dockview
Version:
React docking layout manager — tabs, groups, grids, splitviews, drag and drop, floating panels
1,263 lines (1,251 loc) • 110 kB
CSS
.dv-scrollable {
position: relative;
overflow: hidden;
}
.dv-scrollable .dv-scrollbar {
position: absolute;
border-radius: 2px;
background-color: transparent;
/* GPU optimizations */
will-change: background-color, transform;
transform: translate3d(0, 0, 0);
backface-visibility: hidden;
transition-property: background-color;
transition-timing-function: ease-in-out;
transition-duration: 1s;
transition-delay: 0s;
}
.dv-scrollable .dv-scrollbar-horizontal {
bottom: 0px;
left: 0px;
height: 4px;
}
.dv-scrollable .dv-scrollbar-vertical {
right: 0px;
top: 0px;
width: 4px;
}
.dv-scrollable:hover .dv-scrollbar, .dv-scrollable.dv-scrollable-resizing .dv-scrollbar, .dv-scrollable.dv-scrollable-scrolling .dv-scrollbar {
background-color: var(--dv-scrollbar-background-color, rgba(255, 255, 255, 0.25));
}
.dv-svg {
display: inline-block;
fill: currentcolor;
line-height: 1;
stroke: currentcolor;
stroke-width: 0;
}
.dockview-theme-dark {
--dv-paneview-active-outline-color: dodgerblue;
--dv-tabs-and-actions-container-font-size: 13px;
--dv-tabs-and-actions-container-height: 35px;
--dv-drag-over-background-color: rgba(83, 89, 93, 0.5);
--dv-drag-over-border-color: transparent;
--dv-tabs-container-scrollbar-color: #888;
--dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);
--dv-floating-box-shadow:
0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);
--dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);
--dv-overlay-z-index: 999;
--dv-tab-font-size: inherit;
--dv-border-radius: 0px;
--dv-tab-margin: 0;
--dv-sash-color: transparent;
--dv-active-sash-color: transparent;
--dv-active-sash-transition-duration: 0.1s;
--dv-active-sash-transition-delay: 0.5s;
--dv-spacing-padding: 0px;
--dv-tab-border-radius: 0px;
--dv-sash-border-radius: 0px;
--dv-dropdown-border-radius: 0px;
--dv-tab-close-icon-size: inherit;
--dv-floating-group-border: none;
--dv-drag-over-border: none;
--dv-floating-group-dragging-opacity: 0.5;
--dv-tab-group-color-grey: #5f6368;
--dv-tab-group-color-blue: #1a73e8;
--dv-tab-group-color-red: #d93025;
--dv-tab-group-color-yellow: #f9ab00;
--dv-tab-group-color-green: #188038;
--dv-tab-group-color-pink: #d01884;
--dv-tab-group-color-purple: #a142f4;
--dv-tab-group-color-cyan: #007b83;
--dv-tab-group-color-orange: #e8710a;
--dv-tab-group-chip-padding: 4px 8px;
--dv-tab-group-chip-border-radius: 6px;
--dv-tab-group-chip-font-size: 11px;
--dv-tab-group-line-height: 2px;
--dv-tab-group-line-opacity: 0.6;
}
.dockview-theme-dark .dv-drop-target-container .dv-drop-target-anchor.dv-drop-target-anchor-container-changed {
opacity: 0;
transition: none;
}
.dockview-theme-dark {
--dv-group-view-background-color: #1e1e1e;
--dv-tabs-and-actions-container-background-color: #252526;
--dv-activegroup-visiblepanel-tab-background-color: #1e1e1e;
--dv-activegroup-hiddenpanel-tab-background-color: #2d2d2d;
--dv-inactivegroup-visiblepanel-tab-background-color: #1e1e1e;
--dv-inactivegroup-hiddenpanel-tab-background-color: #2d2d2d;
--dv-tab-divider-color: #1e1e1e;
--dv-activegroup-visiblepanel-tab-color: white;
--dv-activegroup-hiddenpanel-tab-color: #969696;
--dv-inactivegroup-visiblepanel-tab-color: #8f8f8f;
--dv-inactivegroup-hiddenpanel-tab-color: #626262;
--dv-separator-border: rgb(68, 68, 68);
--dv-paneview-header-border-color: rgba(204, 204, 204, 0.2);
}
.dockview-theme-light {
--dv-paneview-active-outline-color: dodgerblue;
--dv-tabs-and-actions-container-font-size: 13px;
--dv-tabs-and-actions-container-height: 35px;
--dv-drag-over-background-color: rgba(83, 89, 93, 0.5);
--dv-drag-over-border-color: transparent;
--dv-tabs-container-scrollbar-color: #888;
--dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);
--dv-floating-box-shadow:
0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);
--dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);
--dv-overlay-z-index: 999;
--dv-tab-font-size: inherit;
--dv-border-radius: 0px;
--dv-tab-margin: 0;
--dv-sash-color: transparent;
--dv-active-sash-color: transparent;
--dv-active-sash-transition-duration: 0.1s;
--dv-active-sash-transition-delay: 0.5s;
--dv-spacing-padding: 0px;
--dv-tab-border-radius: 0px;
--dv-sash-border-radius: 0px;
--dv-dropdown-border-radius: 0px;
--dv-tab-close-icon-size: inherit;
--dv-floating-group-border: none;
--dv-drag-over-border: none;
--dv-floating-group-dragging-opacity: 0.5;
--dv-tab-group-color-grey: #5f6368;
--dv-tab-group-color-blue: #1a73e8;
--dv-tab-group-color-red: #d93025;
--dv-tab-group-color-yellow: #f9ab00;
--dv-tab-group-color-green: #188038;
--dv-tab-group-color-pink: #d01884;
--dv-tab-group-color-purple: #a142f4;
--dv-tab-group-color-cyan: #007b83;
--dv-tab-group-color-orange: #e8710a;
--dv-tab-group-chip-padding: 4px 8px;
--dv-tab-group-chip-border-radius: 6px;
--dv-tab-group-chip-font-size: 11px;
--dv-tab-group-line-height: 2px;
--dv-tab-group-line-opacity: 0.6;
}
.dockview-theme-light .dv-drop-target-container .dv-drop-target-anchor.dv-drop-target-anchor-container-changed {
opacity: 0;
transition: none;
}
.dockview-theme-light {
--dv-group-view-background-color: white;
--dv-tabs-and-actions-container-background-color: #f3f3f3;
--dv-activegroup-visiblepanel-tab-background-color: white;
--dv-activegroup-hiddenpanel-tab-background-color: #ececec;
--dv-inactivegroup-visiblepanel-tab-background-color: white;
--dv-inactivegroup-hiddenpanel-tab-background-color: #ececec;
--dv-tab-divider-color: white;
--dv-activegroup-visiblepanel-tab-color: rgb(51, 51, 51);
--dv-activegroup-hiddenpanel-tab-color: rgba(51, 51, 51, 0.7);
--dv-inactivegroup-visiblepanel-tab-color: rgba(51, 51, 51, 0.7);
--dv-inactivegroup-hiddenpanel-tab-color: rgba(51, 51, 51, 0.35);
--dv-separator-border: rgba(128, 128, 128, 0.35);
--dv-paneview-header-border-color: rgb(51, 51, 51);
--dv-scrollbar-background-color: rgba(0, 0, 0, 0.25);
--dv-floating-box-shadow:
0 8px 32px rgba(0, 0, 0, 0.12), 0 2px 8px rgba(0, 0, 0, 0.08);
--dv-floating-border: 1px solid rgba(0, 0, 0, 0.1);
}
.dockview-theme-vs {
--dv-paneview-active-outline-color: dodgerblue;
--dv-tabs-and-actions-container-font-size: 13px;
--dv-tabs-and-actions-container-height: 35px;
--dv-drag-over-background-color: rgba(83, 89, 93, 0.5);
--dv-drag-over-border-color: transparent;
--dv-tabs-container-scrollbar-color: #888;
--dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);
--dv-floating-box-shadow:
0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);
--dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);
--dv-overlay-z-index: 999;
--dv-tab-font-size: inherit;
--dv-border-radius: 0px;
--dv-tab-margin: 0;
--dv-sash-color: transparent;
--dv-active-sash-color: transparent;
--dv-active-sash-transition-duration: 0.1s;
--dv-active-sash-transition-delay: 0.5s;
--dv-spacing-padding: 0px;
--dv-tab-border-radius: 0px;
--dv-sash-border-radius: 0px;
--dv-dropdown-border-radius: 0px;
--dv-tab-close-icon-size: inherit;
--dv-floating-group-border: none;
--dv-drag-over-border: none;
--dv-floating-group-dragging-opacity: 0.5;
--dv-tab-group-color-grey: #5f6368;
--dv-tab-group-color-blue: #1a73e8;
--dv-tab-group-color-red: #d93025;
--dv-tab-group-color-yellow: #f9ab00;
--dv-tab-group-color-green: #188038;
--dv-tab-group-color-pink: #d01884;
--dv-tab-group-color-purple: #a142f4;
--dv-tab-group-color-cyan: #007b83;
--dv-tab-group-color-orange: #e8710a;
--dv-tab-group-chip-padding: 4px 8px;
--dv-tab-group-chip-border-radius: 6px;
--dv-tab-group-chip-font-size: 11px;
--dv-tab-group-line-height: 2px;
--dv-tab-group-line-opacity: 0.6;
}
.dockview-theme-vs .dv-drop-target-container .dv-drop-target-anchor.dv-drop-target-anchor-container-changed {
opacity: 0;
transition: none;
}
.dockview-theme-vs {
--dv-group-view-background-color: #1e1e1e;
--dv-tabs-and-actions-container-background-color: #252526;
--dv-activegroup-visiblepanel-tab-background-color: #1e1e1e;
--dv-activegroup-hiddenpanel-tab-background-color: #2d2d2d;
--dv-inactivegroup-visiblepanel-tab-background-color: #1e1e1e;
--dv-inactivegroup-hiddenpanel-tab-background-color: #2d2d2d;
--dv-tab-divider-color: #1e1e1e;
--dv-activegroup-visiblepanel-tab-color: white;
--dv-activegroup-hiddenpanel-tab-color: #969696;
--dv-inactivegroup-visiblepanel-tab-color: #8f8f8f;
--dv-inactivegroup-hiddenpanel-tab-color: #626262;
--dv-separator-border: rgb(68, 68, 68);
--dv-paneview-header-border-color: rgba(204, 204, 204, 0.2);
--dv-tabs-and-actions-container-background-color: #2d2d30;
--dv-tabs-and-actions-container-height: 20px;
--dv-tabs-and-actions-container-font-size: 11px;
--dv-activegroup-visiblepanel-tab-background-color: #007acc;
--dv-inactivegroup-visiblepanel-tab-background-color: #3f3f46;
--dv-activegroup-visiblepanel-tab-color: white;
--dv-activegroup-hiddenpanel-tab-color: white;
--dv-inactivegroup-visiblepanel-tab-color: white;
--dv-inactivegroup-hiddenpanel-tab-color: white;
}
.dockview-theme-vs .dv-groupview.dv-active-group > .dv-tabs-and-actions-container {
box-sizing: content-box;
border-bottom: 2px solid var(--dv-activegroup-visiblepanel-tab-background-color);
}
.dockview-theme-vs .dv-groupview.dv-active-group > .dv-tabs-and-actions-container .dv-tab.dv-active-tab {
border-top: 2px solid var(--dv-activegroup-visiblepanel-tab-background-color);
}
.dockview-theme-vs .dv-groupview.dv-active-group > .dv-tabs-and-actions-container .dv-tab.dv-inactive-tab {
border-top: 2px solid var(--dv-activegroup-hiddenpanel-tab-background-color);
}
.dockview-theme-vs .dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container {
box-sizing: content-box;
border-bottom: 2px solid var(--dv-inactivegroup-visiblepanel-tab-background-color);
}
.dockview-theme-vs .dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container .dv-tab.dv-active-tab {
border-top: 2px solid var(--dv-inactivegroup-visiblepanel-tab-background-color);
}
.dockview-theme-vs .dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container .dv-tab.dv-inactive-tab {
border-top: 2px solid var(--dv-inactivegroup-hiddenpanel-tab-background-color);
}
.dockview-theme-abyss {
--dv-paneview-active-outline-color: dodgerblue;
--dv-tabs-and-actions-container-font-size: 13px;
--dv-tabs-and-actions-container-height: 35px;
--dv-drag-over-background-color: rgba(83, 89, 93, 0.5);
--dv-drag-over-border-color: transparent;
--dv-tabs-container-scrollbar-color: #888;
--dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);
--dv-floating-box-shadow:
0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);
--dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);
--dv-overlay-z-index: 999;
--dv-tab-font-size: inherit;
--dv-border-radius: 0px;
--dv-tab-margin: 0;
--dv-sash-color: transparent;
--dv-active-sash-color: transparent;
--dv-active-sash-transition-duration: 0.1s;
--dv-active-sash-transition-delay: 0.5s;
--dv-spacing-padding: 0px;
--dv-tab-border-radius: 0px;
--dv-sash-border-radius: 0px;
--dv-dropdown-border-radius: 0px;
--dv-tab-close-icon-size: inherit;
--dv-floating-group-border: none;
--dv-drag-over-border: none;
--dv-floating-group-dragging-opacity: 0.5;
--dv-tab-group-color-grey: #5f6368;
--dv-tab-group-color-blue: #1a73e8;
--dv-tab-group-color-red: #d93025;
--dv-tab-group-color-yellow: #f9ab00;
--dv-tab-group-color-green: #188038;
--dv-tab-group-color-pink: #d01884;
--dv-tab-group-color-purple: #a142f4;
--dv-tab-group-color-cyan: #007b83;
--dv-tab-group-color-orange: #e8710a;
--dv-tab-group-chip-padding: 4px 8px;
--dv-tab-group-chip-border-radius: 6px;
--dv-tab-group-chip-font-size: 11px;
--dv-tab-group-line-height: 2px;
--dv-tab-group-line-opacity: 0.6;
}
.dockview-theme-abyss .dv-drop-target-container .dv-drop-target-anchor.dv-drop-target-anchor-container-changed {
opacity: 0;
transition: none;
}
.dockview-theme-abyss {
--dv-color-abyss-dark: #000c18;
--dv-color-abyss: #10192c;
--dv-color-abyss-light: #1c1c2a;
--dv-color-abyss-lighter: #2b2b4a;
--dv-color-abyss-accent: rgb(91, 30, 207);
--dv-color-abyss-primary-text: white;
--dv-color-abyss-secondary-text: rgb(148, 151, 169);
--dv-group-view-background-color: var(--dv-color-abyss-dark);
--dv-tabs-and-actions-container-background-color: var(
--dv-color-abyss-light
);
--dv-activegroup-visiblepanel-tab-background-color: var(
--dv-color-abyss-dark
);
--dv-activegroup-hiddenpanel-tab-background-color: var(--dv-color-abyss);
--dv-inactivegroup-visiblepanel-tab-background-color: var(
--dv-color-abyss-dark
);
--dv-inactivegroup-hiddenpanel-tab-background-color: var(--dv-color-abyss);
--dv-tab-divider-color: var(--dv-color-abyss-lighter);
--dv-activegroup-visiblepanel-tab-color: white;
--dv-activegroup-hiddenpanel-tab-color: rgba(255, 255, 255, 0.5);
--dv-inactivegroup-visiblepanel-tab-color: rgba(255, 255, 255, 0.5);
--dv-inactivegroup-hiddenpanel-tab-color: rgba(255, 255, 255, 0.25);
--dv-separator-border: var(--dv-color-abyss-lighter);
--dv-paneview-header-border-color: var(--dv-color-abyss-lighter);
--dv-paneview-active-outline-color: #596f99;
}
.dockview-theme-dracula {
--dv-paneview-active-outline-color: dodgerblue;
--dv-tabs-and-actions-container-font-size: 13px;
--dv-tabs-and-actions-container-height: 35px;
--dv-drag-over-background-color: rgba(83, 89, 93, 0.5);
--dv-drag-over-border-color: transparent;
--dv-tabs-container-scrollbar-color: #888;
--dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);
--dv-floating-box-shadow:
0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);
--dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);
--dv-overlay-z-index: 999;
--dv-tab-font-size: inherit;
--dv-border-radius: 0px;
--dv-tab-margin: 0;
--dv-sash-color: transparent;
--dv-active-sash-color: transparent;
--dv-active-sash-transition-duration: 0.1s;
--dv-active-sash-transition-delay: 0.5s;
--dv-spacing-padding: 0px;
--dv-tab-border-radius: 0px;
--dv-sash-border-radius: 0px;
--dv-dropdown-border-radius: 0px;
--dv-tab-close-icon-size: inherit;
--dv-floating-group-border: none;
--dv-drag-over-border: none;
--dv-floating-group-dragging-opacity: 0.5;
--dv-tab-group-color-grey: #5f6368;
--dv-tab-group-color-blue: #1a73e8;
--dv-tab-group-color-red: #d93025;
--dv-tab-group-color-yellow: #f9ab00;
--dv-tab-group-color-green: #188038;
--dv-tab-group-color-pink: #d01884;
--dv-tab-group-color-purple: #a142f4;
--dv-tab-group-color-cyan: #007b83;
--dv-tab-group-color-orange: #e8710a;
--dv-tab-group-chip-padding: 4px 8px;
--dv-tab-group-chip-border-radius: 6px;
--dv-tab-group-chip-font-size: 11px;
--dv-tab-group-line-height: 2px;
--dv-tab-group-line-opacity: 0.6;
}
.dockview-theme-dracula .dv-drop-target-container .dv-drop-target-anchor.dv-drop-target-anchor-container-changed {
opacity: 0;
transition: none;
}
.dockview-theme-dracula {
--dv-group-view-background-color: #282a36;
--dv-tabs-and-actions-container-background-color: #191a21;
--dv-activegroup-visiblepanel-tab-background-color: #282a36;
--dv-activegroup-hiddenpanel-tab-background-color: #21222c;
--dv-inactivegroup-visiblepanel-tab-background-color: #282a36;
--dv-inactivegroup-hiddenpanel-tab-background-color: #21222c;
--dv-tab-divider-color: #191a21;
--dv-activegroup-visiblepanel-tab-color: rgb(248, 248, 242);
--dv-activegroup-hiddenpanel-tab-color: rgb(98, 114, 164);
--dv-inactivegroup-visiblepanel-tab-color: rgba(248, 248, 242, 0.5);
--dv-inactivegroup-hiddenpanel-tab-color: rgba(98, 114, 164, 0.5);
--dv-separator-border: #bd93f9;
--dv-paneview-header-border-color: #bd93f9;
--dv-paneview-active-outline-color: #6272a4;
}
.dockview-theme-dracula .dv-groupview.dv-active-group > .dv-tabs-and-actions-container .dv-tabs-container > .dv-tab.dv-active-tab {
position: relative;
}
.dockview-theme-dracula .dv-groupview.dv-active-group > .dv-tabs-and-actions-container .dv-tabs-container > .dv-tab.dv-active-tab::after {
position: absolute;
left: 0px;
top: 0px;
content: "";
width: 100%;
height: 1px;
background-color: #94527e;
z-index: 999;
}
.dockview-theme-dracula .dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container .dv-tabs-container > .dv-tab.dv-active-tab {
position: relative;
}
.dockview-theme-dracula .dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container .dv-tabs-container > .dv-tab.dv-active-tab::after {
position: absolute;
left: 0px;
bottom: 0px;
content: "";
width: 100%;
height: 1px;
background-color: #5e3d5a;
z-index: 999;
}
.dockview-theme-nord {
--dv-paneview-active-outline-color: dodgerblue;
--dv-tabs-and-actions-container-font-size: 13px;
--dv-tabs-and-actions-container-height: 35px;
--dv-drag-over-background-color: rgba(83, 89, 93, 0.5);
--dv-drag-over-border-color: transparent;
--dv-tabs-container-scrollbar-color: #888;
--dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);
--dv-floating-box-shadow:
0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);
--dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);
--dv-overlay-z-index: 999;
--dv-tab-font-size: inherit;
--dv-border-radius: 0px;
--dv-tab-margin: 0;
--dv-sash-color: transparent;
--dv-active-sash-color: transparent;
--dv-active-sash-transition-duration: 0.1s;
--dv-active-sash-transition-delay: 0.5s;
--dv-spacing-padding: 0px;
--dv-tab-border-radius: 0px;
--dv-sash-border-radius: 0px;
--dv-dropdown-border-radius: 0px;
--dv-tab-close-icon-size: inherit;
--dv-floating-group-border: none;
--dv-drag-over-border: none;
--dv-floating-group-dragging-opacity: 0.5;
--dv-tab-group-color-grey: #5f6368;
--dv-tab-group-color-blue: #1a73e8;
--dv-tab-group-color-red: #d93025;
--dv-tab-group-color-yellow: #f9ab00;
--dv-tab-group-color-green: #188038;
--dv-tab-group-color-pink: #d01884;
--dv-tab-group-color-purple: #a142f4;
--dv-tab-group-color-cyan: #007b83;
--dv-tab-group-color-orange: #e8710a;
--dv-tab-group-chip-padding: 4px 8px;
--dv-tab-group-chip-border-radius: 6px;
--dv-tab-group-chip-font-size: 11px;
--dv-tab-group-line-height: 2px;
--dv-tab-group-line-opacity: 0.6;
}
.dockview-theme-nord .dv-drop-target-container .dv-drop-target-anchor.dv-drop-target-anchor-container-changed {
opacity: 0;
transition: none;
}
.dockview-theme-nord {
--dv-color-nord-polar-0: #2e3440;
--dv-color-nord-polar-1: #3b4252;
--dv-color-nord-polar-2: #434c5e;
--dv-color-nord-polar-3: #4c566a;
--dv-color-nord-frost: #88c0d0;
--dv-color-nord-frost-2: #81a1c1;
--dv-color-nord-snow-0: #eceff4;
--dv-color-nord-snow-1: #d8dee9;
--dv-group-view-background-color: var(--dv-color-nord-polar-0);
--dv-tabs-and-actions-container-background-color: var(
--dv-color-nord-polar-1
);
--dv-activegroup-visiblepanel-tab-background-color: var(
--dv-color-nord-polar-0
);
--dv-activegroup-hiddenpanel-tab-background-color: var(
--dv-color-nord-polar-2
);
--dv-inactivegroup-visiblepanel-tab-background-color: var(
--dv-color-nord-polar-1
);
--dv-inactivegroup-hiddenpanel-tab-background-color: var(
--dv-color-nord-polar-2
);
--dv-activegroup-visiblepanel-tab-color: var(--dv-color-nord-snow-0);
--dv-activegroup-hiddenpanel-tab-color: var(--dv-color-nord-snow-1);
--dv-inactivegroup-visiblepanel-tab-color: #8a9bbf;
--dv-inactivegroup-hiddenpanel-tab-color: #5e6f8e;
--dv-separator-border: var(--dv-color-nord-polar-3);
--dv-paneview-active-outline-color: var(--dv-color-nord-frost);
--dv-active-sash-color: var(--dv-color-nord-frost);
--dv-scrollbar-background-color: rgba(76, 86, 106, 0.5);
}
.dockview-theme-nord .dv-groupview.dv-active-group > .dv-tabs-and-actions-container .dv-tabs-container > .dv-tab.dv-active-tab {
position: relative;
}
.dockview-theme-nord .dv-groupview.dv-active-group > .dv-tabs-and-actions-container .dv-tabs-container > .dv-tab.dv-active-tab::after {
position: absolute;
left: 0px;
bottom: 0px;
content: "";
width: 100%;
height: 2px;
background-color: var(--dv-color-nord-frost);
z-index: 999;
}
.dockview-theme-nord .dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container .dv-tabs-container > .dv-tab.dv-active-tab {
position: relative;
}
.dockview-theme-nord .dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container .dv-tabs-container > .dv-tab.dv-active-tab::after {
position: absolute;
left: 0px;
bottom: 0px;
content: "";
width: 100%;
height: 2px;
background-color: var(--dv-color-nord-frost-2);
z-index: 999;
}
.dockview-theme-nord-spaced {
--dv-paneview-active-outline-color: dodgerblue;
--dv-tabs-and-actions-container-font-size: 13px;
--dv-tabs-and-actions-container-height: 35px;
--dv-drag-over-background-color: rgba(83, 89, 93, 0.5);
--dv-drag-over-border-color: transparent;
--dv-tabs-container-scrollbar-color: #888;
--dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);
--dv-floating-box-shadow:
0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);
--dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);
--dv-overlay-z-index: 999;
--dv-tab-font-size: inherit;
--dv-border-radius: 0px;
--dv-tab-margin: 0;
--dv-sash-color: transparent;
--dv-active-sash-color: transparent;
--dv-active-sash-transition-duration: 0.1s;
--dv-active-sash-transition-delay: 0.5s;
--dv-spacing-padding: 0px;
--dv-tab-border-radius: 0px;
--dv-sash-border-radius: 0px;
--dv-dropdown-border-radius: 0px;
--dv-tab-close-icon-size: inherit;
--dv-floating-group-border: none;
--dv-drag-over-border: none;
--dv-floating-group-dragging-opacity: 0.5;
--dv-tab-group-color-grey: #5f6368;
--dv-tab-group-color-blue: #1a73e8;
--dv-tab-group-color-red: #d93025;
--dv-tab-group-color-yellow: #f9ab00;
--dv-tab-group-color-green: #188038;
--dv-tab-group-color-pink: #d01884;
--dv-tab-group-color-purple: #a142f4;
--dv-tab-group-color-cyan: #007b83;
--dv-tab-group-color-orange: #e8710a;
--dv-tab-group-chip-padding: 4px 8px;
--dv-tab-group-chip-border-radius: 6px;
--dv-tab-group-chip-font-size: 11px;
--dv-tab-group-line-height: 2px;
--dv-tab-group-line-opacity: 0.6;
--dv-spacing-padding: 10px;
--dv-tab-font-size: 12px;
--dv-border-radius: 20px;
--dv-tab-margin: 0.5rem 0.25rem;
--dv-tabs-and-actions-container-height: 44px;
--dv-tab-border-radius: 8px;
--dv-sash-border-radius: 4px;
--dv-dropdown-border-radius: 8px;
--dv-tab-close-icon-size: 8px;
--dv-floating-group-border: 2px solid var(--dv-group-view-background-color);
box-sizing: border-box;
padding: var(--dv-spacing-padding);
background-color: var(--dv-group-view-background-color);
}
.dv-shell .dockview-theme-nord-spaced {
padding: 0;
}
.dockview-theme-nord-spaced .dv-resize-container:has(> .dv-groupview) {
border-radius: 8px;
}
.dockview-theme-nord-spaced .dv-sash {
border-radius: var(--dv-sash-border-radius);
}
.dockview-theme-nord-spaced .dv-drop-target-anchor {
border-radius: calc(var(--dv-border-radius) / 4);
}
.dockview-theme-nord-spaced .dv-drop-target-anchor.dv-drop-target-content {
border-radius: var(--dv-border-radius);
}
.dockview-theme-nord-spaced .dv-resize-container {
border-radius: var(--dv-border-radius) !important;
border: none;
}
.dockview-theme-nord-spaced .dv-resize-container .dv-groupview {
border: var(--dv-floating-group-border);
}
.dockview-theme-nord-spaced .dv-tabs-overflow-container,
.dockview-theme-nord-spaced .dv-tabs-overflow-dropdown-default {
border-radius: var(--dv-dropdown-border-radius);
height: unset !important;
}
.dockview-theme-nord-spaced .dv-render-overlay {
border-bottom-left-radius: var(--dv-border-radius);
border-bottom-right-radius: var(--dv-border-radius);
}
.dockview-theme-nord-spaced .dv-tab {
border-radius: var(--dv-tab-border-radius);
}
.dockview-theme-nord-spaced .dv-tab .dv-svg {
height: var(--dv-tab-close-icon-size);
width: var(--dv-tab-close-icon-size);
}
.dockview-theme-nord-spaced .dv-tabs-container-vertical .dv-tab {
margin: 0.25rem 0.5rem;
}
.dockview-theme-nord-spaced .dv-groupview {
border-radius: var(--dv-border-radius);
}
.dockview-theme-nord-spaced .dv-groupview .dv-tabs-and-actions-container {
padding: 0px calc(var(--dv-border-radius) / 2);
}
.dockview-theme-nord-spaced .dv-groupview .dv-tabs-and-actions-container.dv-groupview-header-vertical {
padding: calc(var(--dv-border-radius) / 2) 0;
}
.dockview-theme-nord-spaced .dv-groupview .dv-content-container {
background-color: var(--dv-tabs-and-actions-container-background-color);
border-bottom-left-radius: var(--dv-border-radius);
border-bottom-right-radius: var(--dv-border-radius);
}
.dockview-theme-nord-spaced {
--dv-color-nord-polar-0: #2e3440;
--dv-color-nord-polar-1: #3b4252;
--dv-color-nord-polar-2: #434c5e;
--dv-color-nord-polar-3: #4c566a;
--dv-color-nord-frost: #88c0d0;
--dv-color-nord-frost-2: #81a1c1;
--dv-color-nord-snow-0: #eceff4;
--dv-color-nord-snow-1: #d8dee9;
--dv-group-view-background-color: var(--dv-color-nord-polar-0);
--dv-tabs-and-actions-container-background-color: var(
--dv-color-nord-polar-1
);
--dv-activegroup-visiblepanel-tab-background-color: var(
--dv-color-nord-polar-2
);
--dv-activegroup-hiddenpanel-tab-background-color: var(
--dv-color-nord-polar-1
);
--dv-inactivegroup-visiblepanel-tab-background-color: var(
--dv-color-nord-polar-2
);
--dv-inactivegroup-hiddenpanel-tab-background-color: var(
--dv-color-nord-polar-1
);
--dv-activegroup-visiblepanel-tab-color: var(--dv-color-nord-snow-0);
--dv-activegroup-hiddenpanel-tab-color: var(--dv-color-nord-snow-1);
--dv-inactivegroup-visiblepanel-tab-color: #8a9bbf;
--dv-inactivegroup-hiddenpanel-tab-color: #5e6f8e;
--dv-separator-border: transparent;
--dv-paneview-active-outline-color: var(--dv-color-nord-frost);
--dv-active-sash-color: var(--dv-color-nord-frost);
--dv-scrollbar-background-color: rgba(76, 86, 106, 0.5);
--dv-floating-group-border: 2px solid var(--dv-color-nord-polar-0);
}
.dockview-theme-catppuccin-mocha {
--dv-paneview-active-outline-color: dodgerblue;
--dv-tabs-and-actions-container-font-size: 13px;
--dv-tabs-and-actions-container-height: 35px;
--dv-drag-over-background-color: rgba(83, 89, 93, 0.5);
--dv-drag-over-border-color: transparent;
--dv-tabs-container-scrollbar-color: #888;
--dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);
--dv-floating-box-shadow:
0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);
--dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);
--dv-overlay-z-index: 999;
--dv-tab-font-size: inherit;
--dv-border-radius: 0px;
--dv-tab-margin: 0;
--dv-sash-color: transparent;
--dv-active-sash-color: transparent;
--dv-active-sash-transition-duration: 0.1s;
--dv-active-sash-transition-delay: 0.5s;
--dv-spacing-padding: 0px;
--dv-tab-border-radius: 0px;
--dv-sash-border-radius: 0px;
--dv-dropdown-border-radius: 0px;
--dv-tab-close-icon-size: inherit;
--dv-floating-group-border: none;
--dv-drag-over-border: none;
--dv-floating-group-dragging-opacity: 0.5;
--dv-tab-group-color-grey: #5f6368;
--dv-tab-group-color-blue: #1a73e8;
--dv-tab-group-color-red: #d93025;
--dv-tab-group-color-yellow: #f9ab00;
--dv-tab-group-color-green: #188038;
--dv-tab-group-color-pink: #d01884;
--dv-tab-group-color-purple: #a142f4;
--dv-tab-group-color-cyan: #007b83;
--dv-tab-group-color-orange: #e8710a;
--dv-tab-group-chip-padding: 4px 8px;
--dv-tab-group-chip-border-radius: 6px;
--dv-tab-group-chip-font-size: 11px;
--dv-tab-group-line-height: 2px;
--dv-tab-group-line-opacity: 0.6;
}
.dockview-theme-catppuccin-mocha .dv-drop-target-container .dv-drop-target-anchor.dv-drop-target-anchor-container-changed {
opacity: 0;
transition: none;
}
.dockview-theme-catppuccin-mocha {
--dv-color-mocha-crust: #11111b;
--dv-color-mocha-mantle: #181825;
--dv-color-mocha-base: #1e1e2e;
--dv-color-mocha-surface0: #313244;
--dv-color-mocha-surface1: #45475a;
--dv-color-mocha-text: #cdd6f4;
--dv-color-mocha-subtext1: #bac2de;
--dv-color-mocha-subtext0: #a6adc8;
--dv-color-mocha-mauve: #cba6f7;
--dv-color-mocha-lavender: #b4befe;
--dv-group-view-background-color: var(--dv-color-mocha-base);
--dv-tabs-and-actions-container-background-color: var(
--dv-color-mocha-mantle
);
--dv-activegroup-visiblepanel-tab-background-color: var(
--dv-color-mocha-base
);
--dv-activegroup-hiddenpanel-tab-background-color: var(
--dv-color-mocha-surface0
);
--dv-inactivegroup-visiblepanel-tab-background-color: var(
--dv-color-mocha-mantle
);
--dv-inactivegroup-hiddenpanel-tab-background-color: var(
--dv-color-mocha-crust
);
--dv-activegroup-visiblepanel-tab-color: var(--dv-color-mocha-text);
--dv-activegroup-hiddenpanel-tab-color: var(--dv-color-mocha-subtext1);
--dv-inactivegroup-visiblepanel-tab-color: var(--dv-color-mocha-subtext0);
--dv-inactivegroup-hiddenpanel-tab-color: rgba(166, 173, 200, 0.5);
--dv-separator-border: var(--dv-color-mocha-surface1);
--dv-paneview-active-outline-color: var(--dv-color-mocha-mauve);
--dv-active-sash-color: var(--dv-color-mocha-mauve);
--dv-scrollbar-background-color: rgba(49, 50, 68, 0.8);
}
.dockview-theme-catppuccin-mocha .dv-groupview.dv-active-group > .dv-tabs-and-actions-container .dv-tabs-container > .dv-tab.dv-active-tab {
position: relative;
}
.dockview-theme-catppuccin-mocha .dv-groupview.dv-active-group > .dv-tabs-and-actions-container .dv-tabs-container > .dv-tab.dv-active-tab::after {
position: absolute;
left: 0px;
top: 0px;
content: "";
width: 100%;
height: 2px;
background-color: var(--dv-color-mocha-mauve);
z-index: 999;
}
.dockview-theme-catppuccin-mocha .dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container .dv-tabs-container > .dv-tab.dv-active-tab {
position: relative;
}
.dockview-theme-catppuccin-mocha .dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container .dv-tabs-container > .dv-tab.dv-active-tab::after {
position: absolute;
left: 0px;
top: 0px;
content: "";
width: 100%;
height: 2px;
background-color: rgba(180, 190, 254, 0.4);
z-index: 999;
}
.dockview-theme-catppuccin-mocha-spaced {
--dv-paneview-active-outline-color: dodgerblue;
--dv-tabs-and-actions-container-font-size: 13px;
--dv-tabs-and-actions-container-height: 35px;
--dv-drag-over-background-color: rgba(83, 89, 93, 0.5);
--dv-drag-over-border-color: transparent;
--dv-tabs-container-scrollbar-color: #888;
--dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);
--dv-floating-box-shadow:
0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);
--dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);
--dv-overlay-z-index: 999;
--dv-tab-font-size: inherit;
--dv-border-radius: 0px;
--dv-tab-margin: 0;
--dv-sash-color: transparent;
--dv-active-sash-color: transparent;
--dv-active-sash-transition-duration: 0.1s;
--dv-active-sash-transition-delay: 0.5s;
--dv-spacing-padding: 0px;
--dv-tab-border-radius: 0px;
--dv-sash-border-radius: 0px;
--dv-dropdown-border-radius: 0px;
--dv-tab-close-icon-size: inherit;
--dv-floating-group-border: none;
--dv-drag-over-border: none;
--dv-floating-group-dragging-opacity: 0.5;
--dv-tab-group-color-grey: #5f6368;
--dv-tab-group-color-blue: #1a73e8;
--dv-tab-group-color-red: #d93025;
--dv-tab-group-color-yellow: #f9ab00;
--dv-tab-group-color-green: #188038;
--dv-tab-group-color-pink: #d01884;
--dv-tab-group-color-purple: #a142f4;
--dv-tab-group-color-cyan: #007b83;
--dv-tab-group-color-orange: #e8710a;
--dv-tab-group-chip-padding: 4px 8px;
--dv-tab-group-chip-border-radius: 6px;
--dv-tab-group-chip-font-size: 11px;
--dv-tab-group-line-height: 2px;
--dv-tab-group-line-opacity: 0.6;
--dv-spacing-padding: 10px;
--dv-tab-font-size: 12px;
--dv-border-radius: 20px;
--dv-tab-margin: 0.5rem 0.25rem;
--dv-tabs-and-actions-container-height: 44px;
--dv-tab-border-radius: 8px;
--dv-sash-border-radius: 4px;
--dv-dropdown-border-radius: 8px;
--dv-tab-close-icon-size: 8px;
--dv-floating-group-border: 2px solid var(--dv-group-view-background-color);
box-sizing: border-box;
padding: var(--dv-spacing-padding);
background-color: var(--dv-group-view-background-color);
}
.dv-shell .dockview-theme-catppuccin-mocha-spaced {
padding: 0;
}
.dockview-theme-catppuccin-mocha-spaced .dv-resize-container:has(> .dv-groupview) {
border-radius: 8px;
}
.dockview-theme-catppuccin-mocha-spaced .dv-sash {
border-radius: var(--dv-sash-border-radius);
}
.dockview-theme-catppuccin-mocha-spaced .dv-drop-target-anchor {
border-radius: calc(var(--dv-border-radius) / 4);
}
.dockview-theme-catppuccin-mocha-spaced .dv-drop-target-anchor.dv-drop-target-content {
border-radius: var(--dv-border-radius);
}
.dockview-theme-catppuccin-mocha-spaced .dv-resize-container {
border-radius: var(--dv-border-radius) !important;
border: none;
}
.dockview-theme-catppuccin-mocha-spaced .dv-resize-container .dv-groupview {
border: var(--dv-floating-group-border);
}
.dockview-theme-catppuccin-mocha-spaced .dv-tabs-overflow-container,
.dockview-theme-catppuccin-mocha-spaced .dv-tabs-overflow-dropdown-default {
border-radius: var(--dv-dropdown-border-radius);
height: unset !important;
}
.dockview-theme-catppuccin-mocha-spaced .dv-render-overlay {
border-bottom-left-radius: var(--dv-border-radius);
border-bottom-right-radius: var(--dv-border-radius);
}
.dockview-theme-catppuccin-mocha-spaced .dv-tab {
border-radius: var(--dv-tab-border-radius);
}
.dockview-theme-catppuccin-mocha-spaced .dv-tab .dv-svg {
height: var(--dv-tab-close-icon-size);
width: var(--dv-tab-close-icon-size);
}
.dockview-theme-catppuccin-mocha-spaced .dv-tabs-container-vertical .dv-tab {
margin: 0.25rem 0.5rem;
}
.dockview-theme-catppuccin-mocha-spaced .dv-groupview {
border-radius: var(--dv-border-radius);
}
.dockview-theme-catppuccin-mocha-spaced .dv-groupview .dv-tabs-and-actions-container {
padding: 0px calc(var(--dv-border-radius) / 2);
}
.dockview-theme-catppuccin-mocha-spaced .dv-groupview .dv-tabs-and-actions-container.dv-groupview-header-vertical {
padding: calc(var(--dv-border-radius) / 2) 0;
}
.dockview-theme-catppuccin-mocha-spaced .dv-groupview .dv-content-container {
background-color: var(--dv-tabs-and-actions-container-background-color);
border-bottom-left-radius: var(--dv-border-radius);
border-bottom-right-radius: var(--dv-border-radius);
}
.dockview-theme-catppuccin-mocha-spaced {
--dv-color-mocha-crust: #11111b;
--dv-color-mocha-mantle: #181825;
--dv-color-mocha-base: #1e1e2e;
--dv-color-mocha-surface0: #313244;
--dv-color-mocha-surface1: #45475a;
--dv-color-mocha-text: #cdd6f4;
--dv-color-mocha-subtext1: #bac2de;
--dv-color-mocha-subtext0: #a6adc8;
--dv-color-mocha-mauve: #cba6f7;
--dv-color-mocha-lavender: #b4befe;
--dv-group-view-background-color: var(--dv-color-mocha-crust);
--dv-tabs-and-actions-container-background-color: var(
--dv-color-mocha-mantle
);
--dv-activegroup-visiblepanel-tab-background-color: var(
--dv-color-mocha-surface0
);
--dv-activegroup-hiddenpanel-tab-background-color: var(
--dv-color-mocha-mantle
);
--dv-inactivegroup-visiblepanel-tab-background-color: var(
--dv-color-mocha-surface0
);
--dv-inactivegroup-hiddenpanel-tab-background-color: var(
--dv-color-mocha-mantle
);
--dv-activegroup-visiblepanel-tab-color: var(--dv-color-mocha-text);
--dv-activegroup-hiddenpanel-tab-color: var(--dv-color-mocha-subtext1);
--dv-inactivegroup-visiblepanel-tab-color: var(--dv-color-mocha-subtext0);
--dv-inactivegroup-hiddenpanel-tab-color: rgba(166, 173, 200, 0.5);
--dv-separator-border: transparent;
--dv-paneview-active-outline-color: var(--dv-color-mocha-mauve);
--dv-active-sash-color: var(--dv-color-mocha-mauve);
--dv-scrollbar-background-color: rgba(49, 50, 68, 0.8);
--dv-floating-group-border: 2px solid var(--dv-color-mocha-crust);
}
.dockview-theme-monokai {
--dv-paneview-active-outline-color: dodgerblue;
--dv-tabs-and-actions-container-font-size: 13px;
--dv-tabs-and-actions-container-height: 35px;
--dv-drag-over-background-color: rgba(83, 89, 93, 0.5);
--dv-drag-over-border-color: transparent;
--dv-tabs-container-scrollbar-color: #888;
--dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);
--dv-floating-box-shadow:
0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);
--dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);
--dv-overlay-z-index: 999;
--dv-tab-font-size: inherit;
--dv-border-radius: 0px;
--dv-tab-margin: 0;
--dv-sash-color: transparent;
--dv-active-sash-color: transparent;
--dv-active-sash-transition-duration: 0.1s;
--dv-active-sash-transition-delay: 0.5s;
--dv-spacing-padding: 0px;
--dv-tab-border-radius: 0px;
--dv-sash-border-radius: 0px;
--dv-dropdown-border-radius: 0px;
--dv-tab-close-icon-size: inherit;
--dv-floating-group-border: none;
--dv-drag-over-border: none;
--dv-floating-group-dragging-opacity: 0.5;
--dv-tab-group-color-grey: #5f6368;
--dv-tab-group-color-blue: #1a73e8;
--dv-tab-group-color-red: #d93025;
--dv-tab-group-color-yellow: #f9ab00;
--dv-tab-group-color-green: #188038;
--dv-tab-group-color-pink: #d01884;
--dv-tab-group-color-purple: #a142f4;
--dv-tab-group-color-cyan: #007b83;
--dv-tab-group-color-orange: #e8710a;
--dv-tab-group-chip-padding: 4px 8px;
--dv-tab-group-chip-border-radius: 6px;
--dv-tab-group-chip-font-size: 11px;
--dv-tab-group-line-height: 2px;
--dv-tab-group-line-opacity: 0.6;
}
.dockview-theme-monokai .dv-drop-target-container .dv-drop-target-anchor.dv-drop-target-anchor-container-changed {
opacity: 0;
transition: none;
}
.dockview-theme-monokai {
--dv-color-monokai-bg: #272822;
--dv-color-monokai-bg-light: #3e3d32;
--dv-color-monokai-comment: #75715e;
--dv-color-monokai-fg: #f8f8f2;
--dv-color-monokai-green: #a6e22e;
--dv-group-view-background-color: var(--dv-color-monokai-bg);
--dv-tabs-and-actions-container-background-color: var(
--dv-color-monokai-bg-light
);
--dv-activegroup-visiblepanel-tab-background-color: var(
--dv-color-monokai-bg
);
--dv-activegroup-hiddenpanel-tab-background-color: #2d2c25;
--dv-inactivegroup-visiblepanel-tab-background-color: var(
--dv-color-monokai-bg
);
--dv-inactivegroup-hiddenpanel-tab-background-color: #2d2c25;
--dv-activegroup-visiblepanel-tab-color: var(--dv-color-monokai-fg);
--dv-activegroup-hiddenpanel-tab-color: var(--dv-color-monokai-comment);
--dv-inactivegroup-visiblepanel-tab-color: rgba(248, 248, 242, 0.5);
--dv-inactivegroup-hiddenpanel-tab-color: rgba(117, 113, 94, 0.5);
--dv-separator-border: var(--dv-color-monokai-bg-light);
--dv-paneview-active-outline-color: var(--dv-color-monokai-green);
--dv-active-sash-color: var(--dv-color-monokai-green);
--dv-scrollbar-background-color: rgba(117, 113, 94, 0.5);
}
.dockview-theme-monokai .dv-groupview.dv-active-group > .dv-tabs-and-actions-container .dv-tabs-container > .dv-tab.dv-active-tab {
position: relative;
}
.dockview-theme-monokai .dv-groupview.dv-active-group > .dv-tabs-and-actions-container .dv-tabs-container > .dv-tab.dv-active-tab::after {
position: absolute;
left: 0px;
bottom: 0px;
content: "";
width: 100%;
height: 2px;
background-color: var(--dv-color-monokai-green);
z-index: 999;
}
.dockview-theme-monokai .dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container .dv-tabs-container > .dv-tab.dv-active-tab {
position: relative;
}
.dockview-theme-monokai .dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container .dv-tabs-container > .dv-tab.dv-active-tab::after {
position: absolute;
left: 0px;
bottom: 0px;
content: "";
width: 100%;
height: 2px;
background-color: rgba(166, 226, 46, 0.35);
z-index: 999;
}
.dockview-theme-solarized-light {
--dv-paneview-active-outline-color: dodgerblue;
--dv-tabs-and-actions-container-font-size: 13px;
--dv-tabs-and-actions-container-height: 35px;
--dv-drag-over-background-color: rgba(83, 89, 93, 0.5);
--dv-drag-over-border-color: transparent;
--dv-tabs-container-scrollbar-color: #888;
--dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);
--dv-floating-box-shadow:
0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);
--dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);
--dv-overlay-z-index: 999;
--dv-tab-font-size: inherit;
--dv-border-radius: 0px;
--dv-tab-margin: 0;
--dv-sash-color: transparent;
--dv-active-sash-color: transparent;
--dv-active-sash-transition-duration: 0.1s;
--dv-active-sash-transition-delay: 0.5s;
--dv-spacing-padding: 0px;
--dv-tab-border-radius: 0px;
--dv-sash-border-radius: 0px;
--dv-dropdown-border-radius: 0px;
--dv-tab-close-icon-size: inherit;
--dv-floating-group-border: none;
--dv-drag-over-border: none;
--dv-floating-group-dragging-opacity: 0.5;
--dv-tab-group-color-grey: #5f6368;
--dv-tab-group-color-blue: #1a73e8;
--dv-tab-group-color-red: #d93025;
--dv-tab-group-color-yellow: #f9ab00;
--dv-tab-group-color-green: #188038;
--dv-tab-group-color-pink: #d01884;
--dv-tab-group-color-purple: #a142f4;
--dv-tab-group-color-cyan: #007b83;
--dv-tab-group-color-orange: #e8710a;
--dv-tab-group-chip-padding: 4px 8px;
--dv-tab-group-chip-border-radius: 6px;
--dv-tab-group-chip-font-size: 11px;
--dv-tab-group-line-height: 2px;
--dv-tab-group-line-opacity: 0.6;
}
.dockview-theme-solarized-light .dv-drop-target-container .dv-drop-target-anchor.dv-drop-target-anchor-container-changed {
opacity: 0;
transition: none;
}
.dockview-theme-solarized-light {
--dv-color-sol-base3: #fdf6e3;
--dv-color-sol-base2: #eee8d5;
--dv-color-sol-base1: #93a1a1;
--dv-color-sol-base00: #657b83;
--dv-color-sol-base01: #586e75;
--dv-color-sol-blue: #268bd2;
--dv-group-view-background-color: var(--dv-color-sol-base3);
--dv-tabs-and-actions-container-background-color: var(--dv-color-sol-base2);
--dv-activegroup-visiblepanel-tab-background-color: var(
--dv-color-sol-base3
);
--dv-activegroup-hiddenpanel-tab-background-color: #e8e2d0;
--dv-inactivegroup-visiblepanel-tab-background-color: var(
--dv-color-sol-base3
);
--dv-inactivegroup-hiddenpanel-tab-background-color: #e8e2d0;
--dv-activegroup-visiblepanel-tab-color: var(--dv-color-sol-base01);
--dv-activegroup-hiddenpanel-tab-color: var(--dv-color-sol-base00);
--dv-inactivegroup-visiblepanel-tab-color: var(--dv-color-sol-base1);
--dv-inactivegroup-hiddenpanel-tab-color: rgba(147, 161, 161, 0.6);
--dv-separator-border: var(--dv-color-sol-base2);
--dv-paneview-active-outline-color: var(--dv-color-sol-blue);
--dv-active-sash-color: var(--dv-color-sol-blue);
--dv-scrollbar-background-color: rgba(101, 123, 131, 0.25);
--dv-drag-over-background-color: rgba(38, 139, 210, 0.15);
--dv-floating-box-shadow:
0 8px 32px rgba(0, 0, 0, 0.12), 0 2px 8px rgba(0, 0, 0, 0.08);
--dv-floating-border: 1px solid rgba(0, 0, 0, 0.1);
}
.dockview-theme-solarized-light-spaced {
--dv-paneview-active-outline-color: dodgerblue;
--dv-tabs-and-actions-container-font-size: 13px;
--dv-tabs-and-actions-container-height: 35px;
--dv-drag-over-background-color: rgba(83, 89, 93, 0.5);
--dv-drag-over-border-color: transparent;
--dv-tabs-container-scrollbar-color: #888;
--dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);
--dv-floating-box-shadow:
0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);
--dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);
--dv-overlay-z-index: 999;
--dv-tab-font-size: inherit;
--dv-border-radius: 0px;
--dv-tab-margin: 0;
--dv-sash-color: transparent;
--dv-active-sash-color: transparent;
--dv-active-sash-transition-duration: 0.1s;
--dv-active-sash-transition-delay: 0.5s;
--dv-spacing-padding: 0px;
--dv-tab-border-radius: 0px;
--dv-sash-border-radius: 0px;
--dv-dropdown-border-radius: 0px;
--dv-tab-close-icon-size: inherit;
--dv-floating-group-border: none;
--dv-drag-over-border: none;
--dv-floating-group-dragging-opacity: 0.5;
--dv-tab-group-color-grey: #5f6368;
--dv-tab-group-color-blue: #1a73e8;
--dv-tab-group-color-red: #d93025;
--dv-tab-group-color-yellow: #f9ab00;
--dv-tab-group-color-green: #188038;
--dv-tab-group-color-pink: #d01884;
--dv-tab-group-color-purple: #a142f4;
--dv-tab-group-color-cyan: #007b83;
--dv-tab-group-color-orange: #e8710a;
--dv-tab-group-chip-padding: 4px 8px;
--dv-tab-group-chip-border-radius: 6px;
--dv-tab-group-chip-font-size: 11px;
--dv-tab-group-line-height: 2px;
--dv-tab-group-line-opacity: 0.6;
--dv-spacing-padding: 10px;
--dv-tab-font-size: 12px;
--dv-border-radius: 20px;
--dv-tab-margin: 0.5rem 0.25rem;
--dv-tabs-and-actions-container-height: 44px;
--dv-tab-border-radius: 8px;
--dv-sash-border-radius: 4px;
--dv-dropdown-border-radius: 8px;
--dv-tab-close-icon-size: 8px;
--dv-floating-group-border: 2px solid var(--dv-group-view-background-color);
box-sizing: border-box;
padding: var(--dv-spacing-padding);
background-color: var(--dv-group-view-background-color);
}
.dv-shell .dockview-theme-solarized-light-spaced {
padding: 0;
}
.dockview-theme-solarized-light-spaced .dv-resize-container:has(> .dv-groupview) {
border-radius: 8px;
}
.dockview-theme-solarized-light-spaced .dv-sash {
border-radius: var(--dv-sash-border-radius);
}
.dockview-theme-solarized-light-spaced .dv-drop-target-anchor {
border-radius: calc(var(--dv-border-radius) / 4);
}
.dockview-theme-solarized-light-spaced .dv-drop-target-anchor.dv-drop-target-content {
border-radius: var(--dv-border-radius);
}
.dockview-theme-solarized-light-spaced .dv-resize-container {
border-radius: var(--dv-border-radius) !important;
border: none;
}
.dockview-theme-solarized-light-spaced .dv-resize-container .dv-groupview {
border: var(--dv-floating-group-border);
}
.dockview-theme-solarized-light-spaced .dv-tabs-overflow-container,
.dockview-theme-solarized-light-spaced .dv-tabs-overflow-dropdown-default {
border-radius: var(--dv-dropdown-border-radius);
height: unset !important;
}
.dockview-theme-solarized-light-spaced .dv-render-overlay {
border-bottom-left-radius: var(--dv-border-radius);
border-bottom-right-radius: var(--dv-border-radius);
}
.dockview-theme-solarized-light-spaced .dv-tab {
border-radius: var(--dv-tab-border-radius);
}
.dockview-theme-solarized-light-spaced .dv-tab .dv-svg {
height: var(--dv-tab-close-icon-size);
width: var(--dv-tab-close-icon-size);
}
.dockview-theme-solarized-light-spaced .dv-tabs-container-vertical .dv-tab {
margin: 0.25rem 0.5rem;
}
.dockview-theme-solarized-light-spaced .dv-groupview {
border-radius: var(--dv-border-radius);
}
.dockview-theme-solarized-light-spaced .dv-groupview .dv-tabs-and-actions-container {
padding: 0px calc(var(--dv-border-radius) / 2);
}
.dockview-theme-solarized-light-spaced .dv-groupview .dv-tabs-and-actions-container.dv-groupview-header-vertical {
padding: calc(var(--dv-border-radius) / 2) 0;
}
.dockview-theme-solarized-light-spaced .dv-groupview .dv-content-container {
background-color: var(--dv-tabs-and-actions-container-background-color);
border-bottom-left-radius: var(--dv-border-radius);
border-bottom-right-radius: var(--dv-border-radius);
}
.dockview-theme-solarized-light-spaced {
--dv-color-sol-base3: #fdf6e3;
--dv-color-sol-base2: #eee8d5;
--dv-color-sol-base1: #93a1a1;
--dv-color-sol-base00: #657b83;
--dv-color-sol-base01: #586e75;
--dv-color-sol-blue: #268bd2;
--dv-drag-over-background-color: rgba(38, 139, 210, 0.1);
--dv-group-view-background-color: var(--dv-color-sol-base2);
--dv-tabs-and-actions-container-background-color: var(--dv-color-sol-base3);
--dv-activegroup-visiblepanel-tab-background-color: #e8e2d0;
--dv-activegroup-hiddenpanel-tab-background-color: var(
--dv-color-sol-base3
);
--dv-inactivegroup-visiblepanel-tab-background-color: #e8e2d0;
--dv-inactivegroup-hiddenpanel-tab-background-color: var(
--dv-color-sol-base3
);
--dv-activegroup-visiblepanel-tab-color: var(--dv-color-sol-base01);
--dv-activegroup-hiddenpanel-tab-color: var(--dv-color-sol-base00);
--dv-inactivegroup-visiblepanel-tab-color: var(--dv-color-sol-base1);
--dv-inactivegroup-hiddenpanel-tab-color: rgba(147, 161, 161, 0.6);
--dv-separator-border: transparent;
--dv-paneview-active-outline-color: var(--dv-color-sol-blue);
--dv-active-sash-color: var(--dv-color-sol-blue);
--dv-floating-box-shadow:
0 8px 32px rgba(0, 0, 0, 0.12), 0 2px 8px rgba(0, 0, 0, 0.08);
--dv-floating-border: 1px solid rgba(0, 0, 0, 0.1);
--dv-scrollbar-background-color: rgba(101, 123, 131, 0.25);
--dv-floating-group-border: 2px solid rgba(238, 232, 213, 0.5);
}
.dockview-theme-github-dark {
--dv-paneview-active-outline-color: dodgerblue;
--dv-tabs-and-actions-container-font-size: 13px;
--dv-tabs-and-actions-container-height: 35px;
--dv-drag-over-background-color: rgba(83, 89, 93, 0.5);
--dv-drag-over-border-color: transparent;
--dv-tabs-container-scrollbar-color: #888;
--dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);
--dv-floating-box-shadow:
0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);
--dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);
--dv-overlay-z-index: 999;
--dv-tab-font-siz