Loyaly/loyalyweb
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

updated section design

Browse Source
This commit is contained in:
R-Bharathraj
2026-07-13 18:05:59 +05:30
parent 03ed08d7dd
commit 4dbc330b1d
31 changed files with 513 additions and 121 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
src/app/about_us/page.tsx
View File

@@ -5,6 +5,7 @@ import Link from 'next/link';
import Image from 'next/image';
import { useReveal } from '@/hooks/useReveal';
import GSAPAnimator from '@/components/GSAPAnimator';
import SectionEyebrow from '@/components/SectionEyebrow';
function Reveal({ children, delay = 0 }: { children: React.ReactNode; delay?: number }) {
const { ref, visible } = useReveal();
@@ -70,7 +71,7 @@ export default function AboutUsPage() {
<section style={{ padding: '140px 8%', background: '#fff', margin: '0 20px 20px', borderRadius: 24 }}>
<div className="au-story-grid" style={{ display: 'grid', gridTemplateColumns: '1fr 1fr', gap: '8vw', alignItems: 'start' }}>
<Reveal>
<div style={{ fontSize: 11, fontWeight: 700, letterSpacing: '0.2em', textTransform: 'uppercase', color: '#f4be28', fontFamily: 'Sora, sans-serif', marginBottom: 24 }}>Our Story</div>
<SectionEyebrow variant="line" style={{ marginBottom: 24 }}>Our Story</SectionEyebrow>
<h2 style={{ fontSize: 'clamp(36px, 4.5vw, 68px)', fontWeight: 800, letterSpacing: '-0.04em', lineHeight: 0.95, color: '#0a0a0f', margin: '0 0 32px', fontFamily: 'Sora, sans-serif' }}>
We started with<br />a simple idea.
</h2>
@@ -158,7 +159,7 @@ export default function AboutUsPage() {
<section style={{ padding: '140px 8%', background: '#fff', margin: '0 20px 20px', borderRadius: 24 }}>
<div className="au-market-grid" style={{ display: 'grid', gridTemplateColumns: '1fr 1fr', gap: '8vw', alignItems: 'start' }}>
<Reveal>
<div style={{ fontSize: 11, fontWeight: 700, letterSpacing: '0.2em', textTransform: 'uppercase', color: '#f4be28', fontFamily: 'Sora, sans-serif', marginBottom: 24 }}>Market Opportunity</div>
<SectionEyebrow variant="pill" style={{ marginBottom: 24 }}>Market Opportunity</SectionEyebrow>
<h2 style={{ fontSize: 'clamp(36px, 4.5vw, 68px)', fontWeight: 800, letterSpacing: '-0.04em', lineHeight: 0.95, color: '#0a0a0f', margin: '0 0 32px', fontFamily: 'Sora, sans-serif' }}>
13 Million Stores.<br />One Opportunity.
</h2>
@@ -291,7 +292,7 @@ function TeamCarousel() {
{/* Header */}
<div style={{ textAlign: 'center', marginBottom: 72, position: 'relative', zIndex: 2, padding: '0 8%' }}>
<div style={{ fontSize: 11, fontWeight: 700, letterSpacing: '0.2em', textTransform: 'uppercase', color: '#f4be28', fontFamily: 'Sora, sans-serif', marginBottom: 16 }}>The Team</div>
<SectionEyebrow variant="dot" style={{ marginBottom: 16 }}>The Team</SectionEyebrow>
<h2 style={{ fontSize: 'clamp(36px, 5vw, 72px)', fontWeight: 800, letterSpacing: '-0.04em', lineHeight: 0.95, color: '#fff', margin: '0 0 16px', fontFamily: 'Sora, sans-serif' }}>
Builders. Thinkers.<br />Retail obsessives.
</h2>