Archived
fixes
This commit is contained in:
1 parent
6228945065
commit
1d4584e5d9
7 files changed
+2370
-210
No files matched your search
+91
-99
@@ -1,105 +1,97 @@
|
||||
const Footer = () => {
|
||||
const currentYear = new Date().getFullYear();
|
||||
|
||||
const links = {
|
||||
services: [
|
||||
{ label: "Strategieberatung", href: "#services" },
|
||||
{ label: "UX/UI Design", href: "#services" },
|
||||
{ label: "Entwicklung", href: "#services" },
|
||||
{ label: "SEO & Support", href: "#services" },
|
||||
],
|
||||
company: [
|
||||
{ label: "Über uns", href: "#about" },
|
||||
{ label: "Projekte", href: "#projects" },
|
||||
{ label: "Ablauf", href: "#process" },
|
||||
{ label: "Kontakt", href: "#contact" },
|
||||
],
|
||||
legal: [
|
||||
{ label: "Impressum", href: "/impressum" },
|
||||
{ label: "Datenschutz", href: "/datenschutz" },
|
||||
{ label: "AGB", href: "/agb" },
|
||||
],
|
||||
};
|
||||
import React from 'react';
|
||||
|
||||
const DevStudio: React.FC = () => {
|
||||
return (
|
||||
<footer className="bg-secondary/20 border-t border-border relative">
|
||||
<div className="container mx-auto px-6 py-16">
|
||||
<div className="grid md:grid-cols-4 gap-12 mb-16">
|
||||
{/* Logo & Description */}
|
||||
<div className="md:col-span-1">
|
||||
<span className="text-xl font-display font-medium text-foreground tracking-tight mb-6 block">
|
||||
webklar
|
||||
</span>
|
||||
<p className="text-muted-foreground text-sm leading-relaxed">
|
||||
Maßgeschneiderte Weblösungen für Ihr Unternehmen. Sicher, zuverlässig und modern.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{/* Services */}
|
||||
<div>
|
||||
<h4 className="label-tag mb-6">Leistungen</h4>
|
||||
<ul className="space-y-3">
|
||||
{links.services.map((link) => (
|
||||
<li key={link.label}>
|
||||
<a
|
||||
href={link.href}
|
||||
className="text-muted-foreground hover:text-foreground transition-colors text-sm"
|
||||
>
|
||||
{link.label}
|
||||
</a>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
{/* Company */}
|
||||
<div>
|
||||
<h4 className="label-tag mb-6">Unternehmen</h4>
|
||||
<ul className="space-y-3">
|
||||
{links.company.map((link) => (
|
||||
<li key={link.label}>
|
||||
<a
|
||||
href={link.href}
|
||||
className="text-muted-foreground hover:text-foreground transition-colors text-sm"
|
||||
>
|
||||
{link.label}
|
||||
</a>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
{/* Legal */}
|
||||
<div>
|
||||
<h4 className="label-tag mb-6">Rechtliches</h4>
|
||||
<ul className="space-y-3">
|
||||
{links.legal.map((link) => (
|
||||
<li key={link.label}>
|
||||
<a
|
||||
href={link.href}
|
||||
className="text-muted-foreground hover:text-foreground transition-colors text-sm"
|
||||
>
|
||||
{link.label}
|
||||
</a>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Bottom Bar */}
|
||||
<div className="divider mb-8" />
|
||||
<div className="flex flex-col md:flex-row justify-between items-center gap-4">
|
||||
<p className="text-muted-foreground text-sm">
|
||||
© {currentYear} webklar. Alle Rechte vorbehalten.
|
||||
</p>
|
||||
<div className="text-muted-foreground text-sm">
|
||||
Made in Germany
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
<p className="inset-x-0 mt-20 bg-gradient-to-b from-black via-neutral-950 to-neutral-900 bg-clip-text text-center text-5xl font-bold text-transparent md:text-9xl lg:text-[12rem] xl:text-[13rem]">
|
||||
WEBklar
|
||||
</p>
|
||||
);
|
||||
};
|
||||
|
||||
const Footer: React.FC = () => {
|
||||
return (
|
||||
<div className="relative w-full overflow-hidden border-t border-white/[0.1] bg-black px-8 py-20 dark:border-white/[0.1] dark:bg-black">
|
||||
<div className="mx-auto flex max-w-7xl flex-col items-start justify-between text-sm text-neutral-500 sm:flex-row md:px-8">
|
||||
<div>
|
||||
<div className="mr-0 mb-4 md:mr-4 md:flex">
|
||||
<a className="relative z-20 mr-4 flex items-center space-x-2 px-2 py-1 text-sm font-normal text-white" href="/">
|
||||
<img alt="logo" width="30" height="30" src="https://assets.aceternity.com/logo-dark.png" />
|
||||
<span className="font-medium text-white">WEBklar</span>
|
||||
</a>
|
||||
</div>
|
||||
<div className="mt-2 ml-2">© copyright WEBklar 2024. All rights reserved.</div>
|
||||
</div>
|
||||
<div className="mt-10 grid grid-cols-2 items-start gap-10 sm:mt-0 md:mt-0 lg:grid-cols-4">
|
||||
<div className="flex w-full flex-col justify-center space-y-4">
|
||||
<p className="hover:text-neutral-300 font-bold text-neutral-600 transition-colors dark:text-neutral-300">Pages</p>
|
||||
<ul className="hover:text-neutral-300 list-none space-y-4 text-neutral-600 transition-colors dark:text-neutral-300">
|
||||
<li className="list-none">
|
||||
<a className="hover:text-neutral-300 transition-colors" href="/products">All Products</a>
|
||||
</li>
|
||||
<li className="list-none">
|
||||
<a className="hover:text-neutral-300 transition-colors" href="/products">Studio</a>
|
||||
</li>
|
||||
<li className="list-none">
|
||||
<a className="hover:text-neutral-300 transition-colors" href="/products">Clients</a>
|
||||
</li>
|
||||
<li className="list-none">
|
||||
<a className="hover:text-neutral-300 transition-colors" href="/products">Pricing</a>
|
||||
</li>
|
||||
<li className="list-none">
|
||||
<a className="hover:text-neutral-300 transition-colors" href="/products">Blog</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div className="flex flex-col justify-center space-y-4">
|
||||
<p className="hover:text-neutral-300 font-bold text-neutral-600 transition-colors dark:text-neutral-300">Socials</p>
|
||||
<ul className="hover:text-neutral-300 list-none space-y-4 text-neutral-600 transition-colors dark:text-neutral-300">
|
||||
<li className="list-none">
|
||||
<a className="hover:text-neutral-300 transition-colors" href="/products">Facebook</a>
|
||||
</li>
|
||||
<li className="list-none">
|
||||
<a className="hover:text-neutral-300 transition-colors" href="/products">Instagram</a>
|
||||
</li>
|
||||
<li className="list-none">
|
||||
<a className="hover:text-neutral-300 transition-colors" href="/products">Twitter</a>
|
||||
</li>
|
||||
<li className="list-none">
|
||||
<a className="hover:text-neutral-300 transition-colors" href="/products">LinkedIn</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div className="flex flex-col justify-center space-y-4">
|
||||
<p className="hover:text-neutral-300 font-bold text-neutral-600 transition-colors dark:text-neutral-300">Legal</p>
|
||||
<ul className="hover:text-neutral-300 list-none space-y-4 text-neutral-600 transition-colors dark:text-neutral-300">
|
||||
<li className="list-none">
|
||||
<a className="hover:text-neutral-300 transition-colors" href="/agb">AGBs</a>
|
||||
</li>
|
||||
<li className="list-none">
|
||||
<a className="hover:text-neutral-300 transition-colors" href="/impressum">Impressum</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div className="flex flex-col justify-center space-y-4">
|
||||
<p className="hover:text-neutral-300 font-bold text-neutral-600 transition-colors dark:text-neutral-300">Register</p>
|
||||
<ul className="hover:text-neutral-300 list-none space-y-4 text-neutral-600 transition-colors dark:text-neutral-300">
|
||||
<li className="list-none">
|
||||
<a className="hover:text-neutral-300 transition-colors" href="/products">Sign Up</a>
|
||||
</li>
|
||||
<li className="list-none">
|
||||
<a className="hover:text-neutral-300 transition-colors" href="/products">Login</a>
|
||||
</li>
|
||||
<li className="list-none">
|
||||
<a className="hover:text-neutral-300 transition-colors" href="/products">Forgot Password</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<p className="inset-x-0 mt-20 bg-gradient-to-b from-black via-neutral-950 to-neutral-900 bg-clip-text text-center text-5xl font-bold text-transparent md:text-9xl lg:text-[12rem] xl:text-[13rem]">
|
||||
WEBklar
|
||||
</p>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export { DevStudio, Footer };
|
||||
export default Footer;
|
||||
Reference in new issue
Block a user