style: rollback tailwindcss to v3 for temp fix

This commit is contained in:
2025-03-04 03:16:06 +08:00
parent e2fdeaabb2
commit 6e4c136614
14 changed files with 630 additions and 288 deletions

View File

@@ -1,16 +1,16 @@
import { Link, Outlet, createRootRoute } from '@tanstack/solid-router';
import {
NavigationMenu,
NavigationMenuItem,
NavigationMenuLink,
NavigationMenuTrigger,
} from '~/components/ui/navigation-menu';
import { Outlet, createRootRoute } from '@tanstack/solid-router';
// import {
// NavigationMenu,
// NavigationMenuItem,
// NavigationMenuLink,
// NavigationMenuTrigger,
// } from '~/components/ui/navigation-menu';
export const Route = createRootRoute({
component: () => {
return (
<>
<div class="flex space-y-4">
{/* <div class="sticky inset-x-0 top-0 isolate z-10 flex shrink-0 items-center gap-2 border-b bg-background">
<NavigationMenu orientation="horizontal">
<NavigationMenuItem>
<NavigationMenuTrigger>
@@ -25,8 +25,7 @@ export const Route = createRootRoute({
</NavigationMenuLink>
</NavigationMenuItem>
</NavigationMenu>
</div>
<hr />
</div> */}
<Outlet />
</>
);

View File

@@ -1,13 +1,56 @@
import { createFileRoute } from '@tanstack/solid-router'
import { createFileRoute } from '@tanstack/solid-router';
import { AppSidebar } from '~/components/layout/app-sidebar';
import {
Breadcrumb,
BreadcrumbItem,
BreadcrumbLink,
BreadcrumbList,
BreadcrumbSeparator,
} from '~/components/ui/breadcrumb';
import { Separator } from '~/components/ui/separator';
import {
SidebarInset,
SidebarProvider,
SidebarTrigger,
} from '~/components/ui/sidebar';
export const Route = createFileRoute('/')({
component: Index,
})
component: Home,
});
function Index() {
function Home() {
return (
<div class="p-2">
<h3>Welcome Home!</h3>
</div>
)
<SidebarProvider>
<AppSidebar />
<SidebarInset>
<header class="flex h-16 shrink-0 items-center gap-2 transition-[width,height] ease-linear group-has-[[data-collapsible=icon]]/sidebar-wrapper:h-12">
<div class="flex items-center gap-2 px-4">
<SidebarTrigger class="-ml-1" />
<Separator orientation="vertical" class="mr-2 h-4" />
<Breadcrumb>
<BreadcrumbList>
<BreadcrumbItem class="hidden md:block">
<BreadcrumbLink href="#">
Building Your Application
</BreadcrumbLink>
</BreadcrumbItem>
<BreadcrumbSeparator class="hidden md:block" />
<BreadcrumbItem>
<BreadcrumbLink current>Data Fetching</BreadcrumbLink>
</BreadcrumbItem>
</BreadcrumbList>
</Breadcrumb>
</div>
</header>
<div class="flex flex-1 flex-col gap-4 p-4 pt-0">
<div class="grid auto-rows-min gap-4 md:grid-cols-3">
<div class="aspect-video rounded-xl bg-muted/50" />
<div class="aspect-video rounded-xl bg-muted/50" />
<div class="aspect-video rounded-xl bg-muted/50" />
</div>
<div class="min-h-[100vh] flex-1 rounded-xl bg-muted/50 md:min-h-min" />
</div>
</SidebarInset>
</SidebarProvider>
);
}