mirror of
https://github.com/gilbN/theme.park.git
synced 2024-11-09 04:32:36 +01:00
684 lines
14 KiB
CSS
684 lines
14 KiB
CSS
/* dP dP dP */
|
|
/* 88 88 88 */
|
|
/* d8888P 88d888b. .d8888b. 88d8b.d8b. .d8888b. 88d888b. .d8888b. 88d888b. 88 .dP */
|
|
/* 88 88' `88 88ooood8 88'`88'`88 88ooood8 88' `88 88' `88 88' `88 88888" */
|
|
/* 88 88 88 88. ... 88 88 88 88. ... 88. .88 88. .88 88 88 `8b. */
|
|
/* dP dP dP `88888P' dP dP dP `88888P' 88 88Y888P' `88888P8 dP dP `YP */
|
|
/* 88 */
|
|
/* dP */
|
|
|
|
/* Made by @gilbN */
|
|
/* https://github.com/gilbN/theme.park */
|
|
|
|
/* PLACEHOLDERS */
|
|
input::-webkit-input-placeholder {
|
|
color: var(--text);
|
|
}
|
|
|
|
input:focus::-webkit-input-placeholder {
|
|
color: var(--text-hover);
|
|
}
|
|
|
|
/* Firefox < 19 */
|
|
input:-moz-placeholder {
|
|
color: var(--text);
|
|
}
|
|
|
|
input:focus:-moz-placeholder {
|
|
color: var(--text-hover);
|
|
}
|
|
|
|
/* Firefox > 19 */
|
|
input::-moz-placeholder {
|
|
color: var(--text);
|
|
}
|
|
|
|
input:focus::-moz-placeholder {
|
|
color: var(--text-hover);
|
|
}
|
|
|
|
/* Internet Explorer 10 */
|
|
input:-ms-input-placeholder {
|
|
color: var(--text);
|
|
}
|
|
|
|
input:focus:-ms-input-placeholder {
|
|
color: var(--text-hover);
|
|
}
|
|
|
|
.message {
|
|
color: var(--text-hover);
|
|
}
|
|
|
|
#login {
|
|
min-height: 100%;
|
|
height: auto;
|
|
background: var(--main-bg-color);
|
|
background-repeat: repeat, no-repeat;
|
|
background-attachment: fixed, fixed;
|
|
background-position: center center, center center;
|
|
background-size: auto, cover;
|
|
-webkit-background-size: auto, cover;
|
|
-moz-background-size: auto, cover;
|
|
-o-background-size: auto, cover;
|
|
}
|
|
|
|
body {
|
|
|
|
color: var(--text);
|
|
font-family: Open Sans Bold, Helvetica Neue, Helvetica, Arial, sans-serif;
|
|
}
|
|
|
|
h1,
|
|
h2,
|
|
h3,
|
|
h4,
|
|
h5,
|
|
h6,
|
|
th {
|
|
color: var(--text-hover) !important;
|
|
}
|
|
|
|
#login input[type=password],
|
|
#login input[type=text] {
|
|
color: var(--text-hover) !important;
|
|
background-color: rgba(0, 0, 0, 0.15) !important;
|
|
border: none;
|
|
}
|
|
|
|
#loading {
|
|
background: var(--main-bg-color);
|
|
background-repeat: repeat, no-repeat;
|
|
background-attachment: fixed, fixed;
|
|
background-position: center center, center center;
|
|
background-size: auto, cover;
|
|
-webkit-background-size: auto, cover;
|
|
-moz-background-size: auto, cover;
|
|
-o-background-size: auto, cover;
|
|
}
|
|
|
|
#loading .spinner * {
|
|
background-color: #FFF !important;
|
|
}
|
|
|
|
html {
|
|
min-height: 100%;
|
|
background: var(--main-bg-color);
|
|
background-repeat: repeat, no-repeat;
|
|
background-attachment: fixed, fixed;
|
|
background-position: center center, center center;
|
|
background-size: auto, cover;
|
|
-webkit-background-size: auto, cover;
|
|
-moz-background-size: auto, cover;
|
|
-o-background-size: auto, cover;
|
|
}
|
|
|
|
body {
|
|
background: var(--main-bg-color);
|
|
background-repeat: repeat, no-repeat;
|
|
background-attachment: fixed, fixed;
|
|
background-position: center center, center center;
|
|
background-size: auto, cover;
|
|
-webkit-background-size: auto, cover;
|
|
-moz-background-size: auto, cover;
|
|
-o-background-size: auto, cover;
|
|
}
|
|
|
|
@media (max-width: 736px) {
|
|
|
|
nav,
|
|
nav.active {
|
|
background: var(--modal-bg-color) !important;
|
|
}
|
|
|
|
#dropdown.active {
|
|
background: var(--drop-down-menu-bg) !important;
|
|
}
|
|
}
|
|
|
|
nav {
|
|
background: rgba(0, 0, 0, .45);
|
|
height: 100%;
|
|
top: 64px;
|
|
width: 240px;
|
|
}
|
|
|
|
.overlay:not(nav) {
|
|
background-color: transparent;
|
|
}
|
|
|
|
nav .action {
|
|
color: var(--text);
|
|
font-size: 13px;
|
|
font-family: Open Sans Semibold, Helvetica Neue, Helvetica, Arial, sans-serif;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
padding-top: 0px;
|
|
padding-bottom: 0px;
|
|
}
|
|
|
|
nav .action:hover {
|
|
background-color: rgba(255, 255, 255, 0.05);
|
|
color: rgb(var(--accent-color));
|
|
}
|
|
|
|
nav>div {
|
|
border-top: none;
|
|
}
|
|
|
|
header {
|
|
background: rgba(0, 0, 0, 0.25);
|
|
background-repeat: repeat, no-repeat;
|
|
background-attachment: fixed, fixed;
|
|
background-position: center center, center center;
|
|
background-size: auto, cover;
|
|
-webkit-background-size: auto, cover;
|
|
-moz-background-size: auto, cover;
|
|
-o-background-size: auto, cover;
|
|
border-bottom: transparent;
|
|
box-shadow: 0 3px 6px 0 rgba(0, 0, 0, .15);
|
|
}
|
|
|
|
header>div:first-child {
|
|
height: 60px;
|
|
}
|
|
|
|
body {
|
|
padding-top: 60px;
|
|
}
|
|
|
|
.shell {
|
|
background: var(--modal-bg-color);
|
|
background-repeat: repeat, no-repeat;
|
|
background-attachment: fixed, fixed;
|
|
background-position: center center, center center;
|
|
background-size: auto, cover;
|
|
-webkit-background-size: auto, cover;
|
|
-moz-background-size: auto, cover;
|
|
-o-background-size: auto, cover;
|
|
color: rgb(var(--accent-color));
|
|
}
|
|
|
|
.shell__prompt i {
|
|
color: rgb(var(--accent-color));
|
|
}
|
|
|
|
.action {
|
|
color: var(--text-hover);
|
|
}
|
|
|
|
#listing.list .item {
|
|
background-color: rgba(0, 0, 0, .15);
|
|
color: var(--text);
|
|
border: none;
|
|
}
|
|
|
|
#listing.list .item:hover {
|
|
background-color: rgba(255, 255, 255, 0.08);
|
|
color: var(--text-hover);
|
|
border: none;
|
|
transition: .4s;
|
|
}
|
|
|
|
#listing.list .item.header {
|
|
background-color: rgba(0, 0, 0, .45);
|
|
color: var(--text-hover);
|
|
border-bottom: none;
|
|
right: auto;
|
|
}
|
|
|
|
.material-icons,
|
|
.prompt .file-list ul li:before {
|
|
color: rgb(var(--accent-color));
|
|
}
|
|
|
|
.action:hover {
|
|
background-color: rgba(var(--accent-color), .1);
|
|
}
|
|
|
|
.action .counter {
|
|
background: rgb(var(--accent-color));
|
|
color: var(--label-text-color);
|
|
border: 2px solid var(--label-text-color);
|
|
}
|
|
|
|
.share__box {
|
|
background: transparent;
|
|
}
|
|
|
|
.share__box__info {
|
|
background: rgba(0, 0, 0, 0.25);
|
|
}
|
|
|
|
.share__box__download {
|
|
background: rgb(var(--accent-color));
|
|
color: var(--text-hover);
|
|
border-bottom: 1px solid rgb(var(--accent-color));
|
|
}
|
|
|
|
.share__box__element {
|
|
border-top: 1px solid rgb(255 255 255 / 10%);
|
|
}
|
|
|
|
svg {
|
|
fill: rgb(var(--accent-color)) !important;
|
|
}
|
|
|
|
#listing.list .item div:first-of-type i {
|
|
color: rgb(var(--accent-color));
|
|
}
|
|
|
|
#listing .item i {
|
|
color: rgb(var(--accent-color));
|
|
}
|
|
|
|
#listing.mosaic:hover .item:hover i:hover {
|
|
color: var(--accent-color-hover);
|
|
}
|
|
|
|
#listing .item[aria-selected=true] {
|
|
background-color: rgba(255, 255, 255, 0.2) !important;
|
|
color: var(--text-hover) !important;
|
|
}
|
|
|
|
#listing h2 {
|
|
color: var(--text-hover);
|
|
}
|
|
|
|
#listing #multiple-selection {
|
|
background: var(--modal-bg-color);
|
|
background-repeat: repeat, no-repeat;
|
|
background-attachment: fixed, fixed;
|
|
background-position: center center, center center;
|
|
background-size: auto, cover;
|
|
-webkit-background-size: auto, cover;
|
|
-moz-background-size: auto, cover;
|
|
-o-background-size: auto, cover;
|
|
}
|
|
|
|
#breadcrumbs span a {
|
|
color: var(--text-hover);
|
|
}
|
|
|
|
#breadcrumbs {
|
|
border-bottom: 1px solid rgb(var(--accent-color));
|
|
}
|
|
|
|
#listing .item {
|
|
background-color: rgba(0, 0, 0, .15);
|
|
color: var(--text);
|
|
border: none;
|
|
}
|
|
|
|
.input {
|
|
background: rgba(0, 0, 0, 0.25);
|
|
color: var(--text-hover);
|
|
}
|
|
|
|
select>option {
|
|
background: #1f1f1f;
|
|
}
|
|
|
|
#search #input {
|
|
background: #fff;
|
|
display: flex;
|
|
padding: 10px;
|
|
}
|
|
|
|
#search #result {
|
|
background: var(--modal-bg-color);
|
|
background-repeat: repeat, no-repeat;
|
|
background-attachment: fixed, fixed;
|
|
background-position: center center, center center;
|
|
background-size: auto, cover;
|
|
-webkit-background-size: auto, cover;
|
|
-moz-background-size: auto, cover;
|
|
-o-background-size: auto, cover;
|
|
color: var(--text-hover);
|
|
}
|
|
|
|
#search .boxes {
|
|
background-color: rgba(0, 0, 0, .15);
|
|
padding: 15px;
|
|
}
|
|
|
|
#search .boxes h3 {
|
|
color: var(--text-hover);
|
|
}
|
|
|
|
#search .boxes>div>div {
|
|
background-color: rgba(0, 0, 0, .10);
|
|
}
|
|
|
|
#search .boxes>div>div:hover {
|
|
background-color: rgba(255, 255, 255, .08);
|
|
}
|
|
|
|
#search.active #input {
|
|
background: var(--main-bg-color);
|
|
background-repeat: repeat, no-repeat;
|
|
background-attachment: fixed, fixed;
|
|
background-position: center center, center center;
|
|
background-size: auto, cover;
|
|
-webkit-background-size: auto, cover;
|
|
-moz-background-size: auto, cover;
|
|
-o-background-size: auto, cover;
|
|
height: 60px;
|
|
color: black;
|
|
}
|
|
|
|
#search.active i,
|
|
#search.active input {
|
|
color: var(--text-hover);
|
|
}
|
|
|
|
#search #result>div>:first-child {
|
|
margin-top: 10px;
|
|
}
|
|
|
|
.card {
|
|
background-color: rgba(0, 0, 0, .15);
|
|
}
|
|
|
|
.card h3 {
|
|
color: var(--text-hover);
|
|
}
|
|
|
|
.card#share ul li a {
|
|
color: rgb(var(--accent-color));
|
|
}
|
|
|
|
select {
|
|
color: var(--text-hover);
|
|
}
|
|
|
|
.card#share .input-group * {
|
|
border: none;
|
|
background: transparent;
|
|
}
|
|
|
|
input,
|
|
textarea,
|
|
select,
|
|
button {
|
|
color: var(--text-hover);
|
|
}
|
|
|
|
.collapsible>label * {
|
|
color: var(--text-hover);
|
|
}
|
|
|
|
a,
|
|
.link,
|
|
.breadcrumbs span a,
|
|
.breadcrumbs,
|
|
.breadcrumbs span {
|
|
color: var(--link-color);
|
|
}
|
|
|
|
a:hover,
|
|
.link:hover,
|
|
.breadcrumbs span a:hover {
|
|
color: var(--link-color-hover);
|
|
}
|
|
|
|
table th {
|
|
color: var(--text-hover);
|
|
}
|
|
|
|
.card.floating {
|
|
background: var(--modal-bg-color);
|
|
background-repeat: repeat, no-repeat;
|
|
background-attachment: fixed, fixed;
|
|
background-position: center center, center center;
|
|
background-size: auto, cover;
|
|
-webkit-background-size: auto, cover;
|
|
-moz-background-size: auto, cover;
|
|
-o-background-size: auto, cover;
|
|
}
|
|
|
|
#search #input {
|
|
background-color: rgba(255, 255, 255, 0.08);
|
|
}
|
|
|
|
#listing.mosaic .item {
|
|
box-shadow: none !important;
|
|
}
|
|
|
|
#listing.mosaic .item:hover {
|
|
box-shadow: none !important;
|
|
background-color: rgba(255, 255, 255, 0.08);
|
|
}
|
|
|
|
.dashboard p label {
|
|
color: var(--text-hover);
|
|
}
|
|
|
|
.dashboard #nav li.active {
|
|
border-color: rgb(var(--accent-color));
|
|
}
|
|
|
|
.dashboard #nav ul li.active {
|
|
border-color: rgb(var(--accent-color));
|
|
color: rgb(var(--accent-color));
|
|
}
|
|
|
|
.dashboard #nav ul li.active:before {
|
|
background: rgb(var(--accent-color));
|
|
opacity: .08;
|
|
}
|
|
|
|
.dashboard #nav ul li:hover {
|
|
background: rgb(var(--accent-color), .15);
|
|
color: rgb(var(--accent-color));
|
|
}
|
|
|
|
.dashboard #nav .wrapper {
|
|
border-bottom: 2px solid var(--accent-color-hover);
|
|
}
|
|
|
|
|
|
@media (min-width: 1024px) {
|
|
main {
|
|
margin-left: 270px;
|
|
}
|
|
}
|
|
|
|
@media (max-width: 1024px) {
|
|
nav {
|
|
width: 175px;
|
|
}
|
|
}
|
|
|
|
/* Buttons */
|
|
.button:not(.button--flat.button--red) {
|
|
background: var(--button-color);
|
|
color: var(--button-text);
|
|
}
|
|
|
|
.button:hover:not(.button--flat.button--red),
|
|
.button:active:not(.button--flat.button--red),
|
|
.button:focus:not(.button--flat.button--red) {
|
|
background: var(--button-color-hover);
|
|
color: var(--button-text-hover);
|
|
}
|
|
|
|
button:hover:not(.action),
|
|
input[type=submit]:hover {
|
|
color: var(--button-text-hover);
|
|
}
|
|
|
|
.button--flat {
|
|
margin-left: 5px;
|
|
}
|
|
|
|
.button--flat:hover {
|
|
background: var(--dark-red);
|
|
color: var(--text-hover);
|
|
margin-left: 5px;
|
|
}
|
|
|
|
|
|
#editor-container {
|
|
background: var(--modal-bg-color);
|
|
}
|
|
|
|
/* ACE EDITOR */
|
|
|
|
.ace-chrome .ace_gutter {
|
|
background: #282a36 !important;
|
|
color: rgb(144, 145, 148) !important;
|
|
}
|
|
|
|
.ace-chrome .ace_print-margin {
|
|
width: 1px;
|
|
background: #44475a
|
|
}
|
|
|
|
.ace-chrome {
|
|
background-color: #282a36;
|
|
color: #f8f8f2
|
|
}
|
|
|
|
.ace-chrome .ace_cursor {
|
|
color: #f8f8f0
|
|
}
|
|
|
|
.ace-chrome .ace_marker-layer .ace_selection {
|
|
background: #44475a
|
|
}
|
|
|
|
.ace-chrome.ace_multiselect .ace_selection.ace_start {
|
|
box-shadow: 0 0 3px 0px #282a36;
|
|
border-radius: 2px
|
|
}
|
|
|
|
.ace-chrome .ace_marker-layer .ace_step {
|
|
background: rgb(198, 219, 174)
|
|
}
|
|
|
|
.ace-chrome .ace_marker-layer .ace_bracket {
|
|
margin: -1px 0 0 -1px;
|
|
border: 1px solid #a29709
|
|
}
|
|
|
|
.ace-chrome .ace_marker-layer .ace_active-line {
|
|
background: #44475a
|
|
}
|
|
|
|
.ace-chrome .ace_gutter-active-line {
|
|
background-color: #44475a
|
|
}
|
|
|
|
.ace-chrome .ace_marker-layer .ace_selected-word {
|
|
box-shadow: 0px 0px 0px 1px #a29709;
|
|
border-radius: 3px;
|
|
}
|
|
|
|
.ace-chrome .ace_fold {
|
|
background-color: #50fa7b;
|
|
border-color: #f8f8f2
|
|
}
|
|
|
|
.ace-chrome .ace_keyword {
|
|
color: #ff79c6
|
|
}
|
|
|
|
.ace-chrome .ace_constant.ace_language {
|
|
color: #bd93f9
|
|
}
|
|
|
|
.ace-chrome .ace_constant.ace_numeric {
|
|
color: #bd93f9
|
|
}
|
|
|
|
.ace-chrome .ace_constant.ace_character {
|
|
color: #bd93f9
|
|
}
|
|
|
|
.ace-chrome .ace_constant.ace_character.ace_escape {
|
|
color: #ff79c6
|
|
}
|
|
|
|
.ace-chrome .ace_constant.ace_other {
|
|
color: #bd93f9
|
|
}
|
|
|
|
.ace-chrome .ace_support.ace_function {
|
|
color: #8be9fd
|
|
}
|
|
|
|
.ace-chrome .ace_support.ace_constant {
|
|
color: #6be5fd
|
|
}
|
|
|
|
.ace-chrome .ace_support.ace_class {
|
|
font-style: italic;
|
|
color: #66d9ef
|
|
}
|
|
|
|
.ace-chrome .ace_support.ace_type {
|
|
font-style: italic;
|
|
color: #66d9ef
|
|
}
|
|
|
|
.ace-chrome .ace_storage {
|
|
color: #ff79c6
|
|
}
|
|
|
|
.ace-chrome .ace_storage.ace_type {
|
|
font-style: italic;
|
|
color: #8be9fd
|
|
}
|
|
|
|
.ace-chrome .ace_invalid {
|
|
color: #F8F8F0;
|
|
background-color: #ff79c6
|
|
}
|
|
|
|
.ace-chrome .ace_invalid.ace_deprecated {
|
|
color: #F8F8F0;
|
|
background-color: #bd93f9
|
|
}
|
|
|
|
.ace-chrome .ace_string {
|
|
color: #f1fa8c
|
|
}
|
|
|
|
.ace-chrome .ace_comment {
|
|
color: #6272a4
|
|
}
|
|
|
|
.ace-chrome .ace_variable {
|
|
color: #50fa7b
|
|
}
|
|
|
|
.ace-chrome .ace_variable.ace_parameter {
|
|
font-style: italic;
|
|
color: #ffb86c
|
|
}
|
|
|
|
.ace-chrome .ace_entity.ace_other.ace_attribute-name {
|
|
color: #50fa7b
|
|
}
|
|
|
|
.ace-chrome .ace_entity.ace_name.ace_function {
|
|
color: #50fa7b
|
|
}
|
|
|
|
.ace-chrome .ace_entity.ace_name.ace_tag {
|
|
color: #ff79c6
|
|
}
|
|
|
|
.ace-chrome .ace_invisible {
|
|
color: #626680;
|
|
}
|
|
|
|
.ace-chrome .ace_indent-guide {
|
|
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAACCAYAAACZgbYnAAAAEklEQVQImWNgYGBgYHB3d/8PAAOIAdULw8qMAAAAAElFTkSuQmCC) right repeat-y
|
|
}
|
|
|
|
.credits {
|
|
|
|
color: var(--text-muted);
|
|
} |