Skip to content

Commit 1d6e89d

Browse files
mythzmythz
committed
Update Footer
1 parent 947366f commit 1d6e89d

File tree

2 files changed

+51
-34
lines changed

2 files changed

+51
-34
lines changed

‎MyApp.Client/components/footer.tsx‎

Lines changed: 26 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,33 +1,39 @@
1-
import Container from "./container"
2-
import FeatureLinks from "./feature-links"
31

42
const Footer = () => {
53
return (
6-
<footer className="bg-accent-1 dark:bg-gray-800 border-t border-accent-2 dark:border-gray-700">
7-
8-
<FeatureLinks />
4+
<footer className="bg-slate-50 dark:bg-slate-950 border-t border-slate-200 dark:border-slate-800 relative">
5+
<div className="max-w-7xl mx-auto px-6 py-12 lg:py-20">
96

10-
<Container>
11-
<div className="py-28 flex flex-col lg:flex-row items-center">
12-
<h3 className="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">
13-
A ServiceStack Project
14-
</h3>
15-
<div className="flex flex-col lg:flex-row justify-center items-center lg:pl-4 lg:w-1/2">
16-
<a
17-
href="https://react-templates.net/docs"
18-
className="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"
19-
>
7+
<div className="flex flex-col lg:flex-row items-center justify-between gap-10">
8+
<div className="text-center lg:text-left space-y-4">
9+
<h3 className="text-4xl lg:text-6xl font-bold tracking-tight text-slate-900 dark:text-white">
10+
<a href="https://react-templates.net" className="hover:text-blue-600 dark:hover:text-blue-400 transition-colors">
11+
react templates .net
12+
</a>
13+
</h3>
14+
<p className="text-lg text-slate-600 dark:text-slate-400 max-w-xl mx-auto lg:mx-0 leading-relaxed">
15+
Templates for the next generation of AI-assisted web applications.
16+
</p>
17+
</div>
18+
19+
<div className="flex flex-col sm:flex-row gap-4 w-full sm:w-auto">
20+
<a href="https://react-templates.net/docs"
21+
className="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">
2022
Read Documentation
2123
</a>
22-
<a
23-
href={`https://github.com/NetCoreTemplates/nextjs`}
24-
className="mx-3 font-bold hover:underline text-gray-900 dark:text-gray-100"
25-
>
24+
<a href="https://github.com/NetCoreTemplates/nextjs"
25+
className="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">
2626
View on GitHub
2727
</a>
2828
</div>
2929
</div>
30-
</Container>
30+
31+
</div>
32+
33+
<div className="absolute bottom-4 left-6 right-6 flex justify-between items-center text-xs text-slate-400 dark:text-slate-600">
34+
<p>&copy; {new Date().getFullYear()} My App</p>
35+
<a href="#" className="hover:text-slate-600 dark:hover:text-slate-400 transition-colors">Privacy Policy</a>
36+
</div>
3137
</footer>
3238
)
3339
}

‎MyApp/Pages/Shared/Footer.cshtml‎

Lines changed: 25 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,34 @@
1-
<footer class="bg-accent-1 dark:bg-gray-800 border-t border-accent-2 dark:border-gray-700">
2-
<div class="max-w-7xl mx-auto px-5">
3-
<div class="py-28 flex flex-col lg:flex-row items-center">
4-
<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">
5-
A ServiceStack Project
1+
<footer class="bg-slate-50 dark:bg-slate-950 border-t border-slate-200 dark:border-slate-800 relative">
2+
<div class="max-w-7xl mx-auto px-6 py-12 lg:py-20">
3+
4+
<div class="flex flex-col lg:flex-row items-center justify-between gap-10">
5+
<div class="text-center lg:text-left space-y-4">
6+
<h3 class="text-4xl lg:text-6xl font-bold tracking-tight text-slate-900 dark:text-white">
7+
<a href="https://react-templates.net" class="hover:text-blue-600 dark:hover:text-blue-400 transition-colors">
8+
react templates .net
9+
</a>
610
</h3>
7-
<div class="flex flex-col lg:flex-row justify-center items-center lg:pl-4 lg:w-1/2">
8-
<a
9-
href="https://react-templates.net/docs"
10-
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"
11-
>
11+
<p class="text-lg text-slate-600 dark:text-slate-400 max-w-xl mx-auto lg:mx-0 leading-relaxed">
12+
Templates for the next generation of AI-assisted web applications.
13+
</p>
14+
</div>
15+
16+
<div class="flex flex-col sm:flex-row gap-4 w-full sm:w-auto">
17+
<a href="https://react-templates.net/docs"
18+
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">
1219
Read Documentation
1320
</a>
14-
<a
15-
href="https://github.com/NetCoreTemplates/nextjs"
16-
class="mx-3 font-bold hover:underline text-gray-900 dark:text-gray-100"
17-
>
21+
<a href="https://github.com/NetCoreTemplates/nextjs"
22+
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">
1823
View on GitHub
1924
</a>
2025
</div>
2126
</div>
27+
2228
</div>
29+
30+
<div class="absolute bottom-4 left-6 right-6 flex justify-between items-center text-xs text-slate-400 dark:text-slate-600">
31+
<p>&copy; @DateTime.Now.Year My App</p>
32+
<a href="#" class="hover:text-slate-600 dark:hover:text-slate-400 transition-colors">Privacy Policy</a>
33+
</div>
2334
</footer>

0 commit comments

Comments
 (0)