Niklas/shadcn-vue
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

chore: update docs styling

Browse Source
This commit is contained in:
zernonia 2023-09-05 10:03:56 +08:00
parent 7fb4bc20b0
commit 4a748fe14a
4 changed files with 14 additions and 50 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
apps/www/.vitepress/theme/layout/DocsLayout.vue
View File

@ -12,7 +12,7 @@ const { frontmatter } = useData()
</script> </script>
<template> <template>
<div class="container flex-1 items-start md:grid md:grid-cols-[220px_minmax(0,1fr)] md:gap-6 lg:grid-cols-[240px_minmax(0,1fr)] lg:gap-10"> <div class="flex-1 items-start md:grid md:grid-cols-[220px_minmax(0,1fr)] md:gap-6 lg:grid-cols-[240px_minmax(0,1fr)] lg:gap-10">
<aside <aside
class="fixed top-14 z-30 -ml-2 hidden h-[calc(100vh-3.5rem)] w-full shrink-0 md:sticky md:block overflow-y-auto" class="fixed top-14 z-30 -ml-2 hidden h-[calc(100vh-3.5rem)] w-full shrink-0 md:sticky md:block overflow-y-auto"
> >

30
apps/www/.vitepress/theme/layout/MainLayout.vue
View File

@ -18,30 +18,6 @@ const isDark = useDark()
const toggleDark = useToggle(isDark) const toggleDark = useToggle(isDark)
const routes = [
{
name: 'Documentation',
path: '/docs',
},
{
name: 'Components',
path: '/docs/components/accordion',
},
{
name: 'Themes',
path: '/themes',
},
{
name: 'Examples',
path: '/examples/dashboard',
},
{
name: 'GitHub',
path: 'https://github.com/radix-vue/shadcn-vue',
target: '_blank',
},
]
const links = [ const links = [
{ {
name: 'GitHub', name: 'GitHub',
@ -60,7 +36,7 @@ const links = [
<div class="flex min-h-screen flex-col bg-background"> <div class="flex min-h-screen flex-col bg-background">
<header class="sticky z-40 top-0 bg-background/80 backdrop-blur-lg border-b border-border"> <header class="sticky z-40 top-0 bg-background/80 backdrop-blur-lg border-b border-border">
<div <div
class="max-w-8xl flex h-[58px] items-center justify-between p-4 mx-auto" class="container flex h-[58px] items-center justify-between p-4 mx-auto"
> >
<div class="flex gap-6 md:gap-8"> <div class="flex gap-6 md:gap-8">
<a href="/" class="text-md font-bold"> shadcn-vue </a> <a href="/" class="text-md font-bold"> shadcn-vue </a>
@ -129,7 +105,7 @@ const links = [
</div> </div>
</header> </header>
<div class="flex-1 bg-background"> <div class="container flex-1 bg-background">
<component :is="'docs'" v-if="$route.path.includes('docs')"> <component :is="'docs'" v-if="$route.path.includes('docs')">
<Content /> <Content />
</component> </component>
@ -142,7 +118,7 @@ const links = [
</div> </div>
<footer class="bg-background z-40 border-t border-border text-foreground"> <footer class="bg-background z-40 border-t border-border text-foreground">
<div class="max-w-8xl h-20 flex items-center justify-between p-4 mx-auto"> <div class="container h-20 flex items-center justify-between p-4 mx-auto">
<div class="flex justify-center items-center"> <div class="flex justify-center items-center">
<span class="text-sm"> <span class="text-sm">
Built and designed by {{ " " }} Built and designed by {{ " " }}

21
apps/www/.vitepress/theme/style.css
View File

@ -106,17 +106,6 @@
-moz-osx-font-smoothing: grayscale; -moz-osx-font-smoothing: grayscale;
} }
pre {
@apply mb-4 mt-6 max-h-[650px] overflow-x-auto rounded-lg border !bg-zinc-950 py-4 dark:!bg-zinc-900
}
pre code {
@apply relative rounded font-mono text-sm ;
}
pre code .line {
@apply px-4 min-h-[1.5rem] !py-0.5 w-full inline-block;
}
} }
@ -138,5 +127,15 @@
} }
} }
pre {
@apply mb-4 mt-6 max-h-[650px] overflow-x-auto rounded-lg border !bg-zinc-950 py-4 dark:!bg-zinc-900
}
pre code {
@apply relative rounded font-mono text-sm ;
}
pre code .line {
@apply px-4 min-h-[1.5rem] !py-0.5 w-full inline-block;
}

11
apps/www/mono.config.js
View File

@ -1,11 +0,0 @@
import { cva } from 'class-variance-authority'
export const buttonClass = cva(
'flex px-2 py-2',
{
variants: {
primary: 'bg-blue-200',
secondary: 'bg-red-400',
},
},
)