update Footer and Navbar components

Author: myshkin451

client/src/components/ArticleCardV2.vue

@@ -3,7 +3,7 @@
     class="group relative flex flex-col h-full bg-white dark:bg-[#111] border border-gray-200 dark:border-gray-800 transition-all duration-300 hover:border-gray-900 dark:hover:border-gray-500 hover:shadow-xl"
   >
     <div class="relative w-full h-56 overflow-hidden bg-gray-100 dark:bg-gray-800 border-b border-gray-100 dark:border-gray-800">
-      <img 
+      <!-- <img 
         v-if="article.coverImage" 
         :src="article.coverImage" 
         :alt="article.title"
@@ -19,7 +19,21 @@
         class="absolute top-4 right-4 bg-white/90 dark:bg-black/80 backdrop-blur-sm px-3 py-1 text-xs font-mono font-medium uppercase tracking-wider text-gray-900 dark:text-white border border-gray-200 dark:border-gray-700 hover:bg-black hover:text-white transition-colors"
       >
         {{ article.category.name }}
-      </router-link>
+      </router-link> -->
+      <img 
+      v-if="article.coverImage" 
+      :src="article.coverImage" 
+      class="w-full h-full object-cover transition-transform duration-700 group-hover:scale-105" 
+    />
+    
+    <div 
+      v-else 
+      class="w-full h-full flex items-center justify-center bg-gradient-to-br from-gray-100 to-gray-200 dark:from-gray-800 dark:to-gray-900"
+    >
+      <span class="text-4xl font-mono font-bold text-gray-300 dark:text-gray-700 select-none opacity-50">
+        M / 451
+      </span>
+    </div>
     </div>
 
     <div class="flex flex-col flex-grow p-6">

client/src/components/Footer.vue

@@ -1,31 +1,24 @@
 <template>
-    <footer class="bg-white border-t py-8">
-      <div class="container mx-auto px-4">
-        <div class="flex flex-col md:flex-row justify-between items-center">
-          <div class="mb-4 md:mb-0">
-            <p class="text-gray-600">
-              © {{ currentYear }} Myshkin451博客； 保留所有权利.v2test 
-              <span class="text-xs">v2.0 - CI/CD Enabled!</span>
-            </p>
-          </div>
-          
-          <!-- 社交媒体链接(预留) -->
-          <div class="flex space-x-4">
-            <a href="#" class="text-gray-500 hover:text-gray-700">
-              <span class="sr-only">GitHub</span>
-              <svg class="h-6 w-6" fill="currentColor" viewBox="0 0 24 24">
-                <path fill-rule="evenodd" d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z" clip-rule="evenodd"></path>
-              </svg>
-            </a>
-          </div>
-        </div>
+  <footer class="bg-gray-50 dark:bg-[#050505] border-t border-gray-200 dark:border-gray-800 py-12 transition-colors duration-300">
+    <div class="container mx-auto px-4 flex flex-col md:flex-row justify-between items-center">
+      
+      <div class="mb-4 md:mb-0 text-center md:text-left">
+        <h4 class="font-mono font-bold text-lg text-gray-900 dark:text-white mb-2">Myshkin451</h4>
+        <p class="text-sm text-gray-500 dark:text-gray-400">
+          &copy; {{ new Date().getFullYear() }} Built with Node.js & Vue 3.
+        </p>
       </div>
-    </footer>
-  </template>
-  
-  <script setup>
-  import { ref } from 'vue';
-  
-  // 当前年份
-  const currentYear = ref(new Date().getFullYear());
-  </script>
+
+      <div class="hidden md:block text-xs font-mono text-gray-400 dark:text-gray-600">
+        CODING THE FUTURE / REMEMBERING THE PAST
+      </div>
+      
+      <div class="flex space-x-6">
+        <a href="https://github.com/Achernar-Eridani" target="_blank" class="text-gray-400 hover:text-gray-900 dark:hover:text-white transition-colors">
+          <span class="sr-only">GitHub</span>
+          <svg class="h-6 w-6" fill="currentColor" viewBox="0 0 24 24"><path fill-rule="evenodd" d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z" clip-rule="evenodd"></path></svg>
+        </a>
+      </div>
+    </div>
+  </footer>
+</template>