diff --git a/src/app/groups/layout.tsx b/src/app/groups/layout.tsx index d8aff39..df7d39e 100644 --- a/src/app/groups/layout.tsx +++ b/src/app/groups/layout.tsx @@ -1,5 +1,9 @@ import { PropsWithChildren } from 'react' export default function GroupsLayout({ children }: PropsWithChildren<{}>) { - return
{children}
+ return ( +
+ {children} +
+ ) } diff --git a/src/app/layout.tsx b/src/app/layout.tsx index 2edc33c..2abc96a 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -59,7 +59,7 @@ export default function RootLayout({ }) { return ( - + -
+

-
{children}
+ + {children} + + diff --git a/src/app/page.tsx b/src/app/page.tsx index dedeb98..77dfed0 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -1,3 +1,150 @@ +import { Button } from '@/components/ui/button' +import { + BarChartHorizontalBig, + CircleDollarSign, + Github, + List, + LucideIcon, + Share, + ShieldX, + Users, +} from 'lucide-react' +import Link from 'next/link' +import { ReactNode } from 'react' + export default function HomePage() { - return
+ return ( +
+
+
+

+ Share Expenses
with Friends & Family +

+

+ No ads. No account.
Open Source. + Forever Free. +

+
+ + +
+
+
+ +
+
+

+ Features +

+

+ Spliit is a minimalist application to track and share expenses with + your friends and family. +

+
+ + + + + + +
+
+
+ +
+
+

+ Proudly Open Source +

+

+ Spliit is open source and powered by open source software. Feel free + to contribute! +

+ +
+
+
+ ) +} + +function Feature({ + name, + Icon, + description, +}: { + name: ReactNode + Icon: LucideIcon + description: ReactNode +}) { + return ( +
+ +
+ {name} +
+
+ {description} +
+
+ ) } diff --git a/tailwind.config.js b/tailwind.config.js index 0377ea1..03965fe 100644 --- a/tailwind.config.js +++ b/tailwind.config.js @@ -1,76 +1,93 @@ /** @type {import('tailwindcss').Config} */ module.exports = { - darkMode: ["class"], + darkMode: ['class'], content: [ './pages/**/*.{ts,tsx}', './components/**/*.{ts,tsx}', './app/**/*.{ts,tsx}', './src/**/*.{ts,tsx}', - ], + ], theme: { container: { center: true, - padding: "2rem", + padding: '2rem', screens: { - "2xl": "1400px", + '2xl': '1400px', }, }, extend: { colors: { - border: "hsl(var(--border))", - input: "hsl(var(--input))", - ring: "hsl(var(--ring))", - background: "hsl(var(--background))", - foreground: "hsl(var(--foreground))", + border: 'hsl(var(--border))', + input: 'hsl(var(--input))', + ring: 'hsl(var(--ring))', + background: 'hsl(var(--background))', + foreground: 'hsl(var(--foreground))', primary: { - DEFAULT: "hsl(var(--primary))", - foreground: "hsl(var(--primary-foreground))", + DEFAULT: 'hsl(var(--primary))', + foreground: 'hsl(var(--primary-foreground))', }, secondary: { - DEFAULT: "hsl(var(--secondary))", - foreground: "hsl(var(--secondary-foreground))", + DEFAULT: 'hsl(var(--secondary))', + foreground: 'hsl(var(--secondary-foreground))', }, destructive: { - DEFAULT: "hsl(var(--destructive))", - foreground: "hsl(var(--destructive-foreground))", + DEFAULT: 'hsl(var(--destructive))', + foreground: 'hsl(var(--destructive-foreground))', }, muted: { - DEFAULT: "hsl(var(--muted))", - foreground: "hsl(var(--muted-foreground))", + DEFAULT: 'hsl(var(--muted))', + foreground: 'hsl(var(--muted-foreground))', }, accent: { - DEFAULT: "hsl(var(--accent))", - foreground: "hsl(var(--accent-foreground))", + DEFAULT: 'hsl(var(--accent))', + foreground: 'hsl(var(--accent-foreground))', }, popover: { - DEFAULT: "hsl(var(--popover))", - foreground: "hsl(var(--popover-foreground))", + DEFAULT: 'hsl(var(--popover))', + foreground: 'hsl(var(--popover-foreground))', }, card: { - DEFAULT: "hsl(var(--card))", - foreground: "hsl(var(--card-foreground))", + DEFAULT: 'hsl(var(--card))', + foreground: 'hsl(var(--card-foreground))', }, }, borderRadius: { - lg: "var(--radius)", - md: "calc(var(--radius) - 2px)", - sm: "calc(var(--radius) - 4px)", + lg: 'var(--radius)', + md: 'calc(var(--radius) - 2px)', + sm: 'calc(var(--radius) - 4px)', }, keyframes: { - "accordion-down": { + 'accordion-down': { from: { height: 0 }, - to: { height: "var(--radix-accordion-content-height)" }, + to: { height: 'var(--radix-accordion-content-height)' }, }, - "accordion-up": { - from: { height: "var(--radix-accordion-content-height)" }, + 'accordion-up': { + from: { height: 'var(--radix-accordion-content-height)' }, to: { height: 0 }, }, }, animation: { - "accordion-down": "accordion-down 0.2s ease-out", - "accordion-up": "accordion-up 0.2s ease-out", + 'accordion-down': 'accordion-down 0.2s ease-out', + 'accordion-up': 'accordion-up 0.2s ease-out', + }, + fontFamily: { + rounded: [ + 'ui-rounded', + 'Hiragino Maru Gothic ProN', + 'Quicksand', + 'Comfortaa', + 'Manjari', + 'Arial Rounded MT', + 'Arial Rounded MT Bold', + 'Calibri', + 'source-sans-pro', + 'sans-serif', + ], + }, + dropShadow: { + title: '.25vw .25vw 0 rgb(252 165 165 / var(--tw-text-opacity))', }, }, }, - plugins: [require("tailwindcss-animate")], -} \ No newline at end of file + plugins: [require('tailwindcss-animate')], +} diff --git a/tailwind.config.ts b/tailwind.config.ts deleted file mode 100644 index 1af3b8f..0000000 --- a/tailwind.config.ts +++ /dev/null @@ -1,20 +0,0 @@ -import type { Config } from 'tailwindcss' - -const config: Config = { - content: [ - './src/pages/**/*.{js,ts,jsx,tsx,mdx}', - './src/components/**/*.{js,ts,jsx,tsx,mdx}', - './src/app/**/*.{js,ts,jsx,tsx,mdx}', - ], - theme: { - extend: { - backgroundImage: { - 'gradient-radial': 'radial-gradient(var(--tw-gradient-stops))', - 'gradient-conic': - 'conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))', - }, - }, - }, - plugins: [], -} -export default config