diff --git a/docs/advanced_topics/customization/admin_templates.md b/docs/advanced_topics/customization/admin_templates.md index d592fbb674..61edba517b 100644 --- a/docs/advanced_topics/customization/admin_templates.md +++ b/docs/advanced_topics/customization/admin_templates.md @@ -131,12 +131,14 @@ For static colors, either set each color separately (for example `--w-color-prim To customize information density of the admin user interface, inject a CSS file using the hook [](insert_global_admin_css). Set the `--w-density-factor` CSS variable to increase or reduce the UI density. The default value is `1`, the "snug" UI theming uses `0.5`. Here are example overrides: ```css -:root, :host { +:root, +:host { /* Reduce the UI density by 20% for users of the default theme. */ --w-density-factor: 0.8; } -:root, :host { +:root, +:host { /* Increase the UI density by 20% for users of the default theme. */ --w-density-factor: 1.2; } diff --git a/docs/tutorial/style_your_site.md b/docs/tutorial/style_your_site.md index dcfeb183d9..b694889134 100644 --- a/docs/tutorial/style_your_site.md +++ b/docs/tutorial/style_your_site.md @@ -10,38 +10,38 @@ To style your site, navigate to your `mysite/static/css/mysite.css` file and add *, ::before, ::after { - box-sizing: border-box; + box-sizing: border-box; } html { - font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, Roboto, "Helvetica Neue", Arial, sans-serif, Apple Color Emoji, "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; + font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, Roboto, "Helvetica Neue", Arial, sans-serif, Apple Color Emoji, "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; } body { - min-height: 100vh; - max-width: 800px; - margin: 0 auto; - padding: 10px; - display: grid; - gap: 3vw; - grid-template-rows: min-content 1fr min-content; + min-height: 100vh; + max-width: 800px; + margin: 0 auto; + padding: 10px; + display: grid; + gap: 3vw; + grid-template-rows: min-content 1fr min-content; } a { - color: currentColor; + color: currentColor; } footer { - border-top: 2px dotted; - text-align: center; + border-top: 2px dotted; + text-align: center; } header { - border-bottom: 2px dotted; + border-bottom: 2px dotted; } .template-homepage main { - text-align: center; + text-align: center; } ``` @@ -164,12 +164,12 @@ To add a skip-link, add the following styles to your `mysite/static/css/mysite.c ```css .skip-link { - position: absolute; - top: -30px; + position: absolute; + top: -30px; } .skip-link:focus-visible { - top: 5px; + top: 5px; } ```