ruangrupa/kios-webapp
0
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add shadcn

Browse Source
This commit is contained in:
toqvist
2024-04-02 13:08:24 +02:00
parent 12788566f5
commit 2c79904102
8 changed files with 218 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
astro/src/layouts/Layout.astro → astro/src/layouts/BaseLayout.astro
View File

@ -30,7 +30,7 @@ const { title } = Astro.props;
}
</style>
</head>
<body class="mx-auto max-w-7xl bg-gray px-6 py-8 font-plex text-gray-200">
<body class="bg-gray-800 mx-auto max-w-7xl bg-gray px-6 py-8 font-plex text-gray-200">
<slot />
</body>
</html>

8
astro/src/pages/index.astro
View File

@ -1,11 +1,11 @@
---
import Layout from "@/layouts/Layout.astro";
import BaseLayout from "@/layouts/BaseLayout.astro";
import { getPosts } from "@/utils/payload";
import '../styles/global.css'
const posts = await getPosts();
---
<Layout title="Astroad">
<BaseLayout title="Astroad">
<main class="" >
<h1 class="font-bold text-5xl">Astroad</h1>
<p class="mt-3 text-lg">
@ -42,4 +42,4 @@ const posts = await getPosts();
}
</div>
</main>
</Layout>
</BaseLayout>

76
astro/src/styles/global.css Normal file
View File

@ -0,0 +1,76 @@
@tailwind base;
@tailwind components;
@tailwind utilities;
@layer base {
:root {
--background: 0 0% 100%;
--foreground: 0 0% 3.9%;
--card: 0 0% 100%;
--card-foreground: 0 0% 3.9%;
--popover: 0 0% 100%;
--popover-foreground: 0 0% 3.9%;
--primary: 0 0% 9%;
--primary-foreground: 0 0% 98%;
--secondary: 0 0% 96.1%;
--secondary-foreground: 0 0% 9%;
--muted: 0 0% 96.1%;
--muted-foreground: 0 0% 45.1%;
--accent: 0 0% 96.1%;
--accent-foreground: 0 0% 9%;
--destructive: 0 84.2% 60.2%;
--destructive-foreground: 0 0% 98%;
--border: 0 0% 89.8%;
--input: 0 0% 89.8%;
--ring: 0 0% 3.9%;
--radius: 0.5rem;
}
.dark {
--background: 0 0% 3.9%;
--foreground: 0 0% 98%;
--card: 0 0% 3.9%;
--card-foreground: 0 0% 98%;
--popover: 0 0% 3.9%;
--popover-foreground: 0 0% 98%;
--primary: 0 0% 98%;
--primary-foreground: 0 0% 9%;
--secondary: 0 0% 14.9%;
--secondary-foreground: 0 0% 98%;
--muted: 0 0% 14.9%;
--muted-foreground: 0 0% 63.9%;
--accent: 0 0% 14.9%;
--accent-foreground: 0 0% 98%;
--destructive: 0 62.8% 30.6%;
--destructive-foreground: 0 0% 98%;
--border: 0 0% 14.9%;
--input: 0 0% 14.9%;
--ring: 0 0% 83.1%;
}
}
@layer base {
* {
@apply border-border;
}
body {
@apply bg-background text-foreground;
}
}

6
astro/src/utils.ts Normal file
View File

@ -0,0 +1,6 @@
import { type ClassValue, clsx } from "clsx"
import { twMerge } from "tailwind-merge"
export function cn(...inputs: ClassValue[]) {
return twMerge(clsx(inputs))
}