Dark mode in doxygen 1.14.0
The layout has changed in more recent versions and the CSS should be updated accordingly.
Yes, I also noticed the same problem
Yup, noticing this too. When browsing files, the hierarchical display bar on the bottom has some light-mode leaking. Same with the right sidebar ToC.
Can confirm I saw this problem. Identified:
- the
#nav-syncicon at the bottom right corner of the sidebar seems to be light mode - I'm not sure if the
.sub-arrowelements in the top menu are rendering correctly, they look more like squares than arrows - the
#page-nav-contentson the right are completely untouched and show in light mode
This was using the most recent Doxygen 1.14.0.
The #page-nav is a new addition controlled by the PAGE_OUTLINE_PANEL property.
It is enabled by default.
Also, a picture is worth a thousand words.
For any interested I took an attempt to fix up some of the styling with Doxygen 1.14.0. But it's not complete, and I mostly just did it through trial and error. But in case it helps someone else, here are the CSS overrides that I've found which handles most of the issues I've noticed (other than the breadcrumbs)
#nav-tree {
border-right: none;
}
#page-nav {
border-left: 1px solid var(--separator-color);
}
.search-icon::before {
background: transparent;
}
tr[class^="memdesc"] {
box-shadow: none;
}
tr.heading + tr[class^="memitem"] td.memItemLeft, tr.groupHeader + tr[class^="memitem"] td.memItemLeft, tr.inherit_header + tr[class^="memitem"] td.memItemLeft {
border-top: 1px solid var(--separator-color);
}
tr.heading + tr[class^="memitem"] td.memItemRight, tr.groupHeader + tr[class^="memitem"] td.memItemRight, tr.inherit_header + tr[class^="memitem"] td.memItemRight {
border-top: 1px solid var(--separator-color);
}
tr[class^="memitem"] + tr[class^="memitem"] td.memItemLeft, tr[class^="memitem"] + tr[class^="memitem"] td.memItemRight, tr[class^="memitem"] + tr[class^="memitem"] td.memTeplParams{
border-top: none;
}
tr[class^="memdesc"] + tr[class^="memitem"] td.memItemLeft, tr[class^="memdesc"] + tr[class^="memitem"] td.memItemRight {
border-top: none;
}
.mdescLeft {
border-left: 1px solid var(--separator-color);
border-bottom: 1px solid var(--separator-color);
}
.mdescRight {
border-right: 1px solid var(--separator-color);
border-bottom: 1px solid var(--separator-color);
}
table.memberdecls .memItemLeft {
border-radius: 0;
}
table.memberdecls .memItemRight {
border-radius: 0;
}
table.memberdecls .memTemplParams {
border-radius: 0;
}
td h2.groupheader {
box-shadow: none;
border-bottom: 1px solid var(--separator-color);
}
#page-nav {
background: var(--side-nav-background);
}
ul.page-outline li.vis {
background-color: var(--page-background-color);
}