266 lines
6.2 KiB
CSS
266 lines
6.2 KiB
CSS
/* @import url('https://fonts.googleapis.com/css2?family=Lato:wght@300;400&display=swap'); */
|
|
|
|
@font-face {
|
|
font-family: 'TT Commons';
|
|
font-weight: normal;
|
|
src: url('/fonts/TT_Commons_Pro_Regular.woff2') format('woff2');
|
|
}
|
|
|
|
@font-face {
|
|
font-family: 'TT Commons';
|
|
font-weight: medium;
|
|
src: url('/fonts/TT_Commons_Pro_Medium.woff2') format('woff2');
|
|
}
|
|
|
|
@font-face {
|
|
font-family: 'TT Commons';
|
|
font-weight: bold;
|
|
src: url('/fonts/TT_Commons_Pro_DemiBold.woff2') format('woff2');
|
|
}
|
|
|
|
:root:not(.theme-dark) {
|
|
--black: #fff;
|
|
--primary: #ff9c24;
|
|
--bkg-light: rgba(0, 0, 0, 0.05);
|
|
--bkg-dark: rgba(0, 0, 0, 0.1);
|
|
--bkg-darker: rgba(0, 0, 0, 0.15);
|
|
--bkg-darkest: rgba(0, 0, 0, 0.2);
|
|
--text: rgba(0, 0, 0, 0.6);
|
|
|
|
--tv-color-platform-background: transparent;
|
|
--tv-color-pane-background: transparent;
|
|
--tv-color-pane-background-secondary: var(--bkg-dark);
|
|
--tv-color-toolbar-button-background-hover: transparent;
|
|
--tv-color-toolbar-button-background-secondary-hover: var(--bkg-darker);
|
|
--tv-color-toolbar-button-background-expanded: var(--bkg-dark);
|
|
--tv-color-pane-background-secondary: var(--bkg-dark);
|
|
--tv-color-toolbar-button-text: var(--text);
|
|
--tv-color-toolbar-button-text-hover: var(--primary);
|
|
--tv-color-toolbar-button-text-active: var(--primary);
|
|
--tv-color-toolbar-button-text-active-hover: var(--primary);
|
|
--tv-color-item-active-text: var(--primary);
|
|
--tv-color-toolbar-toggle-button-background-active: var(--primary);
|
|
--tv-color-toolbar-toggle-button-background-active-hover: var(--primary);
|
|
}
|
|
|
|
.theme-dark:root {
|
|
--black: #141414;
|
|
--primary: #f2c94c;
|
|
--bkg-light: rgba(255, 255, 255, 0.1);
|
|
--bkg-dark: rgba(0, 0, 0, 0.1);
|
|
--bkg-darker: rgba(0, 0, 0, 0.2);
|
|
--bkg-darkest: rgba(0, 0, 0, 0.4);
|
|
--text: rgba(255, 255, 255, 0.6);
|
|
|
|
--tv-color-platform-background: transparent;
|
|
--tv-color-pane-background: transparent;
|
|
--tv-color-pane-background-secondary: var(--bkg-dark);
|
|
--tv-color-toolbar-button-text: var(--text);
|
|
--tv-color-toolbar-button-background-hover: transparent;
|
|
--tv-color-toolbar-button-background-secondary-hover: var(--bkg-darker);
|
|
--tv-color-toolbar-button-background-expanded: var(--bkg-darkest);
|
|
--tv-color-toolbar-button-text: var(--text);
|
|
--tv-color-toolbar-button-text-hover: var(--primary);
|
|
--tv-color-toolbar-button-text-active: var(--primary);
|
|
--tv-color-toolbar-button-text-active-hover: var(--primary);
|
|
--tv-color-item-active-text: var(--text);
|
|
--tv-color-toolbar-toggle-button-background-active: var(--primary);
|
|
--tv-color-toolbar-toggle-button-background-active-hover: var(--primary);
|
|
}
|
|
|
|
/* light theme */
|
|
|
|
html .chart-page .chart-container-border {
|
|
background-color: transparent;
|
|
}
|
|
|
|
html .chart-page {
|
|
font-family: 'TT Commons', sans-serif;
|
|
}
|
|
|
|
html .loading-indicator {
|
|
background: transparent;
|
|
}
|
|
|
|
html .tv-spinner {
|
|
color: var(--primary);
|
|
}
|
|
|
|
html ::selection {
|
|
background-color: var(--bkg-light);
|
|
}
|
|
|
|
html .container-113jHcZc {
|
|
background: var(--text);
|
|
}
|
|
|
|
/* toggle toolbar arrow */
|
|
|
|
html .toggleButton-5IlBhjdP .arrow-5IlBhjdP {
|
|
stroke: var(--black)
|
|
}
|
|
|
|
html .toggleButton-5IlBhjdP:hover .arrow-5IlBhjdP {
|
|
stroke: var(--black)
|
|
}
|
|
|
|
html .container-68Nk42BD:hover .arrow-68Nk42BD {
|
|
stroke: var(--black)
|
|
}
|
|
|
|
/* menu background */
|
|
|
|
html .menuWrap-g78rwseC {
|
|
background-color: var(--black);
|
|
}
|
|
|
|
html .item-2IihgTnv {
|
|
background-color: var(--black);
|
|
}
|
|
|
|
/* menu hover */
|
|
|
|
html .item-2IihgTnv:hover {
|
|
background-color: var(--bkg-light);
|
|
}
|
|
|
|
/* minutes, hours, days menu hover */
|
|
|
|
html .summary-3UYGeClB:hover {
|
|
background-color: var(--bkg-light);
|
|
}
|
|
|
|
/* menu active highlight */
|
|
|
|
html .item-2IihgTnv.isActive-2IihgTnv, html .item-2IihgTnv.isActive-2IihgTnv:active {
|
|
background-color: var(--bkg-light);
|
|
}
|
|
|
|
html .item-2IihgTnv.isActive-2IihgTnv:hover {
|
|
background-color: var(--bkg-light);
|
|
}
|
|
|
|
/* dialog */
|
|
|
|
html .dialog-UM6w7sFp {
|
|
background-color: var(--black);
|
|
}
|
|
|
|
/* dialog item hovers */
|
|
|
|
html .container-3Ywm3-oo:not(.disabled-3Ywm3-oo):hover {
|
|
background-color: var(--bkg-light);
|
|
}
|
|
|
|
/* dialog item selected */
|
|
|
|
html .container-3Ywm3-oo.selected-3Ywm3-oo {
|
|
background-color: var(--bkg-light);
|
|
}
|
|
|
|
html .container-3Ywm3-oo.selected-3Ywm3-oo.highlighted-3Ywm3-oo.dark-3Ywm3-oo {
|
|
background-color: var(--bkg-light);
|
|
}
|
|
|
|
html .container-3Ywm3-oo:not(.disabled-3Ywm3-oo):hover.selected-3Ywm3-oo {
|
|
background-color: var(--bkg-light);
|
|
}
|
|
|
|
|
|
/* dark theme */
|
|
|
|
html.theme-dark .chart-page .chart-container-border {
|
|
background-color: transparent;
|
|
}
|
|
|
|
html.theme-dark .chart-page {
|
|
font-family: 'TT Commons', sans-serif;
|
|
}
|
|
|
|
html.theme-dark .loading-indicator {
|
|
background: transparent;
|
|
}
|
|
|
|
html.theme-dark .tv-spinner {
|
|
color: var(--primary);
|
|
}
|
|
|
|
html.theme-dark ::selection {
|
|
background-color: var(--bkg-light);
|
|
}
|
|
|
|
html.theme-dark .container-113jHcZc {
|
|
background: var(--black);
|
|
}
|
|
|
|
/* toggle toolbar arrow */
|
|
|
|
html.theme-dark .toggleButton-5IlBhjdP .arrow-5IlBhjdP {
|
|
stroke: var(--black)
|
|
}
|
|
|
|
html.theme-dark .toggleButton-5IlBhjdP:hover .arrow-5IlBhjdP {
|
|
stroke: var(--black)
|
|
}
|
|
|
|
html.theme-dark .container-68Nk42BD:hover .arrow-68Nk42BD {
|
|
stroke: var(--black)
|
|
}
|
|
|
|
/* menu background */
|
|
|
|
html.theme-dark .menuWrap-g78rwseC {
|
|
background-color: var(--black);
|
|
}
|
|
|
|
html.theme-dark .item-2IihgTnv {
|
|
background-color: var(--black);
|
|
}
|
|
|
|
/* menu hover */
|
|
|
|
html.theme-dark .item-2IihgTnv:hover {
|
|
background-color: var(--bkg-light);
|
|
}
|
|
|
|
/* minutes, hours, days menu hover */
|
|
|
|
html.theme-dark .summary-3UYGeClB:hover {
|
|
background-color: var(--bkg-light);
|
|
}
|
|
|
|
/* menu active highlight */
|
|
|
|
html.theme-dark .item-2IihgTnv.isActive-2IihgTnv, html.theme-dark .item-2IihgTnv.isActive-2IihgTnv:active {
|
|
background-color: var(--bkg-light);
|
|
}
|
|
|
|
html.theme-dark .item-2IihgTnv.isActive-2IihgTnv:hover {
|
|
background-color: var(--bkg-light);
|
|
}
|
|
|
|
/* dialog */
|
|
|
|
html.theme-dark .dialog-UM6w7sFp {
|
|
background-color: var(--black);
|
|
}
|
|
|
|
/* dialog item hovers */
|
|
|
|
html.theme-dark .container-3Ywm3-oo:not(.disabled-3Ywm3-oo):hover {
|
|
background-color: var(--bkg-light);
|
|
}
|
|
|
|
/* dialog item selected */
|
|
|
|
html.theme-dark .container-3Ywm3-oo.selected-3Ywm3-oo {
|
|
background-color: var(--bkg-light);
|
|
}
|
|
|
|
html.theme-dark .container-3Ywm3-oo.selected-3Ywm3-oo.highlighted-3Ywm3-oo.dark-3Ywm3-oo {
|
|
background-color: var(--bkg-light);
|
|
}
|
|
|
|
html.theme-dark .container-3Ywm3-oo:not(.disabled-3Ywm3-oo):hover.selected-3Ywm3-oo {
|
|
background-color: var(--bkg-light);
|
|
} |