Browse Source

formatting

pull/204/head
Marius 4 years ago
parent
commit
24ea34df78
  1. 129
      CSS/themes/vuetorrent/vuetorrent-base.css

129
CSS/themes/vuetorrent/vuetorrent-base.css

@ -28,11 +28,13 @@
body, body,
.background, .background,
.theme--light.v-application, .theme--light.v-application,
.theme--dark.v-application, .v-application .background{ .theme--dark.v-application,
.v-application .background {
color: var(--text); color: var(--text);
background: var(--main-bg-color) !important; background: var(--main-bg-color) !important;
} }
html{
html {
color: var(--text); color: var(--text);
background: #1f1f1f !important; background: #1f1f1f !important;
} }
@ -42,6 +44,7 @@ html{
background: rgba(255, 255, 255, .1); background: rgba(255, 255, 255, .1);
border-radius: 20px border-radius: 20px
} }
#app>div>nav>nav>div.v-navigation-drawer__content::-webkit-scrollbar-thumb:hover { #app>div>nav>nav>div.v-navigation-drawer__content::-webkit-scrollbar-thumb:hover {
background: rgba(255, 255, 255, .25); background: rgba(255, 255, 255, .25);
border-radius: 20px border-radius: 20px
@ -66,30 +69,44 @@ p,
.theme--light.v-counter { .theme--light.v-counter {
color: var(--text); color: var(--text);
} }
.v-application .grey--text { .v-application .grey--text {
color: var(--text-muted) !important; color: var(--text-muted) !important;
caret-color: var(--text-muted) !important; caret-color: var(--text-muted) !important;
} }
.theme--light.v-tabs>.v-tabs-bar .v-tab--disabled, .theme--light.v-tabs>.v-tabs-bar .v-tab:not(.v-tab--active), .theme--light.v-tabs>.v-tabs-bar .v-tab:not(.v-tab--active)>.v-btn, .theme--light.v-tabs>.v-tabs-bar .v-tab:not(.v-tab--active)>.v-icon,
.theme--dark.v-tabs>.v-tabs-bar .v-tab--disabled, .theme--dark.v-tabs>.v-tabs-bar .v-tab:not(.v-tab--active), .theme--dark.v-tabs>.v-tabs-bar .v-tab:not(.v-tab--active)>.v-btn, .theme--dark.v-tabs>.v-tabs-bar .v-tab:not(.v-tab--active)>.v-icon{ .theme--light.v-tabs>.v-tabs-bar .v-tab--disabled,
.theme--light.v-tabs>.v-tabs-bar .v-tab:not(.v-tab--active),
.theme--light.v-tabs>.v-tabs-bar .v-tab:not(.v-tab--active)>.v-btn,
.theme--light.v-tabs>.v-tabs-bar .v-tab:not(.v-tab--active)>.v-icon,
.theme--dark.v-tabs>.v-tabs-bar .v-tab--disabled,
.theme--dark.v-tabs>.v-tabs-bar .v-tab:not(.v-tab--active),
.theme--dark.v-tabs>.v-tabs-bar .v-tab:not(.v-tab--active)>.v-btn,
.theme--dark.v-tabs>.v-tabs-bar .v-tab:not(.v-tab--active)>.v-icon {
color: var(--text); color: var(--text);
} }
.theme--dark.v-subheader, .theme--dark.v-subheader,
.theme--light.v-subheader{ .theme--light.v-subheader {
color: hsla(0,0%,100%,.7); color: hsla(0, 0%, 100%, .7);
} }
.theme--light.v-input, .theme--light.v-input input, .theme--light.v-input textarea {
.theme--light.v-input,
.theme--light.v-input input,
.theme--light.v-input textarea {
color: var(--text); color: var(--text);
} }
/* TOP NAVBAR */ /* TOP NAVBAR */
.theme--light.v-app-bar.v-toolbar.v-sheet, .theme--light.v-app-bar.v-toolbar.v-sheet,
.theme--dark.v-app-bar.v-toolbar.v-sheet{ .theme--dark.v-app-bar.v-toolbar.v-sheet {
background-color: rgba(0, 0, 0, .25) !important; background-color: rgba(0, 0, 0, .25) !important;
color: var(--text) !important; color: var(--text) !important;
} }
.v-navigation-drawer__content .theme--dark.v-card, .v-navigation-drawer__content .theme--dark.v-card,
.v-navigation-drawer__content .theme--light.v-card{ .v-navigation-drawer__content .theme--light.v-card {
background: rgba(0, 0, 0, 0) !important; background: rgba(0, 0, 0, 0) !important;
} }
@ -99,35 +116,45 @@ p,
background: rgba(0, 0, 0, .25) !important; background: rgba(0, 0, 0, .25) !important;
color: var(--text) !important; color: var(--text) !important;
} }
.v-application .secondary { .v-application .secondary {
background-color: rgba(255, 255, 255, .15) !important; background-color: rgba(255, 255, 255, .15) !important;
border-color: rgba(255, 255, 255, .15) !important; border-color: rgba(255, 255, 255, .15) !important;
} }
.theme--dark.v-navigation-drawer:not(.v-navigation-drawer--floating) .v-navigation-drawer__border, .theme--dark.v-navigation-drawer:not(.v-navigation-drawer--floating) .v-navigation-drawer__border,
.theme--light.v-navigation-drawer:not(.v-navigation-drawer--floating) .v-navigation-drawer__border{ .theme--light.v-navigation-drawer:not(.v-navigation-drawer--floating) .v-navigation-drawer__border {
background-color: rgba(0,0,0,.12); background-color: rgba(0, 0, 0, .12);
} }
@supports (-webkit-backdrop-filter: none) or (backdrop-filter: none) { @supports (-webkit-backdrop-filter: none) or (backdrop-filter: none) {
.v-navigation-drawer--is-mobile:not(.v-navigation-drawer--close), .v-navigation-drawer--temporary:not(.v-navigation-drawer--close),
.v-navigation-drawer--is-mobile:not(.v-navigation-drawer--close), .v-navigation-drawer--temporary:not(.v-navigation-drawer--close) { .v-navigation-drawer--is-mobile:not(.v-navigation-drawer--close),
.v-navigation-drawer--temporary:not(.v-navigation-drawer--close),
.v-navigation-drawer--is-mobile:not(.v-navigation-drawer--close),
.v-navigation-drawer--temporary:not(.v-navigation-drawer--close) {
-webkit-backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
backdrop-filter: blur(10px); backdrop-filter: blur(10px);
} }
} }
/* slightly transparent fallback for Firefox (not supporting backdrop-filter) */
@supports not ((-webkit-backdrop-filter: none) or (backdrop-filter: none)) { /* slightly transparent fallback for Firefox (not supporting backdrop-filter) */
.v-navigation-drawer--is-mobile:not(.v-navigation-drawer--close), .v-navigation-drawer--temporary:not(.v-navigation-drawer--close), @supports not ((-webkit-backdrop-filter: none) or (backdrop-filter: none)) {
.v-navigation-drawer--is-mobile:not(.v-navigation-drawer--close), .v-navigation-drawer--temporary:not(.v-navigation-drawer--close) {
.v-navigation-drawer--is-mobile:not(.v-navigation-drawer--close),
.v-navigation-drawer--temporary:not(.v-navigation-drawer--close),
.v-navigation-drawer--is-mobile:not(.v-navigation-drawer--close),
.v-navigation-drawer--temporary:not(.v-navigation-drawer--close) {
background-color: rgba(0, 0, 0, 0.9); background-color: rgba(0, 0, 0, 0.9);
} }
} }
.v-application .download--text { .v-application .download--text {
color: rgb(var(--accent-color)) !important; color: rgb(var(--accent-color)) !important;
caret-color: rgb(var(--accent-color)) !important; caret-color: rgb(var(--accent-color)) !important;
} }
.v-navigation-drawer__content .download--text { .v-navigation-drawer__content .download--text {
color: var(--v-download-base) !important; color: var(--v-download-base) !important;
caret-color: var(--v-download-base) !important; caret-color: var(--v-download-base) !important;
@ -139,7 +166,7 @@ p,
.v-dialog .theme--light.v-tabs-items, .v-dialog .theme--light.v-tabs-items,
.v-dialog .theme--dark.v-tabs-items, .v-dialog .theme--dark.v-tabs-items,
.v-dialog .theme--light.v-list, .v-dialog .theme--light.v-list,
.v-dialog .theme--dark.v-list{ .v-dialog .theme--dark.v-list {
background: var(--modal-bg-color); background: var(--modal-bg-color);
color: var(--text); color: var(--text);
} }
@ -148,93 +175,111 @@ p,
color: var(--button-color) !important; color: var(--button-color) !important;
caret-color: var(--button-color) !important; caret-color: var(--button-color) !important;
} }
.theme--light.v-tabs>.v-tabs-bar, .theme--light.v-tabs>.v-tabs-bar,
.theme--dark.v-tabs>.v-tabs-bar{ .theme--dark.v-tabs>.v-tabs-bar {
background-color: rgba(0, 0, 0, .15); background-color: rgba(0, 0, 0, .15);
} }
.v-application .white, .v-application .white,
.v-tab:before, .v-tabs-slider { .v-tab:before,
.v-tabs-slider {
background-color: rgb(var(--accent-color)) !important; background-color: rgb(var(--accent-color)) !important;
border-color: rbg(var(--accent-color)) !important; border-color: rbg(var(--accent-color)) !important;
} }
.theme--dark.v-icon.v-icon.v-icon--disabled, .theme--dark.v-icon.v-icon.v-icon--disabled,
.theme--light.v-icon.v-icon.v-icon--disabled{ .theme--light.v-icon.v-icon.v-icon--disabled {
color: rgba(255, 255, 255, .38) !important; color: rgba(255, 255, 255, .38) !important;
} }
.theme--dark.v-text-field--solo>.v-input__control>.v-input__slot, .theme--dark.v-text-field--solo>.v-input__control>.v-input__slot,
.theme--light.v-text-field--solo>.v-input__control>.v-input__slot{ .theme--light.v-text-field--solo>.v-input__control>.v-input__slot {
background: #1e1e1e; background: #1e1e1e;
} }
.v-input__icon svg, .v-select__selection {
color: rgb(var(--accent-color))!important; .v-input__icon svg,
.v-select__selection {
color: rgb(var(--accent-color)) !important;
} }
.v-application .accent { .v-application .accent {
background-color: var(--button-color) !important; background-color: var(--button-color) !important;
border-color: var(--button-color) !important; border-color: var(--button-color) !important;
} }
.theme--light.v-text-field>.v-input__control>.v-input__slot:before { .theme--light.v-text-field>.v-input__control>.v-input__slot:before {
border-color: rgb(255 255 255 / 42%); border-color: rgb(255 255 255 / 42%);
} }
.theme--light.v-text-field:not(.v-input--has-state):hover>.v-input__control>.v-input__slot:before { .theme--light.v-text-field:not(.v-input--has-state):hover>.v-input__control>.v-input__slot:before {
border-color: rgba(255, 255, 255, .87); border-color: rgba(255, 255, 255, .87);
} }
/* FORMS */ /* FORMS */
.v-input__slot:hover fieldset, .v-text-field--outlined fieldset { .v-input__slot:hover fieldset,
border-color: rgba(255, 255, 255, .1)!important; .v-text-field--outlined fieldset {
border-color: rgba(255, 255, 255, .1) !important;
} }
/* DASHBOARD */ /* DASHBOARD */
.theme--dark.v-card.sideborder.done, .theme--dark.v-card.sideborder.done,
.theme--light.v-card.sideborder.done{ .theme--light.v-card.sideborder.done {
background-color: #16573e40; background-color: #16573e40;
color: #FFF; color: #FFF;
} }
.theme--dark.v-card.sideborder.downloading, .theme--dark.v-card.sideborder.downloading,
.theme--light.v-card.sideborder.downloading{ .theme--light.v-card.sideborder.downloading {
background-color: #5bb97440; background-color: #5bb97440;
color: #FFF; color: #FFF;
} }
.theme--dark.v-card.sideborder.fail, .theme--dark.v-card.sideborder.fail,
.theme--light.v-card.sideborder.fail{ .theme--light.v-card.sideborder.fail {
background-color: #f83e7040; background-color: #f83e7040;
color: #FFF; color: #FFF;
} }
.theme--dark.v-card.sideborder.paused, .theme--dark.v-card.sideborder.paused,
.theme--light.v-card.sideborder.paused { .theme--light.v-card.sideborder.paused {
background-color: #9ca3af40; background-color: #9ca3af40;
color: #FFF; color: #FFF;
} }
.theme--dark.v-card.sideborder.queued, .theme--dark.v-card.sideborder.queued,
.theme--light.v-card.sideborder.queued{ .theme--light.v-card.sideborder.queued {
background-color: #2e5eaa40; background-color: #2e5eaa40;
color: #FFF; color: #FFF;
} }
.theme--dark.v-card.sideborder.seeding, .theme--dark.v-card.sideborder.seeding,
.theme--light.v-card.sideborder.seeding{ .theme--light.v-card.sideborder.seeding {
background-color: #4ecde640; background-color: #4ecde640;
color: #FFF; color: #FFF;
} }
.theme--dark.v-card.sideborder.checking, .theme--dark.v-card.sideborder.checking,
.theme--light.v-card.sideborder.checking{ .theme--light.v-card.sideborder.checking {
background-color: #ff704340; background-color: #ff704340;
color: #FFF; color: #FFF;
} }
.theme--dark.v-card.sideborder.stalled, .theme--dark.v-card.sideborder.stalled,
.theme--light.v-card.sideborder.stalled{ .theme--light.v-card.sideborder.stalled {
background-color: #4ade8040; background-color: #4ade8040;
color: #FFF; color: #FFF;
} }
.theme--dark.v-card.sideborder.metadata, .theme--dark.v-card.sideborder.metadata,
.theme--light.v-card.sideborder.metadata{ .theme--light.v-card.sideborder.metadata {
background-color: #7e57c240; background-color: #7e57c240;
color: #FFF; color: #FFF;
} }
.theme--dark.v-card.sideborder.moving, .theme--dark.v-card.sideborder.moving,
.theme--light.v-card.sideborder.moving{ .theme--light.v-card.sideborder.moving {
background-color: #ffaa2c40; background-color: #ffaa2c40;
color: #FFF; color: #FFF;
} }
@ -242,22 +287,24 @@ p,
/* DROPDOWN */ /* DROPDOWN */
.theme--dark.v-list-item:not(.v-list-item--active):not(.v-list-item--disabled), .theme--dark.v-list-item:not(.v-list-item--active):not(.v-list-item--disabled),
.theme--light.v-list-item:not(.v-list-item--active):not(.v-list-item--disabled){ .theme--light.v-list-item:not(.v-list-item--active):not(.v-list-item--disabled) {
color: var(--text) !important; color: var(--text) !important;
background: var(--modal-bg-color) !important; background: var(--modal-bg-color) !important;
} }
.theme--dark.v-icon, .theme--dark.v-icon,
.theme--light.v-icon{ .theme--light.v-icon {
color: #fff; color: #fff;
} }
.theme--light.v-divider, .theme--light.v-divider,
.theme--dark.v-divider{ .theme--dark.v-divider {
border-color: rgba(255, 255, 255, .65) !important; border-color: rgba(255, 255, 255, .65) !important;
} }
/* TABLE */ /* TABLE */
.theme--dark.v-data-table, .theme--dark.v-data-table,
.theme--light.v-data-table{ .theme--light.v-data-table {
background-color: rgba(0, 0, 0, .65); background-color: rgba(0, 0, 0, .65);
color: var(--text); color: var(--text);
} }
Loading…
Cancel
Save