mirror of
https://github.com/MHSanaei/3x-ui.git
synced 2025-09-19 00:13:03 +00:00
2835 lines
No EOL
64 KiB
CSS
2835 lines
No EOL
64 KiB
CSS
:root {
|
|
--color-primary-100: #008771;
|
|
--dark-color-background: #0a1222;
|
|
--dark-color-surface-100: #151f31;
|
|
--dark-color-surface-200: #222d42;
|
|
--dark-color-surface-300: #2c3950;
|
|
--dark-color-surface-400: rgba(65, 85, 119, .5);
|
|
--dark-color-surface-500: #2c3950;
|
|
--dark-color-surface-600: #313f5a;
|
|
--dark-color-surface-700: #111929;
|
|
--dark-color-surface-700-rgb: 17, 25, 41;
|
|
--dark-color-table-hover: rgba(44, 57, 80, .2);
|
|
--dark-color-text-primary: rgba(255, 255, 255, .75);
|
|
--dark-color-stroke: #2c3950;
|
|
--dark-color-btn-danger: #cd3838;
|
|
--dark-color-btn-danger-border: transparent;
|
|
--dark-color-btn-danger-hover: #e94b4b;
|
|
--dark-color-tag-bg: rgba(255, 255, 255, .05);
|
|
--dark-color-tag-border: rgba(255, 255, 255, .15);
|
|
--dark-color-tag-color: rgba(255, 255, 255, .75);
|
|
--dark-color-tag-green-bg: 17, 36, 33;
|
|
--dark-color-tag-green-border: 25, 81, 65;
|
|
--dark-color-tag-green-color: #3ad3ba;
|
|
--dark-color-tag-purple-bg: #201425;
|
|
--dark-color-tag-purple-border: #5a2969;
|
|
--dark-color-tag-purple-color: #d988cd;
|
|
--dark-color-tag-red-bg: #291515;
|
|
--dark-color-tag-red-border: #5c2626;
|
|
--dark-color-tag-red-color: #e04141;
|
|
--dark-color-tag-orange-bg: #312313;
|
|
--dark-color-tag-orange-border: #593914;
|
|
--dark-color-tag-orange-color: #ffa031;
|
|
--dark-color-tag-blue-bg: #111a2c;
|
|
--dark-color-tag-blue-border: #1348ab;
|
|
--dark-color-tag-blue-color: #529fff;
|
|
--dark-color-codemirror-line-hover: rgba(0, 135, 113, .2);
|
|
--dark-color-codemirror-line-selection: rgba(0, 135, 113, .3);
|
|
--dark-color-login-background: var(--dark-color-background);
|
|
--dark-color-login-wave: var(--dark-color-surface-200);
|
|
--dark-color-tooltip: rgba(61, 76, 104, .9);
|
|
--dark-color-back-top: rgba(61, 76, 104, .9);
|
|
--dark-color-back-top-hover: rgba(61, 76, 104, 1);
|
|
--dark-color-scrollbar: #313f5a;
|
|
--dark-color-scrollbar-webkit: #7484a0;
|
|
--dark-color-scrollbar-webkit-hover: #90a4c7;
|
|
--dark-color-table-ring: rgb(38 52 77);
|
|
--dark-color-spin-container: #151f31
|
|
}
|
|
|
|
html[data-theme-animations='off'] {
|
|
|
|
.ant-menu,
|
|
.ant-layout-sider,
|
|
.ant-card,
|
|
.ant-tag,
|
|
.ant-progress-circle>*,
|
|
.ant-input,
|
|
.ant-table-row-expand-icon,
|
|
.ant-switch,
|
|
.ant-table-thead>tr>th,
|
|
.ant-select-selection,
|
|
.ant-btn,
|
|
.ant-input-number,
|
|
.ant-input-group-addon,
|
|
.ant-checkbox-inner,
|
|
.ant-progress-bg,
|
|
.ant-progress-success-bg,
|
|
.ant-radio-button-wrapper:not(:first-child):before,
|
|
.ant-radio-button-wrapper,
|
|
#login,
|
|
.cm-s-xq.CodeMirror {
|
|
transition: border 0s, background 0s !important
|
|
}
|
|
|
|
.ant-menu.ant-menu-inline .ant-menu-item:not(.ant-menu-sub .ant-menu-item),
|
|
.ant-layout-sider-trigger,
|
|
.ant-alert-close-icon .anticon-close,
|
|
.ant-tabs-nav .ant-tabs-tab,
|
|
.ant-input-number-input,
|
|
.ant-collapse>.ant-collapse-item>.ant-collapse-header,
|
|
.Line-Hover,
|
|
.ant-menu-theme-switch,
|
|
.ant-menu-submenu-title {
|
|
transition: color 0s !important
|
|
}
|
|
|
|
.wave-btn-bg {
|
|
transition: width 0s !important
|
|
}
|
|
}
|
|
|
|
html[data-theme='ultra-dark'] {
|
|
--dark-color-background: #21242a;
|
|
--dark-color-surface-100: #0c0e12;
|
|
--dark-color-surface-200: #222327;
|
|
--dark-color-surface-300: #32353b;
|
|
--dark-color-surface-400: rgba(255, 255, 255, .1);
|
|
--dark-color-surface-500: #3b404b;
|
|
--dark-color-surface-600: #505663;
|
|
--dark-color-surface-700: #101113;
|
|
--dark-color-surface-700-rgb: 16, 17, 19;
|
|
--dark-color-table-hover: rgba(89, 89, 89, .15);
|
|
--dark-color-text-primary: rgb(255 255 255 / 85%);
|
|
--dark-color-stroke: #202025;
|
|
--dark-color-tag-green-bg: 17, 36, 33;
|
|
--dark-color-tag-green-border: 29, 95, 77;
|
|
--dark-color-tag-green-color: #59cbac;
|
|
--dark-color-tag-purple-bg: #241121;
|
|
--dark-color-tag-purple-border: #5a2969;
|
|
--dark-color-tag-purple-color: #d686ca;
|
|
--dark-color-tag-red-bg: #2a1215;
|
|
--dark-color-tag-red-border: #58181c;
|
|
--dark-color-tag-red-color: #e84749;
|
|
--dark-color-tag-orange-bg: #2b1d11;
|
|
--dark-color-tag-orange-border: #593815;
|
|
--dark-color-tag-orange-color: #e89a3c;
|
|
--dark-color-tag-blue-bg: #111a2c;
|
|
--dark-color-tag-blue-border: #0f367e;
|
|
--dark-color-tag-blue-color: #3c89e8;
|
|
--dark-color-codemirror-line-hover: rgba(82, 84, 94, .2);
|
|
--dark-color-codemirror-line-selection: rgba(82, 84, 94, .3);
|
|
--dark-color-login-background: #0a2227;
|
|
--dark-color-login-wave: #0f2d32;
|
|
--dark-color-tooltip: rgba(88, 93, 100, .9);
|
|
--dark-color-back-top: rgba(88, 93, 100, .9);
|
|
--dark-color-back-top-hover: rgba(88, 93, 100, 1);
|
|
--dark-color-scrollbar: rgb(107, 107, 107);
|
|
--dark-color-scrollbar-webkit: #9f9f9f;
|
|
--dark-color-scrollbar-webkit-hover: #d1d1d1;
|
|
--dark-color-table-ring: rgb(37 39 42);
|
|
--dark-color-spin-container: #1d1d1d;
|
|
|
|
.ant-dropdown-menu-dark {
|
|
background-color: var(--dark-color-surface-500)
|
|
}
|
|
|
|
.dark .ant-dropdown-menu-submenu-title:hover,
|
|
.dark .ant-select-dropdown-menu-item-active:not(.ant-select-dropdown-menu-item-disabled),
|
|
.dark .ant-select-dropdown-menu-item:hover:not(.ant-select-dropdown-menu-item-disabled) {
|
|
background-color: rgb(0 93 78 / .3)
|
|
}
|
|
|
|
.dark .waves-header {
|
|
background-color: #0a2227
|
|
}
|
|
|
|
.dark .ant-calendar-year-panel-year:hover,
|
|
.dark .ant-calendar-month-panel-month:hover,
|
|
.dark .ant-calendar-decade-panel-decade:hover {
|
|
background-color: var(--dark-color-surface-600)
|
|
}
|
|
}
|
|
|
|
html,
|
|
body {
|
|
height: 100vh;
|
|
width: 100vw;
|
|
margin: 0;
|
|
padding: 0;
|
|
overflow: hidden
|
|
}
|
|
|
|
body {
|
|
color: rgb(0 0 0 / .65);
|
|
font-size: 14px;
|
|
font-variant: tabular-nums;
|
|
line-height: 1.5;
|
|
background-color: #fff;
|
|
font-feature-settings: "tnum"
|
|
}
|
|
|
|
html {
|
|
--antd-wave-shadow-color: var(--color-primary-100);
|
|
line-height: 1.15;
|
|
text-size-adjust: 100%;
|
|
-webkit-text-size-adjust: 100%;
|
|
-ms-text-size-adjust: 100%;
|
|
-ms-overflow-style: scrollbar;
|
|
-moz-tap-highlight-color: #fff0;
|
|
-webkit-tap-highlight-color: #fff0
|
|
}
|
|
|
|
@supports (scrollbar-width:auto) and (not selector(::-webkit-scrollbar)) {
|
|
:not(.dark) {
|
|
scrollbar-color: #9a9a9a #fff0;
|
|
scrollbar-width: thin
|
|
}
|
|
|
|
.dark * {
|
|
scrollbar-color: var(--dark-color-scrollbar) #fff0;
|
|
scrollbar-width: thin
|
|
}
|
|
}
|
|
|
|
::-webkit-scrollbar {
|
|
width: 10px;
|
|
height: 10px;
|
|
background-color: #fff0
|
|
}
|
|
|
|
::-webkit-scrollbar-track {
|
|
background-color: #fff0;
|
|
margin-block: .5em
|
|
}
|
|
|
|
.ant-modal-wrap::-webkit-scrollbar-track {
|
|
background-color: #fff;
|
|
margin-block: 0
|
|
}
|
|
|
|
::-webkit-scrollbar-thumb {
|
|
border-radius: 9999px;
|
|
background-color: #9a9a9a;
|
|
border: 2px solid #fff0;
|
|
background-clip: content-box
|
|
}
|
|
|
|
::-webkit-scrollbar-thumb:hover,
|
|
::-webkit-scrollbar-thumb:active {
|
|
background-color: #828282
|
|
}
|
|
|
|
.dark .ant-modal-wrap::-webkit-scrollbar-track {
|
|
background-color: var(--dark-color-background)
|
|
}
|
|
|
|
.dark::-webkit-scrollbar-thumb {
|
|
background-color: var(--dark-color-scrollbar-webkit)
|
|
}
|
|
|
|
.dark::-webkit-scrollbar-thumb:hover,
|
|
.dark::-webkit-scrollbar-thumb:active {
|
|
background-color: var(--dark-color-scrollbar-webkit-hover)
|
|
}
|
|
|
|
::-moz-selection {
|
|
color: var(--color-primary-100);
|
|
background-color: #cfe8e4
|
|
}
|
|
|
|
::selection {
|
|
color: var(--color-primary-100);
|
|
background-color: #cfe8e4
|
|
}
|
|
|
|
#app {
|
|
height: 100%;
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
margin: 0;
|
|
padding: 0;
|
|
overflow: auto
|
|
}
|
|
|
|
.ant-layout,
|
|
.ant-layout * {
|
|
box-sizing: border-box
|
|
}
|
|
|
|
.ant-spin-container:after {
|
|
border-radius: 1.5rem
|
|
}
|
|
|
|
.dark .ant-spin-container:after {
|
|
background: var(--dark-color-spin-container)
|
|
}
|
|
|
|
style attribute {
|
|
text-align: center
|
|
}
|
|
|
|
.ant-table-thead>tr>th {
|
|
padding: 12px 8px
|
|
}
|
|
|
|
.ant-table-tbody>tr>td {
|
|
padding: 10px 8px
|
|
}
|
|
|
|
.ant-table-thead>tr>th {
|
|
color: rgb(0 0 0 / .85);
|
|
font-weight: 500;
|
|
text-align: left;
|
|
border-bottom: 1px solid #e8e8e8;
|
|
transition: background .3s ease
|
|
}
|
|
|
|
.ant-table table {
|
|
border-radius: 1rem
|
|
}
|
|
|
|
.ant-table-bordered .ant-table-tbody:not(.ant-table-expanded-row .ant-table-wrapper .ant-table-tbody)>tr:last-child>td:first-child {
|
|
border-bottom-left-radius: 1rem
|
|
}
|
|
|
|
.ant-table-bordered .ant-table-tbody:not(.ant-table-expanded-row .ant-table-wrapper .ant-table-tbody)>tr:last-child>td:last-child {
|
|
border-bottom-right-radius: 1rem
|
|
}
|
|
|
|
.ant-table {
|
|
box-sizing: border-box;
|
|
margin: 0;
|
|
padding: 0;
|
|
color: rgb(0 0 0 / .65);
|
|
font-size: 14px;
|
|
font-variant: tabular-nums;
|
|
line-height: 1.5;
|
|
list-style: none;
|
|
font-feature-settings: "tnum";
|
|
position: relative;
|
|
clear: both
|
|
}
|
|
|
|
.ant-table .ant-table-body:not(.ant-table-expanded-row .ant-table-body) {
|
|
overflow-x: auto !important
|
|
}
|
|
|
|
.ant-card-hoverable {
|
|
cursor: auto;
|
|
cursor: pointer
|
|
}
|
|
|
|
.ant-card {
|
|
box-sizing: border-box;
|
|
margin: 0;
|
|
padding: 0;
|
|
color: rgb(0 0 0 / .65);
|
|
font-size: 14px;
|
|
font-variant: tabular-nums;
|
|
line-height: 1.5;
|
|
list-style: none;
|
|
position: relative;
|
|
background-color: #fff;
|
|
border-radius: 2px;
|
|
transition: all .3s
|
|
}
|
|
|
|
.ant-space {
|
|
width: 100%
|
|
}
|
|
|
|
.ant-layout-sider-zero-width-trigger {
|
|
display: none
|
|
}
|
|
|
|
@media (max-width:768px) {
|
|
.ant-layout-sider {
|
|
display: none
|
|
}
|
|
|
|
.ant-card,
|
|
.ant-alert-error {
|
|
margin: .5rem
|
|
}
|
|
|
|
.ant-tabs {
|
|
margin: .5rem;
|
|
padding: .5rem
|
|
}
|
|
|
|
.ant-modal-body {
|
|
padding: 20px
|
|
}
|
|
|
|
.ant-form-item-label {
|
|
line-height: 1.5;
|
|
padding: 8px 0 0
|
|
}
|
|
|
|
:not(.dark)::-webkit-scrollbar {
|
|
width: 8px;
|
|
height: 8px;
|
|
background-color: #fff0
|
|
}
|
|
|
|
.dark::-webkit-scrollbar {
|
|
width: 8px;
|
|
height: 8px;
|
|
background-color: #fff0
|
|
}
|
|
}
|
|
|
|
.ant-layout-content {
|
|
min-height: auto
|
|
}
|
|
|
|
.ant-card,
|
|
.ant-tabs {
|
|
border-radius: 1.5rem
|
|
}
|
|
|
|
.ant-card-hoverable {
|
|
cursor: auto
|
|
}
|
|
|
|
.ant-card+.ant-card {
|
|
margin-top: 20px
|
|
}
|
|
|
|
.drawer-handle {
|
|
position: absolute;
|
|
top: 72px;
|
|
width: 41px;
|
|
height: 40px;
|
|
cursor: pointer;
|
|
z-index: 0;
|
|
text-align: center;
|
|
line-height: 40px;
|
|
font-size: 16px;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
background-color: #fff;
|
|
right: -40px;
|
|
box-shadow: 2px 0 8px rgb(0 0 0 / .15);
|
|
border-radius: 0 4px 4px 0
|
|
}
|
|
|
|
.ant-menu:not(.ant-menu-horizontal) .ant-menu-item-selected {
|
|
background-color: #006655 !important;
|
|
background-image: linear-gradient(270deg, #fff0 30%, #009980, #fff0 100%);
|
|
background-repeat: no-repeat;
|
|
animation: ma-bg-move linear 6.6s infinite;
|
|
color: #fff;
|
|
border-radius: .5rem
|
|
}
|
|
|
|
.ant-layout-sider-collapsed .ant-menu:not(.ant-menu-horizontal) .ant-menu-item-selected {
|
|
border-radius: 0
|
|
}
|
|
|
|
@-webkit-keyframes ma-bg-move {
|
|
0% {
|
|
background-position: -500px 0
|
|
}
|
|
|
|
100% {
|
|
background-position: 1000px 0
|
|
}
|
|
}
|
|
|
|
@keyframes ma-bg-move {
|
|
0% {
|
|
background-position: -500px 0
|
|
}
|
|
|
|
50% {
|
|
background-position: 1000px 0
|
|
}
|
|
|
|
100% {
|
|
background-position: 1000px 0
|
|
}
|
|
}
|
|
|
|
.ant-menu-item-active,
|
|
.ant-menu-item:hover,
|
|
.ant-menu-submenu-title:hover,
|
|
.ant-menu-item:active,
|
|
.ant-menu-submenu-title:active {
|
|
color: var(--color-primary-100);
|
|
background-color: #e8f4f2
|
|
}
|
|
|
|
.ant-menu-inline .ant-menu-item,
|
|
.ant-menu-inline .ant-menu-submenu-title {
|
|
border-radius: .5rem
|
|
}
|
|
|
|
.ant-menu-inline .ant-menu-item:after,
|
|
.ant-menu {
|
|
border-right-width: 0
|
|
}
|
|
|
|
.ant-layout-sider-children,
|
|
.ant-pagination ul {
|
|
padding: .5rem
|
|
}
|
|
|
|
.ant-layout-sider-collapsed .ant-layout-sider-children {
|
|
padding: .5rem 0
|
|
}
|
|
|
|
.ant-dropdown-menu,
|
|
.ant-select-dropdown-menu {
|
|
padding: .5rem
|
|
}
|
|
|
|
.ant-dropdown-menu-item,
|
|
.ant-dropdown-menu-item:hover,
|
|
.ant-select-dropdown-menu-item,
|
|
.ant-select-dropdown-menu-item:hover,
|
|
.ant-select-selection--multiple .ant-select-selection__choice {
|
|
border-radius: .5rem
|
|
}
|
|
|
|
.ant-select-dropdown--multiple .ant-select-dropdown-menu .ant-select-dropdown-menu-item,
|
|
.ant-select-dropdown--single .ant-select-dropdown-menu .ant-select-dropdown-menu-item-selected {
|
|
margin-block: 2px
|
|
}
|
|
|
|
@media (min-width:769px) {
|
|
.drawer-handle {
|
|
display: none
|
|
}
|
|
|
|
.ant-tabs {
|
|
padding: 2rem
|
|
}
|
|
}
|
|
|
|
.fade-in-enter,
|
|
.fade-in-leave-active,
|
|
.fade-in-linear-enter,
|
|
.fade-in-linear-leave,
|
|
.fade-in-linear-leave-active,
|
|
.fade-in-linear-enter,
|
|
.fade-in-linear-leave,
|
|
.fade-in-linear-leave-active {
|
|
opacity: 0
|
|
}
|
|
|
|
.fade-in-linear-enter-active,
|
|
.fade-in-linear-leave-active {
|
|
-webkit-transition: opacity .2s linear;
|
|
transition: opacity .2s linear
|
|
}
|
|
|
|
.fade-in-linear-enter-active,
|
|
.fade-in-linear-leave-active {
|
|
-webkit-transition: opacity .2s linear;
|
|
transition: opacity .2s linear
|
|
}
|
|
|
|
.fade-in-enter-active,
|
|
.fade-in-leave-active {
|
|
-webkit-transition: all .3s cubic-bezier(.55, 0, .1, 1);
|
|
transition: all .3s cubic-bezier(.55, 0, .1, 1)
|
|
}
|
|
|
|
.zoom-in-center-enter-active,
|
|
.zoom-in-center-leave-active {
|
|
-webkit-transition: all .3s cubic-bezier(.55, 0, .1, 1);
|
|
transition: all .3s cubic-bezier(.55, 0, .1, 1)
|
|
}
|
|
|
|
.zoom-in-center-enter,
|
|
.zoom-in-center-leave-active {
|
|
opacity: 0;
|
|
-webkit-transform: scaleX(0);
|
|
transform: scaleX(0)
|
|
}
|
|
|
|
.zoom-in-top-enter-active,
|
|
.zoom-in-top-leave-active {
|
|
opacity: 1;
|
|
-webkit-transform: scaleY(1);
|
|
transform: scaleY(1);
|
|
-webkit-transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1);
|
|
transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1);
|
|
transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1);
|
|
transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1);
|
|
-webkit-transform-origin: center top;
|
|
transform-origin: center top
|
|
}
|
|
|
|
.zoom-in-top-enter,
|
|
.zoom-in-top-leave-active {
|
|
opacity: 0;
|
|
-webkit-transform: scaleY(0);
|
|
transform: scaleY(0)
|
|
}
|
|
|
|
.zoom-in-bottom-enter-active,
|
|
.zoom-in-bottom-leave-active {
|
|
opacity: 1;
|
|
-webkit-transform: scaleY(1);
|
|
transform: scaleY(1);
|
|
-webkit-transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1);
|
|
transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1);
|
|
transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1);
|
|
transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1);
|
|
-webkit-transform-origin: center bottom;
|
|
transform-origin: center bottom
|
|
}
|
|
|
|
.zoom-in-bottom-enter,
|
|
.zoom-in-bottom-leave-active {
|
|
opacity: 0;
|
|
-webkit-transform: scaleY(0);
|
|
transform: scaleY(0)
|
|
}
|
|
|
|
.zoom-in-left-enter-active,
|
|
.zoom-in-left-leave-active {
|
|
opacity: 1;
|
|
-webkit-transform: scale(1, 1);
|
|
transform: scale(1, 1);
|
|
-webkit-transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1);
|
|
transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1);
|
|
transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1);
|
|
transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1);
|
|
-webkit-transform-origin: top left;
|
|
transform-origin: top left
|
|
}
|
|
|
|
.zoom-in-left-enter,
|
|
.zoom-in-left-leave-active {
|
|
opacity: 0;
|
|
-webkit-transform: scale(.45, .45);
|
|
transform: scale(.45, .45)
|
|
}
|
|
|
|
.list-enter-active,
|
|
.list-leave-active {
|
|
-webkit-transition: all .3s;
|
|
transition: all .3s
|
|
}
|
|
|
|
.list-enter,
|
|
.list-leave-active {
|
|
opacity: 0;
|
|
-webkit-transform: translateY(-30px);
|
|
transform: translateY(-30px)
|
|
}
|
|
|
|
.ant-tooltip-inner {
|
|
min-height: 0;
|
|
padding-inline: 1rem
|
|
}
|
|
|
|
.ant-list-item-meta-title {
|
|
font-size: 14px
|
|
}
|
|
|
|
.ant-progress-inner {
|
|
background-color: #ebeef5
|
|
}
|
|
|
|
.deactive-client .ant-collapse-header {
|
|
color: #ffffff !important;
|
|
background-color: #ff7f7f
|
|
}
|
|
|
|
.ant-table-expand-icon-th,
|
|
.ant-table-row-expand-icon-cell {
|
|
width: 30px;
|
|
min-width: 30px
|
|
}
|
|
|
|
.ant-tabs {
|
|
background-color: #fff
|
|
}
|
|
|
|
.ant-form-item {
|
|
margin-bottom: 0
|
|
}
|
|
|
|
.ant-setting-textarea {
|
|
margin-top: 1.5rem
|
|
}
|
|
|
|
.client-table-header {
|
|
background-color: #f0f2f5
|
|
}
|
|
|
|
.client-table-odd-row {
|
|
background-color: #fafafa
|
|
}
|
|
|
|
.ant-table-pagination.ant-pagination {
|
|
float: left
|
|
}
|
|
|
|
.ant-tag {
|
|
margin-right: 0;
|
|
margin-inline: 2px;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
justify-content: space-evenly
|
|
}
|
|
|
|
.ant-tag:not(.qr-tag) {
|
|
column-gap: 4px
|
|
}
|
|
|
|
#inbound-info-modal .ant-tag {
|
|
margin-block: 2px
|
|
}
|
|
|
|
.tr-info-table {
|
|
display: inline-table;
|
|
margin-block: 10px;
|
|
width: 100%
|
|
}
|
|
|
|
#inbound-info-modal .tr-info-table .ant-tag {
|
|
margin-block: 0;
|
|
margin-inline: 0
|
|
}
|
|
|
|
.tr-info-row {
|
|
display: flex;
|
|
flex-direction: column;
|
|
row-gap: 2px;
|
|
margin-block: 10px
|
|
}
|
|
|
|
.tr-info-row a {
|
|
margin-left: 6px
|
|
}
|
|
|
|
.tr-info-row code {
|
|
padding-inline: 8px
|
|
}
|
|
|
|
.tr-info-tag {
|
|
max-width: 100%;
|
|
text-wrap: balance;
|
|
overflow: hidden;
|
|
overflow-wrap: anywhere
|
|
}
|
|
|
|
.tr-info-title {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
justify-content: flex-start;
|
|
column-gap: 4px
|
|
}
|
|
|
|
.ant-tag-blue {
|
|
background-color: #edf4fa;
|
|
border-color: #a9c5e7;
|
|
color: #0e49b5
|
|
}
|
|
|
|
.ant-tag-green {
|
|
background-color: #eafff9;
|
|
border-color: #76ccb4;
|
|
color: #199270
|
|
}
|
|
|
|
.ant-tag-purple {
|
|
background-color: #f2eaf1;
|
|
border-color: #d5bed2;
|
|
color: #7a316f
|
|
}
|
|
|
|
.ant-tag-orange,
|
|
.ant-alert-warning {
|
|
background-color: #ffeee1;
|
|
border-color: #fec093;
|
|
color: #f37b24
|
|
}
|
|
|
|
.ant-tag-red,
|
|
.ant-alert-error {
|
|
background-color: #ffe9e9;
|
|
border-color: #ff9e9e;
|
|
color: #cf3c3c
|
|
}
|
|
|
|
.ant-input::placeholder {
|
|
opacity: .5
|
|
}
|
|
|
|
.ant-input:hover,
|
|
.ant-input:focus {
|
|
background-color: #e8f4f2
|
|
}
|
|
|
|
.ant-input-affix-wrapper:hover .ant-input:not(.ant-input-disabled) {
|
|
background-color: #e8f4f2
|
|
}
|
|
|
|
.delete-icon:hover {
|
|
color: #e04141
|
|
}
|
|
|
|
.normal-icon:hover {
|
|
color: var(--color-primary-100)
|
|
}
|
|
|
|
.dark::-moz-selection {
|
|
color: #fff;
|
|
background-color: var(--color-primary-100)
|
|
}
|
|
|
|
.dark::selection {
|
|
color: #fff;
|
|
background-color: var(--color-primary-100)
|
|
}
|
|
|
|
.dark .normal-icon:hover {
|
|
color: #fff
|
|
}
|
|
|
|
.dark .ant-layout-sider,
|
|
.dark .ant-drawer-content,
|
|
.ant-menu-dark,
|
|
.ant-menu-dark .ant-menu-sub,
|
|
.dark .ant-card,
|
|
.dark .ant-table,
|
|
.dark .ant-collapse-content,
|
|
.dark .ant-tabs {
|
|
background-color: var(--dark-color-surface-100);
|
|
color: var(--dark-color-text-primary)
|
|
}
|
|
|
|
.dark .ant-card-hoverable:hover,
|
|
.dark .ant-space-item>.ant-tabs:hover {
|
|
box-shadow: 0 2px 8px #fff0
|
|
}
|
|
|
|
.dark>.ant-layout,
|
|
.dark .drawer-handle,
|
|
.dark .ant-table-thead>tr>th,
|
|
.dark .ant-table-expanded-row,
|
|
.dark .ant-table-expanded-row:hover,
|
|
.dark .ant-table-expanded-row .ant-table-tbody,
|
|
.dark .ant-calendar {
|
|
background-color: var(--dark-color-background);
|
|
color: var(--dark-color-text-primary)
|
|
}
|
|
|
|
.dark .ant-table-expanded-row .ant-table-thead>tr:first-child>th {
|
|
border-radius: 0
|
|
}
|
|
|
|
.dark .ant-calendar,
|
|
.dark .ant-card-bordered {
|
|
border-color: var(--dark-color-background)
|
|
}
|
|
|
|
.dark .ant-table-bordered,
|
|
.dark .ant-table-bordered.ant-table-empty .ant-table-placeholder,
|
|
.dark .ant-table-bordered .ant-table-body>table,
|
|
.dark .ant-table-bordered .ant-table-fixed-left table,
|
|
.dark .ant-table-bordered .ant-table-fixed-right table,
|
|
.dark .ant-table-bordered .ant-table-header>table,
|
|
.dark .ant-table-bordered .ant-table-thead>tr:not(:last-child)>th,
|
|
.dark .ant-table-bordered .ant-table-tbody>tr>td,
|
|
.dark .ant-table-bordered .ant-table-thead>tr>th {
|
|
border-color: var(--dark-color-surface-400)
|
|
}
|
|
|
|
.dark .ant-table-tbody>tr>td,
|
|
.dark .ant-table-thead>tr>th,
|
|
.dark .ant-card-head,
|
|
.dark .ant-modal-header,
|
|
.dark .ant-collapse>.ant-collapse-item,
|
|
.dark .ant-tabs-bar,
|
|
.dark .ant-list-split .ant-list-item,
|
|
.dark .ant-popover-title,
|
|
.dark .ant-calendar-header,
|
|
.dark .ant-calendar-input-wrap {
|
|
border-bottom-color: var(--dark-color-surface-400)
|
|
}
|
|
|
|
.dark .ant-modal-footer,
|
|
.dark .ant-collapse-content,
|
|
.dark .ant-calendar-footer,
|
|
.dark .ant-divider-horizontal.ant-divider-with-text-left:before,
|
|
.dark .ant-divider-horizontal.ant-divider-with-text-left:after,
|
|
.dark .ant-divider-horizontal.ant-divider-with-text-center:before,
|
|
.dark .ant-divider-horizontal.ant-divider-with-text-center:after {
|
|
border-top-color: var(--dark-color-surface-300)
|
|
}
|
|
|
|
.ant-divider-horizontal.ant-divider-with-text-left:before {
|
|
width: 10%
|
|
}
|
|
|
|
.dark .ant-progress-text,
|
|
.dark .ant-card-head,
|
|
.dark .ant-form,
|
|
.dark .ant-collapse>.ant-collapse-item>.ant-collapse-header,
|
|
.dark .ant-modal-close-x,
|
|
.dark .ant-form .anticon,
|
|
.dark .ant-tabs-tab-arrow-show:not(.ant-tabs-tab-btn-disabled),
|
|
.dark .anticon-close,
|
|
.dark .ant-list-item-meta-title,
|
|
.dark .ant-select-selection i,
|
|
.dark .ant-modal-confirm-title,
|
|
.dark .ant-modal-confirm-content,
|
|
.dark .ant-popover-message,
|
|
.dark .ant-modal,
|
|
.dark .ant-divider-inner-text,
|
|
.dark .ant-popover-title,
|
|
.dark .ant-popover-inner-content,
|
|
.dark h2,
|
|
.dark .ant-modal-title,
|
|
.dark .ant-form-item-label>label,
|
|
.dark .ant-checkbox-wrapper,
|
|
.dark .ant-form-item,
|
|
.dark .ant-calendar-footer .ant-calendar-today-btn,
|
|
.dark .ant-calendar-footer .ant-calendar-time-picker-btn,
|
|
.dark .ant-calendar-day-select,
|
|
.dark .ant-calendar-month-select,
|
|
.dark .ant-calendar-year-select,
|
|
.dark .ant-calendar-date,
|
|
.dark .ant-calendar-year-panel-year,
|
|
.dark .ant-calendar-month-panel-month,
|
|
.dark .ant-calendar-decade-panel-decade {
|
|
color: var(--dark-color-text-primary)
|
|
}
|
|
|
|
.dark .ant-pagination-options-size-changer .ant-select-arrow .anticon.anticon-down.ant-select-arrow-icon {
|
|
color: rgb(255 255 255 / 35%)
|
|
}
|
|
|
|
.dark .ant-pagination-item a,
|
|
.dark .ant-pagination-next a,
|
|
.dark .ant-pagination-prev a {
|
|
color: var(--dark-color-text-primary)
|
|
}
|
|
|
|
.dark .ant-pagination-item:focus a,
|
|
.dark .ant-pagination-item:hover a,
|
|
.dark .ant-pagination-item-active a,
|
|
.dark .ant-pagination-next:hover .ant-pagination-item-link {
|
|
color: var(--color-primary-100)
|
|
}
|
|
|
|
.dark .ant-pagination-item-active {
|
|
background-color: #fff0
|
|
}
|
|
|
|
.dark .ant-list-item-meta-description {
|
|
color: rgb(255 255 255 / .45)
|
|
}
|
|
|
|
.dark .ant-pagination-disabled i,
|
|
.dark .ant-tabs-tab-btn-disabled {
|
|
color: rgb(255 255 255 / .25)
|
|
}
|
|
|
|
.dark .ant-input,
|
|
.dark .ant-input-group-addon,
|
|
.dark .ant-collapse,
|
|
.dark .ant-select-selection,
|
|
.dark .ant-input-number,
|
|
.dark .ant-input-number-handler-wrap,
|
|
.dark .ant-table-placeholder,
|
|
.dark .ant-empty-normal,
|
|
.dark .ant-select-dropdown,
|
|
.dark .ant-select-dropdown li,
|
|
.dark .ant-select-dropdown-menu-item,
|
|
.dark .client-table-header,
|
|
.dark .ant-select-selection--multiple .ant-select-selection__choice {
|
|
background-color: var(--dark-color-surface-200);
|
|
border-color: var(--dark-color-surface-300);
|
|
color: var(--dark-color-text-primary)
|
|
}
|
|
|
|
.dark .ant-select-dropdown--multiple .ant-select-dropdown-menu .ant-select-dropdown-menu-item.ant-select-dropdown-menu-item-selected:not(.ant-dropdown-menu-submenu-title:hover) {
|
|
background-color: var(--dark-color-surface-300)
|
|
}
|
|
|
|
.dark .ant-select-dropdown-menu-item.ant-select-dropdown-menu-item-selected {
|
|
background-color: var(--dark-color-surface-300)
|
|
}
|
|
|
|
.dark .ant-calendar-time-picker-inner {
|
|
background-color: var(--dark-color-background)
|
|
}
|
|
|
|
.dark .ant-select-selection:hover,
|
|
.dark .ant-calendar-picker-clear,
|
|
.dark .ant-input-number:hover,
|
|
.dark .ant-input-number:focus,
|
|
.dark .ant-input:hover,
|
|
.dark .ant-input:focus {
|
|
background-color: rgb(0 135 113 / .3);
|
|
border-color: var(--color-primary-100)
|
|
}
|
|
|
|
.dark .ant-input-affix-wrapper:hover .ant-input:not(.ant-input-disabled) {
|
|
border-color: var(--color-primary-100);
|
|
background-color: rgb(0 135 113 / .3)
|
|
}
|
|
|
|
.dark .ant-btn:not(.ant-btn-primary):not(.ant-btn-danger) {
|
|
color: var(--dark-color-text-primary);
|
|
background-color: rgb(10 117 87 / 30%);
|
|
border: 1px solid var(--color-primary-100)
|
|
}
|
|
|
|
.dark .ant-radio-button-wrapper,
|
|
.dark .ant-radio-button-wrapper:before {
|
|
color: var(--dark-color-text-primary);
|
|
background-color: rgb(0 135 113 / .3);
|
|
border-color: var(--color-primary-100)
|
|
}
|
|
|
|
.ant-btn:focus:not(.ant-btn-primary):not(.ant-btn-danger),
|
|
.ant-btn:hover:not(.ant-btn-primary):not(.ant-btn-danger) {
|
|
background-color: #e8f4f2
|
|
}
|
|
|
|
.dark .ant-btn:focus:not(.ant-btn-primary):not(.ant-btn-danger),
|
|
.dark .ant-btn:hover:not(.ant-btn-primary):not(.ant-btn-danger) {
|
|
color: #fff;
|
|
background-color: rgb(10 117 87 / 50%);
|
|
border-color: var(--color-primary-100)
|
|
}
|
|
|
|
.dark .ant-btn-primary[disabled],
|
|
.dark .ant-btn-danger[disabled],
|
|
.dark .ant-calendar-ok-btn-disabled {
|
|
color: rgb(255 255 255 / 35%);
|
|
background-color: var(--dark-color-surface-200);
|
|
border-color: var(--dark-color-surface-300)
|
|
}
|
|
|
|
.dark .ant-table-tbody>tr:hover:not(.ant-table-expanded-row):not(.ant-table-row-selected)>td,
|
|
.dark .client-table-odd-row {
|
|
background-color: var(--dark-color-table-hover)
|
|
}
|
|
|
|
.dark .ant-table-row-expand-icon {
|
|
color: #fff;
|
|
background-color: #fff0;
|
|
border-color: rgb(255 255 255 / 20%)
|
|
}
|
|
|
|
.dark .ant-table-row-expand-icon:hover {
|
|
color: var(--color-primary-100);
|
|
background-color: #fff0;
|
|
border-color: var(--color-primary-100)
|
|
}
|
|
|
|
.dark .ant-switch:not(.ant-switch-checked),
|
|
.dark .ant-progress-line .ant-progress-inner {
|
|
background-color: var(--dark-color-surface-500)
|
|
}
|
|
|
|
.dark .ant-progress-circle-trail {
|
|
stroke: var(--dark-color-stroke) !important
|
|
}
|
|
|
|
.dark .ant-popover-inner {
|
|
background-color: var(--dark-color-surface-500)
|
|
}
|
|
|
|
.dark>.ant-popover-content>.ant-popover-arrow {
|
|
border-color: var(--dark-color-surface-500)
|
|
}
|
|
|
|
@media (max-width:768px) {
|
|
.dark .ant-popover-inner {
|
|
background-color: var(--dark-color-surface-200)
|
|
}
|
|
|
|
.dark>.ant-popover-content>.ant-popover-arrow {
|
|
border-color: var(--dark-color-surface-200)
|
|
}
|
|
}
|
|
|
|
.ant-dropdown-menu-dark .ant-dropdown-menu-item:hover,
|
|
.dark .ant-select-dropdown-menu-item-selected,
|
|
.dark .ant-calendar-time-picker-select-option-selected {
|
|
background-color: var(--dark-color-surface-600)
|
|
}
|
|
|
|
.ant-menu-dark .ant-menu-item:hover,
|
|
.ant-menu-dark .ant-menu-submenu-title:hover {
|
|
background-color: var(--dark-color-surface-300)
|
|
}
|
|
|
|
.dark .ant-menu-item:active,
|
|
.dark .ant-menu-submenu-title:active {
|
|
color: #fff;
|
|
background-color: var(--dark-color-surface-300)
|
|
}
|
|
|
|
.dark .ant-alert-message {
|
|
color: rgb(255 255 255 / .85)
|
|
}
|
|
|
|
.dark .ant-tag {
|
|
color: var(--dark-color-tag-color);
|
|
background-color: var(--dark-color-tag-bg);
|
|
border-color: var(--dark-color-tag-border)
|
|
}
|
|
|
|
.dark .ant-tag-blue {
|
|
background-color: var(--dark-color-tag-blue-bg);
|
|
border-color: var(--dark-color-tag-blue-border);
|
|
color: var(--dark-color-tag-blue-color)
|
|
}
|
|
|
|
.dark .ant-tag-red,
|
|
.dark .ant-alert-error {
|
|
background-color: var(--dark-color-tag-red-bg);
|
|
border-color: var(--dark-color-tag-red-border);
|
|
color: var(--dark-color-tag-red-color)
|
|
}
|
|
|
|
.dark .ant-tag-orange,
|
|
.dark .ant-alert-warning {
|
|
background-color: var(--dark-color-tag-orange-bg);
|
|
border-color: var(--dark-color-tag-orange-border);
|
|
color: var(--dark-color-tag-orange-color)
|
|
}
|
|
|
|
.dark .ant-tag-green {
|
|
background-color: rgb(var(--dark-color-tag-green-bg));
|
|
border-color: rgb(var(--dark-color-tag-green-border));
|
|
color: var(--dark-color-tag-green-color)
|
|
}
|
|
|
|
.dark .ant-tag-purple {
|
|
background-color: var(--dark-color-tag-purple-bg);
|
|
border-color: var(--dark-color-tag-purple-border);
|
|
color: var(--dark-color-tag-purple-color)
|
|
}
|
|
|
|
.dark .ant-modal-content,
|
|
.dark .ant-modal-header {
|
|
background-color: var(--dark-color-surface-700)
|
|
}
|
|
|
|
.dark .ant-calendar-next-month-btn-day .ant-calendar-date,
|
|
.dark .ant-calendar-last-month-cell .ant-calendar-date {
|
|
color: var(--dark-color-surface-300)
|
|
}
|
|
|
|
.dark .ant-calendar-selected-day .ant-calendar-date {
|
|
background-color: var(--color-primary-100) !important;
|
|
color: #fff
|
|
}
|
|
|
|
.dark .ant-calendar-date:hover,
|
|
.dark .ant-calendar-time-picker-select li:hover {
|
|
background-color: var(--dark-color-surface-600);
|
|
color: #fff
|
|
}
|
|
|
|
.dark .ant-calendar-header a:hover,
|
|
.dark .ant-calendar-header a:hover::before,
|
|
.dark .ant-calendar-header a:hover::after {
|
|
border-color: #fff
|
|
}
|
|
|
|
.dark .ant-calendar-time-picker-select {
|
|
border-right-color: var(--dark-color-surface-300)
|
|
}
|
|
|
|
.has-warning .ant-select-selection,
|
|
.has-warning .ant-select-selection:hover,
|
|
.has-warning .ant-input,
|
|
.has-warning .ant-input:hover {
|
|
background-color: #ffeee1;
|
|
border-color: #fec093
|
|
}
|
|
|
|
.has-warning .ant-input::placeholder {
|
|
color: #f37b24
|
|
}
|
|
|
|
.has-warning .ant-input:not([disabled]):hover {
|
|
border-color: #fec093
|
|
}
|
|
|
|
.dark .has-warning .ant-select-selection,
|
|
.dark .has-warning .ant-select-selection:hover,
|
|
.dark .has-warning .ant-input,
|
|
.dark .has-warning .ant-input:hover {
|
|
border-color: #784e1d;
|
|
background: #312313
|
|
}
|
|
|
|
.dark .has-warning .ant-input::placeholder {
|
|
color: rgb(255 160 49 / 70%)
|
|
}
|
|
|
|
.dark .has-warning .anticon {
|
|
color: #ffa031
|
|
}
|
|
|
|
.dark .has-success .anticon {
|
|
color: var(--color-primary-100);
|
|
animation-name: diffZoomIn1 !important
|
|
}
|
|
|
|
.dark .anticon-close-circle {
|
|
color: #e04141
|
|
}
|
|
|
|
.dark .ant-spin-nested-loading>div>.ant-spin .ant-spin-text {
|
|
text-shadow: 0 1px 2px #0007
|
|
}
|
|
|
|
.dark .ant-spin {
|
|
color: #fff
|
|
}
|
|
|
|
.dark .ant-spin-dot-item {
|
|
background-color: #fff
|
|
}
|
|
|
|
.ant-checkbox-wrapper,
|
|
.ant-input-group-addon,
|
|
.ant-tabs-tab,
|
|
.ant-input::placeholder,
|
|
.ant-collapse-header,
|
|
.ant-menu,
|
|
.ant-radio-button-wrapper {
|
|
-webkit-user-select: none;
|
|
user-select: none
|
|
}
|
|
|
|
.ant-calendar-date,
|
|
.ant-calendar-year-panel-year,
|
|
.ant-calendar-decade-panel-decade,
|
|
.ant-calendar-month-panel-month {
|
|
border-radius: 4px
|
|
}
|
|
|
|
.ant-checkbox-inner,
|
|
.ant-checkbox-checked:after,
|
|
.ant-table-row-expand-icon {
|
|
border-radius: 6px
|
|
}
|
|
|
|
.ant-calendar-date:hover {
|
|
background-color: #e8f4f2
|
|
}
|
|
|
|
.ant-calendar-date:active {
|
|
background-color: #e8f4f2;
|
|
color: rgb(0 0 0 / .65)
|
|
}
|
|
|
|
.ant-calendar-today .ant-calendar-date {
|
|
color: var(--color-primary-100);
|
|
font-weight: 400;
|
|
border-color: var(--color-primary-100)
|
|
}
|
|
|
|
.dark .ant-calendar-today .ant-calendar-date {
|
|
color: #fff;
|
|
border-color: var(--color-primary-100)
|
|
}
|
|
|
|
.ant-calendar-selected-day .ant-calendar-date {
|
|
background: var(--color-primary-100);
|
|
color: #fff
|
|
}
|
|
|
|
li.ant-select-dropdown-menu-item:empty:after {
|
|
content: "None";
|
|
font-weight: 400;
|
|
color: rgb(0 0 0 / .25)
|
|
}
|
|
|
|
.dark li.ant-select-dropdown-menu-item:empty:after {
|
|
content: "None";
|
|
font-weight: 400;
|
|
color: rgb(255 255 255 / .3)
|
|
}
|
|
|
|
.ant-select-dropdown.ant-select-dropdown--multiple .ant-select-dropdown-menu-item:hover .ant-select-selected-icon {
|
|
color: rgb(0 0 0 / .87)
|
|
}
|
|
|
|
.dark.ant-select-dropdown.ant-select-dropdown--multiple .ant-select-dropdown-menu-item:hover .ant-select-selected-icon {
|
|
color: #fff
|
|
}
|
|
|
|
.ant-select-dropdown.ant-select-dropdown--multiple .ant-select-dropdown-menu-item-selected .ant-select-selected-icon,
|
|
.ant-select-dropdown.ant-select-dropdown--multiple .ant-select-dropdown-menu-item-selected:hover .ant-select-selected-icon {
|
|
color: var(--color-primary-100)
|
|
}
|
|
|
|
.ant-select-selection:hover,
|
|
.ant-input-number-focused,
|
|
.ant-input-number:hover {
|
|
background-color: #e8f4f2
|
|
}
|
|
|
|
.dark .ant-input-number-handler:active {
|
|
background-color: var(--color-primary-100)
|
|
}
|
|
|
|
.dark .ant-input-number-handler:hover .ant-input-number-handler-down-inner,
|
|
.dark .ant-input-number-handler:hover .ant-input-number-handler-up-inner {
|
|
color: #fff
|
|
}
|
|
|
|
.dark .ant-input-number-handler-down {
|
|
border-top: 1px solid rgb(217 217 217 / .3)
|
|
}
|
|
|
|
.dark .ant-calendar-year-panel-header .ant-calendar-year-panel-century-select,
|
|
.dark .ant-calendar-year-panel-header .ant-calendar-year-panel-decade-select,
|
|
.dark .ant-calendar-year-panel-header .ant-calendar-year-panel-month-select,
|
|
.dark .ant-calendar-year-panel-header .ant-calendar-year-panel-year-select .dark .ant-calendar-month-panel-header .ant-calendar-month-panel-century-select,
|
|
.dark .ant-calendar-month-panel-header .ant-calendar-month-panel-decade-select,
|
|
.dark .ant-calendar-month-panel-header .ant-calendar-month-panel-month-select,
|
|
.dark .ant-calendar-month-panel-header .ant-calendar-month-panel-year-select {
|
|
color: rgb(255 255 255 / .85)
|
|
}
|
|
|
|
.dark .ant-calendar-year-panel-header {
|
|
border-bottom: 1px solid var(--dark-color-surface-200)
|
|
}
|
|
|
|
.dark .ant-calendar-year-panel-last-decade-cell .ant-calendar-year-panel-year,
|
|
.dark .ant-calendar-year-panel-next-decade-cell .ant-calendar-year-panel-year {
|
|
color: rgb(255 255 255 / .35)
|
|
}
|
|
|
|
.dark .ant-divider:not(.ant-divider-with-text-center, .ant-divider-with-text-left, .ant-divider-with-text-right),
|
|
.ant-dropdown-menu-dark,
|
|
.dark .ant-calendar-year-panel-year:hover,
|
|
.dark .ant-calendar-month-panel-month:hover,
|
|
.dark .ant-calendar-decade-panel-decade:hover {
|
|
background-color: var(--dark-color-surface-200)
|
|
}
|
|
|
|
.dark .ant-calendar-header a:hover {
|
|
color: #fff
|
|
}
|
|
|
|
.dark .ant-calendar-month-panel-header {
|
|
background-color: var(--dark-color-background);
|
|
border-bottom: 1px solid var(--dark-color-surface-200)
|
|
}
|
|
|
|
.dark .ant-calendar-year-panel,
|
|
.dark .ant-calendar table {
|
|
background-color: var(--dark-color-background)
|
|
}
|
|
|
|
.dark .ant-calendar-year-panel-selected-cell .ant-calendar-year-panel-year,
|
|
.dark .ant-calendar-year-panel-selected-cell .ant-calendar-year-panel-year:hover,
|
|
.dark .ant-calendar-month-panel-selected-cell .ant-calendar-month-panel-month,
|
|
.dark .ant-calendar-month-panel-selected-cell .ant-calendar-month-panel-month:hover,
|
|
.dark .ant-calendar-decade-panel-selected-cell .ant-calendar-decade-panel-decade,
|
|
.dark .ant-calendar-decade-panel-selected-cell .ant-calendar-decade-panel-decade:hover {
|
|
color: #fff;
|
|
background-color: var(--color-primary-100) !important
|
|
}
|
|
|
|
.dark .ant-calendar-last-month-cell .ant-calendar-date,
|
|
.dark .ant-calendar-last-month-cell .ant-calendar-date:hover,
|
|
.dark .ant-calendar-next-month-btn-day .ant-calendar-date,
|
|
.dark .ant-calendar-next-month-btn-day .ant-calendar-date:hover {
|
|
color: rgb(255 255 255 / 25%);
|
|
background: #fff0;
|
|
border-color: #fff0
|
|
}
|
|
|
|
.dark .ant-calendar-today .ant-calendar-date:hover {
|
|
color: #fff;
|
|
border-color: var(--color-primary-100);
|
|
background-color: var(--color-primary-100)
|
|
}
|
|
|
|
.dark .ant-calendar-decade-panel-last-century-cell .ant-calendar-decade-panel-decade,
|
|
.dark .ant-calendar-decade-panel-next-century-cell .ant-calendar-decade-panel-decade {
|
|
color: rgb(255 255 255 / 25%)
|
|
}
|
|
|
|
.dark .ant-calendar-decade-panel-header {
|
|
border-bottom: 1px solid var(--dark-color-surface-200);
|
|
background-color: var(--dark-color-background)
|
|
}
|
|
|
|
.dark .ant-checkbox-inner {
|
|
background-color: rgb(0 135 113 / .3);
|
|
border-color: rgb(0 135 113 / .3)
|
|
}
|
|
|
|
.dark .ant-checkbox-checked .ant-checkbox-inner {
|
|
background-color: var(--color-primary-100);
|
|
border-color: var(--color-primary-100)
|
|
}
|
|
|
|
.dark .ant-calendar-input {
|
|
background-color: var(--dark-color-background);
|
|
color: var(--dark-color-text-primary)
|
|
}
|
|
|
|
.dark .ant-calendar-input::placeholder {
|
|
color: rgb(255 255 255 / .25)
|
|
}
|
|
|
|
.ant-input-group.ant-input-group-compact-addon:not(:first-child):not(:last-child),
|
|
.ant-input-group.ant-input-group-compact-wrap:not(:first-child):not(:last-child),
|
|
.ant-input-group.ant-input-group-compact>.ant-input:not(:first-child):not(:last-child),
|
|
.ant-input-number-handler,
|
|
.ant-input-number-handler-wrap {
|
|
border-radius: 0
|
|
}
|
|
|
|
.ant-input-number {
|
|
overflow: clip
|
|
}
|
|
|
|
.ant-modal-body,
|
|
.ant-collapse-content>.ant-collapse-content-box {
|
|
overflow-x: auto
|
|
}
|
|
|
|
.ant-modal-body {
|
|
overflow-y: hidden
|
|
}
|
|
|
|
.ant-calendar-year-panel-year:hover,
|
|
.ant-calendar-decade-panel-decade:hover,
|
|
.ant-calendar-month-panel-month:hover,
|
|
.ant-dropdown-menu-item:hover,
|
|
.ant-dropdown-menu-submenu-title:hover,
|
|
.ant-select-dropdown-menu-item-active:not(.ant-select-dropdown-menu-item-disabled),
|
|
.ant-select-dropdown-menu-item:hover:not(.ant-select-dropdown-menu-item-disabled),
|
|
.ant-table-tbody>tr.ant-table-row-hover:not(.ant-table-expanded-row):not(.ant-table-row-selected)>td,
|
|
.ant-table-tbody>tr:hover:not(.ant-table-expanded-row):not(.ant-table-row-selected)>td,
|
|
.ant-table-thead>tr.ant-table-row-hover:not(.ant-table-expanded-row):not(.ant-table-row-selected)>td,
|
|
.ant-table-thead>tr:hover:not(.ant-table-expanded-row):not(.ant-table-row-selected)>td {
|
|
background-color: #e8f4f2
|
|
}
|
|
|
|
.dark .ant-dropdown-menu-submenu-title:hover,
|
|
.dark .ant-select-dropdown-menu-item-active:not(.ant-select-dropdown-menu-item-disabled),
|
|
.dark .ant-select-dropdown-menu-item:hover:not(.ant-select-dropdown-menu-item-disabled) {
|
|
background-color: rgb(0 93 78 / .3)
|
|
}
|
|
|
|
.ant-select-dropdown,
|
|
.ant-popover-inner {
|
|
overflow-x: hidden
|
|
}
|
|
|
|
.ant-popover-inner-content {
|
|
max-height: 450px;
|
|
overflow-y: auto
|
|
}
|
|
|
|
@media (max-height:900px) {
|
|
.ant-popover-inner-content {
|
|
max-height: 400px
|
|
}
|
|
}
|
|
|
|
@media (max-height:768px) {
|
|
.ant-popover-inner-content {
|
|
max-height: 300px
|
|
}
|
|
}
|
|
|
|
@media (max-width:768px) {
|
|
.ant-popover-inner-content {
|
|
max-height: 300px
|
|
}
|
|
}
|
|
|
|
.qr-modal {
|
|
display: flex;
|
|
align-items: flex-end;
|
|
gap: 10px;
|
|
flex-direction: column;
|
|
flex-wrap: wrap;
|
|
row-gap: 24px
|
|
}
|
|
|
|
.qr-box {
|
|
width: 220px
|
|
}
|
|
|
|
.qr-cv {
|
|
width: 100%;
|
|
height: 100%
|
|
}
|
|
|
|
.dark .qr-cv {
|
|
filter: invert(1)
|
|
}
|
|
|
|
.qr-bg {
|
|
background-color: #fff;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-content: center;
|
|
padding: .8rem;
|
|
border-radius: 1rem;
|
|
border: solid 1px #e8e8e8;
|
|
height: 220px;
|
|
width: 220px;
|
|
transition: all .1s
|
|
}
|
|
|
|
.qr-bg:hover {
|
|
border-color: #76ccb4;
|
|
background-color: #eafff9
|
|
}
|
|
|
|
.qr-bg:hover:active {
|
|
border-color: #76ccb4;
|
|
background-color: rgb(197 241 228 / 70%)
|
|
}
|
|
|
|
.dark .qr-bg {
|
|
background-color: var(--dark-color-surface-700);
|
|
border-color: var(--dark-color-surface-300)
|
|
}
|
|
|
|
.dark .qr-bg:hover {
|
|
background-color: rgb(var(--dark-color-tag-green-bg));
|
|
border-color: rgb(var(--dark-color-tag-green-border))
|
|
}
|
|
|
|
.dark .qr-bg:hover:active {
|
|
background-color: #17322e
|
|
}
|
|
|
|
@property --tr-rotate {
|
|
syntax: '<angle>';
|
|
initial-value: 45deg;
|
|
inherits: false
|
|
}
|
|
|
|
.qr-bg-sub {
|
|
background-image: linear-gradient(var(--tr-rotate), #76ccb4, transparent, #d5bed2);
|
|
display: flex;
|
|
justify-content: center;
|
|
align-content: center;
|
|
padding: 1px;
|
|
border-radius: 1rem;
|
|
height: 220px;
|
|
width: 220px
|
|
}
|
|
|
|
.dark .qr-bg-sub {
|
|
background-image: linear-gradient(var(--tr-rotate), #195141, transparent, #5a2969)
|
|
}
|
|
|
|
.qr-bg-sub:hover {
|
|
animation: tr-rotate-gradient 3.5s linear infinite
|
|
}
|
|
|
|
@keyframes tr-rotate-gradient {
|
|
from {
|
|
--tr-rotate: 45deg
|
|
}
|
|
|
|
to {
|
|
--tr-rotate: 405deg
|
|
}
|
|
}
|
|
|
|
.qr-bg-sub-inner {
|
|
background-color: #fff;
|
|
padding: .8rem;
|
|
border-radius: 1rem;
|
|
transition: all .1s
|
|
}
|
|
|
|
.qr-bg-sub-inner:hover {
|
|
background-color: rgb(255 255 255 / 60%);
|
|
backdrop-filter: blur(25px)
|
|
}
|
|
|
|
.qr-bg-sub-inner:hover:active {
|
|
background-color: rgb(255 255 255 / 30%)
|
|
}
|
|
|
|
.dark .qr-bg-sub-inner {
|
|
background-color: rgb(var(--dark-color-surface-700-rgb))
|
|
}
|
|
|
|
.dark .qr-bg-sub-inner:hover {
|
|
background-color: rgba(var(--dark-color-surface-700-rgb), .5);
|
|
backdrop-filter: blur(25px)
|
|
}
|
|
|
|
.dark .qr-bg-sub-inner:hover:active {
|
|
background-color: rgba(var(--dark-color-surface-700-rgb), .2)
|
|
}
|
|
|
|
/* Subscription long links styling */
|
|
.mono-link .ant-input {
|
|
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !important;
|
|
direction: ltr !important;
|
|
unicode-bidi: plaintext !important;
|
|
white-space: nowrap !important;
|
|
overflow-x: auto !important;
|
|
text-overflow: clip !important;
|
|
}
|
|
.mono-link.single-line .ant-input {
|
|
height: 38px;
|
|
}
|
|
|
|
.qr-tag {
|
|
text-align: center;
|
|
margin-bottom: 10px;
|
|
width: 100%;
|
|
overflow: hidden;
|
|
margin-inline: 0
|
|
}
|
|
|
|
@media (min-width:769px) {
|
|
.qr-modal {
|
|
flex-direction: row;
|
|
max-width: 680px
|
|
}
|
|
}
|
|
|
|
.tr-marquee {
|
|
justify-content: flex-start
|
|
}
|
|
|
|
.tr-marquee span {
|
|
padding-right: 25%;
|
|
white-space: nowrap;
|
|
transform-origin: center
|
|
}
|
|
|
|
@keyframes move-ltr {
|
|
0% {
|
|
transform: translateX(0)
|
|
}
|
|
|
|
100% {
|
|
transform: translateX(-100%)
|
|
}
|
|
}
|
|
|
|
.ant-input-group-addon:not(:first-child):not(:last-child) {
|
|
border-radius: 0 1rem 1rem 0
|
|
}
|
|
|
|
b,
|
|
strong {
|
|
font-weight: 500
|
|
}
|
|
|
|
.ant-collapse>.ant-collapse-item>.ant-collapse-header {
|
|
padding: 10px 16px 10px 40px
|
|
}
|
|
|
|
.dark .ant-message-notice-content {
|
|
background-color: var(--dark-color-surface-200);
|
|
border: 1px solid var(--dark-color-surface-300);
|
|
color: var(--dark-color-text-primary)
|
|
}
|
|
|
|
.ant-btn-danger {
|
|
background-color: var(--dark-color-btn-danger);
|
|
border-color: var(--dark-color-btn-danger-border)
|
|
}
|
|
|
|
.ant-btn-danger:focus,
|
|
.ant-btn-danger:hover {
|
|
background-color: var(--dark-color-btn-danger-hover);
|
|
border-color: var(--dark-color-btn-danger-hover)
|
|
}
|
|
|
|
.dark .ant-alert-close-icon .anticon-close:hover {
|
|
color: #fff
|
|
}
|
|
|
|
.ant-empty-small {
|
|
margin: 4px 0;
|
|
background-color: transparent !important
|
|
}
|
|
|
|
.ant-empty-small .ant-empty-image {
|
|
height: 20px
|
|
}
|
|
|
|
.ant-menu-theme-switch,
|
|
.ant-menu-theme-switch:hover {
|
|
background-color: transparent !important;
|
|
cursor: default !important
|
|
}
|
|
|
|
.dark .ant-tooltip-inner,
|
|
.dark .ant-tooltip-arrow:before {
|
|
background-color: var(--dark-color-tooltip)
|
|
}
|
|
|
|
.ant-select-sm .ant-select-selection__rendered {
|
|
margin-left: 10px
|
|
}
|
|
|
|
.ant-collapse {
|
|
-moz-animation: collfade .3s ease;
|
|
-webkit-animation: .3s collfade .3s ease;
|
|
animation: collfade .3s ease
|
|
}
|
|
|
|
@-webkit-keyframes collfade {
|
|
0% {
|
|
transform: scaleY(.8);
|
|
transform-origin: 0 0%;
|
|
opacity: 0
|
|
}
|
|
|
|
100% {
|
|
transform: scaleY(1);
|
|
transform-origin: 0 0%;
|
|
opacity: 1
|
|
}
|
|
}
|
|
|
|
@keyframes collfade {
|
|
0% {
|
|
transform: scaleY(.8);
|
|
transform-origin: 0 0%;
|
|
opacity: 0
|
|
}
|
|
|
|
100% {
|
|
transform: scaleY(1);
|
|
transform-origin: 0 0%;
|
|
opacity: 1
|
|
}
|
|
}
|
|
|
|
.ant-table-tbody>tr>td {
|
|
border-color: #f0f0f0
|
|
}
|
|
|
|
.ant-table-row-expand-icon {
|
|
vertical-align: middle;
|
|
margin-inline-end: 8px;
|
|
position: relative;
|
|
transform: scale(.9411764705882353)
|
|
}
|
|
|
|
.ant-table-row-collapsed::before {
|
|
transform: rotate(-180deg);
|
|
top: 7px;
|
|
inset-inline-end: 3px;
|
|
inset-inline-start: 3px;
|
|
height: 1px;
|
|
position: absolute;
|
|
background: currentcolor;
|
|
transition: transform .3s ease-out;
|
|
content: ""
|
|
}
|
|
|
|
.ant-table-row-collapsed::after {
|
|
transform: rotate(0deg);
|
|
top: 3px;
|
|
bottom: 3px;
|
|
inset-inline-start: 7px;
|
|
width: 1px;
|
|
position: absolute;
|
|
background: currentcolor;
|
|
transition: transform .3s ease-out;
|
|
content: ""
|
|
}
|
|
|
|
.ant-table-row-expanded::before {
|
|
top: 7px;
|
|
inset-inline-end: 3px;
|
|
inset-inline-start: 3px;
|
|
height: 1px;
|
|
position: absolute;
|
|
background: currentcolor;
|
|
transition: transform .3s ease-out;
|
|
content: ""
|
|
}
|
|
|
|
.ant-table-row-expanded::after {
|
|
top: 3px;
|
|
bottom: 3px;
|
|
inset-inline-start: 7px;
|
|
width: 1px;
|
|
transform: rotate(90deg);
|
|
position: absolute;
|
|
background: currentcolor;
|
|
transition: transform .3s ease-out;
|
|
content: ""
|
|
}
|
|
|
|
.ant-menu-theme-switch.ant-menu-item .ant-switch:not(.ant-switch-disabled):active:after,
|
|
.ant-switch:not(.ant-switch-disabled):active:before {
|
|
width: 16px
|
|
}
|
|
|
|
.dark .ant-select-disabled .ant-select-selection {
|
|
background: var(--dark-color-surface-100);
|
|
border-color: var(--dark-color-surface-200);
|
|
color: rgb(255 255 255 / .25)
|
|
}
|
|
|
|
.dark .ant-select-disabled .anticon {
|
|
color: rgb(255 255 255 / .25)
|
|
}
|
|
|
|
.dark .ant-input-number-handler-down-disabled,
|
|
.dark .ant-input-number-handler-up-disabled {
|
|
background-color: rgb(0 0 0 / .1)
|
|
}
|
|
|
|
.dark .ant-input-number-handler-down-disabled .anticon,
|
|
.dark .ant-input-number-handler-up-disabled .anticon,
|
|
.dark .ant-input-number-handler-down:hover.ant-input-number-handler-down-disabled .anticon,
|
|
.dark .ant-input-number-handler-up:hover.ant-input-number-handler-up-disabled .anticon {
|
|
color: rgb(255 255 255 / .25)
|
|
}
|
|
|
|
.dark .ant-input-number-handler-down:active.ant-input-number-handler-down-disabled,
|
|
.dark .ant-input-number-handler-up:active.ant-input-number-handler-up-disabled {
|
|
background-color: rgb(0 0 0 / .2)
|
|
}
|
|
|
|
.ant-menu-dark .ant-menu-inline.ant-menu-sub {
|
|
background: var(--dark-color-surface-100);
|
|
box-shadow: none
|
|
}
|
|
|
|
.dark .ant-layout-sider-trigger {
|
|
background: var(--dark-color-surface-100);
|
|
color: rgb(255 255 255 / 65%)
|
|
}
|
|
|
|
.ant-layout-sider {
|
|
overflow: auto
|
|
}
|
|
|
|
.dark .ant-back-top-content {
|
|
background-color: var(--dark-color-back-top)
|
|
}
|
|
|
|
.dark .ant-back-top-content:hover {
|
|
background-color: var(--dark-color-back-top-hover)
|
|
}
|
|
|
|
.ant-calendar-time .ant-calendar-footer .ant-calendar-time-picker-btn {
|
|
text-transform: capitalize
|
|
}
|
|
|
|
.ant-calendar {
|
|
border-color: #fff0;
|
|
border-width: 0
|
|
}
|
|
|
|
.ant-calendar-time-picker-select li:focus,
|
|
li.ant-calendar-time-picker-select-option-selected {
|
|
color: rgb(0 0 0 / .65);
|
|
font-weight: 400;
|
|
background-color: #e8f4f2
|
|
}
|
|
|
|
.dark li.ant-calendar-time-picker-select-option-selected {
|
|
color: var(--dark-color-text-primary);
|
|
font-weight: 400
|
|
}
|
|
|
|
.dark .ant-calendar-time-picker-select li:focus {
|
|
color: #fff;
|
|
font-weight: 400;
|
|
background-color: var(--color-primary-100)
|
|
}
|
|
|
|
.ant-calendar-time-picker-select li:hover {
|
|
background: #f5f5f5
|
|
}
|
|
|
|
.ant-calendar-date {
|
|
transition: background .3s ease, color .3s ease
|
|
}
|
|
|
|
li.ant-calendar-time-picker-select-option-selected {
|
|
margin-block: 2px
|
|
}
|
|
|
|
.ant-calendar-time-picker-select {
|
|
padding: 4px
|
|
}
|
|
|
|
.ant-calendar-time-picker-select li {
|
|
height: 28px;
|
|
line-height: 28px;
|
|
border-radius: 4px
|
|
}
|
|
|
|
@media (min-width:769px) {
|
|
.ant-layout-content {
|
|
margin: 24px 16px
|
|
}
|
|
}
|
|
|
|
.ant-card-dark h2 {
|
|
color: var(--dark-color-text-primary)
|
|
}
|
|
|
|
.ant-backup-list-item {
|
|
gap: 10px
|
|
}
|
|
|
|
.ant-version-list-item {
|
|
--padding: 12px;
|
|
padding: var(--padding) !important;
|
|
gap: var(--padding)
|
|
}
|
|
|
|
.dark .ant-version-list-item svg {
|
|
color: var(--dark-color-text-primary)
|
|
}
|
|
|
|
.dark .ant-backup-list-item svg,
|
|
.dark .ant-badge-status-text,
|
|
.dark .ant-card-extra {
|
|
color: var(--dark-color-text-primary)
|
|
}
|
|
|
|
.dark .ant-card-actions>li {
|
|
color: rgba(255, 255, 255, .55)
|
|
}
|
|
|
|
.dark .ant-radio-inner {
|
|
background-color: var(--dark-color-surface-100);
|
|
border-color: var(--dark-color-surface-600)
|
|
}
|
|
|
|
.dark .ant-radio-checked .ant-radio-inner {
|
|
border-color: var(--color-primary-100)
|
|
}
|
|
|
|
.dark .ant-backup-list,
|
|
.dark .ant-version-list,
|
|
.dark .ant-card-actions,
|
|
.dark .ant-card-actions>li:not(:last-child) {
|
|
border-color: var(--dark-color-stroke)
|
|
}
|
|
|
|
.ant-card-actions {
|
|
background: transparent
|
|
}
|
|
|
|
.ip-hidden {
|
|
-webkit-user-select: none;
|
|
-moz-user-select: none;
|
|
user-select: none;
|
|
filter: blur(10px)
|
|
}
|
|
|
|
.running-animation .ant-badge-status-dot {
|
|
animation: runningAnimation 1.2s linear infinite
|
|
}
|
|
|
|
.running-animation .ant-badge-status-processing:after {
|
|
border-color: var(--color-primary-100)
|
|
}
|
|
|
|
@keyframes runningAnimation {
|
|
|
|
0%,
|
|
50%,
|
|
100% {
|
|
transform: scale(1);
|
|
opacity: 1
|
|
}
|
|
|
|
10% {
|
|
transform: scale(1.5);
|
|
opacity: .2
|
|
}
|
|
}
|
|
|
|
.mb-10 {
|
|
margin-bottom: 10px !important
|
|
}
|
|
|
|
.mb-12 {
|
|
margin-bottom: 12px !important
|
|
}
|
|
|
|
.mt-5 {
|
|
margin-top: 5px !important
|
|
}
|
|
|
|
.mr-8 {
|
|
margin-right: 8px !important
|
|
}
|
|
|
|
.ml-10 {
|
|
margin-left: 10px !important
|
|
}
|
|
|
|
.mr-05 {
|
|
margin-right: .5rem !important
|
|
}
|
|
|
|
.fs-1rem {
|
|
font-size: 1rem !important
|
|
}
|
|
|
|
.w-100 {
|
|
width: 100% !important
|
|
}
|
|
|
|
.w-70 {
|
|
width: 70px !important
|
|
}
|
|
|
|
.w-95 {
|
|
width: 95px !important
|
|
}
|
|
|
|
.text-center {
|
|
text-align: center !important
|
|
}
|
|
|
|
.cursor-pointer {
|
|
cursor: pointer !important
|
|
}
|
|
|
|
.float-right {
|
|
float: right !important
|
|
}
|
|
|
|
.va-middle {
|
|
vertical-align: middle !important
|
|
}
|
|
|
|
.d-flex {
|
|
display: flex !important
|
|
}
|
|
|
|
.justify-end {
|
|
justify-content: flex-end !important
|
|
}
|
|
|
|
.log-container {
|
|
height: auto;
|
|
max-height: 500px;
|
|
overflow: auto;
|
|
margin-top: .5rem
|
|
}
|
|
|
|
.max-w-400 {
|
|
max-width: 400px;
|
|
display: inline-block
|
|
}
|
|
|
|
.card-placeholder {
|
|
text-align: center;
|
|
padding: 30px 0;
|
|
margin-top: 10px;
|
|
background: transparent;
|
|
border: none
|
|
}
|
|
|
|
.ant-space.jc-center {
|
|
justify-content: center
|
|
}
|
|
|
|
#app.login-app {
|
|
overflow: hidden;
|
|
margin: 0 !important;
|
|
padding: 0 !important;
|
|
min-height: 100vh;
|
|
width: 100vw
|
|
}
|
|
|
|
#app.login-app * {
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale
|
|
}
|
|
|
|
#app.login-app h1 {
|
|
text-align: center;
|
|
height: 110px
|
|
}
|
|
|
|
#app.login-app .ant-layout-content {
|
|
margin: 0 !important;
|
|
padding: 0 !important;
|
|
width: 100vw;
|
|
max-width: 100vw
|
|
}
|
|
|
|
#app.login-app.ant-layout,
|
|
#app.login-app .ant-layout {
|
|
margin: 0 !important;
|
|
padding: 0 !important;
|
|
width: 100vw;
|
|
max-width: 100vw
|
|
}
|
|
|
|
.min-h-0 {
|
|
min-height: 0 !important
|
|
}
|
|
|
|
.min-h-100vh {
|
|
min-height: 100vh !important
|
|
}
|
|
|
|
.h-100 {
|
|
height: 100% !important
|
|
}
|
|
|
|
.h-50px {
|
|
height: 50px !important
|
|
}
|
|
|
|
.overflow-auto {
|
|
overflow: auto !important
|
|
}
|
|
|
|
.overflow-x-hidden {
|
|
overflow-x: hidden !important
|
|
}
|
|
|
|
.overflow-hidden-auto {
|
|
overflow: hidden auto !important
|
|
}
|
|
|
|
.mt-1rem {
|
|
margin-top: 1rem !important
|
|
}
|
|
|
|
.my-3rem {
|
|
margin-top: 3rem !important;
|
|
margin-bottom: 3rem !important
|
|
}
|
|
|
|
#app.login-app #login {
|
|
animation: charge .5s both;
|
|
background-color: #fff;
|
|
border-radius: 2rem;
|
|
padding: 4rem 3rem;
|
|
transition: all .3s;
|
|
user-select: none;
|
|
-webkit-user-select: none;
|
|
-moz-user-select: none
|
|
}
|
|
|
|
#app.login-app #login:hover {
|
|
box-shadow: 0 2px 8px rgba(0, 0, 0, .09)
|
|
}
|
|
|
|
@keyframes charge {
|
|
from {
|
|
transform: translateY(5rem);
|
|
opacity: 0
|
|
}
|
|
|
|
to {
|
|
transform: translateY(0);
|
|
opacity: 1
|
|
}
|
|
}
|
|
|
|
#app.login-app .under {
|
|
background-color: #c7ebe2;
|
|
z-index: 0
|
|
}
|
|
|
|
#app.login-app.dark .under {
|
|
background-color: var(--dark-color-login-wave)
|
|
}
|
|
|
|
#app.login-app.dark #login {
|
|
background-color: var(--dark-color-surface-100)
|
|
}
|
|
|
|
#app.login-app.dark h1 {
|
|
color: rgba(255, 255, 255)
|
|
}
|
|
|
|
#app.login-app #login .ant-form-item-children .ant-btn,
|
|
#app.login-app #login .ant-input {
|
|
height: 50px;
|
|
border-radius: 30px
|
|
}
|
|
|
|
#app.login-app #login .ant-input-group-addon {
|
|
border-radius: 0 30px 30px 0;
|
|
width: 50px;
|
|
font-size: 18px
|
|
}
|
|
|
|
#app.login-app #login .ant-input-affix-wrapper .ant-input-prefix {
|
|
left: 23px
|
|
}
|
|
|
|
#app.login-app #login .ant-input-affix-wrapper .ant-input:not(:first-child) {
|
|
padding-left: 50px
|
|
}
|
|
|
|
#app.login-app .centered {
|
|
display: flex;
|
|
text-align: center;
|
|
align-items: center;
|
|
justify-content: center;
|
|
width: 100%
|
|
}
|
|
|
|
#app.login-app .title {
|
|
font-size: 2rem;
|
|
margin-block-end: 2rem
|
|
}
|
|
|
|
#app.login-app .title b {
|
|
font-weight: bold !important
|
|
}
|
|
|
|
.ant-btn-primary-login {
|
|
width: 100%
|
|
}
|
|
|
|
.ant-btn-primary-login:focus,
|
|
.ant-btn-primary-login:hover {
|
|
color: #fff;
|
|
background-color: #006655;
|
|
border-color: #006655;
|
|
background-image: linear-gradient(270deg, rgba(123, 199, 77, 0) 30%, #009980, rgba(123, 199, 77, 0) 100%);
|
|
background-repeat: no-repeat;
|
|
animation: ma-bg-move ease-in-out 5s infinite;
|
|
background-position-x: -500px;
|
|
width: 95%;
|
|
animation-delay: -.5s;
|
|
box-shadow: 0 2px 0 rgba(0, 0, 0, .045)
|
|
}
|
|
|
|
.ant-btn-primary-login.active,
|
|
.ant-btn-primary-login:active {
|
|
color: #fff;
|
|
background-color: #006655;
|
|
border-color: #006655
|
|
}
|
|
|
|
.wave-btn-bg {
|
|
position: relative;
|
|
border-radius: 25px;
|
|
width: 100%;
|
|
transition: all .3s cubic-bezier(.645, .045, .355, 1)
|
|
}
|
|
|
|
.dark .wave-btn-bg {
|
|
color: #fff;
|
|
position: relative;
|
|
background-color: #0a7557;
|
|
border: 2px double transparent;
|
|
background-origin: border-box;
|
|
background-clip: padding-box, border-box;
|
|
background-size: 300%;
|
|
width: 100%;
|
|
z-index: 1
|
|
}
|
|
|
|
.dark .wave-btn-bg:hover {
|
|
animation: wave-btn-tara 4s ease infinite
|
|
}
|
|
|
|
.dark .wave-btn-bg-cl {
|
|
background-image: linear-gradient(rgba(13, 14, 33, 0), rgba(13, 14, 33, 0)), radial-gradient(circle at left top, #006655, #009980, #006655) !important;
|
|
border-radius: 3em
|
|
}
|
|
|
|
.dark .wave-btn-bg-cl:hover {
|
|
width: 95%
|
|
}
|
|
|
|
.dark .wave-btn-bg-cl:before {
|
|
position: absolute;
|
|
content: "";
|
|
top: -5px;
|
|
left: -5px;
|
|
bottom: -5px;
|
|
right: -5px;
|
|
z-index: -1;
|
|
background: inherit;
|
|
background-size: inherit;
|
|
border-radius: 4em;
|
|
opacity: 0;
|
|
transition: .5s
|
|
}
|
|
|
|
.dark .wave-btn-bg-cl:hover::before {
|
|
opacity: 1;
|
|
filter: blur(20px);
|
|
animation: wave-btn-tara 8s linear infinite
|
|
}
|
|
|
|
@keyframes wave-btn-tara {
|
|
to {
|
|
background-position: 300%
|
|
}
|
|
}
|
|
|
|
.waves-header {
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
width: 100%;
|
|
text-align: center;
|
|
background-color: #dbf5ed;
|
|
color: white;
|
|
z-index: -1
|
|
}
|
|
|
|
.dark .waves-header {
|
|
background-color: var(--dark-color-login-background)
|
|
}
|
|
|
|
.waves-inner-header {
|
|
height: 50vh;
|
|
width: 100%;
|
|
margin: 0;
|
|
padding: 0
|
|
}
|
|
|
|
.waves {
|
|
position: relative;
|
|
width: 100%;
|
|
height: 15vh;
|
|
margin-bottom: -8px;
|
|
min-height: 100px;
|
|
max-height: 150px
|
|
}
|
|
|
|
.parallax>use {
|
|
animation: move-forever 25s cubic-bezier(.55, .5, .45, .5) infinite
|
|
}
|
|
|
|
.dark .parallax>use {
|
|
fill: var(--dark-color-login-wave)
|
|
}
|
|
|
|
.parallax>use:nth-child(1) {
|
|
animation-delay: -2s;
|
|
animation-duration: 4s;
|
|
opacity: .2
|
|
}
|
|
|
|
.parallax>use:nth-child(2) {
|
|
animation-delay: -3s;
|
|
animation-duration: 7s;
|
|
opacity: .4
|
|
}
|
|
|
|
.parallax>use:nth-child(3) {
|
|
animation-delay: -4s;
|
|
animation-duration: 10s;
|
|
opacity: .6
|
|
}
|
|
|
|
.parallax>use:nth-child(4) {
|
|
animation-delay: -5s;
|
|
animation-duration: 13s
|
|
}
|
|
|
|
@keyframes move-forever {
|
|
0% {
|
|
transform: translate3d(-90px, 0, 0)
|
|
}
|
|
|
|
100% {
|
|
transform: translate3d(85px, 0, 0)
|
|
}
|
|
}
|
|
|
|
@media (max-width:768px) {
|
|
#app.login-app .waves {
|
|
height: 40px;
|
|
min-height: 40px
|
|
}
|
|
}
|
|
|
|
#app.login-app .words-wrapper {
|
|
width: 100%;
|
|
display: inline-block;
|
|
position: relative;
|
|
text-align: center
|
|
}
|
|
|
|
#app.login-app .words-wrapper b {
|
|
width: 100%;
|
|
display: inline-block;
|
|
position: absolute;
|
|
left: 0;
|
|
top: 0
|
|
}
|
|
|
|
#app.login-app .words-wrapper b.is-visible {
|
|
position: relative
|
|
}
|
|
|
|
#app.login-app .headline.zoom .words-wrapper {
|
|
-webkit-perspective: 300px;
|
|
-moz-perspective: 300px;
|
|
perspective: 300px
|
|
}
|
|
|
|
#app.login-app .headline {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center
|
|
}
|
|
|
|
#app.login-app .headline.zoom b {
|
|
opacity: 0
|
|
}
|
|
|
|
#app.login-app .headline.zoom b.is-visible {
|
|
opacity: 1;
|
|
-webkit-animation: zoom-in .8s;
|
|
-moz-animation: zoom-in .8s;
|
|
animation: cubic-bezier(.215, .61, .355, 1) zoom-in .8s
|
|
}
|
|
|
|
#app.login-app .headline.zoom b.is-hidden {
|
|
-webkit-animation: zoom-out .8s;
|
|
-moz-animation: zoom-out .8s;
|
|
animation: cubic-bezier(.215, .61, .355, 1) zoom-out .4s
|
|
}
|
|
|
|
@-webkit-keyframes zoom-in {
|
|
0% {
|
|
opacity: 0;
|
|
-webkit-transform: translateZ(100px)
|
|
}
|
|
|
|
100% {
|
|
opacity: 1;
|
|
-webkit-transform: translateZ(0)
|
|
}
|
|
}
|
|
|
|
@-moz-keyframes zoom-in {
|
|
0% {
|
|
opacity: 0;
|
|
-moz-transform: translateZ(100px)
|
|
}
|
|
|
|
100% {
|
|
opacity: 1;
|
|
-moz-transform: translateZ(0)
|
|
}
|
|
}
|
|
|
|
@keyframes zoom-in {
|
|
0% {
|
|
opacity: 0;
|
|
-webkit-transform: translateZ(100px);
|
|
-moz-transform: translateZ(100px);
|
|
-ms-transform: translateZ(100px);
|
|
-o-transform: translateZ(100px);
|
|
transform: translateZ(100px)
|
|
}
|
|
|
|
100% {
|
|
opacity: 1;
|
|
-webkit-transform: translateZ(0);
|
|
-moz-transform: translateZ(0);
|
|
-ms-transform: translateZ(0);
|
|
-o-transform: translateZ(0);
|
|
transform: translateZ(0)
|
|
}
|
|
}
|
|
|
|
.inbounds-page .ant-table:not(.ant-table-expanded-row .ant-table) {
|
|
outline: 1px solid #f0f0f0;
|
|
outline-offset: -1px;
|
|
border-radius: 1rem;
|
|
overflow-x: hidden
|
|
}
|
|
|
|
.inbounds-page.dark .ant-table:not(.ant-table-expanded-row .ant-table) {
|
|
outline-color: var(--dark-color-table-ring)
|
|
}
|
|
|
|
.inbounds-page .ant-table .ant-table-content .ant-table-scroll .ant-table-body {
|
|
overflow-y: hidden
|
|
}
|
|
|
|
.inbounds-page .ant-table .ant-table-content .ant-table-tbody tr:last-child .ant-table-wrapper {
|
|
margin: -10px 22px !important
|
|
}
|
|
|
|
.inbounds-page .ant-table .ant-table-content .ant-table-tbody tr:last-child .ant-table-wrapper .ant-table {
|
|
border-bottom-left-radius: 1rem;
|
|
border-bottom-right-radius: 1rem
|
|
}
|
|
|
|
.inbounds-page .ant-table .ant-table-content .ant-table-tbody tr:last-child tr:last-child td {
|
|
border-bottom-color: transparent
|
|
}
|
|
|
|
.inbounds-page .ant-table .ant-table-tbody tr:last-child.ant-table-expanded-row .ant-table-wrapper .ant-table-tbody>tr:last-child>td:first-child {
|
|
border-bottom-left-radius: 6px
|
|
}
|
|
|
|
.inbounds-page .ant-table .ant-table-tbody tr:last-child.ant-table-expanded-row .ant-table-wrapper .ant-table-tbody>tr:last-child>td:last-child {
|
|
border-bottom-right-radius: 6px
|
|
}
|
|
|
|
@media (max-width:768px) {
|
|
.inbounds-page .ant-card-body {
|
|
padding: .5rem
|
|
}
|
|
|
|
.inbounds-page .ant-table .ant-table-content .ant-table-tbody tr:last-child .ant-table-wrapper {
|
|
margin: -10px 2px !important
|
|
}
|
|
}
|
|
|
|
.inbounds-page.dark .ant-switch-small:not(.ant-switch-checked) {
|
|
background-color: var(--dark-color-surface-100) !important
|
|
}
|
|
|
|
.inbounds-page .ant-custom-popover-title {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 10px;
|
|
margin: 5px 0
|
|
}
|
|
|
|
.inbounds-page .ant-col-sm-24 {
|
|
margin: .5rem -2rem .5rem 2rem
|
|
}
|
|
|
|
.inbounds-page tr.hideExpandIcon .ant-table-row-expand-icon {
|
|
display: none
|
|
}
|
|
|
|
.inbounds-page .infinite-tag {
|
|
padding: 0 5px;
|
|
border-radius: 2rem;
|
|
min-width: 50px;
|
|
min-height: 22px
|
|
}
|
|
|
|
.inbounds-page .infinite-bar .ant-progress-inner .ant-progress-bg {
|
|
background-color: #F2EAF1;
|
|
border: #D5BED2 solid 1px
|
|
}
|
|
|
|
.inbounds-page.dark .infinite-bar .ant-progress-inner .ant-progress-bg {
|
|
background-color: #7a316f !important;
|
|
border: #7a316f solid 1px
|
|
}
|
|
|
|
.inbounds-page .ant-collapse {
|
|
margin: 5px 0
|
|
}
|
|
|
|
.inbounds-page .info-large-tag {
|
|
max-width: 200px;
|
|
overflow: hidden
|
|
}
|
|
|
|
.inbounds-page .client-comment {
|
|
font-size: 12px;
|
|
opacity: .75;
|
|
cursor: help
|
|
}
|
|
|
|
.inbounds-page .client-email {
|
|
font-weight: 500
|
|
}
|
|
|
|
.inbounds-page .client-popup-item {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 5px
|
|
}
|
|
|
|
.inbounds-page .online-animation .ant-badge-status-dot {
|
|
animation: onlineAnimation 1.2s linear infinite
|
|
}
|
|
|
|
@keyframes onlineAnimation {
|
|
|
|
0%,
|
|
50%,
|
|
100% {
|
|
transform: scale(1);
|
|
opacity: 1
|
|
}
|
|
|
|
10% {
|
|
transform: scale(1.5);
|
|
opacity: .2
|
|
}
|
|
}
|
|
|
|
.inbounds-page .tr-table-box {
|
|
display: flex;
|
|
gap: 4px;
|
|
justify-content: center;
|
|
align-items: center
|
|
}
|
|
|
|
.inbounds-page .tr-table-rt {
|
|
flex-basis: 70px;
|
|
min-width: 70px;
|
|
text-align: end
|
|
}
|
|
|
|
.inbounds-page .tr-table-lt {
|
|
flex-basis: 70px;
|
|
min-width: 70px;
|
|
text-align: start
|
|
}
|
|
|
|
.inbounds-page .tr-table-bar {
|
|
flex-basis: 160px;
|
|
min-width: 60px
|
|
}
|
|
|
|
.inbounds-page .tr-infinity-ch {
|
|
font-size: 14pt;
|
|
max-height: 24px;
|
|
display: inline-flex;
|
|
align-items: center
|
|
}
|
|
|
|
.inbounds-page .ant-table-expanded-row .ant-table .ant-table-body {
|
|
overflow-x: hidden
|
|
}
|
|
|
|
.inbounds-page .ant-table-expanded-row .ant-table-tbody>tr>td {
|
|
padding: 10px 2px
|
|
}
|
|
|
|
.inbounds-page .ant-table-expanded-row .ant-table-thead>tr>th {
|
|
padding: 12px 2px
|
|
}
|
|
|
|
@-webkit-keyframes zoom-out {
|
|
0% {
|
|
opacity: 1;
|
|
-webkit-transform: translateZ(0)
|
|
}
|
|
|
|
100% {
|
|
opacity: 0;
|
|
-webkit-transform: translateZ(-100px)
|
|
}
|
|
}
|
|
|
|
@-moz-keyframes zoom-out {
|
|
0% {
|
|
opacity: 1;
|
|
-moz-transform: translateZ(0)
|
|
}
|
|
|
|
100% {
|
|
opacity: 0;
|
|
-moz-transform: translateZ(-100px)
|
|
}
|
|
}
|
|
|
|
@keyframes zoom-out {
|
|
0% {
|
|
opacity: 1;
|
|
-webkit-transform: translateZ(0);
|
|
-moz-transform: translateZ(0);
|
|
-ms-transform: translateZ(0);
|
|
-o-transform: translateZ(0);
|
|
transform: translateZ(0)
|
|
}
|
|
|
|
100% {
|
|
opacity: 0;
|
|
-webkit-transform: translateZ(-100px);
|
|
-moz-transform: translateZ(-100px);
|
|
-ms-transform: translateZ(-100px);
|
|
-o-transform: translateZ(-100px);
|
|
transform: translateZ(-100px)
|
|
}
|
|
}
|
|
|
|
.setting-section {
|
|
position: absolute;
|
|
top: 0;
|
|
right: 0;
|
|
padding: 22px
|
|
}
|
|
|
|
.ant-space-item .ant-switch {
|
|
margin: 2px 0 4px
|
|
}
|
|
|
|
@media (min-width:769px) {
|
|
.settings-page .ant-layout-content {
|
|
margin: 24px 16px
|
|
}
|
|
}
|
|
|
|
@media (max-width:768px) {
|
|
.settings-page .ant-tabs-nav .ant-tabs-tab {
|
|
margin: 0;
|
|
padding: 12px .5rem
|
|
}
|
|
}
|
|
|
|
.settings-page .ant-tabs-bar {
|
|
margin: 0
|
|
}
|
|
|
|
.settings-page .ant-list-item {
|
|
display: block
|
|
}
|
|
|
|
.settings-page .alert-msg {
|
|
color: rgb(194, 117, 18);
|
|
font-weight: normal;
|
|
font-size: 16px;
|
|
padding: .5rem 1rem;
|
|
text-align: center;
|
|
background: rgb(255 145 0 / 15%);
|
|
margin: 1.5rem 2.5rem 0;
|
|
border-radius: .5rem;
|
|
transition: all .5s;
|
|
animation: settings-signal 3s cubic-bezier(.18, .89, .32, 1.28) infinite
|
|
}
|
|
|
|
.settings-page .alert-msg:hover {
|
|
cursor: default;
|
|
transition-duration: .3s;
|
|
animation: settings-signal .9s ease infinite
|
|
}
|
|
|
|
@keyframes settings-signal {
|
|
0% {
|
|
box-shadow: 0 0 0 0 rgba(194, 118, 18, .5)
|
|
}
|
|
|
|
50% {
|
|
box-shadow: 0 0 0 6px rgba(0, 0, 0, 0)
|
|
}
|
|
|
|
100% {
|
|
box-shadow: 0 0 0 6px rgba(0, 0, 0, 0)
|
|
}
|
|
}
|
|
|
|
.settings-page .alert-msg>i {
|
|
color: inherit;
|
|
font-size: 24px
|
|
}
|
|
|
|
.settings-page.dark .ant-input-password-icon {
|
|
color: var(--dark-color-text-primary)
|
|
}
|
|
|
|
.settings-page .ant-collapse-content-box .ant-alert {
|
|
margin-block-end: 12px
|
|
}
|
|
|
|
@media (min-width:769px) {
|
|
.xray-page .ant-layout-content {
|
|
margin: 24px 16px
|
|
}
|
|
}
|
|
|
|
@media (max-width:768px) {
|
|
.xray-page .ant-tabs-nav .ant-tabs-tab {
|
|
margin: 0;
|
|
padding: 12px .5rem
|
|
}
|
|
|
|
.xray-page .ant-table-thead>tr>th,
|
|
.xray-page .ant-table-tbody>tr>td {
|
|
padding: 10px 0
|
|
}
|
|
}
|
|
|
|
.xray-page .ant-tabs-bar {
|
|
margin: 0
|
|
}
|
|
|
|
.xray-page .ant-list-item {
|
|
display: block
|
|
}
|
|
|
|
.xray-page .ant-list-item>li {
|
|
padding: 10px 20px !important
|
|
}
|
|
|
|
.xray-page .ant-collapse-content-box .ant-alert {
|
|
margin-block-end: 12px
|
|
}
|
|
|
|
#app.login-app.dark #login input.ant-input:-webkit-autofill,
|
|
#app.login-app.dark #login input.ant-input:-webkit-autofill:hover,
|
|
#app.login-app.dark #login input.ant-input:-webkit-autofill:focus,
|
|
#app.login-app.dark #login .ant-input-password input:-webkit-autofill,
|
|
#app.login-app.dark #login .ant-input-password input:-webkit-autofill:hover,
|
|
#app.login-app.dark #login .ant-input-password input:-webkit-autofill:focus {
|
|
-webkit-text-fill-color: var(--login-input-color, #d6dce6) !important;
|
|
caret-color: var(--login-input-color, #d6dce6) !important;
|
|
-webkit-box-shadow: 0 0 0 1000px var(--login-input-bg, #1d2433) inset !important;
|
|
box-shadow: 0 0 0 1000px var(--login-input-bg, #1d2433) inset !important;
|
|
transition: background-color 9999s ease-in-out 0s !important
|
|
}
|
|
|
|
#app.login-app.dark #login input.ant-input:-moz-autofill,
|
|
#app.login-app.dark #login .ant-input-password input:-moz-autofill {
|
|
-moz-text-fill-color: var(--login-input-color, #d6dce6) !important;
|
|
caret-color: var(--login-input-color, #d6dce6) !important;
|
|
box-shadow: 0 0 0 1000px var(--login-input-bg, #1d2433) inset !important
|
|
}
|
|
|
|
#app.login-app.dark #login {
|
|
--login-input-bg: var(--dark-color-surface-200);
|
|
--login-input-color: var(--dark-color-text-primary)
|
|
}
|
|
|
|
/* Subscription page - dark theme fixes */
|
|
.dark .ant-descriptions-bordered .ant-descriptions-view {
|
|
background-color: transparent;
|
|
}
|
|
.dark .ant-descriptions-bordered .ant-descriptions-item-label,
|
|
.dark .ant-descriptions-bordered .ant-descriptions-item-content {
|
|
background-color: transparent;
|
|
border-color: var(--dark-color-surface-400);
|
|
}
|
|
.dark .ant-descriptions-bordered .ant-descriptions-item-label {
|
|
color: #a9c2d6; /* softer label color */
|
|
}
|
|
.dark .ant-descriptions-bordered .ant-descriptions-item-content {
|
|
color: var(--dark-color-text-primary);
|
|
}
|
|
.dark .ant-input[readonly],
|
|
.dark .ant-input-textarea .ant-input[readonly] {
|
|
background-color: var(--dark-color-surface-200);
|
|
color: var(--dark-color-text-primary);
|
|
} |