gui: ドキュメントプレビューの padding をとれるようにした レイアウト系の UI を書くにあたり邪魔になってくるので。

Changes

2 changed files (+11/-4)

• packages/gui/src/docs/components/Preview.astro
  • @@ -10,7 +10,7 @@ colorScheme?: "dark" | "light";
    contrast?: "more" | "no-preference"; } - const { colorScheme, contrast, title, ...rest } = Astro.props; + const { colorScheme, contrast, title, padding, ...rest } = Astro.props; --- <style>
  • @@ -37,7 +37,6 @@
    .override { flex: 1; display: block; - padding: var(--space-px-7); font-size: 1rem; line-height: 1.5; font-family: var(--font-sans);
  • @@ -45,6 +44,10 @@ font-weight: var(--font-regular);
    background-color: oklch(var(--color-bg)); color: oklch(var(--color-fg) / var(--alpha-fg-medium)); + } + + .override.padded { + padding: var(--space-px-7); } .header {
  • @@ -187,7 +190,7 @@ </div>
    ) } <ThemeOverride - class="override" + class:list={["override", { padded: padding !== "no" }]} color-scheme={colorScheme} contrast={contrast} >
• packages/gui/src/docs/components/ThemeMatrixPreview.astro
  • @@ -34,7 +34,11 @@
    <div class="matrix"> { matrix.map((overrides) => ( - <Preview title={Astro.props.title} {...overrides}> + <Preview + title={Astro.props.title} + padding={Astro.props.padding} + {...overrides} + > <slot /> </Preview> ))