141 lines
2.5 KiB
CSS
141 lines
2.5 KiB
CSS
|
:root {
|
||
|
--background: #121212;
|
||
|
--surfacePrimary: #171819;
|
||
|
--surfaceSecondary: #212528;
|
||
|
--divider: rgba(255, 255, 255, 0.12);
|
||
|
--icon: #ffffff;
|
||
|
--textPrimary: rgba(255, 255, 255, 0.87);
|
||
|
--textSecondary: rgba(255, 255, 255, 0.6);
|
||
|
}
|
||
|
|
||
|
body {
|
||
|
background: var(--background);
|
||
|
color: var(--textPrimary);
|
||
|
}
|
||
|
|
||
|
#loading {
|
||
|
background: var(--background);
|
||
|
}
|
||
|
#loading .spinner div {
|
||
|
background: var(--icon);
|
||
|
}
|
||
|
|
||
|
#login {
|
||
|
background: var(--background);
|
||
|
}
|
||
|
|
||
|
header {
|
||
|
background: var(--surfacePrimary);
|
||
|
}
|
||
|
|
||
|
#search #input {
|
||
|
background: var(--surfaceSecondary);
|
||
|
}
|
||
|
#search.active #input,
|
||
|
#search.active .boxes {
|
||
|
background: var(--surfacePrimary);
|
||
|
}
|
||
|
#search.active input {
|
||
|
color: var(--textPrimary);
|
||
|
}
|
||
|
#search.active #result {
|
||
|
background: var(--background);
|
||
|
color: var(--textPrimary);
|
||
|
}
|
||
|
#search.active .boxes h3 {
|
||
|
color: var(--textPrimary);
|
||
|
}
|
||
|
|
||
|
.action {
|
||
|
color: var(--textPrimary) !important;
|
||
|
}
|
||
|
.action i {
|
||
|
color: var(--icon) !important;
|
||
|
}
|
||
|
.action .counter {
|
||
|
border-color: var(--surfacePrimary);
|
||
|
}
|
||
|
|
||
|
nav > div {
|
||
|
border-color: var(--divider);
|
||
|
}
|
||
|
|
||
|
#breadcrumbs {
|
||
|
border-color: var(--divider);
|
||
|
color: var(--textPrimary) !important;
|
||
|
}
|
||
|
#breadcrumbs span {
|
||
|
color: var(--textPrimary) !important;
|
||
|
}
|
||
|
|
||
|
#listing .item {
|
||
|
background: var(--surfacePrimary);
|
||
|
color: var(--textPrimary);
|
||
|
border-color: var(--divider) !important;
|
||
|
}
|
||
|
#listing .item i {
|
||
|
color: var(--icon);
|
||
|
}
|
||
|
#listing .item .modified {
|
||
|
color: var(--textSecondary);
|
||
|
}
|
||
|
#listing h2,
|
||
|
#listing.list .header span {
|
||
|
color: var(--textPrimary) !important;
|
||
|
}
|
||
|
#listing.list .header span {
|
||
|
color: var(--textPrimary);
|
||
|
}
|
||
|
#listing.list .header i {
|
||
|
color: var(--icon);
|
||
|
}
|
||
|
#listing.list .item.header {
|
||
|
background: var(--background);
|
||
|
}
|
||
|
|
||
|
.card {
|
||
|
background: var(--surfacePrimary);
|
||
|
color: var(--textPrimary);
|
||
|
}
|
||
|
.button--flat:hover {
|
||
|
background: var(--surfaceSecondary);
|
||
|
}
|
||
|
|
||
|
.card h3,
|
||
|
.dashboard #nav,
|
||
|
.dashboard p label {
|
||
|
color: var(--textPrimary);
|
||
|
}
|
||
|
.input {
|
||
|
background: var(--surfaceSecondary);
|
||
|
color: var(--textPrimary);
|
||
|
}
|
||
|
|
||
|
.dashboard #nav li,
|
||
|
.collapsible {
|
||
|
border-color: var(--divider);
|
||
|
}
|
||
|
.collapsible > label * {
|
||
|
color: var(--textPrimary);
|
||
|
}
|
||
|
|
||
|
.shell {
|
||
|
background: var(--surfacePrimary);
|
||
|
color: var(--textPrimary);
|
||
|
}
|
||
|
|
||
|
@media (max-width: 736px) {
|
||
|
#file-selection {
|
||
|
background: var(--surfaceSecondary) !important;
|
||
|
}
|
||
|
#file-selection span {
|
||
|
color: var(--textPrimary) !important;
|
||
|
}
|
||
|
nav {
|
||
|
background: var(--surfaceSecondary) !important;
|
||
|
}
|
||
|
#dropdown {
|
||
|
background: var(--surfaceSecondary) !important;
|
||
|
}
|
||
|
}
|