shishantbiswas/bknd
1
0
Fork 0
mirror of https://github.com/shishantbiswas/bknd.git synced 2026-03-16 04:27:21 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix react example styling

Browse Source
This commit is contained in:
dswbx
2025-03-15 16:44:58 +01:00
parent 2531c2d8d4
commit ea2aa7c76c
4 changed files with 85 additions and 84 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
examples/react/src/App.tsx
View File

@@ -8,7 +8,6 @@ import IndexPage from "~/routes/_index";
const Admin = lazy(() => import("~/routes/admin")); const Admin = lazy(() => import("~/routes/admin"));
import { Center } from "~/components/Center"; import { Center } from "~/components/Center";
import { ClientProvider } from "bknd/client"; import { ClientProvider } from "bknd/client";
import "bknd/dist/styles.css";
export default function () { export default function () {
const [app, setApp] = useState<App | undefined>(undefined); const [app, setApp] = useState<App | undefined>(undefined);

4
examples/react/src/routes/_index.tsx
View File

@@ -12,8 +12,7 @@ export default function IndexPage({ app }: { app: App }) {
const total = todos?.body.meta.total || 0; const total = todos?.body.meta.total || 0;
return ( return (
<div id="app"> <Center className="flex-col gap-10 max-w-96 mx-auto">
<Center className="flex-col gap-10 max-w-96 mx-auto text-lg">
<div className="flex flex-col gap-2 items-center"> <div className="flex flex-col gap-2 items-center">
<img src="/bknd.svg" alt="bknd" className="w-48 dark:invert" /> <img src="/bknd.svg" alt="bknd" className="w-48 dark:invert" />
<p className="font-mono">local</p> <p className="font-mono">local</p>
@@ -89,6 +88,5 @@ export default function IndexPage({ app }: { app: App }) {
</div>*/} </div>*/}
</div> </div>
</Center> </Center>
</div>
); );
} }

1
examples/react/src/routes/admin.tsx
View File

@@ -1,5 +1,6 @@
import { Admin, type BkndAdminProps } from "bknd/ui"; import { Admin, type BkndAdminProps } from "bknd/ui";
import type { App } from "bknd"; import type { App } from "bknd";
import "bknd/dist/styles.css";
export default function AdminPage({ export default function AdminPage({
app, app,

11
examples/react/src/styles.css
View File

@@ -1,6 +1,5 @@
/* @todo: currently not working nicely */
#app {
@import "tailwindcss"; @import "tailwindcss";
:root { :root {
--background: #ffffff; --background: #ffffff;
--foreground: #171717; --foreground: #171717;
@@ -18,8 +17,12 @@
--color-foreground: var(--foreground); --color-foreground: var(--foreground);
} }
width: 100%; body {
min-height: 100dvh;
@apply bg-background text-foreground flex; @apply bg-background text-foreground flex;
font-family: Arial, Helvetica, sans-serif; font-family: Arial, Helvetica, sans-serif;
} }
#root {
width: 100%;
min-height: 100dvh;
}