Update favicon with professional resume design

docker/resume/favicon.svg

@@ -2,17 +2,30 @@
 <svg xmlns="http://www.w3.org/2000/svg" width="64" height="64" viewBox="0 0 64 64">
   <defs>
     <linearGradient id="gradient" x1="0%" y1="0%" x2="100%" y2="100%">
-      <stop offset="0%" stop-color="#3498db" />
+      <stop offset="0%" stop-color="#2c3e50" />
-      <stop offset="100%" stop-color="#2980b9" />
+      <stop offset="100%" stop-color="#1a2530" />
     </linearGradient>
   </defs>
-  <rect width="64" height="64" rx="12" fill="url(#gradient)" />
+  <!-- Background -->
-  <g>
+  <rect width="64" height="64" rx="8" fill="url(#gradient)" />
+  
+  <!-- Document/Resume icon -->
+  <rect x="18" y="14" width="28" height="36" rx="2" fill="#ecf0f1" />
+  <rect x="22" y="20" width="20" height="2" rx="1" fill="#2c3e50" />
+  <rect x="22" y="24" width="16" height="2" rx="1" fill="#2c3e50" />
+  <rect x="22" y="28" width="20" height="2" rx="1" fill="#2c3e50" />
+  <rect x="22" y="32" width="12" height="2" rx="1" fill="#2c3e50" />
+  
+  <!-- Accent corner fold -->
+  <path d="M46,14 L46,22 L38,14 Z" fill="#3498db" />
+  
+  <!-- Initials as paths instead of text for better compatibility -->
+  <g transform="translate(20, 42)">
     <!-- C letter -->
-    <path d="M22,20 C18,20 15,23 15,28 C15,33 18,36 22,36 C25,36 27,34 28,31" 
+    <path d="M8,2 C5,2 3,3.5 3,6 C3,8.5 5,10 8,10 C10,10 11.5,9 12,7.5" 
-          stroke="white" stroke-width="4" fill="none" stroke-linecap="round" />
+          stroke="#3498db" stroke-width="2" fill="none" stroke-linecap="round" />
     <!-- K letter -->
-    <path d="M36,20 L36,36 M36,28 L45,20 M36,28 L45,36" 
+    <path d="M16,2 L16,10 M16,6 L20,2 M16,6 L20,10" 
-          stroke="white" stroke-width="4" fill="none" stroke-linecap="round" />
+          stroke="#3498db" stroke-width="2" fill="none" stroke-linecap="round" />
   </g>
 </svg>

docker/resume/generate-favicon.js

@@ -3,29 +3,43 @@
 const fs = require('fs');
 const path = require('path');
 
-// Create an SVG favicon with a gradient background and initials
+// Create an SVG favicon with a professional design for a resume site
 function generateFavicon() {
-  // Define colors for gradient
+  // Define colors
-  const primaryColor = '#3498db';   // Blue
+  const backgroundColor = '#2c3e50';  // Dark blue-gray
-  const secondaryColor = '#2980b9'; // Darker blue
+  const accentColor = '#3498db';      // Bright blue
+  const textColor = '#ecf0f1';        // Light gray/white
   
-  // Create SVG content with gradient and text
+  // Create SVG content with a professional design
   const svgContent = `<?xml version="1.0" encoding="UTF-8" standalone="no"?>
 <svg xmlns="http://www.w3.org/2000/svg" width="64" height="64" viewBox="0 0 64 64">
   <defs>
     <linearGradient id="gradient" x1="0%" y1="0%" x2="100%" y2="100%">
-      <stop offset="0%" stop-color="${primaryColor}" />
+      <stop offset="0%" stop-color="${backgroundColor}" />
-      <stop offset="100%" stop-color="${secondaryColor}" />
+      <stop offset="100%" stop-color="#1a2530" />
     </linearGradient>
   </defs>
-  <rect width="64" height="64" rx="12" fill="url(#gradient)" />
+  <!-- Background -->
-  <g>
+  <rect width="64" height="64" rx="8" fill="url(#gradient)" />
+  
+  <!-- Document/Resume icon -->
+  <rect x="18" y="14" width="28" height="36" rx="2" fill="${textColor}" />
+  <rect x="22" y="20" width="20" height="2" rx="1" fill="${backgroundColor}" />
+  <rect x="22" y="24" width="16" height="2" rx="1" fill="${backgroundColor}" />
+  <rect x="22" y="28" width="20" height="2" rx="1" fill="${backgroundColor}" />
+  <rect x="22" y="32" width="12" height="2" rx="1" fill="${backgroundColor}" />
+  
+  <!-- Accent corner fold -->
+  <path d="M46,14 L46,22 L38,14 Z" fill="${accentColor}" />
+  
+  <!-- Initials as paths instead of text for better compatibility -->
+  <g transform="translate(20, 42)">
     <!-- C letter -->
-    <path d="M22,20 C18,20 15,23 15,28 C15,33 18,36 22,36 C25,36 27,34 28,31" 
+    <path d="M8,2 C5,2 3,3.5 3,6 C3,8.5 5,10 8,10 C10,10 11.5,9 12,7.5" 
-          stroke="white" stroke-width="4" fill="none" stroke-linecap="round" />
+          stroke="${accentColor}" stroke-width="2" fill="none" stroke-linecap="round" />
     <!-- K letter -->
-    <path d="M36,20 L36,36 M36,28 L45,20 M36,28 L45,36" 
+    <path d="M16,2 L16,10 M16,6 L20,2 M16,6 L20,10" 
-          stroke="white" stroke-width="4" fill="none" stroke-linecap="round" />
+          stroke="${accentColor}" stroke-width="2" fill="none" stroke-linecap="round" />
   </g>
 </svg>`;