[ui] Compact Tabs (classic).css

/*
    Commpact Tabs
    Cleaner, smaller tabs with hidden buttons
    https://github.com/replete/obsidian-minimal-theme-css-snippets
*/

.workspace-tabs:not([class*=-right], [class*=-left]) .workspace-tab-header {
    padding-left:3px;
    padding-right:3px;
}
.workspace-tabs:not([class*=-right], [class*=-left]) .workspace-tab-header .workspace-tab-header-inner {
    gap:0 !important;
}

/* Hide tab separator bar */
.workspace .mod-root .workspace-tab-header-inner::after {
    display:none;
}

/* Hover tab styles */
.workspace-tabs:not([class*=-right], [class*=-left]) .workspace-tab-header:not(.is-active):hover .workspace-tab-header-inner {
    background: var(--bg2);
}

/* Hide buttons until hover */
.workspace-tabs:not([class*=-right], [class*=-left]) .workspace-tab-header:not(.is-active) .workspace-tab-header-inner-close-button,
.workspace-tabs:not([class*=-right], [class*=-left]) .workspace-tab-header:not(.is-active) .workspace-tab-header-status-icon {
    opacity:0;
}
.workspace-tabs:not([class*=-right], [class*=-left]) .workspace-tab-header:not(.is-active):hover .workspace-tab-header-inner-close-button,
.workspace-tabs:not([class*=-right], [class*=-left]) .workspace-tab-header:not(.is-active):hover .workspace-tab-header-status-icon {
    opacity:1;
}

/* Less prominent pinned icon */
.workspace-tabs:not([class*=-right], [class*=-left]) .workspace-tab-header.is-active .workspace-tab-header-status-icon {
    opacity:0.6 !important;
}

/* Variable width tabs WIP */
.workspace-tabs:not([class*=-right], [class*=-left]) .workspace-tab-header-inner {
    /* width:auto; */
}
.workspace-tabs:not([class*=-right], [class*=-left]) .workspace-tab-header {
    /* width:auto;
    flex: none;
    flex-shrink: 1;
    max-width:25% */
}

.workspace-tabs:not([class*=-right], [class*=-left]) .workspace-tab-header-inner {
}

.workspace-tabs:not([class*=-right], [class*=-left]) .workspace-tab-header:not(.is-active) .workspace-tab-header-inner-close-button {
    position:absolute;
    right:6px;
    margin-top:0px;
}

.workspace-tabs:not([class*=-right], [class*=-left]) .workspace-tab-header:not(.is-active):hover .workspace-tab-header-inner-close-button {
    background:var(--bg2);
}

/* Fade graphic to make hover close button look less harsh */
.workspace-tabs:not([class*=-right], [class*=-left]) .workspace-tab-header:not(.is-active):hover .workspace-tab-header-inner-close-button::before {
    content:'';
    display:block;
    position:absolute;
    background:linear-gradient(to right, transparent, var(--bg2)) !important;
    right:100%;
    height:1em;
    width: 1em;
    pointer-events:none;
}


/* Smaller buttons */
.workspace .mod-root .workspace-tab-header-inner-close-button,
.workspace .mod-root .workspace-tab-header-status-icon {
    transform:scale(0.9) translate(2px,1px);
    transform-origin:center;
}

/* Smaller new tab button */
.workspace .mod-root .workspace-tab-header-new-tab {
    margin-left:4px;
}
.workspace .mod-root .workspace-tab-header-new-tab .clickable-icon {
    transform:scale(0.8) translate(0,1px);
}