night.css updates: use css variables, fix various mismatching styles
This commit is contained in:
Andrew Dolgov
parent
6303e1626c
commit
8140974189
160
themes/night.css
160
themes/night.css
|
|
@ -1,8 +1,17 @@
|
||||||
@import "default.php";
|
@import "default.php";
|
||||||
|
|
||||||
|
:root {
|
||||||
|
--bg-main : #333;
|
||||||
|
--border-main : #666;
|
||||||
|
--bg-panel : #222;
|
||||||
|
--fg-main: #999;
|
||||||
|
--fg-light : #ccc;
|
||||||
|
--bg-active: #2a89bc;
|
||||||
|
}
|
||||||
|
|
||||||
body.claro.ttrss_main #feeds-holder {
|
body.claro.ttrss_main #feeds-holder {
|
||||||
background : #222;
|
background : var(--bg-panel);
|
||||||
border-color : #666;
|
border-color : var(--border-main);
|
||||||
border-left-width : 1px;
|
border-left-width : 1px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -11,66 +20,60 @@ body.claro.ttrss_main #headlines-frame {
|
||||||
}
|
}
|
||||||
|
|
||||||
body.claro.ttrss_main div.whiteBox {
|
body.claro.ttrss_main div.whiteBox {
|
||||||
border-color : #666;
|
border-color : var(--border-main);
|
||||||
}
|
}
|
||||||
|
|
||||||
body.claro.ttrss_main #content-insert {
|
body.claro.ttrss_main #content-insert {
|
||||||
background : #333;
|
background : var(--bg-main);
|
||||||
}
|
}
|
||||||
|
|
||||||
body.claro.ttrss_main #feedTree .dijitTreeRow {
|
body.claro.ttrss_main #feedTree .dijitTreeRow {
|
||||||
color : #ccc ! important;
|
color : var(--fg-light) ! important;
|
||||||
}
|
}
|
||||||
|
|
||||||
body.claro.ttrss_main .dijitTree .dijitTreeRowHover {
|
body.claro.ttrss_main .dijitTree .dijitTreeRowHover {
|
||||||
background : #444;
|
background : #444;
|
||||||
border-color : #666;
|
border-color : var(--border-main);
|
||||||
}
|
}
|
||||||
|
|
||||||
body.claro.ttrss_main .dijitTree .dijitTreeRowSelected {
|
body.claro.ttrss_main .dijitTree .dijitTreeRowSelected {
|
||||||
background : #555;
|
background : #555;
|
||||||
border-color : #666 ! important;
|
border-color : var(--border-main) ! important;
|
||||||
}
|
}
|
||||||
|
|
||||||
body.claro.ttrss_main .dijitTreeRowSelected .dijitTreeLabel {
|
body.claro.ttrss_main .dijitTreeRowSelected .dijitTreeLabel {
|
||||||
text-shadow : none;
|
text-shadow : none;
|
||||||
}
|
}
|
||||||
|
|
||||||
body.claro.ttrss_main #feedTree .counterNode.aux {
|
body.claro.ttrss_main #feeds-holder #feedTree .counterNode.aux {
|
||||||
background : #555;
|
background : var(--bg-panel);
|
||||||
color : #999;
|
color : var(--fg-main);
|
||||||
border-color : #333;
|
border-color : var(--bg-main);
|
||||||
}
|
|
||||||
|
|
||||||
body.claro.ttrss_main #feedTree .counterNode {
|
|
||||||
border : 1px solid #6280AD;
|
|
||||||
color : white;
|
|
||||||
background : #6280AD;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
body.claro.ttrss_main #headlines-frame {
|
body.claro.ttrss_main #headlines-frame {
|
||||||
background : #333;
|
background : var(--bg-main);
|
||||||
color : #ccc;
|
color : var(--fg-light);
|
||||||
}
|
}
|
||||||
|
|
||||||
body.claro.ttrss_main #main-toolbar {
|
body.claro.ttrss_main #main-toolbar {
|
||||||
background : #333;
|
background : var(--bg-main);
|
||||||
border-color : #666;
|
border-color : var(--border-main);
|
||||||
}
|
}
|
||||||
|
|
||||||
body.claro.ttrss_main #main-toolbar .dijitButtonText {
|
body.claro.ttrss_main #main-toolbar .dijitButtonText {
|
||||||
color : #ddd;
|
color : #ddd;
|
||||||
}
|
}
|
||||||
|
|
||||||
body.claro.ttrss_main #main-toolbar .dijitSelect {
|
body.claro.ttrss_main #main-toolbar .dijitSelect,
|
||||||
border-color : #666;
|
body.claro.ttrss_main #main-toolbar .dijitSelect .dijitButtonText {
|
||||||
|
background : black;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
body.claro.ttrss_main #main,
|
body.claro.ttrss_main #main,
|
||||||
body.claro.ttrss_main #overlay {
|
body.claro.ttrss_main #overlay {
|
||||||
background : #333;
|
background : var(--bg-main);
|
||||||
color : #ccc;
|
color : var(--fg-main);
|
||||||
}
|
}
|
||||||
|
|
||||||
body.claro.ttrss_main .hl .feed a,
|
body.claro.ttrss_main .hl .feed a,
|
||||||
|
|
@ -80,27 +83,25 @@ body.claro.ttrss_main .cdm .feed a {
|
||||||
|
|
||||||
body.claro.ttrss_main div.cdm.expanded div.footer,
|
body.claro.ttrss_main div.cdm.expanded div.footer,
|
||||||
body.claro.ttrss_main div.cdm.expandable div.footer {
|
body.claro.ttrss_main div.cdm.expandable div.footer {
|
||||||
border-color : #666;
|
border-color : var(--border-main);
|
||||||
color : #ccc;
|
color : var(--fg-light);
|
||||||
}
|
|
||||||
|
|
||||||
body.claro.ttrss_main div.cdm.expandable.Selected {
|
|
||||||
background : #6280AD;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
body.claro.ttrss_main div.cdm.expanded.Unread .header a.title,
|
body.claro.ttrss_main div.cdm.expanded.Unread .header a.title,
|
||||||
body.claro.ttrss_main div.cdm.expandable.Unread a.title {
|
body.claro.ttrss_main div.cdm.expandable.Unread a.title,
|
||||||
color : #ccc;
|
|
||||||
}
|
|
||||||
|
|
||||||
body.claro.ttrss_main div.cdm.expanded .header a.title,
|
body.claro.ttrss_main div.cdm.expanded .header a.title,
|
||||||
body.claro.ttrss_main div.cdm.expandable a.title {
|
body.claro.ttrss_main div.cdm.expandable a.title {
|
||||||
color : #aaa;
|
color : var(--fg-main);
|
||||||
|
}
|
||||||
|
|
||||||
|
body.claro.ttrss_main .cdm.expandable.active .header a.title,
|
||||||
|
body.claro.ttrss_main .cdm.expanded.active .header a.title {
|
||||||
|
color : #2a89bc;
|
||||||
}
|
}
|
||||||
|
|
||||||
body.claro.ttrss_main .cdm.expandable.active,
|
body.claro.ttrss_main .cdm.expandable.active,
|
||||||
body.claro.ttrss_main .cdm.expandable {
|
body.claro.ttrss_main .cdm.expandable {
|
||||||
border-color : #666;
|
border-color : var(--border-main);
|
||||||
background : transparent;
|
background : transparent;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -108,16 +109,11 @@ body.claro.ttrss_main .cdm.active {
|
||||||
background : transparent ! important;
|
background : transparent ! important;
|
||||||
}
|
}
|
||||||
|
|
||||||
body.claro.ttrss_main .cdm .content-inner,
|
|
||||||
body.claro.ttrss_main .cdm .titleWrap {
|
|
||||||
color : #bbb;
|
|
||||||
}
|
|
||||||
|
|
||||||
body.claro.ttrss_main #content-insert blockquote,
|
body.claro.ttrss_main #content-insert blockquote,
|
||||||
body.claro.ttrss_main #headlines-frame blockquote,
|
body.claro.ttrss_main #headlines-frame blockquote,
|
||||||
body.claro.ttrss_main .dijitContentPane blockquote {
|
body.claro.ttrss_main .dijitContentPane blockquote {
|
||||||
color : #999;
|
color : var(--fg-main);
|
||||||
border-color : #666;
|
border-color : var(--border-main);
|
||||||
}
|
}
|
||||||
|
|
||||||
body.claro.ttrss_main #content-insert code,
|
body.claro.ttrss_main #content-insert code,
|
||||||
|
|
@ -129,26 +125,12 @@ body.claro.ttrss_main .dijitContentPane code {
|
||||||
body.claro.ttrss_main #content-insert pre,
|
body.claro.ttrss_main #content-insert pre,
|
||||||
body.claro.ttrss_main #headlines-frame pre,
|
body.claro.ttrss_main #headlines-frame pre,
|
||||||
body.claro.ttrss_main.dijitContentPane pre {
|
body.claro.ttrss_main.dijitContentPane pre {
|
||||||
color : #999;
|
color : var(--fg-main);
|
||||||
background : black;
|
background : black;
|
||||||
}
|
}
|
||||||
|
|
||||||
body.claro.ttrss_main .dijitInputField.dijitButtonText {
|
body.claro.ttrss_main .dijitInputField.dijitButtonText {
|
||||||
background : #333;
|
background : var(--bg-main);
|
||||||
}
|
|
||||||
|
|
||||||
/*body.claro.ttrss_main .cdm .content-inner img,
|
|
||||||
body.claro.ttrss_main .cdm img.tinyFeedIcon,
|
|
||||||
body.claro.ttrss_main .cdm .footer img,
|
|
||||||
body.claro.ttrss_main #feedTree img,
|
|
||||||
body.claro.ttrss_main .post .content img {
|
|
||||||
filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); // firefox lol
|
|
||||||
filter: grayscale(1);
|
|
||||||
-webkit-filter: grayscale(1);
|
|
||||||
}*/
|
|
||||||
|
|
||||||
body.claro.ttrss_main .hl img.hlScorePic {
|
|
||||||
opacity : 0.5;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
body.claro.ttrss_main .cdm .footer img {
|
body.claro.ttrss_main .cdm .footer img {
|
||||||
|
|
@ -156,19 +138,19 @@ body.claro.ttrss_main .cdm .footer img {
|
||||||
}
|
}
|
||||||
|
|
||||||
body.claro.ttrss_main #floatingTitle {
|
body.claro.ttrss_main #floatingTitle {
|
||||||
background : #333;
|
background : var(--bg-main);
|
||||||
border-color : #666;
|
border-color : var(--border-main);
|
||||||
}
|
}
|
||||||
|
|
||||||
body.claro.ttrss_main #floatingTitle a.title {
|
body.claro.ttrss_main #floatingTitle a.title {
|
||||||
color : #ccc;
|
color : var(--fg-light);
|
||||||
}
|
}
|
||||||
|
|
||||||
body.claro.ttrss_main .dijitMenu,
|
body.claro.ttrss_main .dijitMenu,
|
||||||
body.claro.ttrss_main .dijitMenuTable,
|
body.claro.ttrss_main .dijitMenuTable,
|
||||||
body.claro.ttrss_main .dijitMenu .dijitMenuItem td {
|
body.claro.ttrss_main .dijitMenu .dijitMenuItem td {
|
||||||
border-color : #666;
|
border-color : var(--border-main);
|
||||||
background : #666;
|
background : var(--border-main);
|
||||||
}
|
}
|
||||||
|
|
||||||
body.claro.ttrss_main .dijitMenu .dijitMenuItemSelected,
|
body.claro.ttrss_main .dijitMenu .dijitMenuItemSelected,
|
||||||
|
|
@ -178,24 +160,46 @@ body.claro.ttrss_main .dijitMenu .dijitMenuItemSelected td {
|
||||||
}
|
}
|
||||||
|
|
||||||
body.claro.ttrss_main .hl {
|
body.claro.ttrss_main .hl {
|
||||||
border-color : #666;
|
border-color : var(--border-main);
|
||||||
}
|
}
|
||||||
|
|
||||||
body.claro.ttrss_main .hl .hl-title a {
|
body.claro.ttrss_main .hl .title a {
|
||||||
color : #ccc;
|
color : var(--fg-main);
|
||||||
}
|
|
||||||
|
|
||||||
body.claro.ttrss_main .hl.Selected,
|
|
||||||
body.claro.ttrss_main .hl.active {
|
|
||||||
background : #6280AD ! important;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
body.claro.ttrss_main .post .header {
|
body.claro.ttrss_main .post .header {
|
||||||
background : #333;
|
background : var(--bg-panel);
|
||||||
border-color : #666;
|
border-color : var(--border-main);
|
||||||
}
|
}
|
||||||
|
|
||||||
body.claro.ttrss_main .hl.Unread div.title a {
|
body.claro.ttrss_main .post .content,
|
||||||
color: #bbb;
|
body.claro.ttrss_main .cdm .content-inner {
|
||||||
|
color : var(--fg-main);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
body.claro.ttrss_main .articleNote {
|
||||||
|
background : var(--bg-panel);
|
||||||
|
border-color : #9a8c59;
|
||||||
|
}
|
||||||
|
|
||||||
|
body.claro.ttrss_main #content-insert_splitter,
|
||||||
|
body.claro.ttrss_main #feeds-holder_splitter {
|
||||||
|
border-color : var(--border-main);
|
||||||
|
background : var(--bg-panel);
|
||||||
|
}
|
||||||
|
|
||||||
|
body.claro.ttrss_main .insensitive {
|
||||||
|
color : var(--fg-light);
|
||||||
|
}
|
||||||
|
|
||||||
|
::-webkit-scrollbar {
|
||||||
|
width: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
::-webkit-scrollbar-thumb {
|
||||||
|
background-color: rgba(255,255,255,0.5);
|
||||||
|
}
|
||||||
|
|
||||||
|
::-webkit-scrollbar-track {
|
||||||
|
background-color:rgba(255,255,255,0.2);
|
||||||
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue