Skip to content

ATELIER 0.9.0

Choose a tag to compare

@mcanouil-dev mcanouil-dev released this 31 Jul 17:57
· 20 commits to main since this release
2b066c9

Installation

quarto add mcanouil/quarto-atelier@0.9.0

Changelog

Breaking Changes

  • The navbar, the page footer, and the sidebar now follow the colour scheme by default rather than staying dark in both. Set $atelier-chrome: dark; in the defaults block of a project stylesheet to keep the previous appearance.
  • website.navbar.background, website.navbar.foreground, website.page-footer.background, and website.page-footer.foreground no longer have any effect: the chrome palette sets $navbar-bg, $navbar-fg, $footer-bg, and $footer-fg from a layer Quarto evaluates first. The project type no longer sets them either.

New Features

  • feat: $atelier-chrome, taking auto, light, or dark, which decides whether the chrome follows the colour scheme or is pinned to one palette in both. The three bars are drawn from one triple, $atelier-chrome-bg, $atelier-chrome-fg, and $atelier-chrome-accent, each of which can be set on its own; the two pinned palettes are $atelier-chrome-dark-* and $atelier-chrome-light-*. An unknown value fails the render with a named error rather than compiling to something arbitrary.
  • feat: hand the resolved palette to Quarto's own $navbar-*, $sidebar-*, and $footer-* variables from a defaults layer evaluated after _brand.yml. This is what puts the colours Quarto bakes into its own markup, which CSS cannot reach afterwards, on the same palette as everything else, and it retires most of the !important repainting the theme carried.
  • feat: --atelier-navbar-control-border and --atelier-sidebar-control-border, the boundary of a boxed control, at 55% of the chrome foreground. The existing border tokens stay the hairline between two surfaces, which is what the sidebar edge, the section dividers, and the navbar and footer edges want.
  • feat: --atelier-navbar-control-size, --atelier-navbar-control-icon-size, --atelier-navbar-search-icon-size, and --atelier-navbar-control-gap, the one box the navbar-right controls are drawn in. The defaults are the numbers the gitlink widget uses, so the bar reads the same whether or not that extension is installed.
  • feat: fall back per scheme to the brand background for extensions.atelier.theme-color, so a site with a _brand.yml gets both <meta name="theme-color"> tags without restating colours it has already declared. The value is the one Quarto compiles into $body-bg for that bundle, which is the colour the page is painted with; an explicit theme-color still wins, scheme by scheme, and a site with neither still emits nothing.

Bug Fixes

  • fix: ink the reader-mode toggle from the chrome foreground. Quarto bakes $sidebar-fg into the glyph's SVG markup, which on the sidebar was the page ink and could match the column it sat on.
  • fix: run the chrome foreground and accent through Quarto's theme-contrast() at the AA level, which lifts either only when it falls under 4.5:1 against the bar. A brand primary picked against the page can fall under the ratio on a tint of that page.
  • fix: draw the sidebar search field and the gitlink widget pill from the new control-border tokens. Both took the hairline token, which against the bars is around 1.5:1 and reads as no border at all, where WCAG 1.4.11 asks 3:1 of a user-interface component; 55% clears it on a light bar as well as a dark one.
  • fix: size the navbar search button, the colour-scheme toggle, and the navbar tools from one control box, so the bar carries one set of controls rather than three. Quarto draws the search as a 40px button with a 26px glyph, leaves the toggle an inline link with no height of its own, and gives a tool icon the link font size. The search's margin-left: auto is replaced by the control gap at every width, which also retires the collapsed-navbar rule that did the same for small screens alone. The magnifier itself sat in a block wrapper whose height was a line box rather than the icon, which left uneven space above and below it and dropped the glyph off the button's centre, and it draws in 20 units of a 24-unit viewBox, so at the shared icon size it painted a sixth shorter than the colour-scheme glyph beside it.
  • fix: give the sidebar tools their own line, below the title and above the search field, following sidebar.align. Quarto renders them inside the sidebar title whenever a titled sidebar has no navbar, as an inline row pulled up six pixels, which left the colour-scheme toggle trailing the title text. The rule forces nothing the gitlink extension sets, so a sidebar tool widget keeps its column layout and its ordering between the icon tools and the search.

Documentation

  • docs: document the chrome as one palette across the three bars: the $atelier-chrome modes, the pinned palettes, the resolved triple, and when to reach for the Sass variables rather than the custom properties.
  • docs: add a sidebar Quarto profile to the demo site, rendering it with navbar: false and a pinned, docked sidebar carrying the navigation and a location: sidebar, type: textbox search, which is the book-like layout the README describes. Run it with quarto preview --profile sidebar.

What's Changed

  • feat: visible control borders and a sidebar tools row of its own by @mcanouil in #18
  • feat: scheme-following chrome and one navbar control box by @mcanouil in #19
  • feat: fill theme-color from the brand background by @mcanouil in #20
  • ci: bump version for release 🚀 by @mcanouil-dev[bot] in #21

Full Changelog: 0.8.0...0.9.0