Invert luminosity of rendered diagram when in dark mode

This commit is contained in:
David Evans 2020-04-12 13:31:45 +01:00
parent 65981833be
commit bc10b3cc61
1 changed files with 30 additions and 9 deletions

View File

@ -609,12 +609,12 @@ svg a:active, svg a:hover {
border-color: #66AA55; border-color: #66AA55;
} }
.pane-view { .pane-view, .pane-view-scroller {
background: #888888; background: #111111;
} }
.pane-library { .pane-library, .pane-library-scroller {
background: #555555; background: #222222;
} }
.pane-code .CodeMirror { .pane-code .CodeMirror {
@ -634,13 +634,26 @@ svg a:active, svg a:hover {
background: #807700; background: #807700;
} }
.pane-view .region:hover .outline {
stroke: rgba(150, 140, 0, 0.5);
}
.pane-view .region.focus .outline {
stroke: rgba(190, 140, 0, 0.5);
}
.pane-view .region.focus:hover .outline {
stroke: rgba(170, 140, 0, 0.5);
}
.library-item > div { .library-item > div {
border-color: #555555; border-color: #222222;
background: #888888; background: #111111;
} }
.library-item:hover > div { .library-item:hover > div {
background: #999977; border-color: #FFCC00;
background: #444433;
} }
.msg-error { .msg-error {
@ -648,6 +661,10 @@ svg a:active, svg a:hover {
background: #AA6666; background: #AA6666;
} }
.pane-view svg, .library-item svg {
filter: invert(1) hue-rotate(180deg);
}
.options { .options {
background: #333333; background: #333333;
} }
@ -675,16 +692,20 @@ svg a:active, svg a:hover {
.pick-document-item > div { .pick-document-item > div {
border-color: #999999; border-color: #999999;
background: #666666; background: #111111;
} }
.pick-document-item:hover > div { .pick-document-item:hover > div {
background: #888866; background: #444433;
} }
.pick-document-item.new > div:before { .pick-document-item.new > div:before {
color: #999999; color: #999999;
} }
.pane-view svg, .library-item svg, .pick-document-item svg {
filter: invert(1) hue-rotate(180deg);
}
} }
@media (prefers-reduced-motion: reduce) { @media (prefers-reduced-motion: reduce) {