Change Color of Section Header

[jasminskoenig]

Description

Hi everyone!

I'm trying to change the color of my section headers but can't get it to work. I'm able to change all other heading color, only the section headers - which I understand are the h1 header keep their colors.

This is my current scss file. I'm trying to change background color and font color in one go, in theme-section1.

 // fonts
@import url('https://fonts.googleapis.com/css?family=Rajdhani&display=swap');
@import url('https://fonts.googleapis.com/css?family=Source+Code+Pro&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Gochi+Hand&display=swap');


$font-family-sans-serif: "Rajdhani", sans-serif;
$font-family-monospace: "Source Code Pro", monospace;
$theme-rose: #AF929D;
$theme-blue: #689295;
$theme-silver: #CEC3C1;
$theme-darkslate: #263f3f;
$presentation-title-slide-text-color: $theme-darkslate;
  $code-block-font-size: 0.7em;
$presentation-h2-font-size: 1.4em !default;
$presentation-font-size-root: 36px !default;
$presentation-heading-color: $theme-darkslate !default;
$link-color: $theme-rose;
$code-color: $theme-blue;
  
  /*-- scss:rules --*/
  
  details>summary {
    font-size: 0.75em;
  }

#title-slide .title {
text-align: center;
color: #464a53;
  font-size: 30px
}

.theme-section1 {
  &:is(.slide-background) {
    background-color: $theme-darkslate;
  }
 
}

And then I would like to use it like this:

# Overview {.theme-section1 .h1}

I'd be super thankful for any kind of idea!

[cscheid]

Hi - can you share a full .qmd file you're using so we get an idea for the rest of your document? If you have a link to a github repo, that's even better. Thanks.

[jasminskoenig]

Hi - thank you for the quick response!

This is the link to the github repo's folder for my slides: https://github.com/jasminskoenig/constitutional-regression-advanced/tree/main/slides
The current presentation is in the folder slides_cdm.

[dragonstyle]

I would also suggest that you add /*-- scss:variables --*/ at the top of the file (above the variable declarations). I'm not sure what our behavior is when there is free floating scss content in the theme file...

[jasminskoenig]

Oh - that's a really got note. I actually deleted that by accident but didn't notice. Thank you for pointing that out!

[cscheid]

(@dragonstyle I've tagged this discussion as lint so that we can, in the future, check if the provided .scss files match our expectations)

[mcanouil]

@jasminskoenig Did you manage to get what you wanted? (I am not sure your issue is resolved 😅)

[jasminskoenig]

Nope, the issue prevails! 😃

[mcanouil]

Ok, I'll get to it soon.

[mcanouil]

@jasminskoenig I made a PR¹ to your repository.
In your case, the easiest way to ensure your modification takes precedence is to add !important.

Footnotes

1. See https://github.com/jasminskoenig/constitutional-regression-advanced/pull/1. ↩