White Header Menu with black text

[ugreg]

I see the default header is a blue color.

When I set the color in _config.yml to color: "#FFFFFF" my header becomes this hiding most of the text unless I highlight to reveal it has also been set to white.

[vsoch]

That style attribute isn't exposed in the _config.yml, but you can easily update it your self! In assets/css/main.css you'll want to change:

.navbar-dark .navbar-brand {
    color: #fff;
}

and

.navbar-dark .navbar-nav .nav-link {
    color: rgba(255, 255, 255, .75);
}

and then add color: black (or similar) to:

.gh-source__repository {
    display: inline-block;
    max-width: 100%;
    margin-left: 1.2rem;
    font-weight: 700;
    text-overflow: ellipsis;
    overflow: hidden;
    vertical-align: middle;
}

For all of the above, change "color" to black (or what you want for the text). Generally if there is something on the page that isn't styled correctly, you can right click --> inspect and use the console to select the element of interest and test changing the style. When you find something that works, make a change in the actual file.

[vsoch]

If you find the elements in the web console, it also show you the line numbers (which makes life a bit easier!)

[ugreg]

Worked like a charm, changed the code as you suggested to this

.gh-source__repository {
    display: inline-block;
    max-width: 100%;
    margin-left: 1.2rem;
    font-weight: 700;
    text-overflow: ellipsis;
    overflow: hidden;
    vertical-align: middle;
    color: #000
}

... more code ...

.navbar-dark .navbar-brand {
    color: #000
}

.navbar-dark .navbar-brand:hover,
.navbar-dark .navbar-brand:focus {
    color: #fff
}

I'll follow this same approach for the tags css.