Change background of breadcrumbs

[royfrancis]

Description

This is really a minor problem when using custom title-block-banner and $navbar-bg, breadcrumbs stick out since they have a white background.

Here is an example;

.
├── _quarto.yml
├── index.qmd
├── reports
│   └── report.qmd
└── styles.scss

_quarto.yml

project:
  type: website

format:
  html:
    theme: styles.scss
    title-block-banner: d7bde2

website:
  title: Website
  navbar:
    left:
      - href: index.qmd
        text: Home
      - href: reports/report.qmd
        text: Report
  sidebar:
    contents:
      - section: Reports
        contents: "reports/*"

styles.scss

/*-- scss:defaults --*/

$navbar-bg: #d7bde2;

/*-- scss:rules --*/

index.qmd

---
title: Home page
---

Here is some text.

report.qmd

---
title: Report
---

Here is a report.

One option would be to disable the bread-crumbs #6183. If I want to keep them, how do I change the background color of bread-crumbs? Changing the background-color of the class quarto-page-breadcrumbs doesn't fill the margins.

quarto 1.4.506

[mcanouil]

@dragonstyle I believe it should be easy to make the breadcrumbs divs use the SCCS variable, isn't it?

[dragonstyle]

Yeah, but I think we should be doing a better job of this by default without needing the SCSS variable (e.g. this should be inheriting the navbar color)... I just made a change that should address this - let's see if that just takes care of it..

[mcanouil]

(I did not look at the structure, but yes if it can inherit directly, this is better)