Tom Butcher
d5096dbba3
All checks were successful
farmcontrol/farmcontrol-ui/pipeline/head This commit looks good
- Updated CSS for dashboard tabs to improve layout and overflow handling, ensuring better visibility and usability. - Replaced Typography's Text component with a custom ElipsisText component for improved text overflow management. - Simplified tab selection logic in NavigationTabsContext, enhancing scrolling behavior when selecting tabs. - Introduced a new utility function to scroll tabs into view, improving user experience during navigation.
4304 lines
86 KiB
CSS
4304 lines
86 KiB
CSS
.ant-typography,
|
|
.ant-descriptions-item-label,
|
|
.ant-descriptions-item-content,
|
|
.ant-menu-title-content,
|
|
.ant-tag,
|
|
.ant-card,
|
|
.ant-checkbox-label,
|
|
.ant-btn,
|
|
.ant-breadcrumb-link,
|
|
.ant-dropdown-menu-title-content,
|
|
.ant-notification-notice-message,
|
|
.ant-notification-notice-description,
|
|
.ant-message-custom-content,
|
|
.ant-modal-title,
|
|
.ant-modal-body,
|
|
.ant-table-column-title,
|
|
.ant-table-cell,
|
|
.ant-alert-message,
|
|
.ant-drawer-title,
|
|
.ant-tooltip-inner,
|
|
.ant-form-item-control-input-content,
|
|
.ant-form-item-control-input,
|
|
.ant-input,
|
|
.ant-input-number .ant-input-number-input,
|
|
.segmented-nav-item-label,
|
|
.ant-badge-status-text,
|
|
.ant-tree-title,
|
|
.ant-select,
|
|
.ant-progress,
|
|
.ant-collapse,
|
|
.ant-picker-dropdown,
|
|
.ant-radio-group,
|
|
.g2-tooltip-title,
|
|
.g2-tooltip-list-item,
|
|
.ant-picker-input,
|
|
.ant-picker-header-view button,
|
|
.ant-badge,
|
|
.ant-select-dropdown,
|
|
.ant-splitter,
|
|
.adaptive-splitter,
|
|
.ant-steps-item-title,
|
|
.ant-steps-icon,
|
|
.ant-color-picker-presets-label,
|
|
.ant-select-selection-item,
|
|
.ant-color-picker-trigger-text,
|
|
[class*=' ant-radio'] {
|
|
font-family: 'DM Sans';
|
|
}
|
|
|
|
:root {
|
|
--color-list-view-tabs-border: #8282822e;
|
|
--color-button-border: #8282822e;
|
|
--color-button-background: #8282822e;
|
|
}
|
|
|
|
.ant-dropdown {
|
|
z-index: 999;
|
|
}
|
|
|
|
.ant-typography code,
|
|
.ant-typography pre,
|
|
.ͼ1 .cm-scroller {
|
|
font-family: 'DM Mono';
|
|
}
|
|
|
|
.ant-steps .ant-steps-item-icon {
|
|
line-height: 30px;
|
|
font-weight: 600;
|
|
}
|
|
|
|
.ant-steps .ant-steps-item-icon .anticon.anticon-check.ant-steps-finish-icon {
|
|
line-height: 32px;
|
|
}
|
|
|
|
.ant-typography .id-text {
|
|
font-family: 'DM Mono';
|
|
font-size: 11.9px;
|
|
vertical-align: top !important;
|
|
}
|
|
|
|
.ant-typography-ellipsis-single-line {
|
|
vertical-align: middle !important;
|
|
}
|
|
|
|
.ant-typography-ellipsis-single-line > code {
|
|
vertical-align: top !important;
|
|
}
|
|
|
|
.ant-select-selection-item .country-display {
|
|
margin-left: 1px !important;
|
|
}
|
|
|
|
.object-display-tag,
|
|
.object-type-display-tag,
|
|
.country-display {
|
|
opacity: 1;
|
|
transition: opacity 0.15s ease-in-out;
|
|
}
|
|
|
|
.object-select.ant-select-focused .object-display-tag,
|
|
.ant-select-focused .object-type-display-tag,
|
|
.ant-select-focused .country-display {
|
|
opacity: 0.5;
|
|
}
|
|
|
|
.flag {
|
|
line-height: 0.7;
|
|
}
|
|
|
|
.electron-navigation-wrapper {
|
|
user-select: none;
|
|
--webkit-user-select: none;
|
|
}
|
|
|
|
.dashboard-navigation-center {
|
|
position: relative;
|
|
flex: 1;
|
|
min-width: 0;
|
|
align-self: stretch;
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.dashboard-navigation-fade {
|
|
opacity: 1;
|
|
visibility: visible;
|
|
/* Incoming chrome waits for the outgoing fade, then fades in. */
|
|
transition:
|
|
opacity 0.2s ease 0.2s,
|
|
visibility 0s linear 0.2s;
|
|
}
|
|
|
|
.dashboard-navigation-fade-hidden {
|
|
opacity: 0;
|
|
visibility: hidden;
|
|
pointer-events: none;
|
|
/*
|
|
Visibility must use a non-zero duration on hide. A 0s visibility
|
|
transition makes WebKit apply hidden immediately, so opacity never
|
|
animates and the chrome glitches out instead of fading.
|
|
*/
|
|
transition:
|
|
opacity 0.2s ease 0s,
|
|
visibility 0.2s linear 0s;
|
|
}
|
|
|
|
.dashboard-navigation-window-title {
|
|
position: absolute;
|
|
inset: 0;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
padding-left: 16px;
|
|
padding-right: 16px;
|
|
font-size: 14px;
|
|
pointer-events: none;
|
|
user-select: none;
|
|
-webkit-user-select: none;
|
|
}
|
|
|
|
.dashboard-navigation-center-border {
|
|
position: absolute;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
height: 1px;
|
|
background: var(--color-header-border);
|
|
pointer-events: none;
|
|
opacity: 1;
|
|
/* Wait for outgoing chrome to finish fading before this line appears. */
|
|
transition: opacity 0.2s ease 0s;
|
|
}
|
|
|
|
.dashboard-navigation-center-border-hidden {
|
|
opacity: 0;
|
|
/* Stay through the gap, then fade out as incoming chrome fades in. */
|
|
transition: opacity 0.2s ease 0.2s;
|
|
}
|
|
|
|
.dashboard-menu-container {
|
|
position: relative;
|
|
height: 42px;
|
|
padding-top: 2px;
|
|
margin-left: 8px;
|
|
}
|
|
.dashboard-menu-container:after {
|
|
border-bottom: 1px solid var(--color-header-border);
|
|
content: '';
|
|
position: absolute;
|
|
left: -8px;
|
|
right: 0px;
|
|
bottom: 0;
|
|
}
|
|
|
|
.electron-navigation-leading,
|
|
.electron-navigation-trailing {
|
|
align-self: stretch;
|
|
height: 42px;
|
|
border-bottom: 1px solid var(--color-header-border);
|
|
}
|
|
|
|
.electron-navigation-trailing {
|
|
flex: 0 1 auto;
|
|
justify-content: flex-end;
|
|
}
|
|
|
|
.electron-body * {
|
|
-webkit-user-select: none;
|
|
-khtml-user-select: none;
|
|
-moz-user-select: none;
|
|
-o-user-select: none;
|
|
user-select: none;
|
|
}
|
|
|
|
.electron-body .ant-descriptions-item-content *,
|
|
.electron-body .ant-table-cell * {
|
|
-webkit-user-select: text;
|
|
-khtml-user-select: text;
|
|
-moz-user-select: text;
|
|
-o-user-select: text;
|
|
user-select: text;
|
|
}
|
|
|
|
/* Native macOS vibrancy — transparent web content over NSVisualEffectView */
|
|
html.macos-vibrancy {
|
|
--macos-window-corner-radius: 15px; /* keep in sync with MAC_WINDOW_CORNER_RADIUS */
|
|
}
|
|
|
|
html.macos-vibrancy,
|
|
html.macos-vibrancy body,
|
|
html.macos-vibrancy #root {
|
|
background: transparent !important;
|
|
}
|
|
|
|
html.macos-vibrancy .ant-layout.ant-layout-has-sider,
|
|
html.macos-vibrancy .main-layout {
|
|
background: transparent !important;
|
|
}
|
|
|
|
html.macos-vibrancy .light-mode {
|
|
--color-layout-background: rgba(255, 255, 255, 0.3);
|
|
}
|
|
|
|
html.macos-vibrancy .dark-mode {
|
|
--color-layout-background: rgba(0, 0, 0, 0.3);
|
|
}
|
|
|
|
html.macos-vibrancy .light-mode .ant-layout.main-content-layout {
|
|
background: var(--color-layout-background) !important;
|
|
position: relative;
|
|
}
|
|
|
|
html.macos-vibrancy .dark-mode .ant-layout.main-content-layout {
|
|
background: var(--color-layout-background) !important;
|
|
position: relative;
|
|
}
|
|
|
|
html.macos-vibrancy .dark-mode .ant-layout.main-content-layout:before {
|
|
content: '';
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
background: rgba(10, 10, 10, 0.85) !important;
|
|
z-index: -1;
|
|
}
|
|
|
|
html.macos-vibrancy .light-mode .ant-layout-sider {
|
|
background: rgba(244, 244, 244, 0.82) !important;
|
|
}
|
|
|
|
html.macos-vibrancy .light-mode .ant-layout.main-content-layout:before {
|
|
content: '';
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
background: rgba(255, 255, 255, 0.85) !important;
|
|
z-index: -1;
|
|
}
|
|
|
|
html.macos-vibrancy .dark-mode .ant-layout-sider {
|
|
background: rgba(10, 10, 10, 0.82) !important;
|
|
}
|
|
|
|
html.macos-vibrancy .light-mode .ant-layout-content {
|
|
background: transparent !important;
|
|
}
|
|
|
|
html.macos-vibrancy .dark-mode .ant-layout-content {
|
|
background: transparent !important;
|
|
}
|
|
|
|
html.macos-vibrancy .ant-layout-sider-light,
|
|
html.macos-vibrancy .electron-sider .ant-menu-light {
|
|
background: transparent !important;
|
|
}
|
|
|
|
html.macos-vibrancy
|
|
.dark-mode
|
|
.electron-sider
|
|
.ant-menu-light
|
|
.ant-menu-item-selected {
|
|
background-color: color-mix(in srgb, var(--color-primary) 30%, #00000010);
|
|
color: color-mix(in srgb, var(--color-primary) 75%, #ffffff);
|
|
}
|
|
|
|
html.macos-vibrancy
|
|
.light-mode
|
|
.electron-sider
|
|
.ant-menu-light
|
|
.ant-menu-item-selected {
|
|
background-color: color-mix(in srgb, var(--color-primary) 80%, #ffffff3d);
|
|
color: #ffffff;
|
|
}
|
|
|
|
html.macos-vibrancy .dark-mode .electron-navigation-wrapper {
|
|
background: rgba(10, 10, 10, 0.85) !important;
|
|
}
|
|
|
|
html.macos-vibrancy .light-mode .electron-navigation-wrapper {
|
|
background: rgba(255, 255, 255, 0.85) !important;
|
|
}
|
|
|
|
html.macos-vibrancy .electron-navigation {
|
|
background: rgba(0, 0, 0, 0) !important;
|
|
}
|
|
|
|
html.macos-vibrancy .light-mode .ant-layout.main-content-layout .ant-card {
|
|
background: rgba(255, 255, 255, 0.5) !important;
|
|
}
|
|
html.macos-vibrancy .dark-mode .ant-layout.main-content-layout .ant-card {
|
|
background: rgba(31, 31, 31, 0.5) !important;
|
|
}
|
|
|
|
.redTrafficLight {
|
|
width: 12px;
|
|
height: 12px;
|
|
background-color: #fe5f57;
|
|
border-radius: 50%;
|
|
}
|
|
|
|
.yellowTrafficLight {
|
|
width: 12px;
|
|
height: 12px;
|
|
background-color: #febc2e;
|
|
border-radius: 50%;
|
|
}
|
|
|
|
.greenTrafficLight {
|
|
width: 12px;
|
|
height: 12px;
|
|
background-color: #28c840;
|
|
border-radius: 50%;
|
|
}
|
|
|
|
.electron-navigation {
|
|
line-height: 40px;
|
|
}
|
|
|
|
.electron-sidebar.ant-menu-inline .ant-menu-item,
|
|
.electron-sidebar.ant-menu-inline.ant-menu-root .ant-menu-submenu-title {
|
|
padding-left: 20px !important;
|
|
}
|
|
|
|
.electron-navigation .ant-menu-overflow-item-rest {
|
|
padding-inline: 10px;
|
|
}
|
|
|
|
.electron-navigation.ant-menu-horizontal .ant-menu-item {
|
|
padding-inline: 12px;
|
|
}
|
|
|
|
.electron-sidebar .ant-menu-item,
|
|
.electron-sidebar .ant-menu-submenu-title {
|
|
height: 32.5px !important;
|
|
line-height: 32.5px !important;
|
|
}
|
|
|
|
.electron-sider.ant-layout-sider-collapsed {
|
|
min-width: var(--dashboard-sidebar-collapsed-width, 55px) !important;
|
|
max-width: var(--dashboard-sidebar-collapsed-width, 55px) !important;
|
|
}
|
|
|
|
.loading-modal .ant-modal-footer {
|
|
display: none;
|
|
}
|
|
|
|
:root {
|
|
--unit-100vh: 100vh;
|
|
--scrollbox-vertical-right-padding: 16px;
|
|
--scrollbox-horizontal-bottom-padding: 16px;
|
|
}
|
|
@supports (height: 100dvh) {
|
|
:root {
|
|
--unit-100vh: 100dvh;
|
|
}
|
|
}
|
|
|
|
.dashboard-cards-header .ant-table-tbody {
|
|
display: none;
|
|
}
|
|
|
|
.ant-menu-overflow-item-rest::after {
|
|
border-bottom: none !important;
|
|
}
|
|
|
|
.ant-menu-overflow-item > div:hover {
|
|
background-color: transparent !important;
|
|
}
|
|
|
|
code {
|
|
margin: 0;
|
|
}
|
|
|
|
.App {
|
|
text-align: center;
|
|
}
|
|
|
|
.App-logo {
|
|
height: 40vmin;
|
|
pointer-events: none;
|
|
}
|
|
|
|
@media (prefers-reduced-motion: no-preference) {
|
|
.App-logo {
|
|
animation: App-logo-spin infinite 20s linear;
|
|
}
|
|
}
|
|
|
|
.App-header {
|
|
background-color: #be871a;
|
|
min-height: 100vh;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
font-size: calc(10px + 2vmin);
|
|
color: white;
|
|
}
|
|
|
|
.App-link {
|
|
color: #61dafb;
|
|
}
|
|
|
|
@keyframes App-logo-spin {
|
|
from {
|
|
transform: rotate(0deg);
|
|
}
|
|
to {
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
|
|
.iddisplay .ant-popover-inner {
|
|
padding: 0 !important;
|
|
}
|
|
|
|
.iddisplay > *:first-child {
|
|
min-width: 0;
|
|
flex: 0 1 auto;
|
|
max-width: 100%;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.iddisplay .ant-btn {
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
.miscid > *:first-child {
|
|
min-width: 0;
|
|
flex: 0 1 auto;
|
|
max-width: 100%;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.miscid .ant-btn {
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
.ant-popover-inner:has(.spotlight-tooltip) {
|
|
padding: 0 !important;
|
|
}
|
|
|
|
.ant-popover:has(.spotlight-tooltip) {
|
|
z-index: 1051;
|
|
}
|
|
|
|
:root,
|
|
.light-mode,
|
|
html:has(.light-mode) {
|
|
--color-layout-background: #ffffff;
|
|
--kbd-color: #363636;
|
|
--kbd-bg: #efefef;
|
|
--kbd-inset: #e8e8e8;
|
|
--kbd-edge: #c3c3c3;
|
|
--kbd-ridge: #c9c9c9;
|
|
--kbd-drop-shadow: rgb(51 51 51 / 40%);
|
|
--kbd-text-shadow: #f6f6f6;
|
|
}
|
|
|
|
.dark-mode,
|
|
html:has(.dark-mode) {
|
|
--color-layout-background: #000000;
|
|
--kbd-color: #ececec;
|
|
--kbd-bg: #3a3a3a;
|
|
--kbd-inset: #323232;
|
|
--kbd-edge: #1c1c1c;
|
|
--kbd-ridge: #141414;
|
|
--kbd-drop-shadow: rgb(0 0 0 / 45%);
|
|
--kbd-text-shadow: #111111;
|
|
}
|
|
|
|
.keyboard-key {
|
|
display: inline-block;
|
|
color: var(--kbd-color);
|
|
text-decoration: none;
|
|
text-align: center;
|
|
background: var(--kbd-bg);
|
|
padding: 3px 7px;
|
|
margin: 5px 3px;
|
|
border-radius: 4px;
|
|
border: 1px solid color-mix(in srgb, var(--color-text) 10%, transparent);
|
|
box-shadow:
|
|
inset 0 0 25px var(--kbd-inset),
|
|
0 1px 0 var(--kbd-edge),
|
|
0 3px 0 var(--kbd-ridge),
|
|
0 4px 8px var(--kbd-drop-shadow);
|
|
text-shadow: 0 1px 0 var(--kbd-text-shadow);
|
|
}
|
|
|
|
.keyboard-key-md {
|
|
padding: 4.5px 10.5px;
|
|
margin: 7.5px 3.5px;
|
|
font-size: 110%;
|
|
border-radius: 10px;
|
|
box-shadow:
|
|
inset 0 0 37.5px var(--kbd-inset),
|
|
0 1.5px 0 var(--kbd-edge),
|
|
0 4.5px 0 var(--kbd-ridge),
|
|
0 6px 12px var(--kbd-drop-shadow);
|
|
text-shadow: 0 1.5px 0 var(--kbd-text-shadow);
|
|
}
|
|
|
|
.keyboard-key-lg {
|
|
padding: 6px 14px;
|
|
margin: 10px 6px;
|
|
font-size: 200%;
|
|
border-radius: 8px;
|
|
box-shadow:
|
|
inset 0 0 50px var(--kbd-inset),
|
|
0 2px 0 var(--kbd-edge),
|
|
0 6px 0 var(--kbd-ridge),
|
|
0 8px 16px var(--kbd-drop-shadow);
|
|
text-shadow: 0 2px 0 var(--kbd-text-shadow);
|
|
}
|
|
|
|
.keyboard-key-xl {
|
|
padding: 9px 21px;
|
|
margin: 15px 9px;
|
|
font-size: 300%;
|
|
border-radius: 12px;
|
|
box-shadow:
|
|
inset 0 0 75px var(--kbd-inset),
|
|
0 3px 0 var(--kbd-edge),
|
|
0 9px 0 var(--kbd-ridge),
|
|
0 12px 24px var(--kbd-drop-shadow);
|
|
text-shadow: 0 3px 0 var(--kbd-text-shadow);
|
|
}
|
|
|
|
.cursor-tooltip {
|
|
opacity: 0;
|
|
transition: opacity 0.25s ease;
|
|
}
|
|
|
|
.cursor-tooltip.is-visible {
|
|
opacity: 1;
|
|
transition: opacity 0.15s ease;
|
|
}
|
|
|
|
.cursor-tooltip .ant-card {
|
|
box-shadow:
|
|
0 6px 16px 0 rgba(0, 0, 0, 0.08),
|
|
0 3px 6px -4px rgba(0, 0, 0, 0.12),
|
|
0 9px 28px 8px rgba(0, 0, 0, 0.05);
|
|
}
|
|
|
|
/* --- Start of src/index.css --- */
|
|
body {
|
|
margin: 0;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.ant-modal-mask,
|
|
.ant-drawer-mask {
|
|
backdrop-filter: blur(3px);
|
|
}
|
|
|
|
.ant-spin-blur {
|
|
filter: blur(3px);
|
|
}
|
|
|
|
.spin {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
color: var(--color-primary);
|
|
font-size: 20px;
|
|
line-height: 1;
|
|
}
|
|
|
|
.spin-nested {
|
|
position: relative;
|
|
display: flex;
|
|
flex-direction: column;
|
|
width: 100%;
|
|
height: 100%;
|
|
min-width: 0;
|
|
min-height: 0;
|
|
flex: 1;
|
|
}
|
|
|
|
.spin-content {
|
|
position: relative;
|
|
display: flex;
|
|
flex-direction: column;
|
|
width: 100%;
|
|
height: 100%;
|
|
min-width: 0;
|
|
min-height: 0;
|
|
flex: 1;
|
|
transition: opacity 0.3s;
|
|
}
|
|
|
|
.spin-content.is-spinning {
|
|
filter: blur(3px);
|
|
opacity: 0.5;
|
|
user-select: none;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.spin-overlay {
|
|
position: absolute;
|
|
inset: 0;
|
|
z-index: 4;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
color: var(--color-primary);
|
|
font-size: 20px;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.spin.spin-sm,
|
|
.spin-nested.spin-sm .spin-overlay {
|
|
font-size: 14px;
|
|
}
|
|
|
|
.spin.spin-lg,
|
|
.spin-nested.spin-lg .spin-overlay {
|
|
font-size: 32px;
|
|
}
|
|
/* --- End of src/index.css --- */
|
|
|
|
/* --- Start of src/components/Dashboard/Layout.css --- */
|
|
.no-padding-collapse .ant-collapse-header {
|
|
padding: 0 !important;
|
|
}
|
|
|
|
.no-padding-collapse .ant-collapse-content-box {
|
|
padding: 0 !important;
|
|
}
|
|
|
|
.no-h-padding-collapse .ant-collapse-header {
|
|
padding-top: 0 !important;
|
|
padding-left: 0 !important;
|
|
padding-right: 0 !important;
|
|
padding-bottom: 4px !important;
|
|
}
|
|
|
|
.no-h-padding-collapse .ant-collapse-content-box {
|
|
padding-left: 0 !important;
|
|
padding-right: 0 !important;
|
|
padding-bottom: 0 !important;
|
|
}
|
|
|
|
.no-padding-collapse .ant-collapse-item,
|
|
.no-v-padding-collapse .ant-collapse-item {
|
|
border: none !important;
|
|
}
|
|
/* --- End of src/components/Dashboard/Layout.css --- */
|
|
|
|
/* --- Start of src/components/Dashboard/common/DashboardSidebar.css --- */
|
|
.ant-layout-sider {
|
|
height: 100%;
|
|
}
|
|
|
|
.dashboard-sider.ant-layout-sider {
|
|
width: 100% !important;
|
|
min-width: 0 !important;
|
|
max-width: 100% !important;
|
|
flex: 0 0 100% !important;
|
|
transition:
|
|
all 0.3s cubic-bezier(0.2, 0, 0, 1) 0s,
|
|
background 0s;
|
|
}
|
|
|
|
.dashboard-sider.ant-layout-sider-collapsed {
|
|
width: var(--dashboard-sidebar-collapsed-width, 80px) !important;
|
|
min-width: var(--dashboard-sidebar-collapsed-width, 80px) !important;
|
|
max-width: var(--dashboard-sidebar-collapsed-width, 80px) !important;
|
|
flex: 0 0 var(--dashboard-sidebar-collapsed-width, 80px) !important;
|
|
}
|
|
/* --- End of src/components/Dashboard/common/DashboardSidebar.css --- */
|
|
|
|
.objectTableDescritions > .ant-descriptions-view > table {
|
|
table-layout: fixed !important;
|
|
}
|
|
|
|
.objectTableDescritions
|
|
> .ant-descriptions-view
|
|
.ant-descriptions-row
|
|
> .ant-descriptions-item-label {
|
|
width: 35%;
|
|
}
|
|
|
|
.farmcontrol-splitter > .ant-splitter-bar,
|
|
.farmcontrol-splitter > .adaptive-splitter-bar {
|
|
margin: 8px;
|
|
}
|
|
|
|
.farmcontrol-splitter.large > .ant-splitter-bar,
|
|
.farmcontrol-splitter.large > .adaptive-splitter-bar {
|
|
margin: 11px;
|
|
opacity: 0.6;
|
|
}
|
|
|
|
.dark-mode {
|
|
--sb-track-color: #1d1d1d;
|
|
--sb-thumb-color: #848484;
|
|
--sb-size: 8px;
|
|
}
|
|
|
|
.light-mode {
|
|
--sb-thumb-color: #87878718;
|
|
--sb-size: 8px;
|
|
}
|
|
|
|
::-webkit-scrollbar {
|
|
width: 8px;
|
|
}
|
|
|
|
::-webkit-scrollbar:vertical {
|
|
width: 8px;
|
|
}
|
|
|
|
::-webkit-scrollbar:horizontal {
|
|
height: 8px;
|
|
}
|
|
|
|
/* Track */
|
|
::-webkit-scrollbar-track {
|
|
background: transparent;
|
|
}
|
|
|
|
/* Handle */
|
|
::-webkit-scrollbar-thumb {
|
|
background: #8888881a;
|
|
border: 2px solid rgba(0, 0, 0, 0);
|
|
background-clip: padding-box;
|
|
transition: all 1s;
|
|
-moz-transition: all 1s;
|
|
-webkit-transition: all 1s;
|
|
}
|
|
|
|
::-webkit-scrollbar-corner {
|
|
background: #00000000; /* The scroll corner color */
|
|
}
|
|
|
|
::-webkit-scrollbar-thumb:vertical {
|
|
border-left: none;
|
|
}
|
|
|
|
::-webkit-scrollbar-thumb:horizontal {
|
|
border-top: none;
|
|
}
|
|
|
|
/* Handle on hover */
|
|
::-webkit-scrollbar-thumb:hover {
|
|
background: #5555551f;
|
|
border: 2px solid rgba(0, 0, 0, 0);
|
|
background-clip: padding-box;
|
|
}
|
|
|
|
::-webkit-scrollbar-thumb:vertical:hover {
|
|
border-left: none;
|
|
}
|
|
|
|
::-webkit-scrollbar-thumb:horizontal:hover {
|
|
border-top: none;
|
|
}
|
|
|
|
.ant-table-body {
|
|
scrollbar-color: auto;
|
|
}
|
|
|
|
.ant-select-selection-item .ant-tag {
|
|
margin-left: 1px !important;
|
|
}
|
|
|
|
.tags-input.ant-select-multiple .ant-select-selection-item,
|
|
.tags-input.ant-tree-select.ant-select-multiple .ant-select-selection-item {
|
|
background: transparent !important;
|
|
border: none !important;
|
|
padding: 0 !important;
|
|
margin-inline-end: 0 !important;
|
|
height: auto !important;
|
|
line-height: normal !important;
|
|
}
|
|
|
|
.tags-input.ant-select-multiple .ant-select-selection-item-remove,
|
|
.tags-input.ant-tree-select.ant-select-multiple
|
|
.ant-select-selection-item-remove {
|
|
display: none;
|
|
}
|
|
|
|
.ant-badge.ant-badge-status {
|
|
line-height: 18.5px;
|
|
}
|
|
|
|
.simplebar-track.simplebar-vertical {
|
|
right: calc(-1 * var(--scrollbox-vertical-right-padding));
|
|
width: 8px !important;
|
|
}
|
|
|
|
.simplebar-track.simplebar-horizontal {
|
|
bottom: calc(-1 * var(--scrollbox-horizontal-bottom-padding));
|
|
height: 8px !important;
|
|
}
|
|
|
|
.scrollbox-inner .simplebar-track.simplebar-vertical {
|
|
right: var(--scrollbox-vertical-right-padding);
|
|
}
|
|
|
|
.scrollbox-inner .simplebar-track.simplebar-horizontal {
|
|
bottom: var(--scrollbox-horizontal-bottom-padding);
|
|
}
|
|
|
|
.scrollbox-inner-small-padding .simplebar-track.simplebar-vertical {
|
|
right: 8px;
|
|
bottom: 8px;
|
|
top: 8px;
|
|
}
|
|
|
|
.scrollbox-inner-small-padding .simplebar-track.simplebar-horizontal {
|
|
bottom: 8px;
|
|
}
|
|
|
|
.scrollbox-horizontal > [data-simplebar],
|
|
.scrollbox-horizontal .simplebar-wrapper {
|
|
width: 100%;
|
|
}
|
|
|
|
.simplebar-scrollbar:before {
|
|
background: #78787854 !important;
|
|
transition: opacity 0.3s ease;
|
|
}
|
|
|
|
.printer-alerts-display-popover .ant-popover-inner {
|
|
padding: 0 !important;
|
|
margin: 0 24px !important;
|
|
}
|
|
|
|
.child-table-rollups *::-webkit-scrollbar:horizontal {
|
|
height: 0px;
|
|
}
|
|
|
|
.rollup-table .ant-table-container {
|
|
border-start-start-radius: 0px !important;
|
|
border-start-end-radius: 0px !important;
|
|
}
|
|
|
|
.rollup-table .ant-table {
|
|
border-radius: 0px !important;
|
|
}
|
|
|
|
.ant-select-selection-item .ant-tag.object-display-tag,
|
|
.ant-select-tree-title .ant-tag.object-display-tag,
|
|
.ant-select-dropdown .ant-tag.object-display-tag {
|
|
background: transparent !important;
|
|
border: none;
|
|
padding: 0;
|
|
margin-right: 1px !important;
|
|
}
|
|
|
|
.object-select .ant-select-selection-item .object-display-tag {
|
|
top: 1.5px;
|
|
}
|
|
|
|
.object-select .ant-select-selection-item .object-display-tag .iddisplay,
|
|
.ant-select-dropdown .object-display-tag .iddisplay {
|
|
margin-bottom: -1px;
|
|
}
|
|
|
|
.ant-select-tree-title .object-display-tag {
|
|
top: 0.5px;
|
|
}
|
|
|
|
.ant-select-outlined.ant-select-multiple
|
|
.ant-select-selection-item
|
|
.object-display-tag {
|
|
padding-top: 0px;
|
|
}
|
|
|
|
.ant-select-outlined.ant-select-multiple
|
|
.ant-select-selection-item
|
|
.object-display-tag
|
|
.ant-flex {
|
|
margin-top: 0;
|
|
}
|
|
|
|
.ant-select-tree-node-content-wrapper .object-display-tag > .ant-flex {
|
|
margin-top: 1px;
|
|
}
|
|
|
|
.object-info-descriptions table {
|
|
table-layout: fixed !important;
|
|
}
|
|
|
|
.ant-btn-variant-outlined.ant-btn.ant-btn-icon-only {
|
|
min-width: 32px;
|
|
}
|
|
|
|
.electron-spotlight-content .ant-input-outlined {
|
|
background-color: transparent !important;
|
|
border: 1px solid transparent !important;
|
|
border-radius: 0 !important;
|
|
box-shadow: none !important;
|
|
}
|
|
|
|
.ant-modal .ant-modal-content {
|
|
border-radius: 22px;
|
|
padding: 24px;
|
|
}
|
|
|
|
.ant-badge .ant-badge-count-sm {
|
|
font-size: 10px;
|
|
}
|
|
|
|
.input-number-cal {
|
|
position: relative;
|
|
}
|
|
|
|
.input-number-cal input {
|
|
padding: 4px 12px;
|
|
}
|
|
|
|
.input-number-cal-highlight {
|
|
position: absolute;
|
|
display: flex;
|
|
align-items: center;
|
|
overflow: hidden;
|
|
white-space: pre;
|
|
pointer-events: none;
|
|
z-index: 2;
|
|
color: color-mix(in srgb, var(--color-text) 85%, transparent);
|
|
}
|
|
|
|
.input-number-cal-operator {
|
|
color: var(--color-purple);
|
|
}
|
|
|
|
.input-number-cal-bracket {
|
|
color: var(--color-primary);
|
|
}
|
|
|
|
.input-number-cal-expr-input,
|
|
.input-number-cal-expr-input.ant-input-affix-wrapper {
|
|
position: relative;
|
|
z-index: 1;
|
|
}
|
|
|
|
.input-number-cal-expr-input.ant-input-affix-wrapper .ant-input,
|
|
.input-number-cal-expr-input.ant-input-outlined:not(.ant-input-affix-wrapper) {
|
|
color: transparent !important;
|
|
caret-color: var(--color-text);
|
|
}
|
|
|
|
.input-number-cal-expr-input.ant-input-affix-wrapper .ant-input {
|
|
background: transparent !important;
|
|
}
|
|
|
|
.input-number-cal .ant-input-suffix {
|
|
margin-right: 28px;
|
|
}
|
|
|
|
.input-number-cal .ant-input-outlined {
|
|
border-color: var(--color-purple);
|
|
box-shadow: 0 0 0 2px color-mix(in srgb, var(--color-purple) 31%, transparent);
|
|
}
|
|
|
|
.input-number-cal .ant-input {
|
|
font-family: 'DM Sans';
|
|
font-weight: 400;
|
|
}
|
|
|
|
.input-number-cal-icon {
|
|
position: absolute;
|
|
right: 10px;
|
|
top: 0;
|
|
bottom: 1px;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
z-index: 1;
|
|
}
|
|
|
|
/* --- Start of src/components/Dashboard/common/MarkdownInput.css --- */
|
|
.md-editor__content {
|
|
padding: 24px;
|
|
font-size: 14px;
|
|
line-height: 1.6;
|
|
color: var(--baseText);
|
|
white-space: pre-wrap;
|
|
outline: none;
|
|
}
|
|
|
|
.md-editor {
|
|
color: var(--baseText);
|
|
}
|
|
|
|
.md-editor .tiptap {
|
|
min-height: var(--md-editor-min-height);
|
|
}
|
|
|
|
.md-editor .tiptap p.is-editor-empty:first-child::before {
|
|
content: 'Enter text here...';
|
|
color: var(--baseBorderHover);
|
|
float: left;
|
|
height: 0;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.markdown pre,
|
|
.markdown code,
|
|
.markdown blockquote {
|
|
background: var(--baseBgSubtle);
|
|
color: var(--baseTextContrast);
|
|
}
|
|
|
|
.markdown pre {
|
|
border-radius: 8px;
|
|
padding: 12px;
|
|
overflow-x: auto;
|
|
}
|
|
|
|
.markdown blockquote {
|
|
border-left: 3px solid var(--color-primary);
|
|
margin: 0;
|
|
padding: 8px 12px;
|
|
}
|
|
|
|
.markdown hr {
|
|
border: 0;
|
|
border-top: 1px solid #8484844d;
|
|
margin: 10px 0;
|
|
}
|
|
|
|
.markdown *:first-child {
|
|
margin-top: 0;
|
|
}
|
|
|
|
.markdown h1:first-child {
|
|
margin-top: -4px;
|
|
}
|
|
|
|
.markdown h2:first-child {
|
|
margin-top: -3px;
|
|
}
|
|
|
|
.markdown h3:first-child {
|
|
margin-top: -2px;
|
|
}
|
|
|
|
.markdown h4:first-child {
|
|
margin-top: -1px;
|
|
}
|
|
|
|
.markdown *:last-child {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.markdown h1,
|
|
.markdown h2,
|
|
.markdown h3,
|
|
.markdown h4,
|
|
.markdown h5,
|
|
.markdown h6 {
|
|
margin-bottom: 10px;
|
|
line-height: 1;
|
|
}
|
|
|
|
.markdown p {
|
|
font-size: 14px;
|
|
margin: 10px 0;
|
|
line-height: 1.6;
|
|
}
|
|
|
|
.markdown h1 {
|
|
font-size: 32px;
|
|
}
|
|
|
|
.markdown h2 {
|
|
font-size: 26px;
|
|
}
|
|
|
|
.markdown h3 {
|
|
font-size: 20px;
|
|
}
|
|
|
|
.markdown h4 {
|
|
font-size: 16px;
|
|
}
|
|
|
|
.markdown {
|
|
width: 100%;
|
|
}
|
|
|
|
.property-changes .markdown {
|
|
width: unset;
|
|
}
|
|
|
|
.markdown ul,
|
|
.markdown ol {
|
|
padding-left: 20px;
|
|
margin: 10px 0;
|
|
}
|
|
|
|
.markdown li {
|
|
margin: 10px 0;
|
|
line-height: 1;
|
|
}
|
|
|
|
.markdown-code-editor {
|
|
padding: 18px;
|
|
}
|
|
|
|
.markdown-splitter > .ant-splitter-bar {
|
|
margin: 8px 0;
|
|
}
|
|
|
|
.markdown-code-editor .cm-editor {
|
|
background-color: transparent;
|
|
}
|
|
|
|
.markdown-code-editor .cm-editor.cm-focused {
|
|
outline: none;
|
|
}
|
|
|
|
.markdown-code-editor .cm-editor .cm-gutters {
|
|
background-color: transparent;
|
|
}
|
|
|
|
.h-100 {
|
|
height: 100%;
|
|
min-height: 0;
|
|
}
|
|
|
|
.ant-table.ant-table-middle .ant-table-filter-trigger {
|
|
height: 20px;
|
|
}
|
|
|
|
.ant-table-wrapper .ant-table-filter-column {
|
|
align-items: center;
|
|
}
|
|
|
|
span.ant-skeleton-input.ant-skeleton-input-sm.text-skeleton {
|
|
width: 50px;
|
|
min-width: 0;
|
|
height: 20px;
|
|
}
|
|
|
|
.sidebar-scroll .simplebar-track.simplebar-vertical {
|
|
top: 8px;
|
|
right: calc(-1 * var(--scrollbox-vertical-right-padding) - 0.5px);
|
|
width: 8px !important;
|
|
}
|
|
|
|
.sidebar-scroll
|
|
.simplebar-track.simplebar-vertical
|
|
.simplebar-scrollbar:before {
|
|
top: 2px;
|
|
bottom: 2px;
|
|
left: 2px;
|
|
right: 2px;
|
|
}
|
|
|
|
.ant-color-picker
|
|
.ant-color-picker-inner
|
|
.ant-color-picker-panel
|
|
.ant-color-picker-select
|
|
.ant-color-picker-palette {
|
|
border-radius: 8px;
|
|
}
|
|
|
|
.ant-color-picker
|
|
.ant-collapse
|
|
.ant-collapse-item:last-child
|
|
.ant-collapse-content-box {
|
|
padding-bottom: 0 !important;
|
|
}
|
|
|
|
.ant-color-picker .ant-collapse .ant-collapse-expand-icon {
|
|
height: 12px !important;
|
|
padding-inline-end: 8px !important;
|
|
}
|
|
|
|
.ant-color-picker .ant-color-picker-inner .ant-color-picker-presets-label {
|
|
line-height: 1 !important;
|
|
}
|
|
|
|
.ant-color-picker
|
|
.ant-collapse
|
|
.ant-collapse-item:first-child
|
|
.ant-collapse-header {
|
|
margin: 0 0 5.5px 0;
|
|
}
|
|
|
|
.ant-color-picker .ant-collapse .ant-collapse-item .ant-collapse-header {
|
|
margin: 5.5px 0;
|
|
}
|
|
|
|
.subSteps.ant-timeline .ant-timeline-item-last > .ant-timeline-item-content {
|
|
min-height: unset;
|
|
}
|
|
|
|
.subSteps.ant-timeline .ant-timeline-item-last {
|
|
padding-bottom: 6px;
|
|
}
|
|
|
|
.subSteps.ant-timeline {
|
|
margin-top: 16px;
|
|
}
|
|
|
|
.ant-steps.ant-steps-vertical
|
|
> .ant-steps-item
|
|
> .ant-steps-item-container
|
|
> .ant-steps-item-tail::after {
|
|
width: 1.5px;
|
|
}
|
|
|
|
.subSteps.ant-timeline .ant-timeline-item-head {
|
|
background-color: unset;
|
|
}
|
|
|
|
.subSteps.ant-timeline .subSteps-dot {
|
|
width: 10px;
|
|
height: 10px;
|
|
border-radius: 50%;
|
|
background-color: var(--color-primary);
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.subSteps.ant-timeline .subSteps-dot svg path {
|
|
stroke: var(--layout-modal-bg);
|
|
stroke-width: 10px;
|
|
}
|
|
|
|
.subSteps.ant-timeline .subSteps-dot span {
|
|
width: 5px;
|
|
height: 5px;
|
|
margin-top: 0px;
|
|
margin-right: 0px;
|
|
}
|
|
|
|
.subSteps.ant-timeline .subSteps-dot.subSteps-dot-disabled {
|
|
background-color: var(--color-primary-disabled);
|
|
}
|
|
|
|
.subSteps.ant-timeline .subSteps-dot.subSteps-dot-disabled svg path {
|
|
stroke: var(--color-primary);
|
|
}
|
|
|
|
.ant-steps .ant-steps-item-finish .ant-steps-item-icon svg path {
|
|
stroke: var(--color-primary);
|
|
stroke-width: 3px;
|
|
}
|
|
|
|
.ant-descriptions .ant-descriptions-item-label::after {
|
|
top: 0;
|
|
}
|
|
|
|
.ant-descriptions-small .ant-descriptions-row > td {
|
|
padding-bottom: 6px;
|
|
}
|
|
|
|
.minimal-code-block-editor .ant-typography pre {
|
|
margin: 0;
|
|
}
|
|
|
|
.code-block-editor {
|
|
display: flex;
|
|
flex-direction: column;
|
|
min-height: 0;
|
|
}
|
|
|
|
.code-block-editor > div {
|
|
flex: 1 1 auto;
|
|
min-height: 0;
|
|
}
|
|
|
|
.ant-splitter-panel:not(:first-child) .info-collapse .info-collapse-label {
|
|
margin-left: 4px;
|
|
}
|
|
|
|
.farmcontrol-splitter .ant-splitter-panel,
|
|
.farmcontrol-splitter .adaptive-splitter-panel {
|
|
overflow: visible;
|
|
}
|
|
|
|
.farmcontrol-splitter.ant-splitter-horizontal .ant-splitter-panel,
|
|
.farmcontrol-splitter.adaptive-splitter-horizontal .adaptive-splitter-panel {
|
|
width: 100%;
|
|
min-width: 0;
|
|
}
|
|
|
|
.adaptive-splitter {
|
|
display: flex;
|
|
width: 100%;
|
|
height: 100%;
|
|
min-height: 0;
|
|
align-items: stretch;
|
|
position: relative;
|
|
}
|
|
|
|
.adaptive-splitter-vertical {
|
|
flex-direction: column;
|
|
}
|
|
|
|
.adaptive-splitter-panel {
|
|
min-width: 0;
|
|
min-height: 0;
|
|
}
|
|
|
|
.adaptive-splitter-bar {
|
|
flex: none;
|
|
position: relative;
|
|
z-index: 2;
|
|
user-select: none;
|
|
touch-action: none;
|
|
}
|
|
|
|
.adaptive-splitter-horizontal > .adaptive-splitter-bar {
|
|
width: 0;
|
|
}
|
|
|
|
.adaptive-splitter-vertical > .adaptive-splitter-bar {
|
|
height: 0;
|
|
}
|
|
|
|
.adaptive-splitter-bar-dragger {
|
|
position: absolute;
|
|
z-index: 1;
|
|
background: transparent;
|
|
}
|
|
|
|
.adaptive-splitter-horizontal
|
|
> .adaptive-splitter-bar
|
|
.adaptive-splitter-bar-dragger {
|
|
top: 0;
|
|
bottom: 0;
|
|
left: 50%;
|
|
width: 6px;
|
|
transform: translateX(-50%);
|
|
cursor: col-resize;
|
|
}
|
|
|
|
.adaptive-splitter-vertical
|
|
> .adaptive-splitter-bar
|
|
.adaptive-splitter-bar-dragger {
|
|
left: 0;
|
|
right: 0;
|
|
top: 50%;
|
|
height: 6px;
|
|
transform: translateY(-50%);
|
|
cursor: row-resize;
|
|
}
|
|
|
|
.adaptive-splitter-bar-dragger::before {
|
|
content: '';
|
|
position: absolute;
|
|
inset: 0;
|
|
margin: auto;
|
|
}
|
|
|
|
.adaptive-splitter-horizontal
|
|
> .adaptive-splitter-bar
|
|
.adaptive-splitter-bar-dragger::before {
|
|
width: 2px;
|
|
height: 100%;
|
|
background: var(--ant-color-split, rgba(5, 5, 5, 0.06));
|
|
}
|
|
|
|
.adaptive-splitter-vertical
|
|
> .adaptive-splitter-bar
|
|
.adaptive-splitter-bar-dragger::before {
|
|
height: 2px;
|
|
width: 100%;
|
|
background: var(--ant-color-split, rgba(5, 5, 5, 0.06));
|
|
}
|
|
|
|
.adaptive-splitter-bar-dragger::after {
|
|
content: '';
|
|
position: absolute;
|
|
inset: 0;
|
|
margin: auto;
|
|
background: var(--ant-color-text-quaternary, rgba(0, 0, 0, 0.25));
|
|
opacity: 0.35;
|
|
}
|
|
|
|
.adaptive-splitter-horizontal
|
|
> .adaptive-splitter-bar
|
|
.adaptive-splitter-bar-dragger::after {
|
|
width: 2px;
|
|
height: 20px;
|
|
}
|
|
|
|
.adaptive-splitter-vertical
|
|
> .adaptive-splitter-bar
|
|
.adaptive-splitter-bar-dragger::after {
|
|
height: 2px;
|
|
width: 20px;
|
|
}
|
|
|
|
.adaptive-splitter-bar.is-active .adaptive-splitter-bar-dragger::before,
|
|
.adaptive-splitter-bar-dragger:hover::before {
|
|
background: var(--ant-color-primary-border-hover, #4096ff);
|
|
}
|
|
|
|
.adaptive-splitter-bar-collapse {
|
|
position: absolute;
|
|
z-index: 2;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
width: 16px;
|
|
height: 16px;
|
|
padding: 0;
|
|
border: none;
|
|
border-radius: 4px;
|
|
background: transparent;
|
|
color: var(--ant-color-text-secondary, rgba(0, 0, 0, 0.45));
|
|
cursor: pointer;
|
|
}
|
|
|
|
.adaptive-splitter-horizontal
|
|
> .adaptive-splitter-bar
|
|
.adaptive-splitter-bar-collapse {
|
|
top: 50%;
|
|
transform: translateY(-50%);
|
|
}
|
|
|
|
.adaptive-splitter-horizontal
|
|
> .adaptive-splitter-bar
|
|
.adaptive-splitter-bar-collapse-start {
|
|
left: -18px;
|
|
}
|
|
|
|
.adaptive-splitter-horizontal
|
|
> .adaptive-splitter-bar
|
|
.adaptive-splitter-bar-collapse-end {
|
|
right: -18px;
|
|
}
|
|
|
|
.adaptive-splitter-bar-preview {
|
|
position: absolute;
|
|
z-index: 3;
|
|
pointer-events: none;
|
|
background: var(--ant-color-primary, #1677ff);
|
|
opacity: 0.45;
|
|
}
|
|
|
|
.adaptive-splitter-horizontal
|
|
> .adaptive-splitter-bar
|
|
.adaptive-splitter-bar-preview {
|
|
top: 0;
|
|
bottom: 0;
|
|
width: 2px;
|
|
}
|
|
|
|
.adaptive-splitter-vertical
|
|
> .adaptive-splitter-bar
|
|
.adaptive-splitter-bar-preview {
|
|
left: 0;
|
|
right: 0;
|
|
height: 2px;
|
|
}
|
|
|
|
.adaptive-splitter.is-dragging {
|
|
user-select: none;
|
|
}
|
|
|
|
.adaptive-splitter.is-dragging.adaptive-splitter-horizontal,
|
|
.adaptive-splitter.is-dragging.adaptive-splitter-horizontal * {
|
|
cursor: col-resize !important;
|
|
}
|
|
|
|
.adaptive-splitter.is-dragging.adaptive-splitter-vertical,
|
|
.adaptive-splitter.is-dragging.adaptive-splitter-vertical * {
|
|
cursor: row-resize !important;
|
|
}
|
|
|
|
.adaptive-splitter-mask {
|
|
position: absolute;
|
|
inset: 0;
|
|
z-index: 10;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.adaptive-splitter.is-ready:not(.is-dragging) > .adaptive-splitter-panel,
|
|
.adaptive-splitter.is-size-transitioning > .adaptive-splitter-panel,
|
|
.farmcontrol-splitter.is-size-transitioning > .ant-splitter-panel,
|
|
.farmcontrol-splitter.is-size-transitioning > .adaptive-splitter-panel {
|
|
transition:
|
|
flex-basis var(--adaptive-splitter-size-transition, 0.3s)
|
|
cubic-bezier(0.2, 0, 0, 1),
|
|
width var(--adaptive-splitter-size-transition, 0.3s)
|
|
cubic-bezier(0.2, 0, 0, 1),
|
|
min-width var(--adaptive-splitter-size-transition, 0.3s)
|
|
cubic-bezier(0.2, 0, 0, 1),
|
|
max-width var(--adaptive-splitter-size-transition, 0.3s)
|
|
cubic-bezier(0.2, 0, 0, 1),
|
|
height var(--adaptive-splitter-size-transition, 0.3s)
|
|
cubic-bezier(0.2, 0, 0, 1),
|
|
min-height var(--adaptive-splitter-size-transition, 0.3s)
|
|
cubic-bezier(0.2, 0, 0, 1),
|
|
max-height var(--adaptive-splitter-size-transition, 0.3s)
|
|
cubic-bezier(0.2, 0, 0, 1);
|
|
}
|
|
|
|
.farmcontrol-splitter
|
|
.ant-splitter-panel:has(~ .ant-splitter-panel)
|
|
.info-collapse.ant-collapse.ant-collapse-icon-position-end
|
|
> .ant-collapse-item
|
|
> .ant-collapse-header
|
|
.ant-collapse-expand-icon {
|
|
padding-inline-end: 2px;
|
|
}
|
|
|
|
.objectTableCards {
|
|
overflow: hidden;
|
|
}
|
|
|
|
.objectTableCardsContainer {
|
|
width: 100%;
|
|
height: 100%;
|
|
min-width: 0;
|
|
min-height: 0;
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.object-table-select-cell {
|
|
position: relative;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
width: 16px;
|
|
height: 16px;
|
|
}
|
|
|
|
.object-table-select-cell .object-table-row-checkbox,
|
|
.object-table-select-cell .object-table-row-icon {
|
|
position: absolute;
|
|
inset: 0;
|
|
}
|
|
|
|
.object-table-select-cell .object-table-row-checkbox {
|
|
opacity: 0;
|
|
pointer-events: none;
|
|
transition: opacity 0.2s;
|
|
}
|
|
|
|
.dashboard-table
|
|
.ant-table-row:hover
|
|
.object-table-select-cell
|
|
.object-table-row-checkbox,
|
|
.object-table-select-cell.object-table-select-cell-selected
|
|
.object-table-row-checkbox {
|
|
opacity: 1;
|
|
pointer-events: auto;
|
|
}
|
|
|
|
.dashboard-table
|
|
.ant-table-row:hover
|
|
.object-table-select-cell
|
|
.object-table-row-icon,
|
|
.object-table-select-cell.object-table-select-cell-selected
|
|
.object-table-row-icon {
|
|
transition: opacity 0.2s;
|
|
opacity: 0;
|
|
}
|
|
|
|
.ant-table-wrapper.dashboard-table
|
|
.ant-table-tbody
|
|
> tr.object-table-row-selected
|
|
> .ant-table-cell,
|
|
.ant-table-wrapper.dashboard-table
|
|
.ant-table-tbody
|
|
> tr.object-table-row-selected
|
|
> .ant-table-cell.ant-table-cell-fix-left,
|
|
.ant-table-wrapper.dashboard-table
|
|
.ant-table-tbody
|
|
> tr.object-table-row-selected
|
|
> .ant-table-cell.ant-table-cell-fix-right {
|
|
background-color: color-mix(
|
|
in srgb,
|
|
var(--color-primary) 5%,
|
|
var(--color-button-background)
|
|
);
|
|
}
|
|
|
|
.ant-table-wrapper.dashboard-table
|
|
.ant-table-tbody
|
|
> tr.object-table-row-selected:hover
|
|
> .ant-table-cell,
|
|
.ant-table-wrapper.dashboard-table
|
|
.ant-table-tbody
|
|
> tr.object-table-row-selected
|
|
> .ant-table-cell.ant-table-cell-row-hover,
|
|
.ant-table-wrapper.dashboard-table
|
|
.ant-table-tbody
|
|
> tr.object-table-row-selected:hover
|
|
> .ant-table-cell.ant-table-cell-fix-left,
|
|
.ant-table-wrapper.dashboard-table
|
|
.ant-table-tbody
|
|
> tr.object-table-row-selected:hover
|
|
> .ant-table-cell.ant-table-cell-fix-right {
|
|
background-color: color-mix(
|
|
in srgb,
|
|
var(--color-primary) 15%,
|
|
var(--color-button-background)
|
|
);
|
|
}
|
|
|
|
.objectKanbanContainerWrapper {
|
|
position: relative;
|
|
width: 100%;
|
|
height: 100%;
|
|
min-width: 0;
|
|
min-height: 0;
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.objectKanbanContainerSkeletons {
|
|
display: flex;
|
|
flex-direction: column;
|
|
position: relative;
|
|
flex: 1;
|
|
min-width: 0;
|
|
min-height: 0;
|
|
}
|
|
|
|
.objectKanbanOverlayColumns {
|
|
position: absolute;
|
|
inset: 0;
|
|
z-index: 4;
|
|
overflow: hidden;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.objectKanbanKanbanBody {
|
|
position: relative;
|
|
flex: 1;
|
|
min-width: 0;
|
|
min-height: 0;
|
|
}
|
|
|
|
.objectKanbanContainer {
|
|
position: absolute;
|
|
inset: 0;
|
|
display: flex;
|
|
flex-direction: column;
|
|
width: 100%;
|
|
height: 100%;
|
|
min-width: 0;
|
|
min-height: 0;
|
|
z-index: 1;
|
|
pointer-events: auto;
|
|
}
|
|
|
|
.objectKanbanWrap {
|
|
width: 100%;
|
|
height: 100%;
|
|
min-width: 0;
|
|
min-height: 0;
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.objectKanbanScroll {
|
|
flex: 1;
|
|
width: 100%;
|
|
min-width: 0;
|
|
min-height: 0;
|
|
}
|
|
|
|
.objectKanbanScroll .simplebar-content-wrapper {
|
|
height: 100%;
|
|
}
|
|
|
|
.objectKanbanScroll .simplebar-content {
|
|
min-height: 100%;
|
|
}
|
|
|
|
.objectKanbanHeader {
|
|
flex-shrink: 0;
|
|
width: 100%;
|
|
min-width: 0;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.objectKanbanHeaderTrack {
|
|
width: max-content;
|
|
min-width: 100%;
|
|
will-change: transform;
|
|
}
|
|
|
|
.objectKanbanHeaderRow {
|
|
width: max-content;
|
|
min-width: 100%;
|
|
align-items: flex-start;
|
|
}
|
|
|
|
.objectKanbanHeaderCell {
|
|
flex: 0 0 auto;
|
|
min-width: 200px;
|
|
flex-shrink: 0;
|
|
padding: 8px 8px;
|
|
border: 1px solid var(--ant-color-border-secondary);
|
|
border-bottom: 1px solid var(--color-descriptions-border);
|
|
border-radius: 12px 12px 0 0;
|
|
background-color: var(--layout-header-bg);
|
|
transition:
|
|
outline-color 0.15s ease,
|
|
opacity 0.15s ease;
|
|
}
|
|
|
|
.objectKanbanHeaderCell--dragging {
|
|
opacity: 0.45;
|
|
}
|
|
|
|
.objectKanbanHeaderCell--dropTarget {
|
|
outline: 2px dashed color-mix(in srgb, var(--color-primary) 55%, transparent);
|
|
outline-offset: -2px;
|
|
}
|
|
|
|
.objectKanbanHeaderCellActions {
|
|
flex-shrink: 0;
|
|
margin-left: auto;
|
|
}
|
|
|
|
.objectKanbanHeaderDragHandle {
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
.objectKanban {
|
|
width: max-content;
|
|
min-width: 100%;
|
|
height: 100%;
|
|
min-height: 100%;
|
|
align-items: stretch;
|
|
padding-bottom: 4px;
|
|
}
|
|
|
|
.objectKanbanSkeletonColumns {
|
|
position: absolute;
|
|
inset: 0;
|
|
z-index: 0;
|
|
overflow: hidden;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.objectKanbanSkeletonTrack,
|
|
.objectKanbanOverlayTrack {
|
|
width: max-content;
|
|
min-width: 100%;
|
|
height: 100%;
|
|
will-change: transform;
|
|
}
|
|
|
|
.objectKanbanSkeletonRow,
|
|
.objectKanbanOverlayRow {
|
|
width: max-content;
|
|
min-width: 100%;
|
|
height: 100%;
|
|
align-items: stretch;
|
|
}
|
|
|
|
.objectKanbanColumn,
|
|
.objectKanbanColumnSkeleton {
|
|
position: relative;
|
|
flex: 0 0 auto;
|
|
min-width: 200px;
|
|
min-height: 0;
|
|
border-top: none;
|
|
border-radius: 0 0 12px 12px;
|
|
}
|
|
|
|
.objectKanbanColumnResizeOverlay {
|
|
position: relative;
|
|
}
|
|
|
|
.objectKanbanColumnResizeHandle {
|
|
position: absolute;
|
|
top: 0;
|
|
right: -11px;
|
|
bottom: 0;
|
|
width: 6px;
|
|
z-index: 3;
|
|
cursor: col-resize;
|
|
touch-action: none;
|
|
user-select: none;
|
|
pointer-events: auto;
|
|
opacity: 0.6;
|
|
}
|
|
|
|
.objectKanbanColumnResizeHandle::before {
|
|
content: '';
|
|
position: absolute;
|
|
top: 11.15px;
|
|
bottom: 10.85px;
|
|
right: 1px;
|
|
width: 2px;
|
|
transform: translateX(-50%);
|
|
transition: opacity 0.15s ease;
|
|
}
|
|
|
|
.objectKanbanColumnResizeHandle::after {
|
|
content: '';
|
|
position: absolute;
|
|
top: 50%;
|
|
right: 1px;
|
|
width: 2px;
|
|
height: 20px;
|
|
transform: translate(-50%, -50%);
|
|
transition: opacity 0.15s ease;
|
|
}
|
|
|
|
.dark-mode .objectKanbanColumnResizeHandle::after {
|
|
background: rgba(255, 255, 255, 0.18);
|
|
}
|
|
|
|
.dark-mode .objectKanbanColumnResizeHandle::before {
|
|
background: rgba(255, 255, 255, 0.08);
|
|
}
|
|
|
|
.light-mode .objectKanbanColumnResizeHandle::after {
|
|
background: rgba(0, 0, 0, 0.15);
|
|
}
|
|
|
|
.light-mode .objectKanbanColumnResizeHandle::before {
|
|
background: rgba(0, 0, 0, 0.04);
|
|
}
|
|
|
|
.dark-mode .objectKanbanColumnResizeHandle:hover::before {
|
|
background: #0e3a5b;
|
|
}
|
|
|
|
.light-mode .objectKanbanColumnResizeHandle:hover::before {
|
|
background: #e6f8ff;
|
|
}
|
|
|
|
.dark-mode .objectKanbanColumnResizeHandle.active::before {
|
|
background: #0b4c7e;
|
|
}
|
|
|
|
.light-mode .objectKanbanColumnResizeHandle.active::before {
|
|
background: #a3e3ff;
|
|
}
|
|
|
|
body.objectKanbanColumnResizing,
|
|
body.objectKanbanColumnResizing * {
|
|
cursor: col-resize !important;
|
|
user-select: none !important;
|
|
}
|
|
|
|
.objectKanbanColumnSkeleton {
|
|
border-radius: 0 0 12px 12px;
|
|
overflow: visible;
|
|
}
|
|
|
|
.objectKanbanColumnCards {
|
|
flex: 1;
|
|
border-radius: 0 0 12px 12px;
|
|
height: 100%;
|
|
}
|
|
|
|
.objectKanbanColumnSkeleton .objectKanbanColumnCards {
|
|
background-color: var(--layout-header-bg);
|
|
}
|
|
|
|
.objectKanbanColumnCardsInner {
|
|
padding: 16px;
|
|
}
|
|
|
|
.objectTimelineContainer {
|
|
width: 100%;
|
|
height: 100%;
|
|
min-width: 0;
|
|
min-height: 0;
|
|
}
|
|
|
|
.objectTimelineContainer .simplebar-mask {
|
|
border-radius: 12px;
|
|
}
|
|
|
|
.objectTimelineItemLabelContainer {
|
|
border-radius: 3px;
|
|
height: 12px;
|
|
}
|
|
|
|
.objectTimelineRow {
|
|
transition: background-color 0.2s ease;
|
|
}
|
|
|
|
.objectTimelineRowHeaderLabelContainer {
|
|
position: sticky;
|
|
left: 0;
|
|
z-index: 2;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.objectTimelineRowHeaderLabel {
|
|
height: 100%;
|
|
flex: 0 0 auto;
|
|
padding-left: 44px;
|
|
background: transparent;
|
|
transition:
|
|
background 0.2s ease,
|
|
box-shadow 0.3s;
|
|
}
|
|
|
|
.objectTimelineRowHeaderLabel:before {
|
|
content: '';
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
z-index: -1;
|
|
transition: opacity 0.2s ease;
|
|
opacity: 1;
|
|
background: linear-gradient(
|
|
to right,
|
|
var(--color-table-header-bg) 0%,
|
|
var(--color-table-header-bg) 70%,
|
|
transparent calc(100% - 40px)
|
|
);
|
|
}
|
|
|
|
.objectTimelineShadow .objectTimelineRowHeaderLabel {
|
|
background: var(--color-table-header-bg);
|
|
}
|
|
|
|
.objectTimelineRowLabelContainer {
|
|
position: sticky;
|
|
left: 0;
|
|
z-index: 2;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.objectTimelineRowLabel {
|
|
height: 100%;
|
|
transition:
|
|
background-color 0.2s ease,
|
|
box-shadow 0.3s;
|
|
background: var(--layout-header-bg, #fff);
|
|
}
|
|
|
|
.dark-mode .objectTimelineShadow .objectTimelineRowLabel,
|
|
.dark-mode .objectTimelineShadow .objectTimelineRowHeaderLabel {
|
|
box-shadow: -2px -1px 8px 4px rgba(253, 253, 253, 0.12);
|
|
}
|
|
|
|
.light-mode .objectTimelineShadow .objectTimelineRowLabel,
|
|
.light-mode .objectTimelineShadow .objectTimelineRowHeaderLabel {
|
|
box-shadow: -2px -1px 8px 4px rgba(5, 5, 5, 0.06);
|
|
}
|
|
|
|
.objectTimelineRow:hover,
|
|
.objectTimelineRow:hover .objectTimelineRowLabel {
|
|
background-color: var(--color-table-header-bg);
|
|
}
|
|
|
|
.objectTimelineItemLabel {
|
|
display: block;
|
|
margin-top: -1.5px;
|
|
font-size: 10px;
|
|
font-weight: 600;
|
|
}
|
|
|
|
.objectTimelineItemLabel-reference {
|
|
font-family: 'DM Mono', monospace;
|
|
}
|
|
|
|
.objectTimelineItemWithEndDate {
|
|
margin-right: 2px;
|
|
}
|
|
|
|
.electron-body .ant-modal-wrap,
|
|
.electron-body .ant-modal-mask,
|
|
.electron-body .ant-drawer {
|
|
top: 42px;
|
|
}
|
|
|
|
@keyframes h-progress-macos-wave {
|
|
0% {
|
|
transform: translateX(0);
|
|
}
|
|
100% {
|
|
/* One gradient period (40cqw of a 200cqw-wide element) for a seamless loop */
|
|
transform: translateX(20%);
|
|
}
|
|
}
|
|
|
|
.h-progress {
|
|
display: inline-block;
|
|
width: 100%;
|
|
font-size: 14px;
|
|
line-height: 1;
|
|
}
|
|
|
|
.h-progress-outer {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
width: 100%;
|
|
}
|
|
|
|
.h-progress-inner {
|
|
position: relative;
|
|
display: inline-block;
|
|
width: 100%;
|
|
flex: 1;
|
|
overflow: hidden;
|
|
vertical-align: middle;
|
|
/* Lets the wave size itself against the full track via cqw units */
|
|
container-type: inline-size;
|
|
}
|
|
|
|
.h-progress-bg,
|
|
.h-progress-success-bg {
|
|
position: relative;
|
|
transition: all 0.1s cubic-bezier(0.78, 0.14, 0.15, 0.86);
|
|
}
|
|
|
|
.h-progress-success-bg {
|
|
position: absolute;
|
|
inset-block-start: 0;
|
|
inset-inline-start: 0;
|
|
}
|
|
|
|
/* Mask that clips the wave to the filled portion of the bar. Its width
|
|
tracks the fill, while the wave inside keeps a constant width so Safari
|
|
doesn't restart/freeze the animation when progress updates. */
|
|
.h-progress-bg-mask {
|
|
position: absolute;
|
|
inset-block: 0;
|
|
inset-inline-start: 0;
|
|
overflow: hidden;
|
|
pointer-events: none;
|
|
transition: width 0.1s cubic-bezier(0.78, 0.14, 0.15, 0.86);
|
|
}
|
|
|
|
.h-progress-bg-wave {
|
|
position: absolute;
|
|
inset-block: 0;
|
|
/* Constant width relative to the full track (.h-progress-inner),
|
|
independent of the mask's changing width. Starts one period early so
|
|
the pattern always covers the track while sliding right. */
|
|
inset-inline-start: -40cqw;
|
|
width: 200cqw;
|
|
background: repeating-linear-gradient(
|
|
90deg,
|
|
rgba(255, 255, 255, 0) 0,
|
|
rgba(255, 255, 255, 0.35) 20cqw,
|
|
rgba(255, 255, 255, 0) 40cqw
|
|
);
|
|
animation: h-progress-macos-wave 1s linear infinite;
|
|
}
|
|
|
|
.h-progress-text {
|
|
display: inline-block;
|
|
margin-inline-start: 8px;
|
|
line-height: 1;
|
|
width: 2em;
|
|
white-space: nowrap;
|
|
text-align: start;
|
|
vertical-align: middle;
|
|
word-break: normal;
|
|
}
|
|
|
|
.h-progress-text-start {
|
|
width: max-content;
|
|
margin-inline-start: 0;
|
|
margin-inline-end: 8px;
|
|
}
|
|
|
|
.h-progress-text-inner {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
width: 100%;
|
|
height: 100%;
|
|
margin-inline-start: 0;
|
|
padding: 0 4px;
|
|
color: #fff;
|
|
}
|
|
|
|
.h-progress-layout-bottom {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
|
|
.h-progress-layout-bottom .h-progress-text {
|
|
width: max-content;
|
|
margin-inline-start: 0;
|
|
margin-top: 4px;
|
|
}
|
|
|
|
.simple-date-time-property-filter {
|
|
margin: -6px 0;
|
|
background-color: transparent;
|
|
}
|
|
|
|
.simple-date-time-property-filter.ant-tree .ant-tree-treenode {
|
|
margin-bottom: 0;
|
|
height: 40px;
|
|
align-items: center;
|
|
}
|
|
|
|
.simple-date-time-property-filter.ant-tree .ant-tree-switcher {
|
|
align-self: center;
|
|
}
|
|
|
|
.simple-date-time-property-filter.ant-tree .ant-tree-switcher-leaf-line:after {
|
|
height: 0;
|
|
top: -5px;
|
|
}
|
|
|
|
.simple-date-time-property-filter.ant-tree .ant-tree-switcher-leaf-line:before {
|
|
top: -16px !important;
|
|
bottom: -24px !important;
|
|
}
|
|
|
|
/* Size FilterSidebar field selects to the longest label (via labelRender sizer). */
|
|
.filter-sidebar-field-select.ant-select {
|
|
width: max-content;
|
|
}
|
|
.filter-sidebar-field-select .ant-select-selector {
|
|
width: max-content !important;
|
|
}
|
|
|
|
.elipsis-text-wrapper.ant-typography {
|
|
display: block;
|
|
min-width: 0;
|
|
max-width: 100%;
|
|
width: auto;
|
|
overflow-y: hidden;
|
|
overflow-x: visible;
|
|
flex-grow: 0;
|
|
flex-shrink: 1;
|
|
flex-basis: auto;
|
|
}
|
|
|
|
.elipsis-text-wrapper.ant-typography .elipsis-text {
|
|
display: flex;
|
|
flex-direction: row;
|
|
align-items: baseline;
|
|
width: 100%;
|
|
max-width: 100%;
|
|
min-width: 0;
|
|
position: relative;
|
|
overflow: hidden;
|
|
white-space: pre;
|
|
}
|
|
|
|
.elipsis-text-wrapper.ant-typography code.elipsis-text-measure,
|
|
.elipsis-text-wrapper.ant-typography code.elipsis-text-full,
|
|
.elipsis-text-wrapper.ant-typography code.elipsis-text-truncated {
|
|
margin: 0;
|
|
box-sizing: border-box;
|
|
padding-inline: 0.5em;
|
|
padding-block: 0.1em 0.1em;
|
|
}
|
|
|
|
.elipsis-text-measure {
|
|
position: absolute;
|
|
visibility: hidden;
|
|
pointer-events: none;
|
|
white-space: pre;
|
|
}
|
|
|
|
.elipsis-text-full {
|
|
display: none;
|
|
position: absolute;
|
|
left: 0;
|
|
top: 0;
|
|
width: max-content;
|
|
max-width: 100%;
|
|
min-width: 0;
|
|
overflow: hidden;
|
|
white-space: pre;
|
|
}
|
|
|
|
.elipsis-text:not(.is-truncated) .elipsis-text-full {
|
|
display: inline-block;
|
|
}
|
|
|
|
.elipsis-text.is-truncated .elipsis-text-full {
|
|
display: none;
|
|
}
|
|
|
|
.elipsis-text:not(.is-truncated) .elipsis-text-truncated .elipsis-text-dots {
|
|
display: none;
|
|
}
|
|
|
|
.elipsis-text:not(.is-truncated) .elipsis-text-truncated {
|
|
visibility: hidden;
|
|
}
|
|
|
|
.elipsis-text-truncated {
|
|
display: flex;
|
|
flex: 1 1 0;
|
|
align-items: baseline;
|
|
min-width: 0;
|
|
width: 100%;
|
|
max-width: 100%;
|
|
overflow: hidden;
|
|
white-space: pre;
|
|
}
|
|
|
|
.elipsis-text-wrapper.ant-typography code.elipsis-text-truncated {
|
|
display: flex;
|
|
}
|
|
|
|
.elipsis-text-start,
|
|
.elipsis-text-end {
|
|
flex: 1 1 0;
|
|
min-width: 0;
|
|
overflow: hidden;
|
|
white-space: pre;
|
|
}
|
|
|
|
.elipsis-text-start {
|
|
mask-image: linear-gradient(
|
|
to right,
|
|
#000 0%,
|
|
#000 calc(100% - 0.5em),
|
|
transparent 100%
|
|
);
|
|
-webkit-mask-image: linear-gradient(
|
|
to right,
|
|
#000 0%,
|
|
#000 calc(100% - 0.5em),
|
|
transparent 100%
|
|
);
|
|
}
|
|
|
|
.elipsis-text-end {
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
mask-image: linear-gradient(
|
|
to left,
|
|
#000 0%,
|
|
#000 calc(100% - 0.5em),
|
|
transparent 100%
|
|
);
|
|
-webkit-mask-image: linear-gradient(
|
|
to left,
|
|
#000 0%,
|
|
#000 calc(100% - 0.5em),
|
|
transparent 100%
|
|
);
|
|
}
|
|
|
|
.elipsis-text-end-inner {
|
|
flex: 0 0 auto;
|
|
white-space: pre;
|
|
}
|
|
|
|
.elipsis-text-dots {
|
|
flex: 0 0 auto;
|
|
user-select: none;
|
|
}
|
|
|
|
.code-diff-viewer {
|
|
height: 70vh;
|
|
border: 1px solid #85858541;
|
|
}
|
|
|
|
.code-diff-viewer .cm-mergeView {
|
|
height: 100%;
|
|
overflow: auto;
|
|
}
|
|
|
|
.cm-editor {
|
|
width: fit-content;
|
|
}
|
|
|
|
.cm-errorLine {
|
|
background-color: color-mix(in srgb, var(--color-error) 15%, transparent);
|
|
}
|
|
|
|
.cm-gutters .cm-errorLine {
|
|
color: var(--color-error);
|
|
}
|
|
|
|
.diff-label-square {
|
|
width: 7px;
|
|
height: 7px;
|
|
background-color: #85858541;
|
|
border-radius: 2px;
|
|
}
|
|
|
|
.permissions-matrix-table .ant-table-tbody .ant-table-cell {
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.permissions-matrix:hover .ant-table-tbody > tr > .ant-table-cell {
|
|
box-shadow: inset 0 0 0 100vmax
|
|
color-mix(
|
|
in srgb,
|
|
var(--color-text)
|
|
calc(
|
|
4% *
|
|
(
|
|
1 -
|
|
min(
|
|
1,
|
|
abs(
|
|
calc(
|
|
var(--permissions-col, 0) -
|
|
var(--permissions-hovered-col, -1)
|
|
)
|
|
)
|
|
)
|
|
)
|
|
),
|
|
transparent
|
|
);
|
|
}
|
|
|
|
.permissions-matrix-table .permissions-matrix-group-row > .ant-table-cell {
|
|
font-weight: 600;
|
|
background-color: color-mix(
|
|
in srgb,
|
|
var(--color-text) 6%,
|
|
var(--layout-header-bg)
|
|
);
|
|
}
|
|
|
|
.permissions-matrix-table
|
|
.permissions-matrix-group-row
|
|
> .ant-table-cell.ant-table-cell-row-hover {
|
|
background: color-mix(
|
|
in srgb,
|
|
var(--color-text) 10%,
|
|
var(--layout-header-bg)
|
|
);
|
|
}
|
|
|
|
.permissions-matrix-table .ant-table-row-expand-icon,
|
|
.permissions-matrix-table .ant-table-row-indent {
|
|
display: none;
|
|
}
|
|
|
|
.permissions-matrix-expand-button.ant-btn {
|
|
width: 22px;
|
|
min-width: 22px;
|
|
height: 22px;
|
|
padding: 0;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
color: inherit;
|
|
}
|
|
|
|
.permissions-matrix-expand-button.ant-btn:hover,
|
|
.permissions-matrix-expand-button.ant-btn:focus,
|
|
.permissions-matrix-expand-button.ant-btn:focus-visible {
|
|
color: inherit;
|
|
}
|
|
|
|
.permissions-matrix-expand-spacer {
|
|
display: inline-block;
|
|
width: 18px;
|
|
height: 22px;
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
.permissions-matrix-expand-icon {
|
|
font-size: 12px !important;
|
|
color: inherit;
|
|
transition: transform 0.2s ease;
|
|
}
|
|
|
|
.permissions-matrix-expand-icon-open {
|
|
transform: rotate(90deg);
|
|
}
|
|
|
|
.permissions-matrix-table .ant-table-thead > tr > th {
|
|
vertical-align: bottom;
|
|
padding-top: 12px;
|
|
padding-bottom: 12px;
|
|
}
|
|
|
|
.permissions-matrix-table .ant-table-thead .ant-table-column-title {
|
|
display: flex;
|
|
align-items: flex-end;
|
|
justify-content: center;
|
|
height: 100%;
|
|
}
|
|
|
|
.permissions-matrix-header {
|
|
writing-mode: vertical-rl;
|
|
transform: rotate(180deg);
|
|
white-space: nowrap;
|
|
line-height: 1.2;
|
|
display: inline-block;
|
|
}
|
|
|
|
.permission-checkbox {
|
|
position: relative;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
width: 16px;
|
|
height: 16px;
|
|
padding: 0;
|
|
margin: 0;
|
|
border: none;
|
|
background: transparent;
|
|
cursor: pointer;
|
|
vertical-align: middle;
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
.permission-checkbox:disabled {
|
|
cursor: not-allowed;
|
|
opacity: 0.45;
|
|
}
|
|
|
|
.permission-checkbox:focus-visible {
|
|
outline: 2px solid var(--color-primary);
|
|
outline-offset: 2px;
|
|
border-radius: 50%;
|
|
}
|
|
|
|
.permission-checkbox-face {
|
|
position: absolute;
|
|
inset: 0;
|
|
border-radius: 50%;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
opacity: 0;
|
|
pointer-events: none;
|
|
transition: opacity 0.2s ease;
|
|
}
|
|
|
|
.permission-checkbox-inherit {
|
|
border: 1.5px solid;
|
|
background: transparent;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.permission-checkbox[data-state='inherit'] .permission-checkbox-inherit,
|
|
.permission-checkbox[data-state='allow'] .permission-checkbox-allow,
|
|
.permission-checkbox[data-state='deny'] .permission-checkbox-deny,
|
|
.permission-checkbox[data-state='mixed'] .permission-checkbox-mixed {
|
|
opacity: 1;
|
|
}
|
|
|
|
.permission-checkbox-square {
|
|
width: 7px;
|
|
height: 7px;
|
|
background-color: #ffffff;
|
|
border-radius: 1px;
|
|
}
|
|
|
|
.permission-checkbox-face .anticon {
|
|
display: flex;
|
|
line-height: 0;
|
|
}
|
|
|
|
.permission-checkbox-face .anticon svg path {
|
|
stroke: currentColor;
|
|
stroke-width: 8px;
|
|
}
|
|
|
|
.dashboard-splitter.farmcontrol-splitter > .ant-splitter-bar,
|
|
.dashboard-splitter.farmcontrol-splitter > .adaptive-splitter-bar {
|
|
margin: 0;
|
|
}
|
|
|
|
.dashboard-splitter.farmcontrol-splitter > .ant-splitter-panel,
|
|
.dashboard-splitter.farmcontrol-splitter > .adaptive-splitter-panel {
|
|
padding: 0;
|
|
}
|
|
|
|
.dashboard-splitter.farmcontrol-splitter
|
|
> .ant-splitter-bar
|
|
.ant-splitter-bar-dragger::before,
|
|
.dashboard-splitter.farmcontrol-splitter
|
|
> .adaptive-splitter-bar
|
|
.adaptive-splitter-bar-dragger::before {
|
|
background: transparent;
|
|
}
|
|
|
|
.dashboard-splitter.farmcontrol-splitter
|
|
> .ant-splitter-bar
|
|
.ant-splitter-bar-dragger::after,
|
|
.dashboard-splitter.farmcontrol-splitter
|
|
> .adaptive-splitter-bar
|
|
.adaptive-splitter-bar-dragger::after {
|
|
content: none;
|
|
}
|
|
|
|
.farmcontrol-splitter .ant-splitter-bar-dragger {
|
|
transition: opacity 0.3s ease;
|
|
opacity: 1;
|
|
}
|
|
|
|
.farmcontrol-splitter.vertical-scroll-visible .ant-splitter-bar-dragger {
|
|
opacity: 0;
|
|
}
|
|
|
|
.object-display-tag
|
|
.elipsis-text-wrapper.ant-typography
|
|
code.elipsis-text-measure,
|
|
.object-display-tag .elipsis-text-wrapper.ant-typography code.elipsis-text-full,
|
|
.object-display-tag
|
|
.elipsis-text-wrapper.ant-typography
|
|
code.elipsis-text-truncated {
|
|
background-color: transparent !important;
|
|
border: 1px solid transparent !important;
|
|
max-width: calc(100%);
|
|
padding: 0;
|
|
margin: 0;
|
|
font-size: 95%;
|
|
}
|
|
|
|
.ant-tag.object-display-tag,
|
|
.object-select-multiple.ant-select-outlined.ant-select-multiple
|
|
.ant-select-selection-item {
|
|
border: 1px solid color-mix(in srgb, var(--color-text) 5%, transparent);
|
|
}
|
|
|
|
.code-block-editor .simplebar-content-wrapper {
|
|
background-color: var(--layout-modal-bg);
|
|
}
|
|
|
|
.previewProgressOverlay {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
z-index: 2;
|
|
backdrop-filter: blur(8px);
|
|
background-color: color-mix(
|
|
in srgb,
|
|
var(--layout-header-bg) 20%,
|
|
transparent
|
|
);
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
transition: opacity 0.2s ease;
|
|
}
|
|
.previewProgressOverlay.visible {
|
|
opacity: 1;
|
|
pointer-events: auto;
|
|
}
|
|
.previewProgressOverlay.hidden {
|
|
opacity: 0;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.previewZoomOverlay {
|
|
position: absolute;
|
|
right: 12px;
|
|
bottom: 12px;
|
|
z-index: 2;
|
|
}
|
|
|
|
.previewZoomCard {
|
|
background-color: color-mix(
|
|
in srgb,
|
|
var(--layout-header-bg) 80%,
|
|
transparent
|
|
);
|
|
backdrop-filter: blur(8px);
|
|
-webkit-backdrop-filter: blur(8px);
|
|
}
|
|
|
|
.ant-slider .ant-slider-handle.previewZoomSliderHandle::after {
|
|
box-shadow: 0 0 0 2px var(--color-primary);
|
|
background: var(--color-primary);
|
|
}
|
|
|
|
.react-pdf__Page {
|
|
border: 1px solid #000;
|
|
box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
|
|
}
|
|
|
|
.no-navigation-labels.ant-menu-horizontal .ant-menu-item {
|
|
padding: 0 5px;
|
|
}
|
|
|
|
.overview-drag-handle {
|
|
cursor: grab;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
color: var(--color-text);
|
|
padding: 0 4px;
|
|
}
|
|
|
|
.overview-drag-handle svg path {
|
|
stroke: currentColor;
|
|
stroke-width: 3px;
|
|
}
|
|
|
|
.overview-drag-handle:active {
|
|
cursor: grabbing;
|
|
}
|
|
|
|
.overview-section-wrapper.overview-dragging,
|
|
.overview-flex-columns-item.overview-dragging,
|
|
.overview-stat-wrapper.overview-dragging {
|
|
opacity: 0.4;
|
|
}
|
|
|
|
.overview-stat-wrapper.overview-drag-over,
|
|
.overview-flex-columns-item.overview-drag-over {
|
|
outline: 2px dashed color-mix(in srgb, var(--color-primary) 50%, transparent);
|
|
outline-offset: 4px;
|
|
border-radius: 12px;
|
|
}
|
|
|
|
.overview-stats-display {
|
|
width: 100%;
|
|
}
|
|
|
|
.overview-stat-item {
|
|
flex: 1 1 var(--stat-min-width, 175px);
|
|
min-width: var(--stat-min-width, 175px);
|
|
}
|
|
|
|
.overview-stat-item .ant-card,
|
|
.overview-stat-item .ant-tag {
|
|
width: 100%;
|
|
height: 100%;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.overview-stat-item .ant-tag {
|
|
display: inline-flex;
|
|
}
|
|
|
|
.overview-section-wrapper {
|
|
position: relative;
|
|
}
|
|
|
|
.overview-flex-columns {
|
|
position: relative;
|
|
box-sizing: border-box;
|
|
width: 100%;
|
|
}
|
|
|
|
.overview-flex-columns.is-editing {
|
|
border: 2px dashed color-mix(in srgb, var(--color-text) 25%, transparent);
|
|
border-radius: 24px;
|
|
padding: 12px;
|
|
}
|
|
|
|
.overview-flex-columns.is-empty {
|
|
min-height: 72px;
|
|
}
|
|
|
|
.overview-flex-columns-actions.ant-card {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0px;
|
|
transform: translateY(-60%);
|
|
z-index: 4;
|
|
width: max-content;
|
|
}
|
|
|
|
.overview-flex-columns-actions.ant-card .ant-card-body {
|
|
line-height: 1;
|
|
}
|
|
|
|
.overview-flex-columns-actions .ant-btn {
|
|
height: auto;
|
|
width: auto;
|
|
padding: 0 2px;
|
|
}
|
|
|
|
.overview-flex-columns-row {
|
|
width: 100%;
|
|
}
|
|
|
|
.overview-flex-columns.is-vertical .overview-flex-columns-item {
|
|
flex: none;
|
|
width: 100%;
|
|
transition: none;
|
|
}
|
|
|
|
.overview-flex-columns-empty {
|
|
flex: 1;
|
|
min-height: 48px;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
color: color-mix(in srgb, var(--color-text) 45%, transparent);
|
|
}
|
|
|
|
.overview-flex-columns-item {
|
|
position: relative;
|
|
flex: 1 1 0;
|
|
min-width: 0;
|
|
overflow: visible;
|
|
transition: flex-grow 0.1s ease-in-out;
|
|
}
|
|
|
|
.overview-flex-columns.is-resizing,
|
|
.overview-flex-columns.is-resizing * {
|
|
cursor: col-resize !important;
|
|
user-select: none;
|
|
}
|
|
|
|
.overview-flex-columns-separator {
|
|
position: absolute;
|
|
top: 0;
|
|
bottom: 0;
|
|
left: 100%;
|
|
margin-left: calc(var(--ant-margin-lg, 24px) / 2);
|
|
transform: translateX(-50%);
|
|
width: 16px;
|
|
z-index: 3;
|
|
display: flex;
|
|
justify-content: center;
|
|
cursor: col-resize;
|
|
touch-action: none;
|
|
user-select: none;
|
|
}
|
|
|
|
.overview-flex-columns-separator-line {
|
|
width: 2px;
|
|
height: 100%;
|
|
box-sizing: border-box;
|
|
border-left: 2px solid color-mix(in srgb, var(--color-text) 8%, transparent);
|
|
pointer-events: none;
|
|
}
|
|
|
|
.overview-flex-columns-separator:hover .overview-flex-columns-separator-line,
|
|
.overview-flex-columns-separator.is-active
|
|
.overview-flex-columns-separator-line {
|
|
border-left: none;
|
|
background-color: #a3e3ff;
|
|
}
|
|
|
|
.dark-mode
|
|
.overview-flex-columns-separator:hover
|
|
.overview-flex-columns-separator-line,
|
|
.dark-mode
|
|
.overview-flex-columns-separator.is-active
|
|
.overview-flex-columns-separator-line {
|
|
background-color: #0e3a5b;
|
|
}
|
|
|
|
.overview-flex-columns-separator-handle {
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 50%;
|
|
transform: translateX(-50%);
|
|
width: 2px;
|
|
height: 20px;
|
|
background-color: color-mix(in srgb, var(--color-text) 18%, transparent);
|
|
pointer-events: none;
|
|
z-index: 4;
|
|
}
|
|
|
|
.overview-flex-columns-item > .ant-collapse {
|
|
width: 100%;
|
|
min-width: 0;
|
|
}
|
|
|
|
.overview-flex-columns.is-drag-over {
|
|
outline: 2px dashed color-mix(in srgb, var(--color-primary) 50%, transparent);
|
|
outline-offset: 2px;
|
|
}
|
|
|
|
.overview-section-wrapper.overview-insert-before::before,
|
|
.overview-section-wrapper.overview-insert-after::after {
|
|
content: '';
|
|
position: absolute;
|
|
left: 0;
|
|
right: 0;
|
|
height: 0;
|
|
border-top: 2px dashed
|
|
color-mix(in srgb, var(--color-primary) 50%, transparent);
|
|
pointer-events: none;
|
|
z-index: 2;
|
|
}
|
|
|
|
.overview-section-wrapper.overview-insert-before::before {
|
|
top: calc(var(--ant-margin-lg, 24px) / -2);
|
|
transform: translateY(-50%);
|
|
}
|
|
|
|
.overview-section-wrapper.overview-insert-after::after {
|
|
bottom: calc(var(--ant-margin-lg, 24px) / -2);
|
|
transform: translateY(50%);
|
|
}
|
|
|
|
.overview-stat-wrapper {
|
|
cursor: grab;
|
|
}
|
|
|
|
.overview-stat-wrapper:active {
|
|
cursor: grabbing;
|
|
}
|
|
|
|
.info-collapse-resize-handle {
|
|
display: flex;
|
|
position: absolute;
|
|
bottom: 0;
|
|
left: 0;
|
|
right: 0;
|
|
justify-content: center;
|
|
align-items: center;
|
|
height: 12px;
|
|
margin-top: -2px;
|
|
cursor: ns-resize;
|
|
touch-action: none;
|
|
user-select: none;
|
|
}
|
|
|
|
.info-collapse-resize-handle::after {
|
|
content: '';
|
|
width: 20px;
|
|
height: 2px;
|
|
border-radius: 1px;
|
|
background: color-mix(in srgb, var(--color-text) 50%, transparent);
|
|
}
|
|
|
|
.file-gallery-list-preview {
|
|
position: relative;
|
|
width: 100%;
|
|
max-height: 600px;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.file-gallery-list-scroll {
|
|
width: 100%;
|
|
}
|
|
|
|
.file-gallery-list-preview .simplebar-track.simplebar-vertical {
|
|
display: none;
|
|
}
|
|
|
|
.file-gallery-list-preview .simplebar-track.simplebar-horizontal {
|
|
display: none;
|
|
}
|
|
|
|
.file-gallery-list-preview .simplebar-content-wrapper {
|
|
scroll-snap-type: x mandatory;
|
|
scroll-padding-inline: 0;
|
|
}
|
|
|
|
.file-gallery-list-preview:not(.is-mobile) .simplebar-content-wrapper {
|
|
mask-image: linear-gradient(
|
|
to right,
|
|
transparent 0,
|
|
#000 var(--file-gallery-side-padding, 66px),
|
|
#000 calc(100% - var(--file-gallery-side-padding, 66px)),
|
|
transparent 100%
|
|
);
|
|
-webkit-mask-image: linear-gradient(
|
|
to right,
|
|
transparent 0,
|
|
#000 var(--file-gallery-side-padding, 66px),
|
|
#000 calc(100% - var(--file-gallery-side-padding, 66px)),
|
|
transparent 100%
|
|
);
|
|
}
|
|
|
|
.file-gallery-list-track {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.file-gallery-list-slide {
|
|
box-sizing: border-box;
|
|
scroll-snap-align: center;
|
|
height: 100%;
|
|
min-width: 0;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
}
|
|
|
|
.file-gallery-list-preview-frame {
|
|
flex: 0 0 auto;
|
|
max-width: 100%;
|
|
max-height: 600px;
|
|
overflow: hidden;
|
|
border-radius: 8px;
|
|
}
|
|
|
|
.file-gallery-list-nav {
|
|
position: absolute;
|
|
top: 50%;
|
|
z-index: 2;
|
|
transform: translateY(-50%);
|
|
}
|
|
|
|
.file-gallery-list-nav-left {
|
|
left: 16px;
|
|
}
|
|
|
|
.file-gallery-list-nav-right {
|
|
right: 16px;
|
|
}
|
|
|
|
.file-gallery-footer {
|
|
padding: 0 24px;
|
|
}
|
|
|
|
.file-gallery-list-thumb-container {
|
|
height: 64px;
|
|
width: 64px;
|
|
}
|
|
.file-gallery-list-thumb {
|
|
position: relative;
|
|
flex: 0 0 auto;
|
|
cursor: pointer;
|
|
border-radius: 5px;
|
|
line-height: 0;
|
|
}
|
|
|
|
.file-gallery-list-thumb.is-active {
|
|
outline: 2px solid var(--color-primary);
|
|
outline-offset: 0;
|
|
}
|
|
|
|
.file-gallery-list-thumb-delete.ant-card {
|
|
position: absolute;
|
|
top: 0;
|
|
right: 0;
|
|
transform: translate(30%, -60%);
|
|
z-index: 4;
|
|
width: max-content;
|
|
}
|
|
|
|
.file-gallery-list-thumb-delete.ant-card .ant-card-body {
|
|
line-height: 1;
|
|
}
|
|
|
|
.file-gallery-list-thumb-delete .ant-btn {
|
|
height: auto;
|
|
width: auto;
|
|
padding: 0 2px;
|
|
}
|
|
|
|
.file-gallery-list-upload {
|
|
flex: 0 0 auto;
|
|
}
|
|
|
|
.file-gallery-list-dropzone.ant-upload.ant-upload-drag {
|
|
width: 64px;
|
|
height: 64px;
|
|
padding: 0;
|
|
border-radius: 5px;
|
|
border: 1px dashed color-mix(in srgb, var(--color-primary) 50%, transparent);
|
|
background: repeating-linear-gradient(
|
|
-45deg,
|
|
color-mix(in srgb, var(--color-primary) 12%, transparent),
|
|
color-mix(in srgb, var(--color-primary) 12%, transparent) 6px,
|
|
transparent 6px,
|
|
transparent 12px
|
|
);
|
|
}
|
|
|
|
.file-gallery-list-dropzone.ant-upload.ant-upload-drag
|
|
.ant-upload-drag-container {
|
|
padding: 0;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
height: 64px;
|
|
}
|
|
|
|
.file-gallery-list-dropzone.ant-upload.ant-upload-drag:hover,
|
|
.file-gallery-list-dropzone.ant-upload.ant-upload-drag.ant-upload-drag-hover {
|
|
border-color: var(--color-primary);
|
|
}
|
|
|
|
.file-gallery-list-dropzone .anticon {
|
|
font-size: 18px;
|
|
color: var(--color-primary);
|
|
}
|
|
|
|
.ant-table-wrapper .ant-table-cell,
|
|
.ant-table-wrapper .ant-table-thead > tr > th,
|
|
.ant-table-wrapper .ant-table-tbody > tr > th,
|
|
.ant-table-wrapper .ant-table-tbody > tr > td,
|
|
.ant-table-wrapper tfoot > tr > th,
|
|
.ant-table-wrapper tfoot > tr > td {
|
|
padding: 12px 8px;
|
|
}
|
|
|
|
/* FilterInput */
|
|
.filter-input-operand-icon {
|
|
font-size: 8px;
|
|
}
|
|
|
|
.filter-input-operand-icon--chevron {
|
|
font-size: 11px;
|
|
}
|
|
|
|
.filter-input-operand-icon--gt {
|
|
margin-left: 1px;
|
|
}
|
|
|
|
.filter-input-operand-icon--lt {
|
|
margin-right: 1px;
|
|
}
|
|
|
|
.filter-input-wildcard,
|
|
[data-wildcard] {
|
|
color: var(--color-primary);
|
|
}
|
|
|
|
.filter-input-date-unit,
|
|
[data-date-unit] {
|
|
opacity: 0.5;
|
|
}
|
|
|
|
.filter-input-quote,
|
|
[data-quote] {
|
|
color: color-mix(in srgb, var(--color-text) 40%, transparent);
|
|
}
|
|
|
|
.filter-input-operand-tag {
|
|
margin-inline-end: 0;
|
|
margin-right: 0;
|
|
height: 18px;
|
|
cursor: default;
|
|
padding: 0 4px;
|
|
margin-top: -2px;
|
|
line-height: 1.37;
|
|
user-select: none;
|
|
pointer-events: none;
|
|
flex-shrink: 0;
|
|
font-weight: 700;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
|
|
.filter-input-operand-chip {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
vertical-align: middle;
|
|
margin: 0 2px;
|
|
user-select: none;
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
.filter-input-property-filter {
|
|
display: flex;
|
|
flex-direction: column;
|
|
max-width: 280px;
|
|
margin: 0;
|
|
vertical-align: top;
|
|
overflow: hidden;
|
|
--property-filter-panel-max-height: 220px;
|
|
}
|
|
|
|
.filter-input-property-filter-quick {
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
.filter-input-property-filter-divider {
|
|
margin: 4px 0;
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
.filter-input-property-filter
|
|
> .filter-input-property-filter-scroll.scrollbox-inner {
|
|
height: auto !important;
|
|
max-height: var(--property-filter-panel-max-height);
|
|
max-width: 280px;
|
|
flex-shrink: 1;
|
|
min-height: 0;
|
|
}
|
|
|
|
.filter-input-property-filter
|
|
> .filter-input-property-filter-scroll.scrollbox-inner
|
|
.simplebar-wrapper {
|
|
max-height: var(--property-filter-panel-max-height);
|
|
}
|
|
|
|
.filter-input-property-filter .simplebar-content-wrapper {
|
|
max-width: none;
|
|
}
|
|
|
|
.filter-input-property-filter .simplebar-content {
|
|
display: inline-block;
|
|
}
|
|
|
|
.filter-input-property-filter-body {
|
|
padding: 12px 26px 12px 16px;
|
|
max-width: 280px;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.filter-input-property-filter-content {
|
|
width: max-content;
|
|
max-width: 100%;
|
|
}
|
|
|
|
.filter-input-affix {
|
|
width: 100%;
|
|
display: inline-flex;
|
|
position: relative;
|
|
}
|
|
|
|
.filter-input-affix:not(.filter-input-affix--disabled) {
|
|
cursor: text;
|
|
}
|
|
|
|
.filter-input-affix--disabled {
|
|
cursor: not-allowed;
|
|
}
|
|
|
|
.filter-input-affix--elevated {
|
|
z-index: 3 !important;
|
|
}
|
|
|
|
.filter-input-editor::-webkit-scrollbar {
|
|
display: none;
|
|
height: 0;
|
|
}
|
|
|
|
.filter-input-editor {
|
|
display: block;
|
|
padding: 0;
|
|
border: none;
|
|
border-radius: 0;
|
|
outline: none;
|
|
box-shadow: none;
|
|
background: transparent;
|
|
flex: auto;
|
|
min-width: 0;
|
|
width: 100%;
|
|
font-size: inherit;
|
|
line-height: inherit;
|
|
color: inherit;
|
|
white-space: nowrap;
|
|
overflow-x: auto;
|
|
overflow-y: hidden;
|
|
scrollbar-width: none;
|
|
-ms-overflow-style: none;
|
|
word-break: keep-all;
|
|
overflow-wrap: normal;
|
|
caret-color: var(--ant-color-text, inherit);
|
|
cursor: text;
|
|
}
|
|
|
|
.filter-input-affix--disabled .filter-input-editor {
|
|
cursor: not-allowed;
|
|
}
|
|
|
|
.filter-input-placeholder {
|
|
position: absolute;
|
|
inset-inline-start: var(--ant-input-padding-inline, 11px);
|
|
inset-inline-end: var(--ant-input-padding-inline, 11px);
|
|
top: 0;
|
|
bottom: 0;
|
|
display: flex;
|
|
align-items: center;
|
|
color: var(--color-text-placeholder, rgba(0, 0, 0, 0.25));
|
|
pointer-events: none;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
z-index: 1;
|
|
}
|
|
|
|
.filter-input-affix--has-clear .filter-input-placeholder {
|
|
inset-inline-end: calc(var(--ant-input-padding-inline, 11px) + 22px);
|
|
}
|
|
|
|
.filter-input-popover .ant-popover-inner {
|
|
padding: 4px;
|
|
}
|
|
|
|
.filter-input-popover-anchor {
|
|
position: absolute;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
height: 0;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.list-view-tabs {
|
|
flex: 1;
|
|
min-width: 0;
|
|
}
|
|
|
|
.list-view-tabs .ant-input-sm {
|
|
border-radius: 0;
|
|
}
|
|
|
|
.list-view-tabs-spin {
|
|
flex: 1;
|
|
min-width: 0;
|
|
}
|
|
|
|
.list-view-tabs-spin > .ant-spin-container {
|
|
display: flex;
|
|
flex: 1;
|
|
min-width: 0;
|
|
}
|
|
|
|
.list-view-tabs-segmented-wrap {
|
|
flex: 1;
|
|
min-width: 0;
|
|
}
|
|
|
|
.list-view-tabs-segmented-wrap .simplebar-track.simplebar-vertical {
|
|
display: none;
|
|
}
|
|
|
|
.list-view-tabs-segmented-inner {
|
|
width: max-content;
|
|
}
|
|
|
|
.segmented-nav {
|
|
display: inline-flex;
|
|
width: max-content;
|
|
flex-shrink: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
.segmented-nav-group {
|
|
position: relative;
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 8px;
|
|
}
|
|
|
|
.segmented-nav-thumb {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
z-index: 0;
|
|
border-radius: 12px;
|
|
background: var(--color-button-background);
|
|
pointer-events: none;
|
|
will-change: transform, width;
|
|
transition:
|
|
transform 0.3s cubic-bezier(0.645, 0.045, 0.355, 1),
|
|
width 0.3s cubic-bezier(0.645, 0.045, 0.355, 1),
|
|
height 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
|
|
}
|
|
|
|
.segmented-nav-item {
|
|
position: relative;
|
|
z-index: 1;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
margin: 0;
|
|
padding: 0;
|
|
border: 1px solid var(--color-list-view-tabs-border);
|
|
border-radius: 12px;
|
|
background: transparent;
|
|
cursor: pointer;
|
|
font-family: inherit;
|
|
font-size: inherit;
|
|
line-height: inherit;
|
|
color: inherit;
|
|
box-shadow: none;
|
|
outline: none;
|
|
transition:
|
|
background 0.2s ease,
|
|
border 0.2s ease;
|
|
}
|
|
|
|
.segmented-nav-item-label {
|
|
position: relative;
|
|
z-index: 1;
|
|
display: flex;
|
|
align-items: center;
|
|
min-height: 30px;
|
|
line-height: 30px;
|
|
padding-inline: 12px;
|
|
}
|
|
|
|
.segmented-nav-item-icon {
|
|
padding-inline: 8px;
|
|
min-width: 32px;
|
|
}
|
|
|
|
.segmented-nav-item-icon-contents {
|
|
position: relative;
|
|
z-index: 1;
|
|
display: flex;
|
|
align-items: center;
|
|
min-height: 30px;
|
|
line-height: 30px;
|
|
}
|
|
|
|
.segmented-nav-item:focus-visible {
|
|
outline: 2px solid
|
|
color-mix(in srgb, var(--color-primary, #1677ff) 45%, transparent);
|
|
outline-offset: 2px;
|
|
}
|
|
|
|
.segmented-nav-item-selected,
|
|
.segmented-nav-item:not(.segmented-nav-item-disabled):hover {
|
|
background: var(--color-button-background);
|
|
border: 1px solid
|
|
color-mix(
|
|
in srgb,
|
|
var(--color-button-border) 40%,
|
|
var(--color-button-background)
|
|
);
|
|
}
|
|
|
|
.segmented-nav-item-disabled {
|
|
cursor: not-allowed;
|
|
opacity: 0.45;
|
|
}
|
|
|
|
.segmented-nav-disabled .segmented-nav-item {
|
|
cursor: not-allowed;
|
|
}
|
|
|
|
.list-view-tabs-label {
|
|
height: 30px;
|
|
}
|
|
|
|
.list-view-tabs-label-editing .ant-input {
|
|
font-size: inherit;
|
|
}
|
|
|
|
.list-view-tabs-label-editing {
|
|
margin: 0px -8px;
|
|
max-width: none;
|
|
min-width: 0;
|
|
}
|
|
|
|
.list-view-tabs-label-editing .list-view-tabs-name-input-wrap {
|
|
flex: 0 0 auto;
|
|
width: auto;
|
|
}
|
|
|
|
.list-view-tabs-name-input-wrap {
|
|
display: inline-block;
|
|
position: relative;
|
|
vertical-align: top;
|
|
min-width: 0;
|
|
}
|
|
|
|
.list-view-tabs-name-input-sizer {
|
|
visibility: hidden;
|
|
white-space: pre;
|
|
font-size: inherit;
|
|
line-height: inherit;
|
|
font-family: inherit;
|
|
min-height: 1em;
|
|
}
|
|
|
|
.list-view-tabs-label-editing .list-view-tabs-name-input {
|
|
position: absolute;
|
|
inset: 0;
|
|
width: 100%;
|
|
min-width: 0;
|
|
padding-inline: 0;
|
|
}
|
|
|
|
.list-view-tabs-color-dot {
|
|
display: inline-block;
|
|
width: 6px;
|
|
height: 6px;
|
|
border-radius: 50%;
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
.list-view-tabs-editing
|
|
.segmented-nav-item
|
|
.ant-color-picker-trigger.ant-color-picker-sm {
|
|
border-radius: 8px;
|
|
}
|
|
|
|
.list-view-tabs-privacy-button,
|
|
.list-view-tabs-options-button {
|
|
padding-inline: 4px;
|
|
min-width: 20px;
|
|
}
|
|
|
|
.list-view-tabs-options-dropdown {
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.list-view-tabs-options-dropdown-privacy {
|
|
margin: 3px 12px 14px 16px;
|
|
}
|
|
|
|
.segmented-nav-drag-handle {
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
.segmented-nav-item-dragging {
|
|
opacity: 0.4;
|
|
}
|
|
|
|
.segmented-nav-item-drop-before::before,
|
|
.segmented-nav-item-drop-after::after {
|
|
content: '';
|
|
position: absolute;
|
|
top: 4px;
|
|
bottom: 4px;
|
|
width: 2px;
|
|
border-radius: 1px;
|
|
background: var(--color-primary, #1677ff);
|
|
pointer-events: none;
|
|
}
|
|
|
|
.segmented-nav-item-drop-before::before {
|
|
left: -5px;
|
|
}
|
|
|
|
.segmented-nav-item-drop-after::after {
|
|
right: -5px;
|
|
}
|
|
|
|
.segmented-nav-reordering
|
|
.segmented-nav-item:not(.segmented-nav-item-dragging) {
|
|
cursor: default;
|
|
}
|
|
|
|
.list-view-tabs-add-button {
|
|
padding-inline: 4px;
|
|
min-width: 20px;
|
|
}
|
|
|
|
.dashboard-tabs {
|
|
flex: 1;
|
|
min-width: 0;
|
|
align-self: stretch;
|
|
height: 42px;
|
|
position: relative;
|
|
--tab-mask-fade: 14px;
|
|
}
|
|
|
|
.dashboard-tabs-wrap {
|
|
flex: 1;
|
|
min-width: 0;
|
|
height: 100%;
|
|
position: relative;
|
|
--tab-mask-left: 4px;
|
|
--tab-mask-right: 8px;
|
|
--tab-mask-fade-left: var(--tab-mask-fade);
|
|
--tab-mask-fade-right: var(--tab-mask-fade);
|
|
}
|
|
|
|
.dashboard-tabs-wrap .simplebar-content-wrapper {
|
|
overscroll-behavior-x: none;
|
|
}
|
|
|
|
.dashboard-tabs-wrap .simplebar-mask {
|
|
-webkit-clip-path: inset(0 var(--tab-mask-right) 0 var(--tab-mask-left));
|
|
clip-path: inset(0 var(--tab-mask-right) 0 var(--tab-mask-left));
|
|
-webkit-mask-image: linear-gradient(
|
|
to right,
|
|
transparent var(--tab-mask-left),
|
|
#000 calc(var(--tab-mask-left) + var(--tab-mask-fade-left)),
|
|
#000 calc(100% - var(--tab-mask-right) - var(--tab-mask-fade-right)),
|
|
transparent calc(100% - var(--tab-mask-right))
|
|
);
|
|
mask-image: linear-gradient(
|
|
to right,
|
|
transparent var(--tab-mask-left),
|
|
#000 calc(var(--tab-mask-left) + var(--tab-mask-fade-left)),
|
|
#000 calc(100% - var(--tab-mask-right) - var(--tab-mask-fade-right)),
|
|
transparent calc(100% - var(--tab-mask-right))
|
|
);
|
|
}
|
|
|
|
.dashboard-tabs[data-at-start] .dashboard-tabs-wrap {
|
|
--tab-mask-left: 0px;
|
|
--tab-mask-fade-left: 0px;
|
|
}
|
|
|
|
.dashboard-tabs[data-at-end] .dashboard-tabs-wrap {
|
|
--tab-mask-right: 0px;
|
|
--tab-mask-fade-right: 0px;
|
|
}
|
|
|
|
.dashboard-tabs-wrap::before,
|
|
.dashboard-tabs-wrap::after {
|
|
content: '';
|
|
position: absolute;
|
|
bottom: 0;
|
|
height: 1px;
|
|
pointer-events: none;
|
|
z-index: 2;
|
|
background: var(--color-header-border);
|
|
}
|
|
|
|
.dashboard-tabs-wrap::before {
|
|
left: 0;
|
|
width: calc(var(--tab-mask-left) + var(--tab-mask-fade-left));
|
|
-webkit-mask-image: linear-gradient(
|
|
to right,
|
|
#000 var(--tab-mask-left),
|
|
transparent calc(var(--tab-mask-left) + var(--tab-mask-fade-left))
|
|
);
|
|
mask-image: linear-gradient(
|
|
to right,
|
|
#000 var(--tab-mask-left),
|
|
transparent calc(var(--tab-mask-left) + var(--tab-mask-fade-left))
|
|
);
|
|
}
|
|
|
|
.dashboard-tabs-wrap::after {
|
|
right: 0.2px;
|
|
width: calc(var(--tab-mask-right) + var(--tab-mask-fade-right));
|
|
-webkit-mask-image: linear-gradient(
|
|
to left,
|
|
#000 var(--tab-mask-right),
|
|
transparent calc(var(--tab-mask-right) + var(--tab-mask-fade-right))
|
|
);
|
|
mask-image: linear-gradient(
|
|
to left,
|
|
#000 var(--tab-mask-right),
|
|
transparent calc(var(--tab-mask-right) + var(--tab-mask-fade-right))
|
|
);
|
|
}
|
|
|
|
.dashboard-tabs-wrap .simplebar-track.simplebar-vertical {
|
|
display: none;
|
|
}
|
|
|
|
.dashboard-tabs-inner {
|
|
width: max-content;
|
|
height: 100%;
|
|
min-width: fit-content;
|
|
width: 100%;
|
|
overflow: hidden;
|
|
align-items: flex-start;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.dashboard-tabs-list {
|
|
position: relative;
|
|
display: flex;
|
|
align-items: flex-start;
|
|
gap: 4px;
|
|
padding-left: 20px;
|
|
height: 100%;
|
|
max-height: 42px;
|
|
}
|
|
|
|
.dashboard-tab-item-container {
|
|
height: 42px;
|
|
position: relative;
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
.dashboard-tab-item-container-active {
|
|
border-bottom: none;
|
|
height: 42px;
|
|
}
|
|
|
|
.dashboard-tab-item-container:before {
|
|
content: '';
|
|
position: absolute;
|
|
top: 0;
|
|
left: -2px;
|
|
right: -2px;
|
|
bottom: 0;
|
|
border-bottom: 1px solid var(--color-header-border);
|
|
}
|
|
|
|
.dashboard-tab-item-container:first-child:before {
|
|
left: -20px;
|
|
}
|
|
|
|
.dashboard-tab-item-container:last-child:before {
|
|
right: -20px;
|
|
}
|
|
|
|
.dashboard-tab-item-container-active + .dashboard-tab-item-container:before {
|
|
left: 16px;
|
|
}
|
|
|
|
.dashboard-tab-item-container:has(
|
|
+ .dashboard-tab-item-container-active
|
|
):before {
|
|
right: 16px;
|
|
}
|
|
|
|
.dashboard-tab-item-container-active:before {
|
|
content: none;
|
|
display: none;
|
|
}
|
|
|
|
.dashboard-tab-item {
|
|
position: relative;
|
|
z-index: 1;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
max-width: 240px;
|
|
overflow: visible;
|
|
margin: 5px 0 0 0;
|
|
padding: 0 10px 0 10px;
|
|
border: 1px solid
|
|
color-mix(in srgb, var(--color-header-border) 55%, transparent);
|
|
border-radius: 12px;
|
|
background: transparent;
|
|
cursor: pointer;
|
|
font-family: inherit;
|
|
font-size: inherit;
|
|
line-height: inherit;
|
|
color: inherit;
|
|
box-shadow: none;
|
|
outline: none;
|
|
}
|
|
|
|
.dashboard-tab-item-body {
|
|
display: flex;
|
|
align-items: center;
|
|
min-width: 0;
|
|
}
|
|
|
|
.dashboard-tab-item-icon {
|
|
display: flex;
|
|
align-items: center;
|
|
min-height: 30px;
|
|
line-height: 30px;
|
|
margin-right: 6px;
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
.dashboard-tab-item:focus-visible {
|
|
outline: 2px solid
|
|
color-mix(in srgb, var(--color-primary, #1677ff) 45%, transparent);
|
|
outline-offset: 2px;
|
|
}
|
|
|
|
.dashboard-tab-item:not(.dashboard-tab-item-active) {
|
|
transition:
|
|
background 0.3s ease,
|
|
border-color 0.3s ease;
|
|
}
|
|
|
|
.dashboard-tab-item:not(.dashboard-tab-item-active):hover {
|
|
background: color-mix(in srgb, #ffffff 45%, transparent);
|
|
border: 1px solid var(--color-header-border);
|
|
}
|
|
|
|
.dark-mode .dashboard-tab-item:not(.dashboard-tab-item-active):hover {
|
|
background: color-mix(in srgb, #ffffff 2.75%, transparent);
|
|
}
|
|
|
|
.dashboard-tab-item-active {
|
|
z-index: 2;
|
|
align-self: stretch;
|
|
margin-bottom: -1px;
|
|
padding-bottom: 5px;
|
|
border-color: transparent;
|
|
position: relative;
|
|
border-radius: 12px 12px 0 0;
|
|
}
|
|
|
|
.dashboard-tab-item-active:before {
|
|
content: '';
|
|
position: absolute;
|
|
top: 0px;
|
|
left: 0px;
|
|
right: 0px;
|
|
bottom: 21px;
|
|
border-radius: 11px 11px 0 0;
|
|
z-index: -2;
|
|
background: var(--color-layout-background);
|
|
}
|
|
|
|
.dashboard-tab-item-active:after {
|
|
content: '';
|
|
position: absolute;
|
|
top: 14px;
|
|
left: 1px;
|
|
right: 1px;
|
|
bottom: -1px;
|
|
z-index: -2;
|
|
background: var(--color-layout-background);
|
|
}
|
|
|
|
.dashboard-tab-item-outline-container {
|
|
position: absolute;
|
|
top: -1px;
|
|
left: -1px;
|
|
right: -1px;
|
|
bottom: 0;
|
|
}
|
|
|
|
.dashboard-tab-item-outline {
|
|
position: absolute;
|
|
inset: 0 0 21px 0;
|
|
border: 1px solid var(--color-header-border);
|
|
border-bottom: none;
|
|
border-radius: 12px 12px 0 0;
|
|
pointer-events: none;
|
|
opacity: 0;
|
|
}
|
|
|
|
.dashboard-tab-item-corner {
|
|
--tab-corner-size: 22px;
|
|
--tab-corner-radius: 16px;
|
|
--tab-corner-inset: 1px;
|
|
--tab-corner-center: calc(
|
|
var(--tab-corner-size) - var(--tab-corner-inset) - var(--tab-corner-radius)
|
|
);
|
|
--tab-fill-nudge-x: 3px;
|
|
--tab-fill-nudge-y: 4px;
|
|
--tab-fill-circle-x: calc(var(--tab-corner-center) + var(--tab-fill-nudge-x));
|
|
--tab-fill-circle-y: calc(var(--tab-corner-size) - var(--tab-corner-radius));
|
|
position: absolute;
|
|
bottom: -1px;
|
|
width: var(--tab-corner-size);
|
|
height: var(--tab-corner-size);
|
|
overflow: hidden;
|
|
pointer-events: none;
|
|
opacity: 0;
|
|
}
|
|
|
|
.dashboard-tab-item-corner-left {
|
|
left: -21px;
|
|
}
|
|
|
|
.dashboard-tab-item-corner-right {
|
|
right: -21px;
|
|
}
|
|
|
|
.dashboard-tab-item-corner-fill {
|
|
position: absolute;
|
|
width: 26px;
|
|
height: 26px;
|
|
bottom: calc(-1 * var(--tab-fill-nudge-y));
|
|
background: var(--color-layout-background);
|
|
-webkit-mask-repeat: no-repeat;
|
|
mask-repeat: no-repeat;
|
|
}
|
|
|
|
.dashboard-tab-item-corner-left .dashboard-tab-item-corner-fill {
|
|
left: calc(-1 * var(--tab-fill-nudge-x));
|
|
-webkit-mask-image: radial-gradient(
|
|
circle at var(--tab-fill-circle-x) var(--tab-fill-circle-y),
|
|
transparent var(--tab-corner-radius),
|
|
#000 var(--tab-corner-radius)
|
|
);
|
|
mask-image: radial-gradient(
|
|
circle at var(--tab-fill-circle-x) var(--tab-fill-circle-y),
|
|
transparent var(--tab-corner-radius),
|
|
#000 var(--tab-corner-radius)
|
|
);
|
|
}
|
|
|
|
.dashboard-tab-item-corner-right .dashboard-tab-item-corner-fill {
|
|
right: calc(-1 * var(--tab-fill-nudge-x));
|
|
-webkit-mask-image: radial-gradient(
|
|
circle at calc(100% - var(--tab-fill-circle-x)) var(--tab-fill-circle-y),
|
|
transparent var(--tab-corner-radius),
|
|
#000 var(--tab-corner-radius)
|
|
);
|
|
mask-image: radial-gradient(
|
|
circle at calc(100% - var(--tab-fill-circle-x)) var(--tab-fill-circle-y),
|
|
transparent var(--tab-corner-radius),
|
|
#000 var(--tab-corner-radius)
|
|
);
|
|
}
|
|
|
|
.dashboard-tab-item-corner-inner {
|
|
position: absolute;
|
|
width: 48px;
|
|
height: 48px;
|
|
box-sizing: border-box;
|
|
border-radius: var(--tab-corner-radius);
|
|
padding: 1px;
|
|
background: var(--color-header-border);
|
|
-webkit-mask:
|
|
linear-gradient(#fff 0 0) content-box,
|
|
linear-gradient(#fff 0 0);
|
|
-webkit-mask-composite: xor;
|
|
mask:
|
|
linear-gradient(#fff 0 0) content-box,
|
|
linear-gradient(#fff 0 0);
|
|
mask-composite: exclude;
|
|
}
|
|
|
|
.dashboard-tab-item-corner-left .dashboard-tab-item-corner-inner {
|
|
bottom: 0;
|
|
right: var(--tab-corner-inset);
|
|
}
|
|
|
|
.dashboard-tab-item-corner-right .dashboard-tab-item-corner-inner {
|
|
bottom: 0;
|
|
left: var(--tab-corner-inset);
|
|
}
|
|
|
|
.dashboard-tab-item-active .dashboard-tab-item-outline,
|
|
.dashboard-tab-item-active .dashboard-tab-item-corner {
|
|
opacity: 1;
|
|
}
|
|
|
|
.dashboard-tabs-label {
|
|
max-width: 186px;
|
|
min-width: 0;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.dashboard-tabs-label .elipsis-text-wrapper.ant-typography {
|
|
min-width: 0;
|
|
max-width: 100%;
|
|
}
|
|
|
|
.dashboard-tab-item-container[data-sticky-placeholder='true']
|
|
> .dashboard-tab-item {
|
|
visibility: hidden;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.dashboard-tabs[data-sticky-edge] .dashboard-tab-item-container:before,
|
|
.dashboard-tabs[data-sticky-edge] .dashboard-tabs-add-button-container:before,
|
|
.dashboard-tabs[data-sticky-edge] .dashboard-tabs-wrap::before,
|
|
.dashboard-tabs[data-sticky-edge] .dashboard-tabs-wrap::after,
|
|
.dashboard-tabs[data-at-start] .dashboard-tabs-wrap::before,
|
|
.dashboard-tabs[data-at-end] .dashboard-tabs-wrap::after {
|
|
content: none;
|
|
display: none;
|
|
}
|
|
|
|
.dashboard-tabs-sticky-line {
|
|
display: none;
|
|
position: absolute;
|
|
bottom: 0;
|
|
pointer-events: none;
|
|
z-index: 3;
|
|
border-bottom: 1px solid var(--color-header-border);
|
|
}
|
|
|
|
.dashboard-tabs-sticky-line[data-edge] {
|
|
display: block;
|
|
}
|
|
|
|
.dashboard-tab-sticky-clone {
|
|
position: absolute;
|
|
top: 0;
|
|
height: 42px;
|
|
z-index: 5;
|
|
visibility: hidden;
|
|
pointer-events: none;
|
|
box-sizing: border-box;
|
|
flex: none;
|
|
overflow: visible;
|
|
}
|
|
|
|
.dashboard-tab-sticky-clone[data-edge] {
|
|
visibility: visible;
|
|
width: var(--tab-sticky-width);
|
|
}
|
|
|
|
.dashboard-tab-sticky-clone[data-edge] .dashboard-tab-item {
|
|
pointer-events: none;
|
|
box-sizing: border-box;
|
|
width: var(--tab-sticky-width);
|
|
min-width: var(--tab-sticky-width);
|
|
max-width: var(--tab-sticky-width);
|
|
justify-content: flex-start;
|
|
overflow: visible;
|
|
}
|
|
|
|
.dashboard-tab-sticky-clone[data-edge] .dashboard-tab-item-body {
|
|
width: 100%;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.dashboard-tab-sticky-clone[data-edge] .dashboard-tab-item-icon {
|
|
margin-right: calc(6px * var(--tab-label-opacity, 1));
|
|
}
|
|
|
|
.dashboard-tab-sticky-clone[data-edge] .dashboard-tabs-label {
|
|
flex: 1 1 auto;
|
|
min-width: 0;
|
|
opacity: var(--tab-label-opacity, 1);
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.dashboard-tab-sticky-clone[data-edge] .dashboard-tabs-label .ant-typography {
|
|
max-width: 100% !important;
|
|
min-width: 0;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.dashboard-tab-sticky-clone[data-edge] .dashboard-tabs-close {
|
|
pointer-events: auto;
|
|
}
|
|
|
|
.dashboard-tabs-close {
|
|
position: relative;
|
|
z-index: 1;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
width: 16px;
|
|
height: 16px;
|
|
margin-left: 1px;
|
|
margin-right: -2px;
|
|
border-radius: 8px;
|
|
color: color-mix(
|
|
in srgb,
|
|
var(--color-text-secondary, inherit) 70%,
|
|
transparent
|
|
);
|
|
cursor: pointer;
|
|
flex-shrink: 0;
|
|
transition: color 0.2s ease;
|
|
}
|
|
|
|
.dashboard-tabs-close:hover {
|
|
color: var(--color-text-secondary, inherit);
|
|
}
|
|
|
|
.dashboard-tabs-close::before {
|
|
content: '';
|
|
position: absolute;
|
|
inset: -8px -8px -8px -6px;
|
|
}
|
|
|
|
.dashboard-tabs-add-button {
|
|
padding-inline: 5px;
|
|
min-width: 22px;
|
|
margin-top: 5px;
|
|
margin-right: 5px;
|
|
}
|
|
|
|
.dashboard-tabs-add-button-container {
|
|
flex-grow: 1;
|
|
height: 42px;
|
|
position: relative;
|
|
}
|
|
|
|
.dashboard-tabs-add-button-container:before {
|
|
content: '';
|
|
position: absolute;
|
|
left: 15px;
|
|
right: 0;
|
|
bottom: 0;
|
|
border-bottom: 1px solid var(--color-header-border);
|
|
}
|
|
|
|
.dashboard-tab-item-dragging {
|
|
opacity: 0.4;
|
|
}
|
|
|
|
.dashboard-tab-item-drop-before::before,
|
|
.dashboard-tab-item-drop-after::after {
|
|
content: '';
|
|
position: absolute;
|
|
top: 4px;
|
|
bottom: 4px;
|
|
width: 2px;
|
|
border-radius: 1px;
|
|
background: var(--color-primary, #1677ff);
|
|
pointer-events: none;
|
|
}
|
|
|
|
.dashboard-tab-item-drop-before::before {
|
|
left: -5px;
|
|
}
|
|
|
|
.dashboard-tab-item-drop-after::after {
|
|
right: -5px;
|
|
}
|
|
|
|
.dashboard-tabs-reordering
|
|
.dashboard-tab-item:not(.dashboard-tab-item-dragging) {
|
|
cursor: default;
|
|
}
|
|
|
|
.dashboard-tab-panes {
|
|
position: relative;
|
|
isolation: isolate;
|
|
flex: 1 1 auto;
|
|
min-height: 0;
|
|
height: 100%;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.dashboard-tab-pane {
|
|
position: absolute;
|
|
top: 10px;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
display: flex;
|
|
flex-direction: column;
|
|
box-sizing: border-box;
|
|
min-width: 0;
|
|
min-height: 0;
|
|
}
|
|
|
|
.dashboard-tab-pane-active {
|
|
z-index: 2;
|
|
isolation: isolate;
|
|
display: flex;
|
|
visibility: visible;
|
|
opacity: 1;
|
|
transform: none;
|
|
}
|
|
|
|
.dashboard-tab-pane-inactive {
|
|
z-index: 0;
|
|
overflow: hidden;
|
|
visibility: hidden;
|
|
opacity: 0;
|
|
pointer-events: none;
|
|
content-visibility: hidden;
|
|
}
|
|
|
|
.dashboard-tab-pane-inactive.dashboard-tab-pane-capturing {
|
|
/* Preview render: keep layout, but park the pane off-screen. */
|
|
visibility: visible;
|
|
opacity: 1;
|
|
pointer-events: none;
|
|
transform: translate(-100%, 0);
|
|
z-index: 0;
|
|
content-visibility: visible;
|
|
}
|
|
|
|
.dashboard-tab-preview-capture-frame {
|
|
position: absolute;
|
|
inset: 0;
|
|
z-index: 0;
|
|
box-sizing: border-box;
|
|
display: flex;
|
|
flex-direction: column;
|
|
padding: 24px;
|
|
background: var(--tab-preview-render-background);
|
|
transform: translate(-100%, 0);
|
|
pointer-events: none;
|
|
}
|
|
|
|
.dashboard-tab-preview-capture-frame > .dashboard-tab-pane {
|
|
position: relative;
|
|
inset: auto;
|
|
flex: 1 1 auto;
|
|
width: 100%;
|
|
height: auto;
|
|
min-height: 0;
|
|
transform: none;
|
|
}
|
|
|
|
.dashboard-tab-preview-capture-frame
|
|
> .dashboard-tab-pane-inactive.dashboard-tab-pane-capturing {
|
|
transform: none;
|
|
}
|
|
|
|
.dashboard-tab-preview-popover {
|
|
padding-top: 6px;
|
|
}
|
|
|
|
.dashboard-tab-preview-popover .ant-popover-inner {
|
|
padding: 0;
|
|
overflow: hidden;
|
|
background: transparent;
|
|
}
|
|
|
|
.dashboard-tab-preview {
|
|
position: relative;
|
|
width: 320px;
|
|
background: var(--layout-header-bg);
|
|
overflow: hidden;
|
|
padding: 6px;
|
|
border: 1px solid transparent;
|
|
border-radius: 12px;
|
|
}
|
|
|
|
.dark-mode.dashboard-tab-preview {
|
|
border: 1px solid var(--color-header-border);
|
|
}
|
|
|
|
.dark-mode.dashboard-tab-preview:before {
|
|
content: '';
|
|
position: absolute;
|
|
inset: 1px;
|
|
background: var(--tab-preview-render-background);
|
|
}
|
|
|
|
.dashboard-tab-preview-stack {
|
|
position: relative;
|
|
width: 100%;
|
|
overflow: hidden;
|
|
border-radius: 7px;
|
|
}
|
|
|
|
.dashboard-tab-preview-svg {
|
|
display: block;
|
|
width: 100%;
|
|
height: auto;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.dashboard-tab-preview-svg-current {
|
|
position: relative;
|
|
z-index: 0;
|
|
}
|
|
|
|
.dashboard-tab-preview-svg-previous {
|
|
position: absolute;
|
|
inset: 0;
|
|
z-index: 1;
|
|
width: 100%;
|
|
height: 100%;
|
|
object-fit: cover;
|
|
object-position: top center;
|
|
filter: blur(8px);
|
|
opacity: 1;
|
|
transition:
|
|
opacity 280ms ease,
|
|
filter 280ms ease;
|
|
}
|
|
|
|
.dashboard-tab-preview-stack:has(.dashboard-tab-preview-loading):not(
|
|
:has(.dashboard-tab-preview-svg-current)
|
|
) {
|
|
min-height: 160px;
|
|
}
|
|
|
|
.dashboard-tab-preview-svg-previous.is-revealing {
|
|
opacity: 0;
|
|
filter: blur(0);
|
|
}
|
|
|
|
.dashboard-tab-preview-loading {
|
|
position: absolute;
|
|
inset: 0;
|
|
z-index: 2;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.dashboard-tab-preview-loading-icon {
|
|
font-size: 16px;
|
|
color: var(--color-text-secondary, rgba(255, 255, 255, 0.92));
|
|
filter: drop-shadow(0 0 10px rgba(0, 0, 0, 0.45));
|
|
}
|
|
|
|
.dashboard-tab-preview-placeholder {
|
|
width: 100%;
|
|
height: 100%;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
background: rgba(128, 128, 128, 0.18);
|
|
}
|
|
|
|
.state-tag-loading svg path {
|
|
stroke: currentColor;
|
|
stroke-width: 12px;
|
|
}
|
|
|
|
.printerQueue.ant-steps.ant-steps-vertical
|
|
> .ant-steps-item:last-child
|
|
.ant-steps-item-content {
|
|
min-height: 0;
|
|
}
|
|
|
|
.mobile-footer-navigation.ant-layout-footer {
|
|
flex: 0 0 auto;
|
|
width: 100%;
|
|
line-height: normal;
|
|
padding: 8px 8px calc(8px + env(safe-area-inset-bottom, 0px));
|
|
background: var(--color-mobile-footer-bg);
|
|
color: var(--color-text);
|
|
border-top: 1px solid var(--color-mobile-footer-item-border);
|
|
}
|
|
|
|
.mobile-footer-navigation-tabs.segmented-nav {
|
|
display: flex;
|
|
width: 100%;
|
|
}
|
|
|
|
.mobile-footer-navigation .segmented-nav-group {
|
|
width: 100%;
|
|
}
|
|
|
|
.mobile-footer-navigation .segmented-nav-item {
|
|
flex: 1 1 0;
|
|
min-width: 0;
|
|
flex-direction: column;
|
|
gap: 10px;
|
|
padding: 12px;
|
|
border: none;
|
|
color: var(--color-text);
|
|
transition:
|
|
background 0.2s ease,
|
|
color 0.2s ease;
|
|
}
|
|
|
|
.mobile-footer-navigation .segmented-nav-item-icon {
|
|
padding-inline: 0;
|
|
min-width: 0;
|
|
}
|
|
|
|
.mobile-footer-navigation .segmented-nav-item-icon-contents {
|
|
min-height: 24px;
|
|
line-height: 24px;
|
|
}
|
|
|
|
.mobile-footer-navigation .segmented-nav-item-icon-contents .anticon {
|
|
font-size: 24px;
|
|
}
|
|
|
|
.mobile-footer-navigation .segmented-nav-thumb {
|
|
background: var(--color-mobile-footer-item-bg);
|
|
border: none;
|
|
}
|
|
|
|
.mobile-footer-navigation .segmented-nav-item-selected,
|
|
.mobile-footer-navigation
|
|
.segmented-nav-item:not(.segmented-nav-item-disabled):hover {
|
|
background: var(--color-mobile-footer-item-bg);
|
|
border: none;
|
|
}
|
|
|
|
.mobile-footer-navigation .segmented-nav-item-selected {
|
|
color: var(--color-primary);
|
|
}
|
|
|
|
.mobile-footer-navigation .segmented-nav-item-selected .anticon,
|
|
.mobile-footer-navigation .segmented-nav-item-selected svg {
|
|
color: inherit;
|
|
}
|
|
|
|
.mobile-footer-navigation .segmented-nav-item-label {
|
|
min-height: 0;
|
|
line-height: 1.2;
|
|
padding-inline: 0;
|
|
font-size: 11px;
|
|
font-weight: 500;
|
|
min-width: 0;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.main-layout.is-mobile {
|
|
overflow: hidden;
|
|
}
|
|
|
|
.mobile-menu.ant-menu-horizontal {
|
|
max-width: 32px;
|
|
margin-left: 4px;
|
|
margin-right: 12px;
|
|
}
|
|
|
|
.mobile-menu.ant-menu-horizontal .ant-menu-submenu {
|
|
padding: 0;
|
|
}
|