Add logo and rename

static/images/logo.svg

@@ -0,0 +1,76 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" width="64" height="64">
+  <defs>
+    <style>
+      .dog-face { fill: #E8DCC8; }
+      .dog-fur-dark { fill: #8B7355; }
+      .dog-ear-inner { fill: #D4A574; }
+      .dog-eye { fill: #2C1810; }
+      .dog-nose { fill: #1A0F0A; }
+      .dog-mouth { fill: none; stroke: #2C1810; stroke-width: 1; stroke-linecap: round; }
+      .pencil-body { fill: #F4C430; }
+      .pencil-tip { fill: #2C1810; }
+      .pencil-eraser { fill: #FF6B9D; }
+      .pencil-band { fill: #C0C0C0; }
+      .highlight { fill: white; opacity: 0.6; }
+    </style>
+  </defs>
+
+  <!-- Oreille gauche -->
+  <path class="dog-fur-dark" d="M 18 15 L 12 5 L 22 8 Z"/>
+  <path class="dog-ear-inner" d="M 18 15 L 14 8 L 20 10 Z"/>
+
+  <!-- Oreille droite -->
+  <path class="dog-fur-dark" d="M 46 15 L 52 5 L 42 8 Z"/>
+  <path class="dog-ear-inner" d="M 46 15 L 50 8 L 44 10 Z"/>
+
+  <!-- Tache de fourrure sombre sur le front -->
+  <ellipse class="dog-fur-dark" cx="32" cy="20" rx="12" ry="8"/>
+
+  <!-- Visage principal -->
+  <circle class="dog-face" cx="32" cy="32" r="20"/>
+
+  <!-- Taches de fourrure claires sur les joues -->
+  <ellipse class="dog-face" cx="22" cy="35" rx="8" ry="10" opacity="0.8"/>
+  <ellipse class="dog-face" cx="42" cy="35" rx="8" ry="10" opacity="0.8"/>
+
+  <!-- Yeux -->
+  <ellipse class="dog-eye" cx="26" cy="28" rx="3" ry="4"/>
+  <ellipse class="dog-eye" cx="38" cy="28" rx="3" ry="4"/>
+
+  <!-- Reflets dans les yeux pour le rendre plus vivant -->
+  <circle class="highlight" cx="27" cy="27" r="1.5"/>
+  <circle class="highlight" cx="39" cy="27" r="1.5"/>
+
+  <!-- Museau -->
+  <ellipse class="dog-face" cx="32" cy="38" rx="10" ry="8"/>
+
+  <!-- Nez -->
+  <ellipse class="dog-nose" cx="32" cy="36" rx="3" ry="2.5"/>
+
+  <!-- Crayon dans la bouche -->
+  <!-- Corps du crayon (partie hexagonale) -->
+  <g transform="translate(32, 42) rotate(0)">
+    <!-- Partie principale du crayon -->
+    <rect class="pencil-body" x="-15" y="-2" width="30" height="4" rx="0.5"/>
+
+    <!-- Bandes décoratives -->
+    <rect class="pencil-band" x="-15" y="-2" width="2" height="4"/>
+    <rect class="pencil-band" x="13" y="-2" width="2" height="4"/>
+
+    <!-- Pointe du crayon (gauche) -->
+    <path class="pencil-body" d="M -15 -2 L -19 0 L -15 2 Z"/>
+    <path class="pencil-tip" d="M -19 -0.5 L -22 0 L -19 0.5 Z"/>
+
+    <!-- Gomme (droite) -->
+    <rect class="pencil-eraser" x="15" y="-2" width="3" height="4" rx="0.5"/>
+
+    <!-- Reflet sur le crayon -->
+    <rect class="highlight" x="-12" y="-1.5" width="20" height="1" rx="0.5" opacity="0.3"/>
+  </g>
+
+  <!-- Petites moustaches -->
+  <line class="dog-mouth" x1="18" y1="36" x2="12" y2="35"/>
+  <line class="dog-mouth" x1="18" y1="38" x2="12" y2="39"/>
+  <line class="dog-mouth" x1="46" y1="36" x2="52" y2="35"/>
+  <line class="dog-mouth" x1="46" y1="38" x2="52" y2="39"/>
+</svg>

static/theme.css

@@ -1,5 +1,5 @@
 /*
- * Project Notes - Material Darker Theme
+ * PersoNotes - Material Darker Theme
  * Inspired by Material Design with dark palette
  */
 
@@ -219,6 +219,38 @@ aside h2,
     margin: 0 0 var(--spacing-sm) 0;
 }
 
+/* Sections rétractables de la sidebar */
+.sidebar-section-header {
+    display: flex;
+    align-items: center;
+    gap: 0.5rem;
+    padding: 0.5rem 0;
+    user-select: none;
+    transition: opacity var(--transition-fast);
+}
+
+.sidebar-section-header:hover {
+    opacity: 0.8;
+}
+
+.section-toggle {
+    font-size: 0.75rem;
+    color: var(--text-secondary);
+    display: inline-block;
+    transition: transform var(--transition-fast);
+    width: 1rem;
+    text-align: center;
+}
+
+.section-toggle.expanded {
+    transform: rotate(90deg);
+}
+
+.sidebar-section-content {
+    overflow: hidden;
+    transition: opacity var(--transition-fast);
+}
+
 aside hr {
     border: none;
     border-top: 1px solid var(--border-primary);

static/themes.css

@@ -1,5 +1,5 @@
 /*
- * Project Notes - Multi-Theme System
+ * PersoNotes - Multi-Theme System
  * Supports: Material Dark (default), Monokai Dark, Dracula, One Dark, Solarized Dark, Nord
  */