22 lines
8.1 KiB
JSON
22 lines
8.1 KiB
JSON
{
|
|
"name": "Dashboard04",
|
|
"type": "registry:block",
|
|
"dependencies": [],
|
|
"registryDependencies": [
|
|
"button",
|
|
"card",
|
|
"checkbox",
|
|
"dropdown-menu",
|
|
"input",
|
|
"sheet"
|
|
],
|
|
"files": [
|
|
{
|
|
"path": "block/Dashboard04.vue",
|
|
"content": "<script lang=\"ts\">\nexport const description = 'A settings page. The settings page has a sidebar navigation and a main content area. The main content area has a form to update the store name and a form to update the plugins directory. The sidebar navigation has links to general, security, integrations, support, organizations, and advanced settings.'\nexport const iframeHeight = '780px'\nexport const containerClass = 'w-full h-full'\n</script>\n\n<script setup lang=\"ts\">\nimport { Button } from '@/registry/default/ui/button'\n\nimport { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from '@/registry/default/ui/card'\nimport { Checkbox } from '@/registry/default/ui/checkbox'\nimport { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuTrigger } from '@/registry/default/ui/dropdown-menu'\nimport { Input } from '@/registry/default/ui/input'\nimport { Sheet, SheetContent, SheetTrigger } from '@/registry/default/ui/sheet'\nimport { CircleUser, Menu, Package2, Search } from 'lucide-vue-next'\n</script>\n\n<template>\n <div class=\"flex min-h-screen w-full flex-col\">\n <header class=\"sticky top-0 flex h-16 items-center gap-4 border-b bg-background px-4 md:px-6\">\n <nav class=\"hidden flex-col gap-6 text-lg font-medium md:flex md:flex-row md:items-center md:gap-5 md:text-sm lg:gap-6\">\n <a\n href=\"#\"\n class=\"flex items-center gap-2 text-lg font-semibold md:text-base\"\n >\n <Package2 class=\"h-6 w-6\" />\n <span class=\"sr-only\">Acme Inc</span>\n </a>\n <a\n href=\"#\"\n class=\"text-muted-foreground transition-colors hover:text-foreground\"\n >\n Dashboard\n </a>\n <a\n href=\"#\"\n class=\"text-muted-foreground transition-colors hover:text-foreground\"\n >\n Orders\n </a>\n <a\n href=\"#\"\n class=\"text-muted-foreground transition-colors hover:text-foreground\"\n >\n Products\n </a>\n <a\n href=\"#\"\n class=\"text-muted-foreground transition-colors hover:text-foreground\"\n >\n Customers\n </a>\n <a\n href=\"#\"\n class=\"text-foreground transition-colors hover:text-foreground\"\n >\n Settings\n </a>\n </nav>\n <Sheet>\n <SheetTrigger as-child>\n <Button\n variant=\"outline\"\n size=\"icon\"\n class=\"shrink-0 md:hidden\"\n >\n <Menu class=\"h-5 w-5\" />\n <span class=\"sr-only\">Toggle navigation menu</span>\n </Button>\n </SheetTrigger>\n <SheetContent side=\"left\">\n <nav class=\"grid gap-6 text-lg font-medium\">\n <a\n href=\"#\"\n class=\"flex items-center gap-2 text-lg font-semibold\"\n >\n <Package2 class=\"h-6 w-6\" />\n <span class=\"sr-only\">Acme Inc</span>\n </a>\n <a\n href=\"#\"\n class=\"text-muted-foreground hover:text-foreground\"\n >\n Dashboard\n </a>\n <a\n href=\"#\"\n class=\"text-muted-foreground hover:text-foreground\"\n >\n Orders\n </a>\n <a\n href=\"#\"\n class=\"text-muted-foreground hover:text-foreground\"\n >\n Products\n </a>\n <a\n href=\"#\"\n class=\"text-muted-foreground hover:text-foreground\"\n >\n Customers\n </a>\n <a href=\"#\" class=\"hover:text-foreground\">\n Settings\n </a>\n </nav>\n </SheetContent>\n </Sheet>\n <div class=\"flex w-full items-center gap-4 md:ml-auto md:gap-2 lg:gap-4\">\n <form class=\"ml-auto flex-1 sm:flex-initial\">\n <div class=\"relative\">\n <Search class=\"absolute left-2.5 top-2.5 h-4 w-4 text-muted-foreground\" />\n <Input\n type=\"search\"\n placeholder=\"Search products...\"\n class=\"pl-8 sm:w-[300px] md:w-[200px] lg:w-[300px]\"\n />\n </div>\n </form>\n <DropdownMenu>\n <DropdownMenuTrigger as-child>\n <Button variant=\"secondary\" size=\"icon\" class=\"rounded-full\">\n <CircleUser class=\"h-5 w-5\" />\n <span class=\"sr-only\">Toggle user menu</span>\n </Button>\n </DropdownMenuTrigger>\n <DropdownMenuContent align=\"end\">\n <DropdownMenuLabel>My Account</DropdownMenuLabel>\n <DropdownMenuSeparator />\n <DropdownMenuItem>Settings</DropdownMenuItem>\n <DropdownMenuItem>Support</DropdownMenuItem>\n <DropdownMenuSeparator />\n <DropdownMenuItem>Logout</DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n </div>\n </header>\n <main class=\"flex min-h-[calc(100vh_-_theme(spacing.16))] flex-1 flex-col gap-4 bg-muted/40 p-4 md:gap-8 md:p-10\">\n <div class=\"mx-auto grid w-full max-w-6xl gap-2\">\n <h1 class=\"text-3xl font-semibold\">\n Settings\n </h1>\n </div>\n <div class=\"mx-auto grid w-full max-w-6xl items-start gap-6 md:grid-cols-[180px_1fr] lg:grid-cols-[250px_1fr]\">\n <nav class=\"grid gap-4 text-sm text-muted-foreground\">\n <a href=\"#\" class=\"font-semibold text-primary\">\n General\n </a>\n <a href=\"#\">\n Security\n </a>\n <a href=\"#\">\n Integrations\n </a>\n <a href=\"#\">\n Support\n </a>\n <a href=\"#\">\n Organizations\n </a>\n <a href=\"#\">\n Advanced\n </a>\n </nav>\n <div class=\"grid gap-6\">\n <Card>\n <CardHeader>\n <CardTitle>Store Name</CardTitle>\n <CardDescription>\n Used to identify your store in the marketplace.\n </CardDescription>\n </CardHeader>\n <CardContent>\n <form>\n <Input placeholder=\"Store Name\" />\n </form>\n </CardContent>\n <CardFooter class=\"border-t px-6 py-4\">\n <Button>Save</Button>\n </CardFooter>\n </Card>\n <Card>\n <CardHeader>\n <CardTitle>Plugins Directory</CardTitle>\n <CardDescription>\n The directory within your project, in which your plugins are\n located.\n </CardDescription>\n </CardHeader>\n <CardContent>\n <form class=\"flex flex-col gap-4\">\n <Input\n placeholder=\"Project Name\"\n default-value=\"/content/plugins\"\n />\n <div class=\"flex items-center space-x-2\">\n <Checkbox id=\"include\" default-checked />\n <label\n for=\"include\"\n class=\"text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70\"\n >\n Allow administrators to change the directory.\n </label>\n </div>\n </form>\n </CardContent>\n <CardFooter class=\"border-t px-6 py-4\">\n <Button>Save</Button>\n </CardFooter>\n </Card>\n </div>\n </div>\n </main>\n </div>\n</template>\n",
|
|
"type": "registry:block",
|
|
"target": "Dashboard04.vue"
|
|
}
|
|
]
|
|
}
|