dwindown/meet-hub
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Set up project skeleton

Browse Source 
Initialize design system and core pages (landing, auth, products, cart, dashboard, admin) with routing and responsive layout for a membership platform using React TS and Supabase.

X-Lovable-Edit-ID: edt-6f39a65a-3627-4e07-a539-c340682d627f
This commit is contained in:
gpt-engineer-app[bot]
2025-12-18 06:26:44 +00:00
parent bebc3a2029 cd367f31bf
commit 2385655510
2 changed files with 232 additions and 132 deletions
Download Patch File Download Diff File Expand all files Collapse all files

156
src/index.css
View File

@@ -1,3 +1,6 @@
@import url("https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Lora:wght@400;500;600;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Space+Mono:ital,wght@0,400;0,700;1,400;1,700&display=swap");
@tailwind base; @tailwind base;
@tailwind components; @tailwind components;
@tailwind utilities; @tailwind utilities;
@@ -9,88 +12,141 @@ All colors MUST be HSL.
@layer base { @layer base {
:root { :root {
--background: 0 0% 100%; --background: 0 0% 100%;
--foreground: 222.2 84% 4.9%; --foreground: 0 0% 0%;
--card: 0 0% 100%; --card: 0 0% 100%;
--card-foreground: 222.2 84% 4.9%; --card-foreground: 0 0% 0%;
--popover: 0 0% 100%; --popover: 0 0% 100%;
--popover-foreground: 222.2 84% 4.9%; --popover-foreground: 0 0% 0%;
--primary: 222.2 47.4% 11.2%; --primary: 0 0% 0%;
--primary-foreground: 210 40% 98%; --primary-foreground: 0 0% 100%;
--secondary: 210 40% 96.1%; --secondary: 0 0% 96%;
--secondary-foreground: 222.2 47.4% 11.2%; --secondary-foreground: 0 0% 0%;
--muted: 210 40% 96.1%; --muted: 0 0% 96%;
--muted-foreground: 215.4 16.3% 46.9%; --muted-foreground: 0 0% 45%;
--accent: 210 40% 96.1%; --accent: 0 0% 90%;
--accent-foreground: 222.2 47.4% 11.2%; --accent-foreground: 0 0% 0%;
--destructive: 0 84.2% 60.2%; --destructive: 0 84% 60%;
--destructive-foreground: 210 40% 98%; --destructive-foreground: 0 0% 98%;
--border: 214.3 31.8% 91.4%; --border: 0 0% 0%;
--input: 214.3 31.8% 91.4%; --input: 0 0% 0%;
--ring: 222.2 84% 4.9%; --ring: 0 0% 0%;
--radius: 0.5rem; --radius: 0rem;
--sidebar-background: 0 0% 98%; --sidebar-background: 0 0% 98%;
--sidebar-foreground: 240 5.3% 26.1%; --sidebar-foreground: 0 0% 0%;
--sidebar-primary: 240 5.9% 10%; --sidebar-primary: 0 0% 0%;
--sidebar-primary-foreground: 0 0% 98%; --sidebar-primary-foreground: 0 0% 100%;
--sidebar-accent: 240 4.8% 95.9%; --sidebar-accent: 0 0% 90%;
--sidebar-accent-foreground: 240 5.9% 10%; --sidebar-accent-foreground: 0 0% 0%;
--sidebar-border: 220 13% 91%; --sidebar-border: 0 0% 0%;
--sidebar-ring: 217.2 91.2% 59.8%; --sidebar-ring: 0 0% 0%;
--chart-1: 12 76% 61%;
--chart-2: 173 58% 39%;
--chart-3: 197 37% 24%;
--chart-4: 43 74% 66%;
--chart-5: 27 87% 67%;
--sidebar: 0 0% 98%;
--font-sans: 'Space Grotesk', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif;
--font-serif: ui-serif, Georgia, Cambria, 'Times New Roman', Times, serif;
--font-mono: 'Space Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;
--shadow-2xs: 1px 1px 0px 0px #000000;
--shadow-xs: 2px 2px 0px 0px #000000;
--shadow-sm: 3px 3px 0px 0px #000000;
--shadow: 5px 5px 0px 0px #000000;
--shadow-md: 8px 8px 0px 0px #000000;
--shadow-lg: 12px 12px 0px 0px #000000;
--shadow-xl: 16px 16px 0px 0px #000000;
--shadow-2xl: 24px 24px 0px 0px #000000;
--tracking-normal: 0em;
--spacing: 0.25rem;
} }
.dark { .dark {
--background: 222.2 84% 4.9%; --background: 0 0% 0%;
--foreground: 210 40% 98%; --foreground: 0 0% 100%;
--card: 222.2 84% 4.9%; --card: 0 0% 0%;
--card-foreground: 210 40% 98%; --card-foreground: 0 0% 100%;
--popover: 222.2 84% 4.9%; --popover: 0 0% 0%;
--popover-foreground: 210 40% 98%; --popover-foreground: 0 0% 100%;
--primary: 210 40% 98%; --primary: 0 0% 100%;
--primary-foreground: 222.2 47.4% 11.2%; --primary-foreground: 0 0% 0%;
--secondary: 217.2 32.6% 17.5%; --secondary: 0 0% 15%;
--secondary-foreground: 210 40% 98%; --secondary-foreground: 0 0% 100%;
--muted: 217.2 32.6% 17.5%; --muted: 0 0% 15%;
--muted-foreground: 215 20.2% 65.1%; --muted-foreground: 0 0% 65%;
--accent: 217.2 32.6% 17.5%; --accent: 0 0% 15%;
--accent-foreground: 210 40% 98%; --accent-foreground: 0 0% 100%;
--destructive: 0 62.8% 30.6%; --destructive: 0 62% 30%;
--destructive-foreground: 210 40% 98%; --destructive-foreground: 0 0% 100%;
--border: 217.2 32.6% 17.5%; --border: 0 0% 100%;
--input: 217.2 32.6% 17.5%; --input: 0 0% 100%;
--ring: 212.7 26.8% 83.9%; --ring: 0 0% 100%;
--sidebar-background: 240 5.9% 10%; --sidebar-background: 240 5.9% 10%;
--sidebar-foreground: 240 4.8% 95.9%; --sidebar-foreground: 0 0% 100%;
--sidebar-primary: 224.3 76.3% 48%; --sidebar-primary: 0 0% 100%;
--sidebar-primary-foreground: 0 0% 100%; --sidebar-primary-foreground: 0 0% 0%;
--sidebar-accent: 240 3.7% 15.9%; --sidebar-accent: 0 0% 15%;
--sidebar-accent-foreground: 240 4.8% 95.9%; --sidebar-accent-foreground: 0 0% 100%;
--sidebar-border: 240 3.7% 15.9%; --sidebar-border: 0 0% 100%;
--sidebar-ring: 217.2 91.2% 59.8%; --sidebar-ring: 0 0% 100%;
--chart-1: 220 70% 50%;
--chart-2: 160 60% 45%;
--chart-3: 30 80% 55%;
--chart-4: 280 65% 60%;
--chart-5: 340 75% 55%;
--sidebar: 0 0% 5%;
--radius: 0rem;
--shadow-2xs: 1px 1px 0px 0px #ffffff;
--shadow-xs: 2px 2px 0px 0px #ffffff;
--shadow-sm: 3px 3px 0px 0px #ffffff;
--shadow: 5px 5px 0px 0px #ffffff;
--shadow-md: 8px 8px 0px 0px #ffffff;
--shadow-lg: 12px 12px 0px 0px #ffffff;
--shadow-xl: 16px 16px 0px 0px #ffffff;
--shadow-2xl: 24px 24px 0px 0px #ffffff;
} }
} }

134
tailwind.config.ts
View File

@@ -7,85 +7,129 @@ export default {
theme: { theme: {
container: { container: {
center: true, center: true,
padding: "2rem", padding: '2rem',
screens: { screens: {
"2xl": "1400px", '2xl': '1400px'
}, }
}, },
extend: { extend: {
colors: { colors: {
border: "hsl(var(--border))", border: 'hsl(var(--border))',
input: "hsl(var(--input))", input: 'hsl(var(--input))',
ring: "hsl(var(--ring))", ring: 'hsl(var(--ring))',
background: "hsl(var(--background))", background: 'hsl(var(--background))',
foreground: "hsl(var(--foreground))", foreground: 'hsl(var(--foreground))',
primary: { primary: {
DEFAULT: "hsl(var(--primary))", DEFAULT: 'hsl(var(--primary))',
foreground: "hsl(var(--primary-foreground))", foreground: 'hsl(var(--primary-foreground))'
}, },
secondary: { secondary: {
DEFAULT: "hsl(var(--secondary))", DEFAULT: 'hsl(var(--secondary))',
foreground: "hsl(var(--secondary-foreground))", foreground: 'hsl(var(--secondary-foreground))'
}, },
destructive: { destructive: {
DEFAULT: "hsl(var(--destructive))", DEFAULT: 'hsl(var(--destructive))',
foreground: "hsl(var(--destructive-foreground))", foreground: 'hsl(var(--destructive-foreground))'
}, },
muted: { muted: {
DEFAULT: "hsl(var(--muted))", DEFAULT: 'hsl(var(--muted))',
foreground: "hsl(var(--muted-foreground))", foreground: 'hsl(var(--muted-foreground))'
}, },
accent: { accent: {
DEFAULT: "hsl(var(--accent))", DEFAULT: 'hsl(var(--accent))',
foreground: "hsl(var(--accent-foreground))", foreground: 'hsl(var(--accent-foreground))'
}, },
popover: { popover: {
DEFAULT: "hsl(var(--popover))", DEFAULT: 'hsl(var(--popover))',
foreground: "hsl(var(--popover-foreground))", foreground: 'hsl(var(--popover-foreground))'
}, },
card: { card: {
DEFAULT: "hsl(var(--card))", DEFAULT: 'hsl(var(--card))',
foreground: "hsl(var(--card-foreground))", foreground: 'hsl(var(--card-foreground))'
}, },
sidebar: { sidebar: {
DEFAULT: "hsl(var(--sidebar-background))", DEFAULT: 'hsl(var(--sidebar-background))',
foreground: "hsl(var(--sidebar-foreground))", foreground: 'hsl(var(--sidebar-foreground))',
primary: "hsl(var(--sidebar-primary))", primary: 'hsl(var(--sidebar-primary))',
"primary-foreground": "hsl(var(--sidebar-primary-foreground))", 'primary-foreground': 'hsl(var(--sidebar-primary-foreground))',
accent: "hsl(var(--sidebar-accent))", accent: 'hsl(var(--sidebar-accent))',
"accent-foreground": "hsl(var(--sidebar-accent-foreground))", 'accent-foreground': 'hsl(var(--sidebar-accent-foreground))',
border: "hsl(var(--sidebar-border))", border: 'hsl(var(--sidebar-border))',
ring: "hsl(var(--sidebar-ring))", ring: 'hsl(var(--sidebar-ring))'
}, }
}, },
borderRadius: { borderRadius: {
lg: "var(--radius)", lg: 'var(--radius)',
md: "calc(var(--radius) - 2px)", md: 'calc(var(--radius) - 2px)',
sm: "calc(var(--radius) - 4px)", sm: 'calc(var(--radius) - 4px)'
}, },
keyframes: { keyframes: {
"accordion-down": { 'accordion-down': {
from: { from: {
height: "0", height: '0'
}, },
to: { to: {
height: "var(--radix-accordion-content-height)", height: 'var(--radix-accordion-content-height)'
}
}, },
}, 'accordion-up': {
"accordion-up": {
from: { from: {
height: "var(--radix-accordion-content-height)", height: 'var(--radix-accordion-content-height)'
}, },
to: { to: {
height: "0", height: '0'
}, }
}, }
}, },
animation: { animation: {
"accordion-down": "accordion-down 0.2s ease-out", 'accordion-down': 'accordion-down 0.2s ease-out',
"accordion-up": "accordion-up 0.2s ease-out", 'accordion-up': 'accordion-up 0.2s ease-out'
}, },
fontFamily: {
sans: [
'Space Grotesk',
'ui-sans-serif',
'system-ui',
'-apple-system',
'BlinkMacSystemFont',
'Segoe UI',
'Roboto',
'Helvetica Neue',
'Arial',
'Noto Sans',
'sans-serif'
],
serif: [
'Lora',
'ui-serif',
'Georgia',
'Cambria',
'Times New Roman',
'Times',
'serif'
],
mono: [
'Space Mono',
'ui-monospace',
'SFMono-Regular',
'Menlo',
'Monaco',
'Consolas',
'Liberation Mono',
'Courier New',
'monospace'
]
}, },
boxShadow: {
'2xs': 'var(--shadow-2xs)',
xs: 'var(--shadow-xs)',
sm: 'var(--shadow-sm)',
md: 'var(--shadow-md)',
lg: 'var(--shadow-lg)',
xl: 'var(--shadow-xl)',
'2xl': 'var(--shadow-2xl)'
}
}
}, },
plugins: [require("tailwindcss-animate")], plugins: [require("tailwindcss-animate")],
} satisfies Config; } satisfies Config;