style: rollback tailwindcss to v3 for temp fix
This commit is contained in:
@@ -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 />
|
||||
</>
|
||||
);
|
||||
|
||||
@@ -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>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user