Navbar not showing correct dark background

williamjmorenor · July 6, 2020, 3:40am

Hello I am starting with patternfly and I am making my first full page but I see that the side bar is not in the correct color.

I am using:

Content goes here

But I got a light background in the sidebar:

I am not sure where I am wrong, any advice will be nice

This is the corresponding html code:

gist.github.com

https://gist.github.com/williamjmorenor/c6415d72a45a13e8818fc6fe5f7ba191

app.html


<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="stylesheet" href="/static/js/%40patternfly/patternfly/patternfly.css">
  <script src="/static/cacaoaccounting.js"></script>
  <link rel="icon" type="image/png" href="/static/media/favicon-32x32.png" sizes="32x32">
  <link rel="icon" type="image/png" href="/static/media/favicon-16x16.png" sizes="16x16">

This file has been truncated. show original

redallen · July 6, 2020, 1:51pm

Hey @williamjmorenor,

I believe you’re using an older version of our CSS. If you use the latest @patternfly/patternfly from NPM you’ll find that the side nav has a dark background with your HTML. If you still need the dark background with an older version you can set it to var(--pf-global--BackgroundColor--dark-200).

Let us know if you have more questions!

Zack