update footer

Author: mythz

MyApp.Client/components/footer.tsx

@@ -1,10 +1,10 @@
 
 const Footer = () => {
   return (
-    <footer className="bg-slate-50 dark:bg-slate-950 border-t border-slate-200 dark:border-slate-800">
+    <footer className="bg-slate-50 dark:bg-slate-950 border-t border-slate-200 dark:border-slate-800 relative">
       <div className="max-w-7xl mx-auto px-6 py-12 lg:py-20">
 
-        <div className="flex flex-col lg:flex-row items-center justify-between gap-10 mb-12">
+        <div className="flex flex-col lg:flex-row items-center justify-between gap-10">
           <div className="text-center lg:text-left space-y-4">
             <h3 className="text-4xl lg:text-6xl font-bold tracking-tight text-slate-900 dark:text-white">
               <a href="https://react-templates.net" className="hover:text-blue-600 dark:hover:text-blue-400 transition-colors">
@@ -28,13 +28,11 @@ const Footer = () => {
           </div>
         </div>
 
-        <div className="border-t border-slate-200 dark:border-slate-800 pt-8 flex flex-col md:flex-row justify-between items-center gap-4 text-sm text-slate-500 dark:text-slate-500">
-          <p>&copy; {new Date().getFullYear()} My App. All rights reserved.</p>
-          <div className="flex gap-8">
-            <a href="#" className="hover:text-slate-900 dark:hover:text-slate-300 transition-colors">Privacy Policy</a>
-          </div>
-        </div>
+      </div>
 
+      <div className="absolute bottom-4 left-6 right-6 flex justify-between items-center text-xs text-slate-400 dark:text-slate-600">
+        <p>&copy; {new Date().getFullYear()} My App</p>
+        <a href="#" className="hover:text-slate-600 dark:hover:text-slate-400 transition-colors">Privacy Policy</a>
       </div>
     </footer>
   )

MyApp/Pages/Shared/Footer.cshtml

@@ -1,23 +1,34 @@
-<footer class="bg-accent-1 dark:bg-gray-800 border-t border-accent-2 dark:border-gray-700">
-    <div class="max-w-7xl mx-auto px-5">
-    <div class="py-28 flex flex-col lg:flex-row items-center">
-        <h3 class="text-4xl lg:text-6xl font-bold tracking-tighter leading-tight text-center lg:text-left mb-10 lg:mb-0 lg:pr-4 lg:w-1/2 text-gray-900 dark:text-gray-100">
-        A ServiceStack Project
+<footer class="bg-slate-50 dark:bg-slate-950 border-t border-slate-200 dark:border-slate-800 relative">
+    <div class="max-w-7xl mx-auto px-6 py-12 lg:py-20">
+
+    <div class="flex flex-col lg:flex-row items-center justify-between gap-10">
+        <div class="text-center lg:text-left space-y-4">
+        <h3 class="text-4xl lg:text-6xl font-bold tracking-tight text-slate-900 dark:text-white">
+            <a href="https://react-templates.net" class="hover:text-blue-600 dark:hover:text-blue-400 transition-colors">
+            react templates .net
+            </a>
         </h3>
-        <div class="flex flex-col lg:flex-row justify-center items-center lg:pl-4 lg:w-1/2">
-        <a
-            href="https://react-templates.net/docs"
-            class="mx-3 bg-black dark:bg-gray-700 hover:bg-white dark:hover:bg-gray-600 hover:text-black dark:hover:text-white border border-black dark:border-gray-600 text-white font-bold py-3 px-12 lg:px-8 duration-200 transition-colors mb-6 lg:mb-0"
-        >
+        <p class="text-lg text-slate-600 dark:text-slate-400 max-w-xl mx-auto lg:mx-0 leading-relaxed">
+            Templates for the next generation of AI-assisted web applications.
+        </p>
+        </div>
+
+        <div class="flex flex-col sm:flex-row gap-4 w-full sm:w-auto">
+        <a href="https://react-templates.net/docs"
+            class="inline-flex items-center justify-center px-8 py-3.5 text-base font-semibold text-white transition-all bg-slate-900 rounded-full hover:bg-slate-800 hover:shadow-lg hover:shadow-slate-900/20 focus:ring-4 focus:ring-slate-900/20 dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-500/20 active:scale-95">
             Read Documentation
         </a>
-        <a
-            href="https://github.com/NetCoreTemplates/next-rsc"
-            class="mx-3 font-bold hover:underline text-gray-900 dark:text-gray-100"
-        >
+        <a href="https://github.com/NetCoreTemplates/next-rsc"
+            class="inline-flex items-center justify-center px-8 py-3.5 text-base font-semibold text-slate-900 transition-all bg-white border border-slate-200 rounded-full hover:bg-slate-50 hover:border-slate-300 dark:bg-slate-900 dark:text-slate-300 dark:border-slate-700 dark:hover:bg-slate-800 dark:hover:text-white dark:hover:border-slate-600 focus:ring-4 focus:ring-slate-200 dark:focus:ring-slate-800 active:scale-95">
             View on GitHub
         </a>
         </div>
     </div>
+
     </div>
+
+    <div class="absolute bottom-4 left-6 right-6 flex justify-between items-center text-xs text-slate-400 dark:text-slate-600">
+    <p>&copy; @DateTime.Now.Year My App</p>
+    <a href="#" class="hover:text-slate-600 dark:hover:text-slate-400 transition-colors">Privacy Policy</a>
+</div>
 </footer>