mirror of
https://github.com/vrcx-team/VRCX.git
synced 2026-04-06 00:32:02 +02:00
remove legacy themes
This commit is contained in:
pa
Natsumi
@@ -1,645 +0,0 @@
|
||||
@charset "utf-8";
|
||||
|
||||
//
|
||||
// Copyright(c) 2019-2025 pypy and individual contributors.
|
||||
// All rights reserved.
|
||||
//
|
||||
// This work is licensed under the terms of the MIT license.
|
||||
// For a copy, see <https://opensource.org/licenses/MIT>.
|
||||
//
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background: rgba(255, 255, 255, 0.02);
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
}
|
||||
|
||||
:root {
|
||||
color-scheme: dark;
|
||||
--el-button-hover-border-color: #{$--theme-primary};
|
||||
}
|
||||
|
||||
html,
|
||||
body {
|
||||
background-color: $--theme-bg-1;
|
||||
}
|
||||
|
||||
body,
|
||||
input,
|
||||
textarea,
|
||||
select,
|
||||
button {
|
||||
color: $--theme-text-1;
|
||||
}
|
||||
|
||||
.el-dialog,
|
||||
.el-message-box {
|
||||
border-radius: 28px !important;
|
||||
}
|
||||
|
||||
.el-dropdown-menu,
|
||||
.el-select-dropdown,
|
||||
.el-popover,
|
||||
.el-picker-panel {
|
||||
border: 1px solid hsl($--theme-hue, $--theme-saturation, 14%) !important;
|
||||
box-shadow: 0 2px 12px hsla($--theme-hue, $--theme-saturation, 0%, 0.3) !important;
|
||||
}
|
||||
|
||||
.el-message-box {
|
||||
border: 0px !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
.el-loading-mask {
|
||||
background-color: hsla(
|
||||
$--theme-hue,
|
||||
$--theme-saturation,
|
||||
0%,
|
||||
0.6
|
||||
) !important;
|
||||
}
|
||||
|
||||
.el-textarea .el-input__count,
|
||||
.el-input .el-input__count .el-input__count-inner {
|
||||
background-color: $--theme-bg-5;
|
||||
}
|
||||
|
||||
.x-friend-item .el-textarea .el-input__count {
|
||||
background-color: $--theme-bg-5;
|
||||
}
|
||||
|
||||
// User dialog memo: input count background color
|
||||
.x-friend-item:hover .el-input__count {
|
||||
background: hsl($--theme-hue, $--theme-saturation, 24%);
|
||||
}
|
||||
|
||||
.el-input-group__append,
|
||||
.el-input-group__prepend {
|
||||
color: $--theme-text-1;
|
||||
background-color: $--theme-border-1;
|
||||
border-color: $--theme-border-1;
|
||||
}
|
||||
|
||||
.el-input-number__decrease,
|
||||
.el-input-number__increase {
|
||||
background: unset;
|
||||
color: $--theme-text-1;
|
||||
}
|
||||
|
||||
.el-input-number__decrease {
|
||||
border-right: 1px solid hsla($--theme-hue, 20%, 87%, 0.2);
|
||||
}
|
||||
|
||||
.el-input-number__increase {
|
||||
border-left: 1px solid hsla($--theme-hue, 20%, 87%, 0.2);
|
||||
}
|
||||
|
||||
.el-table tr,
|
||||
.el-table td.el-table__cell,
|
||||
.el-table th.el-table__cell {
|
||||
background-color: hsl($--theme-hue, $--theme-saturation, 15%);
|
||||
border-bottom: 1px solid $--theme-border-2;
|
||||
}
|
||||
|
||||
.el-table--border::after,
|
||||
.el-table--group::after,
|
||||
.el-table::before {
|
||||
background-color: $--theme-border-2;
|
||||
}
|
||||
|
||||
.el-table--striped .el-table__body tr.el-table__row--striped td.el-table__cell {
|
||||
background-color: $--theme-bg-3;
|
||||
}
|
||||
|
||||
.el-table--enable-row-hover .el-table__body tr:hover > td.el-table__cell {
|
||||
background-color: hsl($--theme-hue, $--theme-saturation, 18%);
|
||||
}
|
||||
|
||||
.friend-view {
|
||||
color: $--theme-text-2;
|
||||
|
||||
.friend-view__toolbar,
|
||||
.friend-view__loading-text,
|
||||
.friend-view__slider-label,
|
||||
.friend-view__settings-label {
|
||||
color: $--theme-text-2;
|
||||
}
|
||||
|
||||
.friend-view__search .el-input__wrapper {
|
||||
background: $--theme-bg-4;
|
||||
box-shadow: inset 0 0 0 1px $--theme-border-2;
|
||||
}
|
||||
|
||||
.friend-view__instances {
|
||||
background: none;
|
||||
}
|
||||
|
||||
.friend-view__instance {
|
||||
background: hsla($--theme-hue, $--theme-saturation, 18%, 0.28);
|
||||
border-radius: 14px;
|
||||
border: 1px solid hsla($--theme-hue, $--theme-saturation, 42%, 0.15);
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.friend-view__instance-header,
|
||||
.friend-view__divider {
|
||||
color: $--theme-text-1;
|
||||
}
|
||||
|
||||
.friend-view__instance-count {
|
||||
color: rgba($--theme-text-1, 0.6);
|
||||
}
|
||||
|
||||
.friend-view__divider::before,
|
||||
.friend-view__divider::after {
|
||||
background: hsla($--theme-hue, $--theme-saturation, 48%, 0.15);
|
||||
}
|
||||
|
||||
.friend-view__empty {
|
||||
color: rgba($--theme-text-1, 0.45);
|
||||
}
|
||||
|
||||
.friend-view__loading {
|
||||
color: $--theme-text-2;
|
||||
}
|
||||
}
|
||||
|
||||
.friend-view .friend-card {
|
||||
background: hsla($--theme-hue, $--theme-saturation, 18%, 0.72) !important;
|
||||
border: 1px solid hsla($--theme-hue, $--theme-saturation, 50%, 0.18) !important;
|
||||
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
|
||||
|
||||
&:hover {
|
||||
box-shadow: 0 14px 32px rgba(0, 0, 0, 0.45);
|
||||
}
|
||||
|
||||
.friend-card__name {
|
||||
color: $--theme-text-1;
|
||||
}
|
||||
|
||||
.friend-card__signature {
|
||||
color: rgba($--theme-text-1, 0.65);
|
||||
}
|
||||
|
||||
.friend-card__world {
|
||||
background: hsla($--theme-hue, $--theme-saturation, 44%, 0.22);
|
||||
color: rgba($--theme-text-1, 0.8);
|
||||
}
|
||||
|
||||
.friend-card__location {
|
||||
color: rgba($--theme-text-1, 0.85);
|
||||
}
|
||||
|
||||
.friend-card__status-dot {
|
||||
border: 2px solid rgba(0, 0, 0, 0.55);
|
||||
}
|
||||
|
||||
.friend-card__avatar {
|
||||
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.55);
|
||||
}
|
||||
}
|
||||
|
||||
.el-pagination .btn-next,
|
||||
.el-pagination .btn-prev {
|
||||
color: $--theme-text-2;
|
||||
background-color: $--theme-bg-4;
|
||||
}
|
||||
|
||||
.el-pagination button:disabled {
|
||||
color: hsl($--theme-hue, $--theme-saturation, 40%);
|
||||
background-color: $--theme-bg-4;
|
||||
}
|
||||
|
||||
.el-dialog {
|
||||
background-color: $--theme-bg-4;
|
||||
}
|
||||
|
||||
div.x-friend-list
|
||||
> div:nth-child(1)
|
||||
> div
|
||||
> div.el-textarea.el-input--small
|
||||
> span.el-input__count {
|
||||
background-color: $--theme-bg-4;
|
||||
}
|
||||
|
||||
.el-pager li {
|
||||
background-color: $--theme-bg-5;
|
||||
color: $--theme-text-2;
|
||||
}
|
||||
|
||||
.el-table {
|
||||
color: $--theme-text-1;
|
||||
}
|
||||
|
||||
.el-pagination__total {
|
||||
color: hsl($--theme-hue, $--theme-saturation, 73%);
|
||||
margin: 0 10px;
|
||||
}
|
||||
|
||||
.el-tag--plain.el-tag--info {
|
||||
background-color: $--theme-bg-5;
|
||||
}
|
||||
|
||||
.el-collapse-item .el-tag--small {
|
||||
background-color: $--theme-bg-5;
|
||||
border: transparent;
|
||||
}
|
||||
|
||||
.el-button {
|
||||
color: $--theme-text-2;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.el-button.el-button--primary {
|
||||
background-color: $--theme-primary !important;
|
||||
}
|
||||
|
||||
.el-button:not(.el-button--text, .el-button--primary, .is-disabled) {
|
||||
// background-color: $--theme-bg-5;
|
||||
border-color: $--theme-border-2;
|
||||
}
|
||||
|
||||
.el-button.is-text:not(.is-disabled):hover {
|
||||
background-color: unset;
|
||||
}
|
||||
|
||||
.el-button:not(.el-button--text, .el-button--primary, .is-disabled):focus,
|
||||
.el-button:not(.el-button--text, .el-button--primary, .is-disabled):hover {
|
||||
color: $--theme-text-1 !important;
|
||||
background-color: $--theme-border-2;
|
||||
border-color: var(--el-button-hover-border-color);
|
||||
}
|
||||
|
||||
.el-button.is-disabled,
|
||||
.el-button.is-disabled:focus,
|
||||
.el-button.is-disabled:hover {
|
||||
color: hsl($--theme-hue, $--theme-saturation, 53%);
|
||||
background-color: hsl($--theme-hue, $--theme-saturation, 15%);
|
||||
border-color: $--theme-bg-5;
|
||||
}
|
||||
|
||||
.el-tabs--card > .el-tabs__header {
|
||||
border-bottom-color: $--theme-border-2;
|
||||
}
|
||||
|
||||
.el-dropdown-menu {
|
||||
background-color: $--theme-bg-4;
|
||||
border-color: $--theme-border-2;
|
||||
}
|
||||
|
||||
.el-dropdown-menu__item--divided::before {
|
||||
background-color: $--theme-border-2;
|
||||
}
|
||||
|
||||
.el-dropdown-menu__item {
|
||||
color: hsl($--theme-hue, $--theme-saturation, 83%);
|
||||
}
|
||||
|
||||
.el-dropdown-menu__item:focus,
|
||||
.el-dropdown-menu__item:not(.is-disabled):hover {
|
||||
color: $--theme-primary;
|
||||
background-color: hsl($--theme-hue, $--theme-saturation, 27%);
|
||||
}
|
||||
|
||||
.el-popper[data-popper-placement^='bottom'] .el-popper__arrow::after {
|
||||
border-bottom-color: $--theme-bg-5;
|
||||
}
|
||||
|
||||
.el-popper[data-popper-placement^='bottom'] .el-popper__arrow {
|
||||
border-bottom-color: $--theme-border-2;
|
||||
}
|
||||
|
||||
.el-form-item {
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
.el-message-box {
|
||||
background-color: $--theme-bg-4;
|
||||
}
|
||||
|
||||
.el-tree {
|
||||
background: hsl($--theme-hue, $--theme-saturation, 12%);
|
||||
}
|
||||
|
||||
.el-menu-item i {
|
||||
color: $--theme-info;
|
||||
}
|
||||
|
||||
.nav-menu-container {
|
||||
.bottom-button {
|
||||
color: $--theme-info;
|
||||
}
|
||||
}
|
||||
|
||||
.el-menu-item.notify::after {
|
||||
background: hsl($--theme-hue, 0%, 92%);
|
||||
}
|
||||
|
||||
.el-menu-item.is-active::before {
|
||||
background: hsl($--theme-hue, 0%, 87%);
|
||||
}
|
||||
|
||||
.el-menu-item:focus,
|
||||
.el-menu-item:hover {
|
||||
background-color: $--theme-border-3;
|
||||
}
|
||||
|
||||
.el-tabs--card > .el-tabs__header .el-tabs__item {
|
||||
border-left-color: $--theme-border-2;
|
||||
}
|
||||
|
||||
.el-tabs--card > .el-tabs__header .el-tabs__item.is-active {
|
||||
border-bottom-color: hsl($--theme-hue, $--theme-saturation, 40%);
|
||||
border-left-color: $--theme-border-2;
|
||||
}
|
||||
|
||||
.el-tabs--card > .el-tabs__header .el-tabs__nav {
|
||||
border-color: $--theme-border-2;
|
||||
}
|
||||
|
||||
.el-collapse-item__header {
|
||||
background-color: inherit;
|
||||
}
|
||||
|
||||
.el-collapse-item__wrap {
|
||||
background-color: hsl($--theme-hue, $--theme-saturation, 16%);
|
||||
}
|
||||
|
||||
.el-message-box__title {
|
||||
color: $--theme-text-2;
|
||||
}
|
||||
|
||||
.el-dialog__title {
|
||||
color: $--theme-text-2;
|
||||
}
|
||||
|
||||
.el-message-box__content {
|
||||
color: $--theme-text-2;
|
||||
}
|
||||
|
||||
.el-switch__core {
|
||||
background-color: hsl($--theme-hue, $--theme-saturation, 13%);
|
||||
border-color: hsl($--theme-hue, $--theme-saturation, 37%);
|
||||
}
|
||||
|
||||
.el-popover {
|
||||
text-align: left;
|
||||
word-break: break-word;
|
||||
color: $--theme-text-2;
|
||||
background-color: $--theme-bg-4;
|
||||
border-color: hsl($--theme-hue, $--theme-saturation, 37%);
|
||||
}
|
||||
|
||||
.el-popper[data-popper-placement^='right'] .el-popper__arrow::after {
|
||||
border-right-color: hsl($--theme-hue, $--theme-saturation, 37%);
|
||||
}
|
||||
|
||||
.el-popper[data-popper-placement^='right'] .el-popper__arrow {
|
||||
border-right-color: hsl($--theme-hue, $--theme-saturation, 37%);
|
||||
}
|
||||
|
||||
.el-switch__label {
|
||||
color: hsl($--theme-hue, $--theme-saturation, 63%);
|
||||
}
|
||||
|
||||
.el-table,
|
||||
.el-table__expanded-cell {
|
||||
background-color: inherit;
|
||||
}
|
||||
|
||||
.el-tree-node:focus > .el-tree-node__content {
|
||||
background-color: hsl($--theme-hue, $--theme-saturation, 16%);
|
||||
}
|
||||
|
||||
.el-select-dropdown__item {
|
||||
color: $--theme-text-2;
|
||||
}
|
||||
|
||||
.el-select-dropdown.is-multiple .el-select-dropdown__item.selected {
|
||||
background-color: $--theme-border-2;
|
||||
}
|
||||
|
||||
.el-select-dropdown.is-multiple .el-select-dropdown__item.selected.hover {
|
||||
background-color: $--theme-border-2;
|
||||
}
|
||||
|
||||
.el-select-dropdown__item.hover,
|
||||
.el-select-dropdown__item:hover {
|
||||
background-color: hsl($--theme-hue, $--theme-saturation, 24%);
|
||||
}
|
||||
|
||||
.el-tag {
|
||||
background-color: $--theme-bg-5;
|
||||
border-color: $--theme-border-2;
|
||||
color: $--theme-primary;
|
||||
}
|
||||
|
||||
.el-tag.el-tag--success {
|
||||
background-color: $--theme-bg-5;
|
||||
border-color: $--theme-border-2;
|
||||
color: $--theme-success;
|
||||
}
|
||||
|
||||
.el-tag.el-tag--info {
|
||||
background-color: $--theme-bg-5;
|
||||
border-color: $--theme-border-2;
|
||||
color: $--theme-text-2;
|
||||
}
|
||||
|
||||
.el-tag.el-tag--warning {
|
||||
background-color: $--theme-bg-5;
|
||||
border-color: $--theme-border-2;
|
||||
color: $--theme-warning;
|
||||
}
|
||||
|
||||
.el-tag.el-tag--danger {
|
||||
background-color: $--theme-bg-5;
|
||||
border-color: $--theme-border-2;
|
||||
color: $--theme-danger;
|
||||
}
|
||||
|
||||
.el-table__expanded-cell:hover {
|
||||
background-color: hsl($--theme-hue, $--theme-saturation, 19%) !important;
|
||||
}
|
||||
|
||||
.el-dialog__body {
|
||||
color: $--theme-text-1;
|
||||
word-break: break-word;
|
||||
overflow-wrap: break-word;
|
||||
}
|
||||
|
||||
.el-radio {
|
||||
color: $--theme-text-1;
|
||||
}
|
||||
|
||||
.el-radio-button__inner {
|
||||
color: $--theme-text-1;
|
||||
background: hsl($--theme-hue, $--theme-saturation, 34%);
|
||||
border: 1px solid hsl($--theme-hue, $--theme-saturation, 40%);
|
||||
}
|
||||
|
||||
.el-radio-button:first-child .el-radio-button__inner {
|
||||
border-left: 1px solid rgba(0, 0, 0, 0);
|
||||
}
|
||||
|
||||
.el-radio-button.is-disabled .el-radio-button__inner {
|
||||
background-color: unset;
|
||||
border-color: unset;
|
||||
border: 1px solid hsl($--theme-hue, $--theme-saturation, 40%);
|
||||
}
|
||||
|
||||
.el-button {
|
||||
color: $--theme-text-1;
|
||||
}
|
||||
|
||||
.el-form-item__label {
|
||||
color: $--theme-text-2;
|
||||
}
|
||||
|
||||
.el-checkbox {
|
||||
color: $--theme-text-2;
|
||||
}
|
||||
|
||||
.el-input.is-disabled .el-input__inner,
|
||||
.el-input.is-disabled .el-input__wrapper {
|
||||
background-color: hsl($--theme-hue, $--theme-saturation, 23%);
|
||||
}
|
||||
|
||||
.x-app {
|
||||
background-color: $--theme-bg-1;
|
||||
}
|
||||
|
||||
.x-container {
|
||||
background: $--theme-bg-3;
|
||||
}
|
||||
|
||||
.x-app > .x-container {
|
||||
overflow: hidden auto !important;
|
||||
}
|
||||
|
||||
.x-login-container {
|
||||
background-color: $--theme-bg-1;
|
||||
}
|
||||
|
||||
.x-aside-container {
|
||||
background-color: $--theme-bg-2;
|
||||
}
|
||||
|
||||
.x-friend-list {
|
||||
overflow: hidden auto !important;
|
||||
}
|
||||
|
||||
.x-friend-list > .x-friend-group {
|
||||
color: $--theme-text-1;
|
||||
}
|
||||
|
||||
.x-friend-item:hover,
|
||||
.x-change-image-item:hover {
|
||||
background: hsl($--theme-hue, $--theme-saturation, 24%);
|
||||
}
|
||||
|
||||
.x-friend-item > .detail > .name {
|
||||
color: $--theme-text-1;
|
||||
}
|
||||
|
||||
.x-friend-item > .detail > .extra,
|
||||
.extra {
|
||||
color: hsl($--theme-hue, 4%, 78%);
|
||||
}
|
||||
|
||||
.x-login-container p {
|
||||
color: hsl($--theme-hue, 5%, 87%);
|
||||
}
|
||||
|
||||
.x-menu-container {
|
||||
background: $--theme-bg-2;
|
||||
overflow: hidden auto !important;
|
||||
}
|
||||
|
||||
.x-grey {
|
||||
color: $--theme-text-3;
|
||||
}
|
||||
|
||||
.el-color-picker__panel {
|
||||
background-color: $--theme-bg-3;
|
||||
}
|
||||
|
||||
.x-text-removed {
|
||||
text-decoration: line-through;
|
||||
color: hsl(0, 100%, 64%);
|
||||
background-color: hsla(0, 100%, 50%, 0.2);
|
||||
padding: 2px 2px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.x-text-added {
|
||||
color: rgb(76, 255, 80);
|
||||
background-color: rgba(76, 255, 80, 0.2);
|
||||
padding: 2px 2px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.el-divider {
|
||||
background-color: $--theme-text-4;
|
||||
}
|
||||
|
||||
.el-divider__text {
|
||||
background: $--theme-bg-3;
|
||||
color: $--theme-text-1;
|
||||
}
|
||||
|
||||
.el-tabs__content {
|
||||
overflow-y: auto !important;
|
||||
}
|
||||
|
||||
.el-date-picker {
|
||||
background-color: $--theme-bg-3;
|
||||
}
|
||||
|
||||
.el-date-table td.disabled div {
|
||||
background-color: hsl($--theme-hue, $--theme-saturation, 16%);
|
||||
color: $--theme-text-4;
|
||||
}
|
||||
|
||||
.el-date-table td.next-month,
|
||||
.el-date-table td.prev-month {
|
||||
color: $--theme-text-4;
|
||||
}
|
||||
|
||||
.el-date-table th {
|
||||
border-bottom: 1px solid hsl($--theme-hue, $--theme-saturation, 33%);
|
||||
}
|
||||
|
||||
.el-picker-panel {
|
||||
border: 1px solid $--theme-border-2;
|
||||
background-color: $--theme-bg-4;
|
||||
}
|
||||
|
||||
.el-year-table td.disabled .cell {
|
||||
background-color: hsla($--theme-hue, $--theme-saturation, 0%, 0.2);
|
||||
}
|
||||
|
||||
.el-month-table td.disabled .cell {
|
||||
background-color: hsla($--theme-hue, $--theme-saturation, 0%, 0.2);
|
||||
}
|
||||
|
||||
.el-color-picker__trigger {
|
||||
border: none;
|
||||
}
|
||||
|
||||
.el-tooltip__popper {
|
||||
box-shadow: $--box-shadow-dark !important;
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
@@ -1,334 +0,0 @@
|
||||
@charset "utf-8";
|
||||
|
||||
//
|
||||
// Copyright(c) 2019-2025 pypy and individual contributors.
|
||||
// All rights reserved.
|
||||
//
|
||||
// This work is licensed under the terms of the MIT license.
|
||||
// For a copy, see <https://opensource.org/licenses/MIT>.
|
||||
//
|
||||
|
||||
@use 'sass:color';
|
||||
|
||||
$--theme-hue: 0;
|
||||
$--theme-saturation: 0%;
|
||||
|
||||
// AMOLED background tones
|
||||
// #0f0f0f
|
||||
$--theme-bg-1: hsl($--theme-hue, $--theme-saturation, 6%);
|
||||
$--theme-bg-2: hsl($--theme-hue, $--theme-saturation, 6%);
|
||||
$--theme-bg-3: hsl($--theme-hue, $--theme-saturation, 6%);
|
||||
$--theme-bg-4: hsl($--theme-hue, $--theme-saturation, 7%);
|
||||
$--theme-bg-5: hsl($--theme-hue, $--theme-saturation, 9%);
|
||||
|
||||
$--theme-border-1: hsl($--theme-hue, $--theme-saturation, 8%);
|
||||
$--theme-border-2: hsla($--theme-hue, $--theme-saturation, 6%, 0.5);
|
||||
$--theme-border-3: hsl($--theme-hue, $--theme-saturation, 12%);
|
||||
|
||||
$--theme-text-1: hsl($--theme-hue, $--theme-saturation, 85%);
|
||||
$--theme-text-2: hsl($--theme-hue, $--theme-saturation, 70%);
|
||||
$--theme-text-3: hsl($--theme-hue, $--theme-saturation, 68%);
|
||||
$--theme-text-4: hsl($--theme-hue, $--theme-saturation, 38%);
|
||||
|
||||
$--theme-primary: #b18fff;
|
||||
$--theme-success: #67c23a;
|
||||
$--theme-warning: #e6a23c;
|
||||
$--theme-danger: #f56c6c;
|
||||
$--theme-info: #909399;
|
||||
|
||||
$--border-color-lighter: hsl($--theme-hue, $--theme-saturation, 16%);
|
||||
$--border-color-extra-light: hsl($--theme-hue, $--theme-saturation, 15%);
|
||||
$--background-color-base: hsl($--theme-hue, $--theme-saturation, 16%);
|
||||
$--input-focus-border: hsl($--theme-hue, $--theme-saturation, 33%);
|
||||
$--table-header-background-color: hsl($--theme-hue, $--theme-saturation, 15%);
|
||||
$--table-row-hover-background-color: hsl(
|
||||
$--theme-hue,
|
||||
$--theme-saturation,
|
||||
18%
|
||||
);
|
||||
$--skeleton-to-color: hsl($--theme-hue, $--theme-saturation, 33%);
|
||||
$--tree-node-hover-background-color: hsl(
|
||||
$--theme-hue,
|
||||
$--theme-saturation,
|
||||
16%
|
||||
);
|
||||
$--collapse-content-font-color: hsl($--theme-hue, $--theme-saturation, 66%);
|
||||
$--message-close-icon-color: hsl($--theme-hue, $--theme-saturation, 60%);
|
||||
$--dropdown-menu-box-shadow: 0 2px 12px rgba(0, 0, 0, 0.15);
|
||||
$--box-shadow-base: 0 1px 2px hsla($--theme-hue, $--theme-saturation, 0%, 0.1);
|
||||
$--box-shadow-dark: 0 1px 3px hsla($--theme-hue, $--theme-saturation, 0%, 0.15);
|
||||
$--calendar-selected-background-color: rgba($--theme-primary, 0.1);
|
||||
|
||||
@forward 'var' with (
|
||||
$colors: (
|
||||
'white': $--theme-text-1,
|
||||
'black': $--theme-bg-1,
|
||||
'primary': (
|
||||
'base': $--theme-primary
|
||||
),
|
||||
'success': (
|
||||
'base': $--theme-success
|
||||
),
|
||||
'warning': (
|
||||
'base': $--theme-warning
|
||||
),
|
||||
'danger': (
|
||||
'base': $--theme-danger
|
||||
),
|
||||
'error': (
|
||||
'base': $--theme-danger
|
||||
),
|
||||
'info': (
|
||||
'base': $--theme-info
|
||||
)
|
||||
),
|
||||
$text-color: (
|
||||
'primary': $--theme-text-1,
|
||||
'regular': $--theme-text-2,
|
||||
'secondary': $--theme-info,
|
||||
'placeholder': $--theme-text-4,
|
||||
'disabled': $--theme-text-4
|
||||
),
|
||||
$border-color: (
|
||||
'': $--theme-border-1,
|
||||
'light': $--theme-border-2,
|
||||
'lighter': $--border-color-lighter,
|
||||
'extra-light': $--border-color-extra-light,
|
||||
'dark': $--theme-border-1,
|
||||
'darker': $--theme-border-2
|
||||
),
|
||||
$fill-color: (
|
||||
'': $--background-color-base,
|
||||
'light': $--theme-bg-4,
|
||||
'lighter': $--theme-bg-5,
|
||||
'extra-light': $--border-color-extra-light,
|
||||
'dark': $--theme-bg-2,
|
||||
'darker': $--theme-bg-1,
|
||||
'blank': $--theme-bg-4
|
||||
),
|
||||
$bg-color: (
|
||||
'': $--theme-bg-2,
|
||||
'page': $--theme-bg-1,
|
||||
'overlay': $--theme-bg-4
|
||||
),
|
||||
$box-shadow: (
|
||||
'': (
|
||||
0px 12px 32px 4px rgba(0, 0, 0, 0.36),
|
||||
0px 8px 20px rgba(0, 0, 0, 0.72)
|
||||
),
|
||||
'light': (
|
||||
0px 0px 12px rgba(0, 0, 0, 0.72)
|
||||
),
|
||||
'lighter': (
|
||||
0px 0px 6px rgba(0, 0, 0, 0.72)
|
||||
),
|
||||
'dark': (
|
||||
0px 16px 48px 16px rgba(0, 0, 0, 0.72),
|
||||
0px 12px 32px rgba(0, 0, 0, 0.72),
|
||||
0px 8px 16px -8px rgba(0, 0, 0, 0.96)
|
||||
)
|
||||
),
|
||||
$disabled: (
|
||||
'bg-color': $--theme-bg-5,
|
||||
'text-color': $--theme-text-4,
|
||||
'border-color': $--theme-border-2
|
||||
)
|
||||
);
|
||||
|
||||
$--color-primary: $--theme-primary;
|
||||
$--color-success: $--theme-success;
|
||||
$--color-warning: $--theme-warning;
|
||||
$--color-danger: $--theme-danger;
|
||||
$--color-info: $--theme-info;
|
||||
|
||||
$--color-white: $--theme-text-1;
|
||||
$--color-black: $--theme-bg-1;
|
||||
|
||||
$--color-text-primary: $--theme-text-1;
|
||||
$--color-text-regular: $--theme-text-2;
|
||||
$--color-text-secondary: $--theme-info;
|
||||
$--color-text-placeholder: $--theme-text-4;
|
||||
|
||||
$--border-color-base: $--theme-border-1;
|
||||
$--border-color-light: $--theme-bg-5;
|
||||
|
||||
$--button-default-background-color: $--theme-bg-5;
|
||||
$--button-default-border-color: $--theme-border-2;
|
||||
$--button-default-font-color: $--theme-text-2;
|
||||
|
||||
$--input-background-color: $--theme-bg-5;
|
||||
$--input-border-color: $--theme-border-1;
|
||||
$--input-font-color: $--theme-text-1;
|
||||
|
||||
$--select-input-focus-border-color: $--input-focus-border;
|
||||
|
||||
$--dialog-background-color: $--theme-bg-4;
|
||||
$--popover-background-color: $--theme-bg-4;
|
||||
|
||||
$--table-border-color: $--theme-border-2;
|
||||
|
||||
$--pagination-font-color: $--theme-text-2;
|
||||
$--pagination-background-color: $--theme-bg-4;
|
||||
|
||||
$--tooltip-fill: $--theme-bg-4;
|
||||
$--tooltip-color: $--theme-text-1;
|
||||
$--tooltip-border-color: $--theme-bg-4;
|
||||
|
||||
$--backtop-background-color: $--theme-bg-5;
|
||||
$--backtop-font-color: $--theme-text-2;
|
||||
$--backtop-hover-background-color: $--theme-border-2;
|
||||
|
||||
$--datepicker-font-color: $--theme-text-1;
|
||||
$--datepicker-header-font-color: $--theme-text-1;
|
||||
$--datepicker-icon-color: $--theme-text-1;
|
||||
|
||||
$--skeleton-color: $--theme-bg-5;
|
||||
|
||||
$--select-dropdown-background: $--theme-bg-4;
|
||||
$--select-dropdown-border: 1px solid $--theme-border-1;
|
||||
|
||||
$--tree-font-color: $--theme-text-2;
|
||||
|
||||
$--menu-item-font-color: $--theme-text-2;
|
||||
$--menu-background-color: $--theme-bg-2;
|
||||
|
||||
$--collapse-header-background-color: $--theme-bg-5;
|
||||
$--collapse-content-background-color: $--theme-bg-4;
|
||||
$--collapse-border-color: $--theme-border-2;
|
||||
$--collapse-header-font-color: $--theme-text-2;
|
||||
|
||||
$--message-background-color: $--theme-bg-5;
|
||||
$--message-close-hover-color: $--theme-text-2;
|
||||
$--message-success-font-color: #52c41a;
|
||||
$--message-info-font-color: #1890ff;
|
||||
$--message-warning-font-color: #faad14;
|
||||
$--message-danger-font-color: #ff4d4f;
|
||||
|
||||
$--pagination-hover-color: $--theme-text-4;
|
||||
|
||||
$--card-background-color: $--theme-bg-4;
|
||||
|
||||
:root {
|
||||
--group-calendar-event-bg: #{$--calendar-selected-background-color};
|
||||
--group-calendar-badge-following: #{color.adjust(
|
||||
$--theme-primary,
|
||||
$lightness: 20%
|
||||
)};
|
||||
--group-calendar-badge-normal: #{$--theme-info};
|
||||
}
|
||||
|
||||
@import 'theme.dark_styles';
|
||||
|
||||
.el-table tr,
|
||||
.el-table td.el-table__cell,
|
||||
.el-table th.el-table__cell {
|
||||
background-color: hsl($--theme-hue, $--theme-saturation, 6%);
|
||||
}
|
||||
|
||||
.el-radio-button__inner {
|
||||
background: hsl($--theme-hue, $--theme-saturation, 9%);
|
||||
border: 1px solid hsl($--theme-hue, $--theme-saturation, 12%);
|
||||
}
|
||||
|
||||
.el-tree {
|
||||
background: hsl($--theme-hue, $--theme-saturation, 9%);
|
||||
}
|
||||
|
||||
.x-menu-container {
|
||||
border-right: 1px solid $--theme-bg-5;
|
||||
}
|
||||
|
||||
.x-aside-container {
|
||||
border-left: 1px solid $--theme-bg-5;
|
||||
}
|
||||
|
||||
.x-friend-item:hover,
|
||||
.x-change-image-item:hover,
|
||||
.el-select-dropdown__item.hover,
|
||||
.el-select-dropdown__item:hover,
|
||||
.el-dropdown-menu__item:focus,
|
||||
.el-dropdown-menu__item:not(.is-disabled):hover,
|
||||
.el-table--enable-row-hover .el-table__body tr:hover > td.el-table__cell,
|
||||
.x-friend-item:hover .el-input__count {
|
||||
background: hsl($--theme-hue, $--theme-saturation, 9%);
|
||||
color: $--color-primary;
|
||||
}
|
||||
|
||||
.x-friend-item:hover,
|
||||
.x-change-image-item:hover {
|
||||
color: $--color-primary;
|
||||
}
|
||||
|
||||
// Tag background variants
|
||||
@each $type in success, warning, danger {
|
||||
.el-tag--plain.el-tag--#{$type} {
|
||||
background-color: hsl($--theme-hue, $--theme-saturation, 9%);
|
||||
}
|
||||
}
|
||||
|
||||
.el-calendar {
|
||||
background-color: $--theme-bg-4 !important;
|
||||
}
|
||||
|
||||
.el-calendar__title {
|
||||
color: $--theme-text-1 !important;
|
||||
}
|
||||
|
||||
.el-card {
|
||||
background-color: $--theme-bg-5 !important;
|
||||
border-color: $--theme-border-1 !important;
|
||||
}
|
||||
|
||||
.el-descriptions__body {
|
||||
background-color: $--theme-bg-4 !important;
|
||||
color: $--theme-text-1 !important;
|
||||
}
|
||||
|
||||
.el-timeline-item__tail {
|
||||
border-left-color: #{color.adjust($--theme-primary, $lightness: 20%)} !important;
|
||||
}
|
||||
|
||||
.el-timeline-item__node {
|
||||
background-color: #{color.adjust($--theme-primary, $lightness: 20%)} !important;
|
||||
}
|
||||
|
||||
.el-popper[data-popper-placement^='top'] .el-popper__arrow {
|
||||
border-top-color: $--theme-bg-4 !important;
|
||||
}
|
||||
|
||||
.el-popper[data-popper-placement^='top'] .el-popper__arrow::after {
|
||||
border-top-color: $--theme-bg-4 !important;
|
||||
}
|
||||
|
||||
.el-popper[data-popper-placement^='bottom'] .el-popper__arrow {
|
||||
border-bottom-color: $--theme-bg-4 !important;
|
||||
}
|
||||
|
||||
.el-popper[data-popper-placement^='bottom'] .el-popper__arrow::after {
|
||||
border-bottom-color: $--theme-bg-4 !important;
|
||||
}
|
||||
|
||||
.el-popper[data-popper-placement^='left'] .el-popper__arrow {
|
||||
border-left-color: $--theme-bg-4 !important;
|
||||
}
|
||||
|
||||
.el-popper[data-popper-placement^='left'] .el-popper__arrow::after {
|
||||
border-left-color: $--theme-bg-4 !important;
|
||||
}
|
||||
|
||||
.el-popper[data-popper-placement^='right'] .el-popper__arrow {
|
||||
border-right-color: $--theme-bg-4 !important;
|
||||
}
|
||||
|
||||
.el-popper[data-popper-placement^='right'] .el-popper__arrow::after {
|
||||
border-right-color: $--theme-bg-4 !important;
|
||||
}
|
||||
|
||||
// Group Calendar Dialog borders
|
||||
.search-container {
|
||||
border-bottom-color: $--border-color-light !important;
|
||||
}
|
||||
|
||||
.group-header {
|
||||
border-bottom-color: $--border-color-light !important;
|
||||
}
|
||||
@@ -1,281 +0,0 @@
|
||||
@charset "utf-8";
|
||||
|
||||
//
|
||||
// Copyright(c) 2019-2025 pypy and individual contributors.
|
||||
// All rights reserved.
|
||||
//
|
||||
// This work is licensed under the terms of the MIT license.
|
||||
// For a copy, see <https://opensource.org/licenses/MIT>.
|
||||
//
|
||||
|
||||
$--theme-hue: 0;
|
||||
$--theme-saturation: 0%;
|
||||
|
||||
$--theme-bg-1: hsl($--theme-hue, $--theme-saturation, 6%); // #101010
|
||||
$--theme-bg-2: hsl($--theme-hue, $--theme-saturation, 9%); // #171717
|
||||
$--theme-bg-3: hsl($--theme-hue, $--theme-saturation, 13%); // #222222
|
||||
$--theme-bg-4: hsl($--theme-hue, $--theme-saturation, 17%); // #2b2b2b
|
||||
$--theme-bg-5: hsl($--theme-hue, $--theme-saturation, 20%); // #333333
|
||||
|
||||
$--theme-border-1: hsl($--theme-hue, $--theme-saturation, 23%); // #3a3a3a
|
||||
$--theme-border-2: hsl($--theme-hue, $--theme-saturation, 25%); // #404040
|
||||
$--theme-border-3: hsl($--theme-hue, $--theme-saturation, 31%); // #505050
|
||||
|
||||
$--theme-text-1: hsl($--theme-hue, $--theme-saturation, 100%); // #ffffff
|
||||
$--theme-text-2: hsl($--theme-hue, $--theme-saturation, 78%); // #c8c8c8
|
||||
$--theme-text-3: hsl($--theme-hue, $--theme-saturation, 70%); // #b3b3b3
|
||||
$--theme-text-4: hsl($--theme-hue, $--theme-saturation, 38%); // #606266
|
||||
|
||||
$--theme-primary: #66b1ff;
|
||||
$--theme-success: #67c23a;
|
||||
$--theme-warning: #e6a23c;
|
||||
$--theme-danger: #f56c6c;
|
||||
$--theme-info: #909399;
|
||||
|
||||
$--border-color-lighter: hsl($--theme-hue, $--theme-saturation, 16%);
|
||||
$--border-color-extra-light: hsl($--theme-hue, $--theme-saturation, 15%);
|
||||
$--background-color-base: hsl($--theme-hue, $--theme-saturation, 16%);
|
||||
$--input-focus-border: hsl($--theme-hue, $--theme-saturation, 33%);
|
||||
$--table-header-background-color: hsl($--theme-hue, $--theme-saturation, 15%);
|
||||
$--table-row-hover-background-color: hsl(
|
||||
$--theme-hue,
|
||||
$--theme-saturation,
|
||||
18%
|
||||
);
|
||||
$--skeleton-to-color: hsl($--theme-hue, $--theme-saturation, 33%);
|
||||
$--tree-node-hover-background-color: hsl(
|
||||
$--theme-hue,
|
||||
$--theme-saturation,
|
||||
16%
|
||||
);
|
||||
$--collapse-content-font-color: hsl($--theme-hue, $--theme-saturation, 66%);
|
||||
$--message-close-icon-color: hsl($--theme-hue, $--theme-saturation, 60%);
|
||||
$--dropdown-menu-box-shadow: 0 2px 12px
|
||||
hsla($--theme-hue, $--theme-saturation, 0%, 0.15);
|
||||
$--box-shadow-base: 0 1px 2px hsla($--theme-hue, $--theme-saturation, 0%, 0.1);
|
||||
$--box-shadow-dark: 0 1px 3px hsla($--theme-hue, $--theme-saturation, 0%, 0.15);
|
||||
$--calendar-selected-background-color: rgba($--theme-primary, 0.1);
|
||||
|
||||
@forward 'var' with (
|
||||
$colors: (
|
||||
'white': $--theme-text-1,
|
||||
'black': $--theme-bg-1,
|
||||
'primary': (
|
||||
'base': $--theme-primary
|
||||
),
|
||||
'success': (
|
||||
'base': $--theme-success
|
||||
),
|
||||
'warning': (
|
||||
'base': $--theme-warning
|
||||
),
|
||||
'danger': (
|
||||
'base': $--theme-danger
|
||||
),
|
||||
'error': (
|
||||
'base': $--theme-danger
|
||||
),
|
||||
'info': (
|
||||
'base': $--theme-info
|
||||
)
|
||||
),
|
||||
$text-color: (
|
||||
'primary': $--theme-text-1,
|
||||
'regular': $--theme-text-2,
|
||||
'secondary': $--theme-info,
|
||||
'placeholder': $--theme-text-4,
|
||||
'disabled': $--theme-text-4
|
||||
),
|
||||
$border-color: (
|
||||
'': $--theme-border-1,
|
||||
'light': $--theme-border-2,
|
||||
'lighter': $--border-color-lighter,
|
||||
'extra-light': $--border-color-extra-light,
|
||||
'dark': $--theme-border-1,
|
||||
'darker': $--theme-border-2
|
||||
),
|
||||
$fill-color: (
|
||||
'': $--background-color-base,
|
||||
'light': $--theme-bg-4,
|
||||
'lighter': $--theme-bg-5,
|
||||
'extra-light': $--border-color-extra-light,
|
||||
'dark': $--theme-bg-2,
|
||||
'darker': $--theme-bg-1,
|
||||
'blank': $--theme-bg-4
|
||||
),
|
||||
$bg-color: (
|
||||
'': $--theme-bg-2,
|
||||
'page': $--theme-bg-1,
|
||||
'overlay': $--theme-bg-4
|
||||
),
|
||||
$box-shadow: (
|
||||
'': (
|
||||
0px 12px 32px 4px rgba(0, 0, 0, 0.36),
|
||||
0px 8px 20px rgba(0, 0, 0, 0.72)
|
||||
),
|
||||
'light': (
|
||||
0px 0px 12px rgba(0, 0, 0, 0.72)
|
||||
),
|
||||
'lighter': (
|
||||
0px 0px 6px rgba(0, 0, 0, 0.72)
|
||||
),
|
||||
'dark': (
|
||||
0px 16px 48px 16px rgba(0, 0, 0, 0.72),
|
||||
0px 12px 32px rgba(0, 0, 0, 0.72),
|
||||
0px 8px 16px -8px rgba(0, 0, 0, 0.96)
|
||||
)
|
||||
),
|
||||
$disabled: (
|
||||
'bg-color': $--theme-bg-5,
|
||||
'text-color': $--theme-text-4,
|
||||
'border-color': $--theme-border-2
|
||||
)
|
||||
);
|
||||
|
||||
$--color-primary: $--theme-primary;
|
||||
$--color-success: $--theme-success;
|
||||
$--color-warning: $--theme-warning;
|
||||
$--color-danger: $--theme-danger;
|
||||
$--color-info: $--theme-info;
|
||||
|
||||
$--color-white: $--theme-text-1;
|
||||
$--color-black: $--theme-bg-1;
|
||||
|
||||
$--color-text-primary: $--theme-text-1;
|
||||
$--color-text-regular: $--theme-text-2;
|
||||
$--color-text-secondary: $--theme-info;
|
||||
$--color-text-placeholder: $--theme-text-4;
|
||||
|
||||
$--border-color-base: $--theme-border-1;
|
||||
$--border-color-light: $--theme-bg-5;
|
||||
|
||||
$--button-default-background-color: $--theme-bg-5;
|
||||
$--button-default-border-color: $--theme-border-2;
|
||||
$--button-default-font-color: $--theme-text-2;
|
||||
|
||||
$--input-background-color: $--theme-bg-5;
|
||||
$--input-border-color: $--theme-border-1;
|
||||
$--input-font-color: $--theme-text-1;
|
||||
|
||||
$--select-input-focus-border-color: $--input-focus-border;
|
||||
|
||||
$--dialog-background-color: $--theme-bg-4;
|
||||
$--popover-background-color: $--theme-bg-4;
|
||||
|
||||
$--table-border-color: $--theme-border-2;
|
||||
|
||||
$--pagination-font-color: $--theme-text-2;
|
||||
$--pagination-background-color: $--theme-bg-4;
|
||||
|
||||
$--tooltip-fill: $--theme-bg-4;
|
||||
$--tooltip-color: $--theme-text-1;
|
||||
$--tooltip-border-color: $--theme-bg-4;
|
||||
|
||||
$--backtop-background-color: $--theme-bg-5;
|
||||
$--backtop-font-color: $--theme-text-2;
|
||||
$--backtop-hover-background-color: $--theme-border-2;
|
||||
|
||||
$--datepicker-font-color: $--theme-text-1;
|
||||
$--datepicker-header-font-color: $--theme-text-1;
|
||||
$--datepicker-icon-color: $--theme-text-1;
|
||||
|
||||
$--skeleton-color: $--theme-bg-5;
|
||||
|
||||
$--select-dropdown-background: $--theme-bg-4;
|
||||
$--select-dropdown-border: 1px solid $--theme-border-1;
|
||||
|
||||
$--tree-font-color: $--theme-text-2;
|
||||
|
||||
$--menu-item-font-color: $--theme-text-2;
|
||||
$--menu-background-color: $--theme-bg-2;
|
||||
|
||||
$--collapse-header-background-color: $--theme-bg-5;
|
||||
$--collapse-content-background-color: $--theme-bg-4;
|
||||
$--collapse-border-color: $--theme-border-2;
|
||||
$--collapse-header-font-color: $--theme-text-2;
|
||||
|
||||
$--message-background-color: $--theme-bg-5;
|
||||
$--message-close-hover-color: $--theme-text-2;
|
||||
$--message-success-font-color: #52c41a;
|
||||
$--message-info-font-color: #1890ff;
|
||||
$--message-warning-font-color: #faad14;
|
||||
$--message-danger-font-color: #ff4d4f;
|
||||
|
||||
$--pagination-hover-color: $--theme-text-4;
|
||||
|
||||
$--card-background-color: $--theme-bg-4;
|
||||
|
||||
:root {
|
||||
--group-calendar-event-bg: #{$--calendar-selected-background-color};
|
||||
--group-calendar-badge-following: #{$--color-success};
|
||||
--group-calendar-badge-normal: #{$--color-primary};
|
||||
}
|
||||
|
||||
@import 'theme.dark_styles';
|
||||
|
||||
.el-calendar {
|
||||
background-color: $--theme-bg-4 !important;
|
||||
}
|
||||
|
||||
.el-calendar__title {
|
||||
color: $--theme-text-1 !important;
|
||||
}
|
||||
|
||||
.el-card {
|
||||
background-color: $--theme-bg-5 !important;
|
||||
border-color: $--theme-border-1 !important;
|
||||
}
|
||||
|
||||
.el-descriptions__body {
|
||||
background-color: $--theme-bg-4 !important;
|
||||
color: $--theme-text-1 !important;
|
||||
}
|
||||
|
||||
.el-timeline-item__tail {
|
||||
border-left-color: $--theme-border-2 !important;
|
||||
}
|
||||
|
||||
.el-timeline-item__node {
|
||||
background-color: $--theme-border-2 !important;
|
||||
}
|
||||
|
||||
.el-popper[data-popper-placement^='top'] .el-popper__arrow {
|
||||
border-top-color: $--theme-bg-4 !important;
|
||||
}
|
||||
|
||||
.el-popper[data-popper-placement^='top'] .el-popper__arrow::after {
|
||||
border-top-color: $--theme-bg-4 !important;
|
||||
}
|
||||
|
||||
.el-popper[data-popper-placement^='bottom'] .el-popper__arrow {
|
||||
border-bottom-color: $--theme-bg-4 !important;
|
||||
}
|
||||
|
||||
.el-popper[data-popper-placement^='bottom'] .el-popper__arrow::after {
|
||||
border-bottom-color: $--theme-bg-4 !important;
|
||||
}
|
||||
|
||||
.el-popper[data-popper-placement^='left'] .el-popper__arrow {
|
||||
border-left-color: $--theme-bg-4 !important;
|
||||
}
|
||||
|
||||
.el-popper[data-popper-placement^='left'] .el-popper__arrow::after {
|
||||
border-left-color: $--theme-bg-4 !important;
|
||||
}
|
||||
|
||||
.el-popper[data-popper-placement^='right'] .el-popper__arrow {
|
||||
border-right-color: $--theme-bg-4 !important;
|
||||
}
|
||||
|
||||
.el-popper[data-popper-placement^='right'] .el-popper__arrow::after {
|
||||
border-right-color: $--theme-bg-4 !important;
|
||||
}
|
||||
|
||||
// Group Calendar Dialog borders
|
||||
.search-container {
|
||||
border-bottom-color: $--border-color-light !important;
|
||||
}
|
||||
|
||||
.group-header {
|
||||
border-bottom-color: $--border-color-light !important;
|
||||
}
|
||||
@@ -1,281 +0,0 @@
|
||||
@charset "utf-8";
|
||||
|
||||
//
|
||||
// Copyright(c) 2019-2025 pypy and individual contributors.
|
||||
// All rights reserved.
|
||||
//
|
||||
// This work is licensed under the terms of the MIT license.
|
||||
// For a copy, see <https://opensource.org/licenses/MIT>.
|
||||
//
|
||||
|
||||
$--theme-hue: 210;
|
||||
$--theme-saturation: 15%;
|
||||
|
||||
$--theme-bg-1: hsl($--theme-hue, $--theme-saturation, 6%); // #101010
|
||||
$--theme-bg-2: hsl($--theme-hue, $--theme-saturation, 9%); // #171717
|
||||
$--theme-bg-3: hsl($--theme-hue, $--theme-saturation, 13%); // #222222
|
||||
$--theme-bg-4: hsl($--theme-hue, $--theme-saturation, 17%); // #2b2b2b
|
||||
$--theme-bg-5: hsl($--theme-hue, $--theme-saturation, 20%); // #333333
|
||||
|
||||
$--theme-border-1: hsl($--theme-hue, $--theme-saturation, 23%); // #3a3a3a
|
||||
$--theme-border-2: hsl($--theme-hue, $--theme-saturation, 25%); // #404040
|
||||
$--theme-border-3: hsl($--theme-hue, $--theme-saturation, 31%); // #505050
|
||||
|
||||
$--theme-text-1: hsl($--theme-hue, $--theme-saturation, 100%); // #ffffff
|
||||
$--theme-text-2: hsl($--theme-hue, $--theme-saturation, 78%); // #c8c8c8
|
||||
$--theme-text-3: hsl($--theme-hue, $--theme-saturation, 70%); // #b3b3b3
|
||||
$--theme-text-4: hsl($--theme-hue, $--theme-saturation, 38%); // #606266
|
||||
|
||||
$--theme-primary: #66b1ff;
|
||||
$--theme-success: #67c23a;
|
||||
$--theme-warning: #e6a23c;
|
||||
$--theme-danger: #f56c6c;
|
||||
$--theme-info: #909399;
|
||||
|
||||
$--border-color-lighter: hsl($--theme-hue, $--theme-saturation, 16%);
|
||||
$--border-color-extra-light: hsl($--theme-hue, $--theme-saturation, 15%);
|
||||
$--background-color-base: hsl($--theme-hue, $--theme-saturation, 16%);
|
||||
$--input-focus-border: hsl($--theme-hue, $--theme-saturation, 33%);
|
||||
$--table-header-background-color: hsl($--theme-hue, $--theme-saturation, 15%);
|
||||
$--table-row-hover-background-color: hsl(
|
||||
$--theme-hue,
|
||||
$--theme-saturation,
|
||||
18%
|
||||
);
|
||||
$--skeleton-to-color: hsl($--theme-hue, $--theme-saturation, 33%);
|
||||
$--tree-node-hover-background-color: hsl(
|
||||
$--theme-hue,
|
||||
$--theme-saturation,
|
||||
16%
|
||||
);
|
||||
$--collapse-content-font-color: hsl($--theme-hue, $--theme-saturation, 66%);
|
||||
$--message-close-icon-color: hsl($--theme-hue, $--theme-saturation, 60%);
|
||||
$--dropdown-menu-box-shadow: 0 2px 12px
|
||||
hsla($--theme-hue, $--theme-saturation, 0%, 0.15);
|
||||
$--box-shadow-base: 0 1px 2px hsla($--theme-hue, $--theme-saturation, 0%, 0.1);
|
||||
$--box-shadow-dark: 0 1px 3px hsla($--theme-hue, $--theme-saturation, 0%, 0.15);
|
||||
$--calendar-selected-background-color: rgba($--theme-primary, 0.1);
|
||||
|
||||
@forward 'var' with (
|
||||
$colors: (
|
||||
'white': $--theme-text-1,
|
||||
'black': $--theme-bg-1,
|
||||
'primary': (
|
||||
'base': $--theme-primary
|
||||
),
|
||||
'success': (
|
||||
'base': $--theme-success
|
||||
),
|
||||
'warning': (
|
||||
'base': $--theme-warning
|
||||
),
|
||||
'danger': (
|
||||
'base': $--theme-danger
|
||||
),
|
||||
'error': (
|
||||
'base': $--theme-danger
|
||||
),
|
||||
'info': (
|
||||
'base': $--theme-info
|
||||
)
|
||||
),
|
||||
$text-color: (
|
||||
'primary': $--theme-text-1,
|
||||
'regular': $--theme-text-2,
|
||||
'secondary': $--theme-info,
|
||||
'placeholder': $--theme-text-4,
|
||||
'disabled': $--theme-text-4
|
||||
),
|
||||
$border-color: (
|
||||
'': $--theme-border-1,
|
||||
'light': $--theme-border-2,
|
||||
'lighter': $--border-color-lighter,
|
||||
'extra-light': $--border-color-extra-light,
|
||||
'dark': $--theme-border-1,
|
||||
'darker': $--theme-border-2
|
||||
),
|
||||
$fill-color: (
|
||||
'': $--background-color-base,
|
||||
'light': $--theme-bg-4,
|
||||
'lighter': $--theme-bg-5,
|
||||
'extra-light': $--border-color-extra-light,
|
||||
'dark': $--theme-bg-2,
|
||||
'darker': $--theme-bg-1,
|
||||
'blank': $--theme-bg-4
|
||||
),
|
||||
$bg-color: (
|
||||
'': $--theme-bg-2,
|
||||
'page': $--theme-bg-1,
|
||||
'overlay': $--theme-bg-4
|
||||
),
|
||||
$box-shadow: (
|
||||
'': (
|
||||
0px 12px 32px 4px hsla($--theme-hue, $--theme-saturation, 0%, 0.36),
|
||||
0px 8px 20px hsla($--theme-hue, $--theme-saturation, 0%, 0.72)
|
||||
),
|
||||
'light': (
|
||||
0px 0px 12px hsla($--theme-hue, $--theme-saturation, 0%, 0.72)
|
||||
),
|
||||
'lighter': (
|
||||
0px 0px 6px hsla($--theme-hue, $--theme-saturation, 0%, 0.72)
|
||||
),
|
||||
'dark': (
|
||||
0px 16px 48px 16px hsla($--theme-hue, $--theme-saturation, 0%, 0.72),
|
||||
0px 12px 32px hsla($--theme-hue, $--theme-saturation, 0%, 0.72),
|
||||
0px 8px 16px -8px hsla($--theme-hue, $--theme-saturation, 0%, 0.96)
|
||||
)
|
||||
),
|
||||
$disabled: (
|
||||
'bg-color': $--theme-bg-5,
|
||||
'text-color': $--theme-text-4,
|
||||
'border-color': $--theme-border-2
|
||||
)
|
||||
);
|
||||
|
||||
$--color-primary: $--theme-primary;
|
||||
$--color-success: $--theme-success;
|
||||
$--color-warning: $--theme-warning;
|
||||
$--color-danger: $--theme-danger;
|
||||
$--color-info: $--theme-info;
|
||||
|
||||
$--color-white: $--theme-text-1;
|
||||
$--color-black: $--theme-bg-1;
|
||||
|
||||
$--color-text-primary: $--theme-text-1;
|
||||
$--color-text-regular: $--theme-text-2;
|
||||
$--color-text-secondary: $--theme-info;
|
||||
$--color-text-placeholder: $--theme-text-4;
|
||||
|
||||
$--border-color-base: $--theme-border-1;
|
||||
$--border-color-light: $--theme-bg-5;
|
||||
|
||||
$--button-default-background-color: $--theme-bg-5;
|
||||
$--button-default-border-color: $--theme-border-2;
|
||||
$--button-default-font-color: $--theme-text-2;
|
||||
|
||||
$--input-background-color: $--theme-bg-5;
|
||||
$--input-border-color: $--theme-border-1;
|
||||
$--input-font-color: $--theme-text-1;
|
||||
|
||||
$--select-input-focus-border-color: $--input-focus-border;
|
||||
|
||||
$--dialog-background-color: $--theme-bg-4;
|
||||
$--popover-background-color: $--theme-bg-4;
|
||||
|
||||
$--table-border-color: $--theme-border-2;
|
||||
|
||||
$--pagination-font-color: $--theme-text-2;
|
||||
$--pagination-background-color: $--theme-bg-4;
|
||||
|
||||
$--tooltip-fill: $--theme-bg-4;
|
||||
$--tooltip-color: $--theme-text-1;
|
||||
$--tooltip-border-color: $--theme-bg-4;
|
||||
|
||||
$--backtop-background-color: $--theme-bg-5;
|
||||
$--backtop-font-color: $--theme-text-2;
|
||||
$--backtop-hover-background-color: $--theme-border-2;
|
||||
|
||||
$--datepicker-font-color: $--theme-text-1;
|
||||
$--datepicker-header-font-color: $--theme-text-1;
|
||||
$--datepicker-icon-color: $--theme-text-1;
|
||||
|
||||
$--skeleton-color: $--theme-bg-5;
|
||||
|
||||
$--select-dropdown-background: $--theme-bg-4;
|
||||
$--select-dropdown-border: 1px solid $--theme-border-1;
|
||||
|
||||
$--tree-font-color: $--theme-text-2;
|
||||
|
||||
$--menu-item-font-color: $--theme-text-2;
|
||||
$--menu-background-color: $--theme-bg-2;
|
||||
|
||||
$--collapse-header-background-color: $--theme-bg-5;
|
||||
$--collapse-content-background-color: $--theme-bg-4;
|
||||
$--collapse-border-color: $--theme-border-2;
|
||||
$--collapse-header-font-color: $--theme-text-2;
|
||||
|
||||
$--message-background-color: $--theme-bg-5;
|
||||
$--message-close-hover-color: $--theme-text-2;
|
||||
$--message-success-font-color: #52c41a;
|
||||
$--message-info-font-color: #1890ff;
|
||||
$--message-warning-font-color: #faad14;
|
||||
$--message-danger-font-color: #ff4d4f;
|
||||
|
||||
$--pagination-hover-color: $--theme-text-4;
|
||||
|
||||
$--card-background-color: $--theme-bg-4;
|
||||
|
||||
:root {
|
||||
--group-calendar-event-bg: #{$--calendar-selected-background-color};
|
||||
--group-calendar-badge-following: #{$--color-success};
|
||||
--group-calendar-badge-normal: #{$--color-primary};
|
||||
}
|
||||
|
||||
@import 'theme.dark_styles';
|
||||
|
||||
.el-calendar {
|
||||
background-color: $--theme-bg-4 !important;
|
||||
}
|
||||
|
||||
.el-calendar__title {
|
||||
color: $--theme-text-1 !important;
|
||||
}
|
||||
|
||||
.el-card {
|
||||
background-color: $--theme-bg-5 !important;
|
||||
border-color: $--theme-border-1 !important;
|
||||
}
|
||||
|
||||
.el-descriptions__body {
|
||||
background-color: $--theme-bg-4 !important;
|
||||
color: $--theme-text-1 !important;
|
||||
}
|
||||
|
||||
.el-timeline-item__tail {
|
||||
border-left-color: $--theme-border-2 !important;
|
||||
}
|
||||
|
||||
.el-timeline-item__node {
|
||||
background-color: $--theme-border-2 !important;
|
||||
}
|
||||
|
||||
.el-popper[data-popper-placement^='top'] .el-popper__arrow {
|
||||
border-top-color: $--theme-bg-4 !important;
|
||||
}
|
||||
|
||||
.el-popper[data-popper-placement^='top'] .el-popper__arrow::after {
|
||||
border-top-color: $--theme-bg-4 !important;
|
||||
}
|
||||
|
||||
.el-popper[data-popper-placement^='bottom'] .el-popper__arrow {
|
||||
border-bottom-color: $--theme-bg-4 !important;
|
||||
}
|
||||
|
||||
.el-popper[data-popper-placement^='bottom'] .el-popper__arrow::after {
|
||||
border-bottom-color: $--theme-bg-4 !important;
|
||||
}
|
||||
|
||||
.el-popper[data-popper-placement^='left'] .el-popper__arrow {
|
||||
border-left-color: $--theme-bg-4 !important;
|
||||
}
|
||||
|
||||
.el-popper[data-popper-placement^='left'] .el-popper__arrow::after {
|
||||
border-left-color: $--theme-bg-4 !important;
|
||||
}
|
||||
|
||||
.el-popper[data-popper-placement^='right'] .el-popper__arrow {
|
||||
border-right-color: $--theme-bg-4 !important;
|
||||
}
|
||||
|
||||
.el-popper[data-popper-placement^='right'] .el-popper__arrow::after {
|
||||
border-right-color: $--theme-bg-4 !important;
|
||||
}
|
||||
|
||||
// Group Calendar Dialog borders
|
||||
.search-container {
|
||||
border-bottom-color: $--border-color-light !important;
|
||||
}
|
||||
|
||||
.group-header {
|
||||
border-bottom-color: $--border-color-light !important;
|
||||
}
|
||||
@@ -1,857 +0,0 @@
|
||||
/*
|
||||
* VRCX Dark-Vanilla theme by MintLily
|
||||
* https://github.com/MintLily/Dark-Vanilla
|
||||
*/
|
||||
|
||||
:root {
|
||||
--ThemeName: 'Dark Vanilla';
|
||||
--ThemeVers: '2.0.2';
|
||||
--ThemeAuth: 'MintLily';
|
||||
|
||||
--dv_bright: #eecce0;
|
||||
--dv_muted: #906d92;
|
||||
--dv_bright-rgb: 238, 204, 224;
|
||||
--dv_muted-rgb: 144, 109, 146;
|
||||
--dv_bg-top: #1e2427;
|
||||
--dv_bg-mid: #191f22;
|
||||
--dv_bg-bot: #131719;
|
||||
--dv_lg-rounded: 1rem;
|
||||
--dv_md-rounded: 0.6rem;
|
||||
--dv_sm-rounded: 0.45rem;
|
||||
--dv_background-modifier-selected: rgba(var(--dv_bright-rgb), 0.2);
|
||||
--dv_background-modifier-hover: rgba(var(--dv_bright-rgb), 0.3);
|
||||
--font-primary:
|
||||
'Encode Sans', 'Tofu', 'Helvetica Neue', Helvetica, Arial, sans-serif;
|
||||
--shadow: 0 0 15px 5px rgba(0, 0, 0, 0.35);
|
||||
}
|
||||
|
||||
/* MAIN */
|
||||
html,
|
||||
body,
|
||||
.x-menu-container {
|
||||
background-color: var(--dv_bg-bot);
|
||||
}
|
||||
|
||||
/* vietnamese */
|
||||
@font-face {
|
||||
font-family: 'Encode Sans';
|
||||
font-style: normal;
|
||||
font-weight: 100 900;
|
||||
font-stretch: 100%;
|
||||
src: url(https://fonts.gstatic.com/s/encodesans/v19/LDIhapOFNxEwR-Bd1O9uYNmnUQomAgE25imKSbHLR8A6WQw.woff2)
|
||||
format('woff2');
|
||||
unicode-range:
|
||||
U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1,
|
||||
U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329,
|
||||
U+1EA0-1EF9, U+20AB;
|
||||
}
|
||||
|
||||
/* latin-ext */
|
||||
@font-face {
|
||||
font-family: 'Encode Sans';
|
||||
font-style: normal;
|
||||
font-weight: 100 900;
|
||||
font-stretch: 100%;
|
||||
src: url(https://fonts.gstatic.com/s/encodesans/v19/LDIhapOFNxEwR-Bd1O9uYNmnUQomAgE25imKSbHLRsA6WQw.woff2)
|
||||
format('woff2');
|
||||
unicode-range:
|
||||
U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020,
|
||||
U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
|
||||
}
|
||||
|
||||
/* latin */
|
||||
@font-face {
|
||||
font-family: 'Encode Sans';
|
||||
font-style: normal;
|
||||
font-weight: 100 900;
|
||||
font-stretch: 100%;
|
||||
src: url(https://fonts.gstatic.com/s/encodesans/v19/LDIhapOFNxEwR-Bd1O9uYNmnUQomAgE25imKSbHLSMA6.woff2)
|
||||
format('woff2');
|
||||
unicode-range:
|
||||
U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
|
||||
U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191,
|
||||
U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
||||
}
|
||||
|
||||
body,
|
||||
input,
|
||||
textarea,
|
||||
select,
|
||||
button {
|
||||
font-family: var(--font-primary);
|
||||
}
|
||||
|
||||
a {
|
||||
color: var(--dv_bright);
|
||||
}
|
||||
|
||||
/* Side Bar */
|
||||
.x-menu-container {
|
||||
border-top-right-radius: var(--dv_lg-rounded);
|
||||
border-bottom-right-radius: var(--dv_lg-rounded);
|
||||
}
|
||||
|
||||
.el-menu-item.is-active {
|
||||
color: var(--dv_bright);
|
||||
}
|
||||
|
||||
.el-menu-item.is-active::before {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.el-menu-item:focus,
|
||||
.el-menu-item:hover {
|
||||
background-color: var(--dv_background-modifier-hover);
|
||||
}
|
||||
|
||||
li[class='el-menu-item is-active'] {
|
||||
background-color: var(--dv_background-modifier-selected);
|
||||
}
|
||||
|
||||
.el-menu-item:hover i {
|
||||
color: #eee;
|
||||
transition: 0.3s !important;
|
||||
}
|
||||
|
||||
.el-tooltip__popper.is-dark,
|
||||
.el-tooltip__popper[x-placement^='right'] .popper__arrow::after {
|
||||
background-color: var(--dv_bg-top);
|
||||
border-radius: var(--dv_md-rounded);
|
||||
box-shadow: var(--shadow);
|
||||
}
|
||||
|
||||
.el-tooltip__popper[x-placement^='right'] .popper__arrow::after {
|
||||
background-color: var(--dv_bg-top);
|
||||
}
|
||||
|
||||
/* Main Window Content */
|
||||
/* Feed */
|
||||
.x-app {
|
||||
background-color: var(--dv_bg-top);
|
||||
}
|
||||
|
||||
.x-container {
|
||||
background-color: var(--dv_bg-top);
|
||||
}
|
||||
|
||||
.x-container {
|
||||
border-top-left-radius: var(--dv_lg-rounded);
|
||||
border-bottom-left-radius: var(--dv_lg-rounded);
|
||||
}
|
||||
|
||||
.el-select:hover .el-input__inner {
|
||||
border: none;
|
||||
}
|
||||
|
||||
.el-select > .el-input input,
|
||||
.el-select .el-input input {
|
||||
background-color: var(--dv_bg-bot);
|
||||
border-radius: var(--dv_lg-rounded);
|
||||
}
|
||||
|
||||
.el-select-dropdown {
|
||||
background-color: var(--dv_bg-top);
|
||||
border: none;
|
||||
border-radius: var(--dv_lg-rounded);
|
||||
box-shadow: var(--shadow);
|
||||
}
|
||||
|
||||
.el-select-dropdown__item.hover,
|
||||
.el-select-dropdown__item:hover {
|
||||
background-color: var(--dv_background-modifier-hover);
|
||||
transition: 0.2s;
|
||||
border-radius: var(--dv_md-rounded);
|
||||
}
|
||||
|
||||
.el-select-dropdown__item.selected {
|
||||
color: var(--dv_bright);
|
||||
}
|
||||
|
||||
.el-popper[x-placement^='bottom'] .popper__arrow,
|
||||
.el-popper[x-placement^='bottom'] .popper__arrow::after {
|
||||
border-bottom-color: var(--dv_bg-top);
|
||||
}
|
||||
|
||||
.el-select-dropdown__item {
|
||||
color: #eee;
|
||||
}
|
||||
|
||||
.el-input__inner {
|
||||
background-color: var(--dv_bg-bot);
|
||||
border-radius: var(--dv_lg-rounded);
|
||||
transition: none !important;
|
||||
}
|
||||
|
||||
.el-table thead {
|
||||
color: #eee;
|
||||
}
|
||||
|
||||
.el-table .ascending .sort-caret.ascending {
|
||||
border-bottom-color: var(--dv_bright);
|
||||
}
|
||||
.el-table .descending .sort-caret.descending {
|
||||
border-top-color: var(--dv_bright);
|
||||
}
|
||||
|
||||
.el-table td.el-table__cell,
|
||||
.el-table th.el-table__cell.is-leaf {
|
||||
border-bottom-color: #5f5f5f;
|
||||
}
|
||||
|
||||
.el-table tr,
|
||||
.el-table td.el-table__cell,
|
||||
.el-table th.el-table__cell {
|
||||
background-color: var(--dv_bg-top);
|
||||
border: none;
|
||||
}
|
||||
|
||||
.el-table--striped .el-table__body tr.el-table__row--striped td.el-table__cell {
|
||||
background-color: var(--dv_bg-top);
|
||||
border: none;
|
||||
}
|
||||
|
||||
table.el-table__body[style^='width:'] tr[class='el-table__row']:hover td,
|
||||
table.el-table__body[style^='width:']
|
||||
tr[class='el-table__row el-table__row--striped']:hover
|
||||
td {
|
||||
background-color: var(--dv_background-modifier-hover);
|
||||
transition: 0.1s;
|
||||
}
|
||||
|
||||
table.el-table__body[style^='width:']
|
||||
tr[class='el-table__row']:hover
|
||||
td[class^='el-table_1_column_1'],
|
||||
table.el-table__body[style^='width:']
|
||||
tr[class='el-table__row el-table__row--striped']:hover
|
||||
td[class^='el-table_1_column_1'] {
|
||||
border-top-left-radius: var(--dv_md-rounded);
|
||||
border-bottom-left-radius: var(--dv_md-rounded);
|
||||
}
|
||||
|
||||
table.el-table__body[style^='width:']
|
||||
tr[class='el-table__row']:hover
|
||||
td[class^='el-table_1_column_5'],
|
||||
table.el-table__body[style^='width:']
|
||||
tr[class='el-table__row el-table__row--striped']:hover
|
||||
td[class^='el-table_1_column_5'] {
|
||||
border-top-right-radius: var(--dv_md-rounded);
|
||||
border-bottom-right-radius: var(--dv_md-rounded);
|
||||
}
|
||||
|
||||
tr[class='el-table__row']:hover .el-table__expand-icon,
|
||||
tr[class='el-table__row el-table__row--striped']:hover .el-table__expand-icon {
|
||||
color: #eee;
|
||||
}
|
||||
|
||||
.el-table__expanded-cell:hover {
|
||||
background-color: var(--dv_background-modifier-hover) !important;
|
||||
transition: 0.1s;
|
||||
border-bottom-left-radius: var(--dv_md-rounded);
|
||||
border-bottom-right-radius: var(--dv_md-rounded);
|
||||
}
|
||||
|
||||
.el-table--enable-row-hover .el-table__body tr:hover > td.el-table__cell {
|
||||
background-color: var(--dv_background-modifier-selected);
|
||||
transition: 0.1s;
|
||||
}
|
||||
|
||||
.el-pagination {
|
||||
padding: 8px;
|
||||
|
||||
> button.btn-prev {
|
||||
border-top-left-radius: var(--dv_sm-rounded);
|
||||
border-bottom-left-radius: var(--dv_sm-rounded);
|
||||
background-color: var(--dv_bg-bot);
|
||||
}
|
||||
|
||||
> button.btn-next {
|
||||
border-top-right-radius: var(--dv_md-rounded);
|
||||
border-bottom-right-radius: var(--dv_sm-rounded);
|
||||
background-color: var(--dv_bg-bot);
|
||||
}
|
||||
|
||||
> ul > li,
|
||||
button:disabled {
|
||||
background-color: var(--dv_bg-bot);
|
||||
color: #c0c4cc;
|
||||
}
|
||||
|
||||
> button:hover {
|
||||
color: var(--dv_bright);
|
||||
}
|
||||
}
|
||||
|
||||
.el-pagination .el-select .el-input .el-input__inner {
|
||||
border-radius: var(--dv_sm-rounded);
|
||||
}
|
||||
|
||||
.el-pager li.active,
|
||||
.el-pager li:hover,
|
||||
.el-button--text:hover {
|
||||
color: var(--dv_bright);
|
||||
}
|
||||
|
||||
.el-message-box {
|
||||
background-color: var(--dv_bg-top);
|
||||
border-radius: var(--dv_lg-rounded);
|
||||
border-color: transparent;
|
||||
box-shadow: var(--shadow);
|
||||
}
|
||||
|
||||
/* Game Log */
|
||||
table.el-table__body[style^='width:']
|
||||
tr[class='el-table__row']:hover
|
||||
td[class^='el-table_2_column_6'],
|
||||
table.el-table__body[style^='width:']
|
||||
tr[class='el-table__row el-table__row--striped']:hover
|
||||
td[class^='el-table_2_column_6'] {
|
||||
border-top-left-radius: var(--dv_md-rounded);
|
||||
border-bottom-left-radius: var(--dv_md-rounded);
|
||||
}
|
||||
|
||||
table.el-table__body[style^='width:']
|
||||
tr[class='el-table__row']:hover
|
||||
td[class^='el-table_2_column_11'],
|
||||
table.el-table__body[style^='width:']
|
||||
tr[class='el-table__row el-table__row--striped']:hover
|
||||
td[class^='el-table_2_column_11'] {
|
||||
border-top-right-radius: var(--dv_md-rounded);
|
||||
border-bottom-right-radius: var(--dv_md-rounded);
|
||||
}
|
||||
|
||||
/* Search */
|
||||
.el-tabs--card > .el-tabs__header .el-tabs__nav:first-child,
|
||||
.el-tabs--card > .el-tabs__header .el-tabs__nav:first-child:hover {
|
||||
border-top-left-radius: var(--dv_lg-rounded);
|
||||
}
|
||||
|
||||
.el-tabs--card > .el-tabs__header .el-tabs__item.is-active {
|
||||
border-bottom: 2px solid var(--dv_bright);
|
||||
}
|
||||
|
||||
.el-tabs__item:hover {
|
||||
border-bottom: 2px solid var(--dv_muted);
|
||||
}
|
||||
|
||||
.el-tabs--card > .el-tabs__header .el-tabs__nav:last-child,
|
||||
.el-tabs--card > .el-tabs__header .el-tabs__nav:last-child:hover {
|
||||
border-top-right-radius: var(--dv_lg-rounded);
|
||||
}
|
||||
|
||||
.el-tabs__item.is-active,
|
||||
.el-tabs__item:hover {
|
||||
color: var(--dv_bright);
|
||||
}
|
||||
|
||||
.el-button.is-disabled,
|
||||
.el-button.is-disabled:focus,
|
||||
.el-button.is-disabled:hover,
|
||||
.el-button:not(.el-button--text, .el-button--primary, .is-disabled):focus,
|
||||
.el-button:not(.el-button--text, .el-button--primary, .is-disabled):hover {
|
||||
background-color: var(--dv_background-modifier-hover);
|
||||
}
|
||||
|
||||
.el-button-group > .el-button:first-child {
|
||||
border-top-left-radius: var(--dv_md-rounded);
|
||||
border-bottom-left-radius: var(--dv_md-rounded);
|
||||
}
|
||||
|
||||
.el-button-group > .el-button:last-child {
|
||||
border-top-right-radius: var(--dv_md-rounded);
|
||||
border-bottom-right-radius: var(--dv_md-rounded);
|
||||
}
|
||||
|
||||
.el-button-group > .el-button,
|
||||
.el-button:not(.el-button--text, .el-button--primary, .is-disabled) {
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.el-button:not(.el-button--text, .el-button--primary, .is-disabled) {
|
||||
background-color: var(--dv_bg-bot);
|
||||
}
|
||||
|
||||
.el-button:not(.el-button--text, .el-button--primary) {
|
||||
border-radius: var(--dv_md-rounded);
|
||||
}
|
||||
|
||||
.el-button:not(.el-button--text, .el-button--primary, .is-disabled):focus,
|
||||
.el-button:not(.el-button--text, .el-button--primary, .is-disabled):hover,
|
||||
.el-button:not(.el-button--text, .el-button--primary, .is-disabled):focus,
|
||||
.el-button:not(.el-button--text, .el-button--primary, .is-disabled):hover {
|
||||
color: #eee;
|
||||
}
|
||||
|
||||
.x-friend-item:hover,
|
||||
.x-change-image-item:hover {
|
||||
background-color: var(--dv_background-modifier-hover);
|
||||
border-radius: var(--dv_lg-rounded);
|
||||
}
|
||||
|
||||
/* Favorites */
|
||||
.el-switch.is-checked .el-switch__core,
|
||||
span[class='el-switch__core'][style*='border-color'] {
|
||||
background-color: var(--dv_muted) !important;
|
||||
border-color: var(--dv_muted) !important;
|
||||
}
|
||||
|
||||
.el-switch__label.is-active {
|
||||
color: var(--dv_bright);
|
||||
}
|
||||
|
||||
.el-collapse-item__wrap {
|
||||
background-color: var(--dv_bg-top);
|
||||
border-bottom-color: transparent;
|
||||
}
|
||||
|
||||
/* Friend Log */
|
||||
table.el-table__body[style^='width:']
|
||||
tr[class='el-table__row']:hover
|
||||
td[class^='el-table_4_column_21'],
|
||||
table.el-table__body[style^='width:']
|
||||
tr[class='el-table__row el-table__row--striped']:hover
|
||||
td[class^='el-table_4_column_21'] {
|
||||
border-top-left-radius: var(--dv_md-rounded);
|
||||
border-bottom-left-radius: var(--dv_md-rounded);
|
||||
}
|
||||
|
||||
table.el-table__body[style^='width:']
|
||||
tr[class='el-table__row']:hover
|
||||
td[class^='el-table_4_column_24'],
|
||||
table.el-table__body[style^='width:']
|
||||
tr[class='el-table__row el-table__row--striped']:hover
|
||||
td[class^='el-table_4_column_24'] {
|
||||
border-top-right-radius: var(--dv_md-rounded);
|
||||
border-bottom-right-radius: var(--dv_md-rounded);
|
||||
}
|
||||
|
||||
/* Moderation */
|
||||
table.el-table__body[style^='width:']
|
||||
tr[class='el-table__row']:hover
|
||||
td[class^='el-table_4_column_25'],
|
||||
table.el-table__body[style^='width:']
|
||||
tr[class='el-table__row el-table__row--striped']:hover
|
||||
td[class^='el-table_4_column_25'] {
|
||||
border-top-right-radius: var(--dv_md-rounded);
|
||||
border-bottom-right-radius: var(--dv_md-rounded);
|
||||
}
|
||||
|
||||
/* Notification */
|
||||
table.el-table__body[style^='width:']
|
||||
tr[class='el-table__row']:hover
|
||||
td[class^='el-table_4_column_26'],
|
||||
table.el-table__body[style^='width:']
|
||||
tr[class='el-table__row el-table__row--striped']:hover
|
||||
td[class^='el-table_4_column_26'] {
|
||||
border-top-right-radius: var(--dv_md-rounded);
|
||||
border-bottom-right-radius: var(--dv_md-rounded);
|
||||
}
|
||||
|
||||
/* Profile */
|
||||
.el-tree {
|
||||
background-color: var(--dv_bg-bot);
|
||||
}
|
||||
|
||||
div[role='treeitem'][class*='is-focusable'] {
|
||||
background-color: var(--dv_bg-mid);
|
||||
}
|
||||
|
||||
.el-switch__core {
|
||||
background-color: var(--dv_bg-bot);
|
||||
}
|
||||
|
||||
.el-radio-group label,
|
||||
.el-radio-button__inner {
|
||||
background-color: var(--dv_bg-bot);
|
||||
border: none;
|
||||
border-radius: var(--dv_md-rounded);
|
||||
}
|
||||
|
||||
.el-radio-button__orig-radio:checked + .el-radio-button__inner {
|
||||
background-color: var(--dv_muted);
|
||||
border-color: var(--dv_muted);
|
||||
box-shadow: none;
|
||||
border-radius: var(--dv_md-rounded);
|
||||
}
|
||||
|
||||
.el-radio-button__inner:hover {
|
||||
color: #eee;
|
||||
background-color: var(--dv_background-modifier-hover);
|
||||
border-radius: var(--dv_md-rounded);
|
||||
}
|
||||
|
||||
div.options-container[style='margin-top: 45px; border-top: 1px solid rgb(238, 238, 238); padding-top: 30px;']:after {
|
||||
content: var(--ThemeName) ' v' var(--ThemeVers) ' by ' var(--ThemeAuth);
|
||||
color: var(--dv_bright);
|
||||
float: right;
|
||||
padding-bottom: 10px;
|
||||
padding-right: 10px;
|
||||
font-size: 18pt;
|
||||
}
|
||||
|
||||
.el-slider__bar {
|
||||
background-color: var(--dv_muted);
|
||||
}
|
||||
|
||||
.el-slider__button {
|
||||
border-color: var(--dv_muted);
|
||||
}
|
||||
|
||||
.el-dropdown-menu {
|
||||
background-color: var(--dv_bg-top);
|
||||
border: none;
|
||||
border-radius: var(--dv_lg-rounded);
|
||||
box-shadow: var(--shadow);
|
||||
}
|
||||
|
||||
.el-dropdown-menu__item:focus,
|
||||
.el-dropdown-menu__item:not(.is-disabled):hover {
|
||||
color: #eee;
|
||||
background-color: var(--dv_background-modifier-hover);
|
||||
border-radius: var(--dv_md-rounded);
|
||||
}
|
||||
|
||||
.el-input-number__decrease:hover,
|
||||
.el-input-number__increase:hover {
|
||||
color: var(--dv_bright);
|
||||
}
|
||||
|
||||
.el-dialog,
|
||||
.el-pager
|
||||
li:not(li.number, li[class*='btn-quicknext'], li[class*='btn-quickprev']) {
|
||||
background-color: var(--dv_bg-top);
|
||||
border: none;
|
||||
border-radius: var(--dv_lg-rounded);
|
||||
box-shadow: var(--shadow);
|
||||
}
|
||||
|
||||
.el-button--primary {
|
||||
background-color: var(--dv_muted);
|
||||
border-color: var(--dv_muted);
|
||||
border-radius: var(--dv_md-rounded);
|
||||
}
|
||||
|
||||
.el-button--primary:focus,
|
||||
.el-button--primary:hover {
|
||||
background-color: rgba(var(--dv_muted-rgb), 0.6);
|
||||
border-color: var(--dv_muted);
|
||||
}
|
||||
|
||||
.el-textarea__inner {
|
||||
background-color: var(--dv_bg-bot);
|
||||
}
|
||||
|
||||
.el-textarea__inner:hover {
|
||||
background-color: var(--dv_bg-mid);
|
||||
}
|
||||
|
||||
.el-textarea .el-input__count {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.el-popover {
|
||||
background-color: var(--dv_bg-top);
|
||||
border: none;
|
||||
border-radius: var(--dv_lg-rounded);
|
||||
box-shadow: var(--shadow);
|
||||
color: #ddd;
|
||||
}
|
||||
|
||||
.el-popover {
|
||||
background-color: var(--dv_bg-top) !important;
|
||||
border-color: var(--dv_bg-mid) !important;
|
||||
}
|
||||
|
||||
.el-popper[x-placement^='top'] .popper__arrow {
|
||||
border-top-color: var(--dv_bg-top) !important;
|
||||
}
|
||||
|
||||
.el-popper[x-placement^='top'] .popper__arrow::after {
|
||||
border-top-color: var(--dv_bg-top) !important;
|
||||
}
|
||||
|
||||
.el-popper[x-placement^='bottom'] .popper__arrow {
|
||||
border-bottom-color: var(--dv_bg-top) !important;
|
||||
}
|
||||
|
||||
.el-popper[x-placement^='bottom'] .popper__arrow::after {
|
||||
border-bottom-color: var(--dv_bg-top) !important;
|
||||
}
|
||||
|
||||
.el-popper[x-placement^='left'] .popper__arrow {
|
||||
border-left-color: var(--dv_bg-top) !important;
|
||||
}
|
||||
|
||||
.el-popper[x-placement^='left'] .popper__arrow::after {
|
||||
border-left-color: var(--dv_bg-top) !important;
|
||||
}
|
||||
|
||||
.el-popper[x-placement^='right'] .popper__arrow {
|
||||
border-right-color: var(--dv_bg-top) !important;
|
||||
}
|
||||
|
||||
.el-popper[x-placement^='right'] .popper__arrow::after {
|
||||
border-right-color: var(--dv_bg-top) !important;
|
||||
}
|
||||
|
||||
img.x-link,
|
||||
img.friends-list-avatar {
|
||||
border-radius: var(--dv_lg-rounded) !important;
|
||||
}
|
||||
|
||||
.el-tag--small {
|
||||
height: 30px;
|
||||
padding: 5px 15px;
|
||||
font-size: 10pt;
|
||||
border-radius: var(--dv_md-rounded);
|
||||
}
|
||||
|
||||
.el-tag,
|
||||
.el-tag.el-tag--success,
|
||||
.el-tag.el-tag--info,
|
||||
.el-tag.el-tag--warning,
|
||||
.el-tag.el-tag--danger {
|
||||
background-color: var(--dv_bg-bot);
|
||||
}
|
||||
|
||||
.el-tag--plain.el-tag--warning,
|
||||
.el-tag--plain.el-tag--danger,
|
||||
.el-tag--plain {
|
||||
background-color: var(--dv_bg-mid);
|
||||
}
|
||||
|
||||
.el-tag--plain.el-tag--info {
|
||||
color: #eee;
|
||||
}
|
||||
|
||||
.el-tabs__active-bar {
|
||||
background-color: var(--dv_muted);
|
||||
}
|
||||
|
||||
.el-input--small .el-textarea__inner:hover {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
i[class='el-icon-delete'],
|
||||
i[class='el-icon-switch-button'],
|
||||
.el-dropdown-menu--small
|
||||
.el-dropdown-menu__item.el-dropdown-menu__item--divided:has(
|
||||
i[class='el-icon-switch-button']
|
||||
) {
|
||||
color: #f56c6c;
|
||||
}
|
||||
|
||||
i[class='el-icon-star-off']:not(.el-menu-item div.el-tooltip i) {
|
||||
color: #ffd000;
|
||||
}
|
||||
|
||||
.el-dropdown-menu__item--divided {
|
||||
border-color: rgba(255, 255, 255, 0.5);
|
||||
}
|
||||
|
||||
.el-dropdown-menu__item--divided::before {
|
||||
background-color: var(--dv_bg-top);
|
||||
}
|
||||
|
||||
.el-tab-pane .el-radio-group[style^='margin-left: '] label {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
.el-radio__input.is-checked + .el-radio__label {
|
||||
color: var(--dv_bright);
|
||||
}
|
||||
|
||||
.el-radio__input.is-checked .el-radio__inner {
|
||||
border-color: var(--dv_bright);
|
||||
background-color: var(--dv_bright);
|
||||
}
|
||||
|
||||
.el-input-group__append,
|
||||
.el-input-group__prepend {
|
||||
background-color: var(--dv_bg-mid);
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.el-input-group__append:hover {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.el-dialog__headerbtn:focus .el-dialog__close,
|
||||
.el-dialog__headerbtn:hover .el-dialog__close {
|
||||
color: var(--dv_bright);
|
||||
}
|
||||
|
||||
.x-aside-container {
|
||||
background-color: var(--dv_bg-bot);
|
||||
background: linear-gradient(
|
||||
180deg,
|
||||
var(--dv_bg-top) 0%,
|
||||
var(--dv_bg-bot) 25%,
|
||||
var(--dv_bg-bot) 100%
|
||||
);
|
||||
border-top-left-radius: 2rem;
|
||||
border-bottom-left-radius: var(--dv_lg-rounded);
|
||||
}
|
||||
|
||||
.el-dialog__wrapper[style^='z-index: '] {
|
||||
background-color: rgba(0, 0, 0, 0.4);
|
||||
}
|
||||
|
||||
.v-modal {
|
||||
background: none;
|
||||
}
|
||||
|
||||
.noty_theme__mint.noty_type__error,
|
||||
.noty_theme__mint.noty_type__success,
|
||||
.noty_theme__mint.noty_type__alert,
|
||||
.noty_theme__mint.noty_type__notification,
|
||||
.noty_theme__mint.noty_type__warning,
|
||||
.noty_theme__mint.noty_type__info,
|
||||
.noty_theme__mint.noty_type__information {
|
||||
border-radius: var(--dv_lg-rounded);
|
||||
box-shadow: var(--shadow);
|
||||
}
|
||||
|
||||
.noty_theme__mint.noty_type__success {
|
||||
color: #fff;
|
||||
background-color: var(--dv_muted);
|
||||
border-bottom: 1px solid var(--dv_bright);
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background: var(--dv_bg-mid);
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: var(--dv_bg-bot);
|
||||
}
|
||||
|
||||
// User dialog memo: input count background color
|
||||
.x-friend-item:hover .el-input__count {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.el-collapse-item .el-tag--small {
|
||||
border: transparent;
|
||||
background-color: var(--dv_bg-bot);
|
||||
}
|
||||
.el-color-picker__panel {
|
||||
background-color: var(--dv_bg-top);
|
||||
}
|
||||
.el-divider {
|
||||
background-color: #606266;
|
||||
}
|
||||
.el-divider__text {
|
||||
background: var(--dv_bg-top);
|
||||
color: #efefef;
|
||||
padding-bottom: 2px;
|
||||
}
|
||||
.el-backtop {
|
||||
background-color: var(--dv_bg-top);
|
||||
color: var(--dv_muted);
|
||||
}
|
||||
|
||||
// Date picker
|
||||
.el-date-picker {
|
||||
background-color: var(--dv_bg-top);
|
||||
}
|
||||
.el-date-table td.current:not(.disabled) span {
|
||||
background-color: var(--dv_muted);
|
||||
}
|
||||
.el-date-table td.today span {
|
||||
color: var(--dv_muted);
|
||||
}
|
||||
.el-date-table td.available:hover span {
|
||||
background-color: var(--dv_muted);
|
||||
color: #fff;
|
||||
}
|
||||
.el-date-table td.available:hover {
|
||||
color: #fff;
|
||||
}
|
||||
.el-year-table td .cell:hover,
|
||||
.el-year-table td.current:not(.disabled) .cell {
|
||||
color: var(--dv_muted);
|
||||
}
|
||||
.el-month-table td.current:not(.disabled) .cell {
|
||||
color: var(--dv_muted);
|
||||
}
|
||||
.el-date-picker__header-label.active,
|
||||
.el-date-picker__header-label:hover {
|
||||
color: var(--dv_muted);
|
||||
}
|
||||
.el-picker-panel__icon-btn:hover {
|
||||
color: var(--dv_muted);
|
||||
}
|
||||
// Date picker end
|
||||
|
||||
div.x-friend-list
|
||||
> div:nth-child(1)
|
||||
> div
|
||||
> div.el-textarea.el-input--small
|
||||
> span.el-input__count {
|
||||
background-color: var(--mid) !important;
|
||||
}
|
||||
|
||||
:root {
|
||||
--group-calendar-event-bg: rgba(var(--dv_bright-rgb), 0.1);
|
||||
--group-calendar-badge-following: var(--dv_muted);
|
||||
--group-calendar-badge-normal: var(--dv_bright);
|
||||
}
|
||||
|
||||
.el-calendar {
|
||||
background-color: var(--dv_bg-top) !important;
|
||||
}
|
||||
|
||||
.el-calendar__title {
|
||||
color: var(--dv_bright) !important;
|
||||
}
|
||||
|
||||
.el-card {
|
||||
background-color: var(--dv_bg-mid) !important;
|
||||
border-color: var(--dv_bg-bot) !important;
|
||||
}
|
||||
|
||||
.el-descriptions__body {
|
||||
background-color: var(--dv_bg-top) !important;
|
||||
color: var(--dv_bright) !important;
|
||||
}
|
||||
|
||||
.el-timeline-item__tail {
|
||||
border-left-color: var(--dv_muted) !important;
|
||||
}
|
||||
|
||||
.el-timeline-item__node {
|
||||
background-color: var(--dv_muted) !important;
|
||||
}
|
||||
|
||||
// Group Calendar Dialog borders
|
||||
.search-container {
|
||||
border-bottom: 1px solid var(--dv_muted) !important;
|
||||
}
|
||||
|
||||
.group-header {
|
||||
border-bottom: 2px solid var(--dv_muted) !important;
|
||||
}
|
||||
|
||||
.el-select__wrapper {
|
||||
background-color: var(--dv_bg-top) !important;
|
||||
border: 1px solid var(--dv_muted) !important;
|
||||
color: var(--dv_bright);
|
||||
}
|
||||
|
||||
.el-select__wrapper.is-focused {
|
||||
border-color: var(--dv_bright) !important;
|
||||
}
|
||||
|
||||
.el-select__wrapper.is-disabled {
|
||||
background-color: var(--dv_bg-bot) !important;
|
||||
color: var(--dv_muted) !important;
|
||||
}
|
||||
|
||||
.el-input__wrapper {
|
||||
background-color: var(--dv_bg-top) !important;
|
||||
border: 1px solid var(--dv_muted) !important;
|
||||
}
|
||||
|
||||
.el-input__wrapper.is-focus {
|
||||
border-color: var(--dv_bright) !important;
|
||||
}
|
||||
@@ -1,428 +0,0 @@
|
||||
/*
|
||||
* VRCX Dark-Vanilla theme by MintLily
|
||||
* https://github.com/MintLily/Dark-Vanilla
|
||||
*/
|
||||
|
||||
:root {
|
||||
--ThemeName: 'Dark Vanilla';
|
||||
--ThemeVersion: 'v1.7';
|
||||
--ThemeAuthor: 'MintLily'; /* Discord: MintLily#0001 */
|
||||
|
||||
--blur: 3px;
|
||||
--blur-more: 8px;
|
||||
--farback: #131719;
|
||||
--mid: #191f22;
|
||||
--top: #1e2427;
|
||||
--top-border: #151a1c;
|
||||
--theme-text: #eecce0;
|
||||
--theme-text-muted: #906d92;
|
||||
--theme-text-rgb: 238, 204, 224;
|
||||
--theme-text-muted-rgb: 144, 109, 146;
|
||||
|
||||
--group-calendar-event-bg: rgba(var(--theme-text-muted-rgb), 0.1);
|
||||
--group-calendar-badge-following: var(--theme-text-muted);
|
||||
--group-calendar-badge-normal: var(--theme-text);
|
||||
}
|
||||
|
||||
div.options-container[style='margin-top: 45px; border-top: 1px solid rgb(238, 238, 238); padding-top: 30px;']:after {
|
||||
content: var(--ThemeName) ' ' var(--ThemeVersion) ' by ' var(--ThemeAuthor);
|
||||
color: var(--theme-text);
|
||||
float: right;
|
||||
padding-bottom: 10px;
|
||||
padding-right: 10px;
|
||||
}
|
||||
|
||||
a {
|
||||
color: var(--theme-text) !important;
|
||||
}
|
||||
.x-menu-container {
|
||||
background: var(--top) !important;
|
||||
}
|
||||
.x-container {
|
||||
background: var(--farback) !important;
|
||||
}
|
||||
.x-aside-container {
|
||||
background: var(--mid) !important;
|
||||
}
|
||||
|
||||
.el-tooltip__popper.is-dark {
|
||||
background: rgba(var(--theme-text-muted-rgb), 0.2) !important;
|
||||
backdrop-filter: blur(var(--blur));
|
||||
}
|
||||
|
||||
.el-menu-item:focus,
|
||||
.el-menu-item:hover {
|
||||
background: var(--theme-text-muted) !important;
|
||||
}
|
||||
.el-menu-item.is-active {
|
||||
color: var(--theme-text) !important;
|
||||
}
|
||||
.el-menu-item.is-active::before {
|
||||
background: var(--theme-text) !important;
|
||||
}
|
||||
.el-menu-item.notify::after {
|
||||
background: var(--theme-text) !important;
|
||||
}
|
||||
.el-collapse-item__content,
|
||||
.el-collapse-item__wrap {
|
||||
background: var(--mid) !important;
|
||||
}
|
||||
|
||||
.el-button:not(.el-button--text, .el-button--primary, .is-disabled) {
|
||||
background: var(--top) !important;
|
||||
border: var(--top-border) !important;
|
||||
}
|
||||
|
||||
.el-input__inner,
|
||||
.el-textarea__inner,
|
||||
.el-textarea .el-input__count,
|
||||
.el-input .el-input__count .el-input__count-inner {
|
||||
background: transparent;
|
||||
border: var(--top-border) !important;
|
||||
}
|
||||
|
||||
// User dialog memo: input count background color
|
||||
.x-friend-item:hover .el-input__count {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.el-table th.is-leaf {
|
||||
background: var(--top) !important;
|
||||
/*border: 1px solid var(--top-border) !important;*/
|
||||
}
|
||||
|
||||
.el-table td,
|
||||
.el-table th.is-leaf {
|
||||
background: var(--top) !important;
|
||||
}
|
||||
.el-table--striped .el-table__body tr.el-table__row--striped td {
|
||||
background: var(--mid) !important;
|
||||
}
|
||||
|
||||
.el-dialog,
|
||||
.el-pager li,
|
||||
.el-pagination .btn-next,
|
||||
.el-pagination .btn-prev {
|
||||
background: var(--mid) !important;
|
||||
}
|
||||
.el-pager li.active {
|
||||
color: var(--theme-text) !important;
|
||||
}
|
||||
.el-pager li.btn-quicknext,
|
||||
.el-pager li.btn-quickprev {
|
||||
color: var(--theme-text-muted) !important;
|
||||
}
|
||||
.el-pager li:hover,
|
||||
.el-pagination button:hover {
|
||||
color: var(--theme-text) !important;
|
||||
}
|
||||
|
||||
.x-friend-item:hover,
|
||||
.x-change-image-item:hover {
|
||||
background: var(--theme-text-muted) !important;
|
||||
}
|
||||
|
||||
.el-popover,
|
||||
.el-dropdown-menu {
|
||||
background: var(--top) !important;
|
||||
border: var(--top-border) !important;
|
||||
}
|
||||
|
||||
.el-select-dropdown {
|
||||
background: var(--top) !important;
|
||||
border: var(--top-border) !important;
|
||||
}
|
||||
|
||||
.el-button:not(.el-button--text, .el-button--primary, .is-disabled) {
|
||||
background: var(--mid) !important;
|
||||
}
|
||||
.el-button:not(.el-button--text, .el-button--primary, .is-disabled):focus,
|
||||
.el-button:not(.el-button--text, .el-button--primary, .is-disabled):hover {
|
||||
background: var(--farback) !important;
|
||||
border: var(--top-border) !important;
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
.el-tree,
|
||||
.el-message-box {
|
||||
background: rgba(38, 50, 56, 0.2) !important;
|
||||
border-color: rgba(38, 50, 56, 0.2) !important;
|
||||
backdrop-filter: blur(var(--blur));
|
||||
}
|
||||
.el-tree-node__content:hover {
|
||||
background: rgba(58, 69, 74, 0.6) !important;
|
||||
backdrop-filter: blur(var(--blur-more));
|
||||
}
|
||||
.el-tree-node:focus > .el-tree-node__content {
|
||||
background: rgba(0, 0, 0, 0.4) !important;
|
||||
}
|
||||
|
||||
.el-tabs__item.is-active,
|
||||
.el-radio__input.is-checked + .el-radio__label {
|
||||
color: var(--theme-text) !important;
|
||||
}
|
||||
.el-tabs__active-bar {
|
||||
background-color: var(--theme-text) !important;
|
||||
}
|
||||
.el-tabs__item:hover {
|
||||
color: var(--theme-text-muted) !important;
|
||||
}
|
||||
.el-radio__input.is-checked .el-radio__inner {
|
||||
border-color: var(--theme-text) !important;
|
||||
background: var(--theme-text) !important;
|
||||
}
|
||||
.el-radio__inner:hover {
|
||||
border-color: var(--theme-text) !important;
|
||||
}
|
||||
|
||||
.el-checkbox__input.is-checked + .el-checkbox__label {
|
||||
color: var(--theme-text-muted) !important;
|
||||
}
|
||||
.el-checkbox__input.is-checked .el-checkbox__inner,
|
||||
.el-checkbox__input.is-indeterminate .el-checkbox__inner {
|
||||
border-color: var(--theme-text-muted) !important;
|
||||
background: var(--theme-text-muted) !important;
|
||||
}
|
||||
|
||||
.el-icon-star-on {
|
||||
color: var(--theme-text) !important;
|
||||
}
|
||||
|
||||
.el-tag,
|
||||
.el-tag.el-tag--success,
|
||||
.el-tag.el-tag--info,
|
||||
.el-tag.el-tag--warning,
|
||||
.el-tag.el-tag--danger {
|
||||
background: var(--farback) !important;
|
||||
}
|
||||
|
||||
.el-loading-spinner .path {
|
||||
stroke: var(--theme-text) !important;
|
||||
}
|
||||
|
||||
.noty_theme__mint.noty_type__success {
|
||||
background-color: var(--theme-text-muted) !important;
|
||||
border-bottom: var(--theme-text) !important;
|
||||
}
|
||||
|
||||
.noty_theme__mint.noty_type__error {
|
||||
background-color: rgba(0, 0, 0, 0) !important;
|
||||
}
|
||||
|
||||
.el-button--primary {
|
||||
border-color: var(--theme-text) !important;
|
||||
background: var(--theme-text) !important;
|
||||
color: black !important;
|
||||
}
|
||||
.el-button--primary:focus,
|
||||
.el-button--primary:hover {
|
||||
border-color: var(--theme-text-muted) !important;
|
||||
background: var(--theme-text-muted) !important;
|
||||
color: var(--theme-text) !important;
|
||||
}
|
||||
|
||||
.el-button:not(.el-button--text, .el-button--primary, .is-disabled):focus,
|
||||
.el-button:not(.el-button--text, .el-button--primary, .is-disabled):hover {
|
||||
border-color: var(--theme-text-muted) !important;
|
||||
background: var(--theme-text-muted) !important;
|
||||
color: var(--theme-text) !important;
|
||||
}
|
||||
|
||||
.el-radio-button__inner {
|
||||
background-color: var(--top) !important;
|
||||
border-color: var(--top) !important;
|
||||
}
|
||||
.el-radio-button__inner:hover {
|
||||
color: var(--theme-text) !important;
|
||||
}
|
||||
.el-radio-button__orig-radio:checked + .el-radio-button__inner {
|
||||
background-color: var(--theme-text-muted) !important;
|
||||
border-color: var(--theme-text-muted) !important;
|
||||
box-shadow: -1px 0 0 0 var(--theme-text-muted) !important;
|
||||
}
|
||||
.el-switch.is-checked .el-switch__core {
|
||||
background-color: var(--theme-text-muted) !important;
|
||||
border-color: var(--theme-text-muted) !important;
|
||||
}
|
||||
.el-switch__label.is-active {
|
||||
color: var(--theme-text) !important;
|
||||
}
|
||||
.el-tag {
|
||||
background: var(--farback);
|
||||
border-color: var(--farback);
|
||||
color: var(--theme-text);
|
||||
}
|
||||
.el-tabs--card > .el-tabs__header .el-tabs__item.is-active {
|
||||
border-bottom-color: var(--theme-text);
|
||||
}
|
||||
|
||||
.toggle-switch li[data-v-3cf97114] > label {
|
||||
background-color: var(--top) !important;
|
||||
border-color: var(--top) !important;
|
||||
color: lightgrey !important;
|
||||
}
|
||||
|
||||
.toggle-switch li[data-v-3cf97114] > label:hover {
|
||||
background-color: var(--mid) !important;
|
||||
border-color: var(--mid) !important;
|
||||
color: var(--theme-text-muted) !important;
|
||||
}
|
||||
|
||||
.toggle-switch li[data-v-3cf97114] > label.selected {
|
||||
background-color: var(--mid) !important;
|
||||
border-color: var(--mid) !important;
|
||||
color: var(--theme-text) !important;
|
||||
}
|
||||
|
||||
.el-slider__bar {
|
||||
background-color: var(--theme-text-muted) !important;
|
||||
}
|
||||
.el-slider__button {
|
||||
border-color: var(--theme-text-muted) !important;
|
||||
}
|
||||
|
||||
.el-table .ascending .sort-caret.ascending {
|
||||
border-bottom-color: var(--theme-text) !important;
|
||||
}
|
||||
.el-table .descending .sort-caret.descending {
|
||||
border-top-color: var(--theme-text) !important;
|
||||
}
|
||||
|
||||
.el-select-dropdown__item.selected {
|
||||
color: var(--theme-text);
|
||||
}
|
||||
.el-select-dropdown__item.hover,
|
||||
.el-select-dropdown__item:hover {
|
||||
background-color: var(--farback);
|
||||
}
|
||||
|
||||
.el-dropdown-menu__item:focus,
|
||||
.el-dropdown-menu__item:not(.is-disabled):hover {
|
||||
background-color: var(--farback);
|
||||
color: var(--theme-text);
|
||||
}
|
||||
|
||||
.el-dialog__headerbtn:focus .el-dialog__close,
|
||||
.el-dialog__headerbtn:hover .el-dialog__close {
|
||||
color: var(--theme-text);
|
||||
}
|
||||
|
||||
.el-progress-bar__inner {
|
||||
background-color: var(--theme-text);
|
||||
}
|
||||
.el-progress-bar__outer {
|
||||
background-color: var(--farback);
|
||||
}
|
||||
.el-button--text:focus,
|
||||
.el-button--text:hover {
|
||||
color: var(--theme-text);
|
||||
}
|
||||
|
||||
path[stroke='#20a0ff'] {
|
||||
stroke: var(--theme-text) !important;
|
||||
}
|
||||
path[stroke='#e5e9f2'] {
|
||||
stroke: var(--farback) !important;
|
||||
}
|
||||
|
||||
.el-collapse-item .el-tag--small {
|
||||
border: transparent;
|
||||
background-color: #333 !important;
|
||||
}
|
||||
.el-divider {
|
||||
background-color: #606266;
|
||||
}
|
||||
.el-divider__text {
|
||||
background: var(--farback);
|
||||
color: #efefef;
|
||||
}
|
||||
.el-backtop {
|
||||
color: var(--theme-text-muted);
|
||||
}
|
||||
|
||||
// Date picker
|
||||
.el-date-table td.current:not(.disabled) span {
|
||||
background-color: var(--theme-text-muted);
|
||||
}
|
||||
.el-date-table td.today span {
|
||||
color: var(--theme-text-muted);
|
||||
}
|
||||
.el-date-table td.available:hover span {
|
||||
background-color: var(--theme-text-muted);
|
||||
color: #fff;
|
||||
}
|
||||
.el-date-table td.available:hover {
|
||||
color: #fff;
|
||||
}
|
||||
.el-year-table td .cell:hover,
|
||||
.el-year-table td.current:not(.disabled) .cell {
|
||||
color: var(--theme-text-muted);
|
||||
}
|
||||
.el-month-table td.current:not(.disabled) .cell {
|
||||
color: var(--theme-text-muted);
|
||||
}
|
||||
.el-date-picker__header-label.active,
|
||||
.el-date-picker__header-label:hover {
|
||||
color: var(--theme-text-muted);
|
||||
}
|
||||
.el-picker-panel__icon-btn:hover {
|
||||
color: var(--theme-text-muted);
|
||||
}
|
||||
|
||||
div.x-friend-list
|
||||
> div:nth-child(1)
|
||||
> div
|
||||
> div.el-textarea.el-input--small
|
||||
> span.el-input__count {
|
||||
background-color: var(--mid) !important;
|
||||
}
|
||||
|
||||
.el-calendar {
|
||||
background-color: var(--mid) !important;
|
||||
}
|
||||
|
||||
.el-calendar__title {
|
||||
color: var(--theme-text) !important;
|
||||
}
|
||||
|
||||
.el-card {
|
||||
background-color: var(--top) !important;
|
||||
border-color: var(--top-border) !important;
|
||||
}
|
||||
|
||||
.el-descriptions__body {
|
||||
background-color: var(--top) !important;
|
||||
color: var(--theme-text) !important;
|
||||
}
|
||||
|
||||
.el-timeline-item__tail {
|
||||
border-left-color: var(--theme-text-muted) !important;
|
||||
}
|
||||
|
||||
.el-timeline-item__node {
|
||||
background-color: var(--theme-text-muted) !important;
|
||||
}
|
||||
|
||||
.el-select__wrapper {
|
||||
background-color: var(--top) !important;
|
||||
border: 1px solid var(--top-border) !important;
|
||||
color: var(--theme-text);
|
||||
}
|
||||
|
||||
.el-select__wrapper.is-focused {
|
||||
border-color: var(--theme-text) !important;
|
||||
}
|
||||
|
||||
.el-select__wrapper.is-disabled {
|
||||
background-color: var(--farback) !important;
|
||||
color: var(--theme-text-muted) !important;
|
||||
}
|
||||
|
||||
.el-input__wrapper {
|
||||
background-color: var(--top) !important;
|
||||
border: 1px solid var(--top-border) !important;
|
||||
}
|
||||
|
||||
.el-input__wrapper.is-focus {
|
||||
border-color: var(--theme-text) !important;
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
@@ -1,550 +0,0 @@
|
||||
/*
|
||||
* VRCX Pink theme by Kamiya
|
||||
* https://github.com/kamiya10/VRCX-theme
|
||||
*/
|
||||
|
||||
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;700&display=swap');
|
||||
:root {
|
||||
--theme: #dfa2a2;
|
||||
--bg: #322525;
|
||||
--light-bg: #443030;
|
||||
--lighter-bg: #554040;
|
||||
--lighter-lighter-bg: #655050;
|
||||
--lighter-lighter-lighter-bg: #756060;
|
||||
--lighter-lighter-lighter-lighter-bg: #857070;
|
||||
--lighter-border: #aa6065;
|
||||
--font:
|
||||
'Poppins', 'Noto Sans JP Variable', 'Noto Sans KR Variable', 'Noto Sans TC Variable',
|
||||
'Noto Sans SC Variable', sans-serif;
|
||||
|
||||
--group-calendar-event-bg: rgba(223, 162, 162, 0.1);
|
||||
--group-calendar-badge-following: var(--theme);
|
||||
--group-calendar-badge-normal: var(--lighter-border);
|
||||
}
|
||||
body,
|
||||
button,
|
||||
input,
|
||||
select,
|
||||
textarea {
|
||||
font-family: var(--font);
|
||||
}
|
||||
.el-collapse-item__wrap,
|
||||
.el-table td.el-table__cell,
|
||||
.el-table th.el-table__cell,
|
||||
.el-table tr,
|
||||
.el-table--striped .el-table__body tr.el-table__row--striped td.el-table__cell {
|
||||
background-color: transparent;
|
||||
}
|
||||
.el-table--small.el-table__expanded-cell[class*='cell']:hover {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
.el-button.is-disabled,
|
||||
.el-button.is-disabled:focus,
|
||||
.el-button.is-disabled:hover,
|
||||
.el-pagination .btn-next,
|
||||
.el-pagination .btn-prev,
|
||||
.el-switch__core,
|
||||
.el-tree,
|
||||
.x-aside-container,
|
||||
.x-container,
|
||||
.x-login-container {
|
||||
background-color: var(--bg);
|
||||
}
|
||||
.el-pager li,
|
||||
.el-pager li.btn-quicknext,
|
||||
.el-pager li.btn-quickprev {
|
||||
color: #cbb;
|
||||
transition: color ease-in-out 0.1s;
|
||||
}
|
||||
.el-pager li:hover {
|
||||
color: #fff;
|
||||
}
|
||||
.el-tree-node:focus > .el-tree-node__content,
|
||||
.el-tree-node__content:hover {
|
||||
background-color: var(--light-bg);
|
||||
}
|
||||
.el-button:not(.el-button--text, .el-button--primary, .is-disabled),
|
||||
.el-color-picker__panel,
|
||||
.el-dialog,
|
||||
.el-input .el-input__count .el-input__count-inner,
|
||||
.el-input__inner,
|
||||
.el-message-box,
|
||||
.el-pager li,
|
||||
.el-radio-button__inner,
|
||||
.el-select-dropdown,
|
||||
.el-textarea .el-input__count,
|
||||
.el-textarea__inner,
|
||||
.x-menu-container {
|
||||
background-color: var(--lighter-bg) !important;
|
||||
}
|
||||
.el-color-picker__panel {
|
||||
border-color: var(--lighter-bg);
|
||||
}
|
||||
.el-button,
|
||||
.el-radio-button__inner {
|
||||
color: #dcc;
|
||||
}
|
||||
.el-button:not(.el-button--text, .el-button--primary, .is-disabled):focus,
|
||||
.el-button:not(.el-button--text, .el-button--primary, .is-disabled):hover,
|
||||
.el-dropdown-menu,
|
||||
.x-change-image-item:hover,
|
||||
.x-friend-item:hover {
|
||||
background-color: var(--lighter-lighter-bg);
|
||||
color: #fff;
|
||||
}
|
||||
.el-button--primary {
|
||||
background-color: var(--theme);
|
||||
border-color: var(--theme);
|
||||
color: #fff;
|
||||
}
|
||||
.el-tooltip__popper.is-dark {
|
||||
background-color: var(--lighter-lighter-lighter-bg);
|
||||
}
|
||||
.el-button--primary:focus,
|
||||
.el-button--primary:hover {
|
||||
background-color: var(--lighter-lighter-lighter-lighter-bg);
|
||||
border-color: var(--lighter-lighter-lighter-lighter-bg);
|
||||
}
|
||||
.el-dialog,
|
||||
.el-dropdown-menu,
|
||||
.el-tooltip__popper.is-dark {
|
||||
box-shadow:
|
||||
0 3px 6px rgba(0, 0, 0, 0.16),
|
||||
0 3px 6px rgba(0, 0, 0, 0.23);
|
||||
}
|
||||
.el-dropdown-menu__item,
|
||||
.x-friend-item {
|
||||
transition:
|
||||
background-color ease-in-out 0.1s,
|
||||
color ease-in-out 0.1s;
|
||||
}
|
||||
.el-dropdown-menu__item:focus,
|
||||
.el-dropdown-menu__item:not(.is-disabled):hover {
|
||||
color: #fff;
|
||||
background-color: var(--lighter-lighter-lighter-bg);
|
||||
}
|
||||
.el-popper[x-placement^='bottom'] .popper__arrow,
|
||||
.el-popper[x-placement^='bottom'] .popper__arrow::after,
|
||||
.el-table th.el-table__cell,
|
||||
.el-table th.el-table__cell.is-leaf {
|
||||
border-bottom-color: var(--lighter-lighter-bg);
|
||||
}
|
||||
.el-table td.el-table__cell,
|
||||
.el-table tr {
|
||||
border-color: transparent;
|
||||
}
|
||||
.el-popper .popper__arrow,
|
||||
.el-popper .popper__arrow::after,
|
||||
.el-popper[x-placement^='top'] .popper__arrow,
|
||||
.el-popper[x-placement^='top'] .popper__arrow::after {
|
||||
border-top-color: var(--lighter-lighter-bg);
|
||||
}
|
||||
.el-dropdown-menu__item--divided::before,
|
||||
.el-menu-item:focus,
|
||||
.el-menu-item:hover,
|
||||
.el-select-dropdown__item.hover,
|
||||
.el-select-dropdown__item:hover,
|
||||
.el-table--enable-row-hover .el-table__body tr:hover > td.el-table__cell {
|
||||
background-color: var(--lighter-lighter-bg);
|
||||
}
|
||||
.el-input .el-input__count .el-input__count-inner,
|
||||
.el-input__inner,
|
||||
.el-textarea .el-input__count,
|
||||
.el-textarea__inner {
|
||||
border: var(--lighter-border);
|
||||
}
|
||||
.el-input-number {
|
||||
background-color: var(--lighter-bg);
|
||||
border: 1px solid #404040;
|
||||
border-radius: 5px;
|
||||
}
|
||||
.el-input-number__decrease {
|
||||
border-right: 1px solid #404040;
|
||||
}
|
||||
.el-input-number__increase {
|
||||
border-left: 1px solid #404040;
|
||||
}
|
||||
.el-dropdown-menu__item--divided {
|
||||
border-top: 2px solid var(--lighter-lighter-lighter-lighter-bg);
|
||||
}
|
||||
.el-radio-button__inner {
|
||||
border: 1px solid var(--lighter-lighter-bg);
|
||||
}
|
||||
.el-checkbox__input.is-checked + .el-checkbox__label,
|
||||
.el-menu-item.is-active,
|
||||
.el-pagination .btn-next:not(:disabled):hover .el-icon,
|
||||
.el-pagination .btn-prev:not(:disabled):hover .el-icon,
|
||||
.el-radio__input.is-checked + .el-radio__label,
|
||||
.el-select-dropdown.is-multiple .el-select-dropdown__item.selected,
|
||||
.el-tabs__item.is-active {
|
||||
color: var(--theme);
|
||||
transition: color ease-in-out 0.1s;
|
||||
}
|
||||
.el-pager .number:first-child {
|
||||
border-top-left-radius: 10px;
|
||||
border-bottom-left-radius: 10px;
|
||||
}
|
||||
.el-pager .number:last-child {
|
||||
border-top-right-radius: 10px;
|
||||
border-bottom-right-radius: 10px;
|
||||
}
|
||||
.el-menu-item i,
|
||||
.el-tabs__item,
|
||||
i.el-icon-close:hover {
|
||||
color: #cbb;
|
||||
transition: color ease-in-out 0.1s;
|
||||
}
|
||||
.el-button--text:focus,
|
||||
.el-button--text:hover,
|
||||
.el-tabs__item:hover {
|
||||
color: #fff;
|
||||
}
|
||||
.el-slider__bar,
|
||||
.el-tabs__active-bar {
|
||||
background-color: var(--theme);
|
||||
}
|
||||
.el-slider__button {
|
||||
border: 2px solid var(--theme);
|
||||
}
|
||||
.el-checkbox__input.is-checked .el-checkbox__inner,
|
||||
.el-checkbox__input.is-indeterminate .el-checkbox__inner,
|
||||
.el-radio-button__orig-radio:checked + .el-radio-button__inner,
|
||||
.el-radio__input.is-checked .el-radio__inner,
|
||||
.el-switch.is-checked .el-switch__core {
|
||||
background-color: var(--theme);
|
||||
border-color: var(--theme);
|
||||
}
|
||||
.el-radio-button__orig-radio:checked + .el-radio-button__inner {
|
||||
box-shadow: -1px 0 0 0 var(--theme);
|
||||
}
|
||||
.el-radio-button__orig-radio:checked + .el-radio-button__inner:hover {
|
||||
color: #fff;
|
||||
}
|
||||
.el-pager li.active,
|
||||
.el-radio-button__inner:not(.is-disabled):hover,
|
||||
.el-select-dropdown__item.selected,
|
||||
.el-switch__label.is-active {
|
||||
color: var(--theme);
|
||||
}
|
||||
.el-tag.el-tag--info {
|
||||
color: #baa;
|
||||
}
|
||||
|
||||
.el-tag,
|
||||
.el-tag.el-tag--success,
|
||||
.el-tag.el-tag--info,
|
||||
.el-tag.el-tag--warning,
|
||||
.el-tag.el-tag--danger {
|
||||
background-color: var(--lighter-lighter-bg);
|
||||
border: 1px solid var(--lighter-lighter-lighter-lighter-bg);
|
||||
}
|
||||
|
||||
.el-collapse-item__header > span + span,
|
||||
.el-form-item__label,
|
||||
.el-pagination__total,
|
||||
.el-table th.el-table__cell > .cell,
|
||||
.el-table__expand-icon > .el-icon,
|
||||
.x-login-container div[style='text-align: center; font-size: 12px;'] > * {
|
||||
color: #baa !important;
|
||||
}
|
||||
.el-table .ascending .sort-caret.ascending {
|
||||
border-bottom-color: var(--theme);
|
||||
}
|
||||
.el-table .descending .sort-caret.descending {
|
||||
border-top-color: var(--theme);
|
||||
}
|
||||
.el-pagination button:disabled,
|
||||
.el-pagination button:disabled:focus,
|
||||
.el-pagination button:disabled:hover {
|
||||
background-color: transparent;
|
||||
color: transparent !important;
|
||||
}
|
||||
.el-table--border::after,
|
||||
.el-table--group::after,
|
||||
.el-table::before,
|
||||
.el-tabs__nav-wrap::after {
|
||||
background-color: transparent;
|
||||
}
|
||||
.options-container-item .name {
|
||||
color: #eeeaea;
|
||||
}
|
||||
.el-tabs--card > .el-tabs__header,
|
||||
.el-tabs--card > .el-tabs__header .el-tabs__item,
|
||||
.el-tabs--card > .el-tabs__header .el-tabs__item.is-active,
|
||||
.el-tabs--card > .el-tabs__header .el-tabs__nav {
|
||||
border-color: transparent;
|
||||
}
|
||||
.options-container .header,
|
||||
h2 {
|
||||
color: #faeeee;
|
||||
}
|
||||
.options-container .sub-header {
|
||||
color: #988;
|
||||
}
|
||||
.el-table__row td:first-child {
|
||||
padding-left: 5px;
|
||||
border-top-left-radius: 10px;
|
||||
border-bottom-left-radius: 10px;
|
||||
}
|
||||
.el-table__row td:last-child {
|
||||
border-top-right-radius: 10px;
|
||||
border-bottom-right-radius: 10px;
|
||||
}
|
||||
.el-select-dropdown {
|
||||
border-color: var(--lighter-bg);
|
||||
}
|
||||
.el-popover {
|
||||
background-color: var(--lighter-bg);
|
||||
border-color: var(--lighter-border);
|
||||
}
|
||||
.x-menu-container::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
background-color: rgba(255, 255, 255, 0.3);
|
||||
}
|
||||
::-webkit-scrollbar-thumb:active {
|
||||
background-color: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
::-webkit-scrollbar-track {
|
||||
background: transparent;
|
||||
}
|
||||
.el-radio-button__orig-radio:disabled + .el-radio-button__inner {
|
||||
color: var(--lighter-lighter-lighter-bg);
|
||||
background-color: var(--light-bg);
|
||||
border-color: var(--lighter-bg);
|
||||
}
|
||||
.el-radio-button__orig-radio:disabled:checked + .el-radio-button__inner {
|
||||
color: var(--lighter-lighter-lighter-bg);
|
||||
background-color: var(--lighter-bg);
|
||||
border-color: var(--lighter-bg);
|
||||
}
|
||||
.el-radio-button__orig-radio:disabled:checked + .el-radio-button__inner {
|
||||
box-shadow: none;
|
||||
}
|
||||
body,
|
||||
button,
|
||||
input,
|
||||
select,
|
||||
textarea {
|
||||
font-variant-numeric: tabular-nums;
|
||||
}
|
||||
.extra,
|
||||
.dialog-title,
|
||||
.x-link,
|
||||
.el-tree,
|
||||
input[type='text'],
|
||||
input[type='password'] {
|
||||
user-select: text;
|
||||
}
|
||||
.avatar-info-public::selection {
|
||||
color: hsl(100, 54%, 64%);
|
||||
}
|
||||
.avatar-info-own::selection {
|
||||
color: hsl(36, 77%, 72%);
|
||||
}
|
||||
::selection {
|
||||
background-color: rgba(255, 255, 255, 0.2);
|
||||
color: #fff;
|
||||
}
|
||||
.el-select-dropdown.is-multiple .el-select-dropdown__item.selected {
|
||||
transition: background-color 0.1s ease-in-out;
|
||||
}
|
||||
.el-select-dropdown.is-multiple .el-select-dropdown__item.selected {
|
||||
background-color: var(--lighter-lighter-lighter-bg);
|
||||
}
|
||||
.el-select-dropdown.is-multiple .el-select-dropdown__item.selected.hover {
|
||||
background-color: var(--lighter-lighter-bg);
|
||||
}
|
||||
.el-select .el-tag__close.el-icon-close {
|
||||
background-color: var(--lighter-lighter-bg);
|
||||
}
|
||||
input[type='checkbox'] + .el-switch__core {
|
||||
width: 36px !important;
|
||||
}
|
||||
input[type='checkbox']:checked + .el-switch__core {
|
||||
border-color: var(--theme) !important;
|
||||
background-color: var(--theme) !important;
|
||||
}
|
||||
.el-loading-spinner .path {
|
||||
stroke: var(--theme);
|
||||
}
|
||||
|
||||
// User dialog memo: input count background color
|
||||
.x-friend-item:hover .el-input__count {
|
||||
background-color: var(--lighter-lighter-bg);
|
||||
}
|
||||
|
||||
.el-collapse-item .el-tag--small {
|
||||
border: transparent;
|
||||
background-color: var(--lighter-lighter-bg);
|
||||
}
|
||||
.el-divider {
|
||||
background-color: #606266;
|
||||
}
|
||||
.el-divider__text {
|
||||
background: var(--bg);
|
||||
color: #efefef;
|
||||
}
|
||||
.el-backtop {
|
||||
background: var(--lighter-bg);
|
||||
color: var(--theme);
|
||||
}
|
||||
|
||||
// Date picker
|
||||
.el-date-picker {
|
||||
background-color: var(--lighter-bg);
|
||||
}
|
||||
.el-date-table td.current:not(.disabled) span {
|
||||
background-color: var(--lighter-bg);
|
||||
}
|
||||
.el-date-table td.today span {
|
||||
color: var(--theme);
|
||||
}
|
||||
.el-date-table td.available:hover span {
|
||||
background-color: var(--lighter-bg);
|
||||
color: #fff;
|
||||
}
|
||||
.el-date-table td.available:hover {
|
||||
color: #fff;
|
||||
}
|
||||
.el-year-table td .cell:hover,
|
||||
.el-year-table td.current:not(.disabled) .cell {
|
||||
color: var(--theme);
|
||||
}
|
||||
.el-month-table td.current:not(.disabled) .cell {
|
||||
color: var(--theme);
|
||||
}
|
||||
.el-date-picker__header-label.active,
|
||||
.el-date-picker__header-label:hover {
|
||||
color: var(--theme);
|
||||
}
|
||||
.el-picker-panel__icon-btn:hover {
|
||||
color: var(--theme);
|
||||
}
|
||||
.el-month-table td .cell:hover {
|
||||
color: var(--theme);
|
||||
}
|
||||
.el-date-table td.disabled div {
|
||||
background-color: #3a2b2b;
|
||||
}
|
||||
|
||||
.el-skeleton.is-animated .el-skeleton__item {
|
||||
background: linear-gradient(90deg, #4a3d3d 25%, #665252 37%, #4a3d3d 63%);
|
||||
background-size: 400% 100%;
|
||||
animation: el-skeleton-loading 1.4s ease infinite;
|
||||
}
|
||||
|
||||
.el-calendar {
|
||||
background-color: var(--lighter-bg) !important;
|
||||
}
|
||||
|
||||
.el-calendar__title {
|
||||
color: var(--theme) !important;
|
||||
}
|
||||
|
||||
.el-card {
|
||||
background-color: var(--light-bg) !important;
|
||||
border-color: var(--lighter-bg) !important;
|
||||
}
|
||||
|
||||
.el-descriptions__body {
|
||||
background-color: var(--bg) !important;
|
||||
color: var(--theme) !important;
|
||||
}
|
||||
|
||||
.el-timeline-item__tail {
|
||||
border-left-color: var(--lighter-border) !important;
|
||||
}
|
||||
|
||||
.el-timeline-item__node {
|
||||
background-color: var(--lighter-border) !important;
|
||||
}
|
||||
|
||||
.el-popover {
|
||||
background-color: var(--bg) !important;
|
||||
border-color: var(--lighter-bg) !important;
|
||||
}
|
||||
|
||||
.el-popper[x-placement^='top'] .popper__arrow {
|
||||
border-top-color: var(--bg) !important;
|
||||
}
|
||||
|
||||
.el-popper[x-placement^='top'] .popper__arrow::after {
|
||||
border-top-color: var(--bg) !important;
|
||||
}
|
||||
|
||||
.el-popper[x-placement^='bottom'] .popper__arrow {
|
||||
border-bottom-color: var(--bg) !important;
|
||||
}
|
||||
|
||||
.el-popper[x-placement^='bottom'] .popper__arrow::after {
|
||||
border-bottom-color: var(--bg) !important;
|
||||
}
|
||||
|
||||
.el-popper[x-placement^='left'] .popper__arrow {
|
||||
border-left-color: var(--bg) !important;
|
||||
}
|
||||
|
||||
.el-popper[x-placement^='left'] .popper__arrow::after {
|
||||
border-left-color: var(--bg) !important;
|
||||
}
|
||||
|
||||
.el-popper[x-placement^='right'] .popper__arrow {
|
||||
border-right-color: var(--bg) !important;
|
||||
}
|
||||
|
||||
.el-popper[x-placement^='right'] .popper__arrow::after {
|
||||
border-right-color: var(--bg) !important;
|
||||
}
|
||||
|
||||
// Group Calendar Dialog borders
|
||||
.search-container {
|
||||
border-bottom: 1px solid var(--lighter-bg) !important;
|
||||
}
|
||||
|
||||
.group-header {
|
||||
border-bottom: 2px solid var(--lighter-bg) !important;
|
||||
}
|
||||
|
||||
.el-select__wrapper {
|
||||
background-color: var(--light-bg) !important;
|
||||
border: 1px solid var(--lighter-bg) !important;
|
||||
color: var(--theme);
|
||||
}
|
||||
|
||||
.el-select__wrapper.is-focused {
|
||||
border-color: var(--theme) !important;
|
||||
}
|
||||
|
||||
.el-select__wrapper.is-disabled {
|
||||
background-color: var(--bg) !important;
|
||||
color: var(--lighter-border) !important;
|
||||
}
|
||||
|
||||
.el-input__wrapper {
|
||||
background-color: var(--light-bg) !important;
|
||||
border: 1px solid var(--lighter-bg) !important;
|
||||
}
|
||||
|
||||
.el-input__wrapper.is-focus {
|
||||
border-color: var(--theme) !important;
|
||||
}
|
||||
|
||||
.el-table {
|
||||
background-color: var(--bg) !important;
|
||||
}
|
||||
|
||||
.el-table tr,
|
||||
.el-table td.el-table__cell,
|
||||
.el-table th.el-table__cell {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
.el-table--striped .el-table__body tr.el-table__row--striped td.el-table__cell {
|
||||
background-color: var(--light-bg) !important;
|
||||
}
|
||||
|
||||
.el-table__body-wrapper .el-table__row:hover > .el-table__cell {
|
||||
background-color: var(--lighter-bg) !important;
|
||||
}
|
||||
Reference in New Issue
Block a user