201 lines
3.5 KiB
CSS
201 lines
3.5 KiB
CSS
:root {
|
|
--background: #141D24;
|
|
--surfacePrimary: #20292F;
|
|
--surfaceSecondary: #3A4147;
|
|
--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, #previewer .loading .spinner div {
|
|
background: var(--icon);
|
|
}
|
|
|
|
#login {
|
|
background: var(--background);
|
|
}
|
|
|
|
header {
|
|
background: var(--surfacePrimary);
|
|
}
|
|
|
|
#search #input {
|
|
background: var(--surfaceSecondary);
|
|
border-color: var(--surfacePrimary);
|
|
}
|
|
#search #input input::placeholder {
|
|
color: var(--textSecondary);
|
|
}
|
|
#search.active #input {
|
|
background: var(--surfacePrimary);
|
|
}
|
|
#search.active input {
|
|
color: var(--textPrimary);
|
|
}
|
|
#search #result {
|
|
background: var(--background);
|
|
color: var(--textPrimary);
|
|
}
|
|
#search .boxes {
|
|
background: var(--surfaceSecondary);
|
|
}
|
|
#search .boxes h3 {
|
|
color: var(--textPrimary);
|
|
}
|
|
|
|
.action {
|
|
color: var(--textPrimary) !important;
|
|
}
|
|
.action:hover {
|
|
background-color: rgba(255, 255, 255, .1);
|
|
}
|
|
.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);
|
|
}
|
|
|
|
.message {
|
|
color: var(--textPrimary);
|
|
}
|
|
|
|
.card {
|
|
background: var(--surfacePrimary);
|
|
color: var(--textPrimary);
|
|
}
|
|
.button--flat:hover {
|
|
background: var(--surfaceSecondary);
|
|
}
|
|
|
|
.card h3,
|
|
.dashboard #nav,
|
|
.dashboard p label {
|
|
color: var(--textPrimary);
|
|
}
|
|
.card#share ul li input,
|
|
.card#share ul li select,
|
|
.input {
|
|
background: var(--surfaceSecondary);
|
|
color: var(--textPrimary);
|
|
border: 1px solid rgba(255, 255, 255, 0.05);
|
|
}
|
|
.input:hover,
|
|
.input:focus {
|
|
border-color: rgba(255, 255, 255, 0.15);
|
|
}
|
|
.input--red {
|
|
background: #73302D;
|
|
}
|
|
|
|
.input--green {
|
|
background: #147A41;
|
|
}
|
|
|
|
.dashboard #nav li,
|
|
.collapsible {
|
|
border-color: var(--divider);
|
|
}
|
|
.collapsible > label * {
|
|
color: var(--textPrimary);
|
|
}
|
|
|
|
table th {
|
|
color: var(--textSecondary);
|
|
}
|
|
|
|
.file-list li:hover {
|
|
background: var(--surfaceSecondary);
|
|
}
|
|
.file-list li:before {
|
|
color: var(--textSecondary);
|
|
}
|
|
.file-list li[aria-selected=true]:before {
|
|
color: var(--icon);
|
|
}
|
|
|
|
.shell {
|
|
background: var(--surfacePrimary);
|
|
color: var(--textPrimary);
|
|
}
|
|
.shell__result {
|
|
border-top: 1px solid var(--divider);
|
|
}
|
|
|
|
#editor-container {
|
|
background: var(--background);
|
|
}
|
|
|
|
#editor-container .bar {
|
|
background: var(--surfacePrimary);
|
|
}
|
|
|
|
@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;
|
|
}
|
|
}
|
|
|
|
.share__box {
|
|
background: var(--surfacePrimary) !important;
|
|
color: var(--textPrimary);
|
|
}
|
|
|
|
.share__box__element {
|
|
border-top-color: var(--divider);
|
|
} |