Brand palette colours reach Bootstrap colour variables only when `defaults.bootstrap` is set

Abierto
  • ¿Algo no está bien?
#15,295 0 comentarios 0 reacciones 0 asignados Ver en GitHub

Los mantenedores suelen responder en 1 día

Nadie ha tomado este issue todavía.

Evaluación

Dificultad
3/5
Tiempo estimado
1-2 días
Aptitud para principiantes
57/100
Tipo de issue
Error
Claridad
Bien especificado
Estado de actividad
Activo
Stack tecnológico
sass, typescript, yaml
Área
build-system, design

Línea de trabajo

Start in src/core/sass/brand.ts, especially brandBootstrapSassLayers and brandDefaultsBootstrapLayer; compare how light and dark brand data add the palette mapping. Reproduce with the _brand.yml examples and render index.qmd with quarto render. Done when palette colors reach Bootstrap variables without a defaults.bootstrap block and the precedence of an explicit Bootstrap default is resolved.

Escrito por el modelo de indexación a partir del texto del issue.

Descripción

bootstrap brand bug themes
I have:
  • searched the issue tracker for similar issues
  • installed the latest version of Quarto CLI
  • formatted my issue following the Bug Reports guide
Bug description

When a color.palette name matches a Bootstrap colour (blue, red, green and the others), #11108 sets the Bootstrap variable to the brand colour, so $blue takes color.palette.blue.
That only happens when the brand also has a defaults.bootstrap block.
With a palette alone, $brand-blue is set but $blue keeps the Bootstrap value.
Anything built on $blue, such as $callout-color-note, then ignores the brand.

The cause is in brandBootstrapSassLayers in src/core/sass/brand.ts.
The palette mapping lives in brandDefaultsBootstrapLayer, and that layer is only added under if (brand?.light?.data?.defaults?.bootstrap) (and the same for dark).
The PR describes the mapping with no such condition, so this looks unintended.

There's a second, smaller point in the same layer.
When both color.palette.blue and defaults.bootstrap.defaults.blue are set, the palette wins.
I'd have expected the explicit Bootstrap default to take precedence.
If the current order is by design, it would help to document it.

Related: #11108, #14092.

Steps to reproduce

_brand.yml:

color:
  palette:
    blue: "#ff00aa"

index.qmd:

---
title: Brand palette
format: html
---

::: {.callout-note}
A note.
:::

Render with quarto render index.qmd, then look at the generated Bootstrap CSS.
Next, add any unrelated key under defaults.bootstrap and render again:

color:
  palette:
    blue: "#ff00aa"
defaults:
  bootstrap:
    defaults:
      enable-shadows: false
Actual behavior

With the palette only:

--bs-blue: #0d6efd
--brand-blue: #ff00aa
div.callout-note.callout{border-left-color:#0d6efd}

With the unrelated defaults.bootstrap key added:

--bs-blue: #ff00aa
--brand-blue: #ff00aa
div.callout-note.callout{border-left-color:#f0a}

With defaults.bootstrap.defaults.blue: "#00aa00" as well, --bs-blue is still #ff00aa.

Expected behavior

$blue (and so --bs-blue and the note callout) takes color.palette.blue whether or not the brand has a defaults.bootstrap block.

Your environment
  • OS: macOS 27.2.
Quarto check output
Quarto 99.9.9
[✓] Checking versions of quarto binary dependencies...
      Pandoc version 3.10.0: OK
      Dart Sass version 1.107.1: OK
      Deno version 2.9.8: OK
      Typst version 0.15.1: OK
[✓] Checking Quarto installation......OK
      Version: 99.9.9
      commit: 089ba530b3ed4ec156a355d41b6b7de2db3e44ea
Lenguaje dominante
JavaScript
Estrellas
6.2k
Forks
482
Merge medio
17 h 46 min
PR fusionados (30 d)
135

Preparar el entorno

Primeros pasos

  1. Lee el issue completo y luego la guía de contribución del proyecto.
  2. Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
  3. Haz un fork del repositorio y trabaja en una rama.
  4. Abre un pull request que haga referencia al número del issue.

Más de quarto-dev/quarto-cli

Todos los issues de quarto-dev/quarto-cli

Issues similares

Más issues de JavaScript

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.