bender/aa2137cc-7451-4339-aea4-3d4961c7f423
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge version_2 into main #3

Merged
bender merged 2 commits from version_2 into main 2026-03-10 21:35:30 +00:00
Conversation 0 Commits 2 Files Changed 2 +70 -11
2 changed files with 70 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

71
src/app/page.tsx
View File

@@ -8,8 +8,8 @@ import FeatureCardSixteen from "@/components/sections/feature/FeatureCardSixteen
import ProductCardFour from "@/components/sections/product/ProductCardFour";
import TestimonialCardTen from "@/components/sections/testimonial/TestimonialCardTen";
import ContactFaq from "@/components/sections/contact/ContactFaq";
import FooterBase from "@/components/sections/footer/FooterBase";
import { Sparkles, Award, Scissors, Image, Star, Phone } from "lucide-react";
import FooterBaseCard from "@/components/sections/footer/FooterBaseCard";
import { Sparkles, Award, Scissors, Image, Star, Phone, Instagram, Facebook } from "lucide-react";
export default function LandingPage() {
return (
@@ -146,6 +146,56 @@ export default function LandingPage() {
/>
</div>
<div id="instagram" data-section="instagram">
<div className="relative w-full py-20 px-4 sm:px-6 lg:px-8">
<div className="max-w-7xl mx-auto">
<div className="text-center mb-16">
<p className="text-sm font-medium tracking-wide uppercase text-accent mb-4">Community</p>
<h2 className="text-4xl sm:text-5xl font-bold mb-6 leading-tight">Join the Svalna Community</h2>
<p className="text-lg text-foreground/70 max-w-2xl mx-auto">Discover how our customers style their premium fashion with confidence and elegance</p>
</div>
<div className="grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-4 gap-3 sm:gap-4 md:gap-6">
{[
"http://img.b2bpic.net/free-photo/portrait-young-slim-sensual-girl-gray-dress-leaning-ag_613910-8706.jpg", "http://img.b2bpic.net/free-photo/studio-portrait-serious-bearded-male-dressed-suit_613910-5596.jpg", "http://img.b2bpic.net/free-photo/young-handsome-groom-posing-looking-camera_1153-6076.jpg", "http://img.b2bpic.net/free-photo/man-blue-suit-posing-white-artistic-wall-from-bricks_613910-3011.jpg", "http://img.b2bpic.net/free-photo/portrait-young-slim-sensual-girl-gray-dress-leaning-ag_613910-8706.jpg", "http://img.b2bpic.net/free-photo/studio-portrait-serious-bearded-male-dressed-suit_613910-5596.jpg", "http://img.b2bpic.net/free-photo/young-handsome-groom-posing-looking-camera_1153-6076.jpg", "http://img.b2bpic.net/free-photo/man-blue-suit-posing-white-artistic-wall-from-bricks_613910-3011.jpg"
].map((img, idx) => (
<div
key={idx}
className="relative overflow-hidden rounded-lg aspect-square group cursor-pointer transition-all duration-500 ease-out hover:shadow-lg hover:shadow-accent/30"
>
<img
src={img}
alt={`Community member ${idx + 1}`}
className="w-full h-full object-cover transition-transform duration-700 group-hover:scale-110"
/>
<div className="absolute inset-0 bg-gradient-to-t from-black/60 via-transparent to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-300 flex items-end justify-center pb-4">
<div className="text-white text-center">
<p className="font-semibold text-sm">@svalna_style</p>
</div>
</div>
<div className="absolute top-0 right-0 p-2 opacity-0 group-hover:opacity-100 transition-all duration-300">
<Instagram className="w-5 h-5 text-white drop-shadow-lg" />
</div>
</div>
))}
</div>
<div className="text-center mt-12">
<p className="text-foreground/60 mb-6">Tag us @svalna_style for a chance to be featured</p>
<a
href="https://instagram.com"
target="_blank"
rel="noopener noreferrer"
className="inline-flex items-center gap-2 px-8 py-3 rounded-full bg-accent text-white font-semibold hover:shadow-lg hover:shadow-accent/50 transition-all duration-300 hover:-translate-y-1"
>
<Instagram className="w-5 h-5" />
Follow on Instagram
</a>
</div>
</div>
</div>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardTen
title="Våra kunder älskar oss"
@@ -202,24 +252,32 @@ export default function LandingPage() {
</div>
<div id="footer" data-section="footer">
<FooterBase
<FooterBaseCard
logoText="Hårcenter"
copyrightText="© 2025 Hårcenter Nyköping. Alla rättigheter förbehållna."
columns={[
{
title: "Företaget", items: [
title: "Om Hårcenter", items: [
{ label: "Om oss", href: "about" },
{ label: "Tjänster", href: "services" },
{ label: "Galleriet", href: "gallery" },
{ label: "Recensioner", href: "testimonials" }
]
},
{
title: "Shipping & Returns", items: [
{ label: "Leveranspolicy", href: "#" },
{ label: "Returpolicy", href: "#" },
{ label: "Spårning", href: "#" },
{ label: "FAQ", href: "contact" }
]
},
{
title: "Kontakt", items: [
{ label: "Östra Storgatan 5, 611 34 Nyköping", href: "#" },
{ label: "Telefon: 0155-26 74 74", href: "tel:0155267474" },
{ label: "E-post: info@harcenter.se", href: "mailto:info@harcenter.se" },
{ label: "Öppettider: Mån-Fre 09:00-18:00", href: "#" }
{ label: "Öppettider: Mån-Fre 09:00-18:00", href: "#" },
{ label: "Östra Storgatan 5, 611 34 Nyköping", href: "#" }
]
},
{
@@ -231,6 +289,7 @@ export default function LandingPage() {
]
}
]}
onPrivacyClick={() => console.log("Privacy policy clicked")}
/>
</div>
</ThemeProvider>

10
src/app/styles/variables.css
View File

@@ -10,15 +10,15 @@
--accent: #ffffff;
--background-accent: #ffffff; */
--background: #0b0b0b;
--background: #0a0a0a;
--card: #1a1a1a;
--foreground: #f5f5f5;
--primary-cta: #d4af37;
--foreground: #f0f0f0;
--primary-cta: #00ff88;
--primary-cta-text: #0b0b0b;
--secondary-cta: #1a1a1a;
--secondary-cta-text: #d4af37;
--accent: #2a2a2a;
--background-accent: #d4af37;
--accent: #00ff88;
--background-accent: #ff1493;
/* text sizing - set by ThemeProvider */
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);