feat: padded config

Signed-off-by: ZTL-UwU <zhangtianli2006@163.com>

components/layout/Header.vue

@@ -4,8 +4,8 @@
     :class="{ 'lg:border-b': config.header.border }"
   >
     <div
-      class="container px-4 md:px-8 flex h-14 max-w-screen-2xl items-center gap-2 justify-between"
-      :class="{ 'border-b lg:border-none': config.header.border }"
+      class="px-4 md:px-8 flex h-14 items-center gap-2 justify-between"
+      :class="{ 'border-b lg:border-none': config.header.border, 'max-w-screen-2xl container': config.main.padded }"
     >
       <LayoutHeaderLogo class="hidden md:flex flex-1" />
       <LayoutMobileNav />

composables/useConfig.ts

@@ -31,6 +31,7 @@ const defaultConfig: DefaultConfig = {
     breadCrumb: true,
     showTitle: true,
     codeCopyToast: true,
+    padded: true,
     codeIcon: {
       'package.json': 'vscode-icons:file-type-node',
       'tsconfig.json': 'vscode-icons:file-type-tsconfig',

content/1.getting-started/4.changelog.md

@@ -4,7 +4,13 @@ title: Changelog
 description: Changes made to shadcn-docs.
 ---
 
-### `v0.4.0`
+## `v0.4.1`
+
+#### :icon{name="lucide:settings"} Config
+
+- [`main.padded`](/api/configuration#main)
+
+## `v0.4.0`
 
 #### :icon{name="lucide:box"} Components
 

content/2.api/1.configuration.md

@@ -43,7 +43,7 @@ interface INav {
 }
 ```
 
-### `site`
+## `site`
 
 ::field-group
   ::field{name="name" type="string"}
@@ -57,7 +57,7 @@ interface INav {
   ::
 ::
 
-### `theme`
+## `theme`
 
 ::field-group
   ::field{name="customizable" type="boolean" defaultValue="true"}
@@ -71,7 +71,7 @@ interface INav {
   ::
 ::
 
-### `header`
+## `header`
 
 ::field-group
   ::field{name="title" type="string"}
@@ -97,7 +97,7 @@ interface INav {
   ::
 ::
 
-### `aside`
+## `aside`
 
 ::field-group
   ::field{name="useLevel" type="boolean" defaultValue="true"}
@@ -108,9 +108,12 @@ interface INav {
   ::
 ::
 
-### `main`
+## `main`
 
 ::field-group
+  ::field{name="padded" type="boolean" defaultValue="true"}
+  Whether the page is padded.
+  ::
   ::field{name="breadCrumb" type="boolean" defaultValue="true"}
   Whether to show the bread crumb.
   ::
@@ -125,7 +128,7 @@ interface INav {
   ::
 ::
 
-### `footer`
+## `footer`
 
 ::field-group
   ::field{name="credits" type="string" defaultValue="''"}
@@ -136,7 +139,7 @@ interface INav {
   ::
 ::
 
-### `toc`
+## `toc`
 
 ::field-group
   ::field{name="enable" type="boolean" defaultValue="true"}
@@ -153,7 +156,7 @@ interface INav {
   ::
 ::
 
-### `search`
+## `search`
 
 ::field-group
   ::field{name="enable" type="boolean" defaultValue="true"}

package.json

@@ -1,7 +1,7 @@
 {
   "name": "shadcn-docs-nuxt",
   "type": "module",
-  "version": "0.4.0",
+  "version": "0.4.1",
   "author": "Tony Zhang <zhangtianli2006@gmail.com>",
   "license": "MIT",
   "homepage": "https://shadcn-docs.nuxt.dev/",

pages/[...slug].vue

@@ -1,7 +1,10 @@
 <template>
   <LayoutHeader />
   <div class="border-b min-h-screen">
-    <div class="container px-4 md:px-8 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="px-4 md:px-8 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"
+      :class="[config.main.padded && 'container']"
+    >
       <aside class="fixed top-[102px] lg:top-[60px] z-30 -ml-2 hidden h-[calc(100vh-3.5rem)] w-full shrink-0 md:sticky md:block overflow-y-auto">
         <LayoutAside :is-mobile="false" />
       </aside>

pages/index.vue

@@ -1,6 +1,9 @@
 <template>
   <LayoutHeader />
-  <div class="container px-4 md:px-8 py-6">
+  <div
+    class="px-4 md:px-8 py-6"
+    :class="[config.main.padded && 'container']"
+  >
     <ContentRenderer
       :key="page._id"
       :value="page"

types/index.d.ts

@@ -46,6 +46,7 @@ interface DefaultConfig {
     codeIcon: {
       [key: string]: string;
     };
+    padded: boolean;
   };
   footer: {
     credits: string;