[RESOURCE] CSS stuff I've managed with this plugin

[firinael]

This is just to make it easier to implement "hide until hover" and stuff like that that's being requested.

/* display headers on hover ONLY WITH TABS (initially based on chrisgrieser/shimmering-focus) */

.plugin-tabs .workspace-leaf {
    border-top: 0 !important;
}

.plugin-tabs .mod-right-split .workspace-tab-header-container,
.plugin-tabs .mod-right-split .workspace-tab-header-container * {
    background-color: var(--background-secondary) !important;
    height: calc(var(--headerheight) + 2px) !important;
}

.plugin-tabs .mod-right-split .view-content {
    border-top: 2px solid var(--interactive-accent);
    margin-top: 1px;
}

.plugin-tabs .workspace-leaf {
    border: 0px !important;
    border-radius: 0px !important;
}

.plugin-tabs .mod-root.workspace-split .workspace-split>div.workspace-leaf:not(.mod-active),
.plugin-tabs .mod-root.workspace-split>div.workspace-leaf:not(.mod-active) {
    border-radius: 0 !important;
    border-right: 0 !important;
    border-left: 0 !important;
    --w2: max(20%, 100%);
}

.plugin-tabs .view-content {
    height: 100% !important;
}

.plugin-tabs .workspace-leaf.mod-active .view-actions {
    padding-right: 2px !important;
}

.plugin-tabs .workspace-leaf:not(.mod-active) .view-header {
    border-bottom: 2px solid var(--interactive-accent) !important;
}

.plugin-tabs .workspace-leaf .view-header {
    transition: .2s;
    text-align: left !important;
    border-left: 0 !important;
}

.plugin-tabs .workspace-split.mod-horizontal .view-header {
    height: var(--headerheight) !important;
}

.plugin-tabs .workspace-leaf:only-of-type .view-header {
    background-color: var(--background-secondary)!important;
    border-bottom: 2px solid var(--interactive-accent)!important;
}

.plugin-tabs .workspace-leaf:only-of-type .view-header:hover,
.plugin-tabs .workspace-leaf:only-of-type .view-header:focus-within {
    background-color: var(--background-primary)!important;
}

.plugin-tabs .workspace-leaf.mod-active .view-header:hover, 
.plugin-tabs .workspace-leaf.mod-active .view-header:focus-within {
    border-bottom: 2px solid var(--interactive-accent) !important;
    transition: .2s !important;
    height: var(--headerheight) !important;
    border-radius: 0px !important;
}

.plugin-tabs .workspace-leaf.mod-active .view-header {
    transition: .2s !important;
    border: none;
    background-color: var(--background-primary);
    display: hidden;
    height: calc(var(--headerheight)/2) !important;
}

.plugin-tabs .workspace-leaf:not(.mod-active) .view-header-title {
    opacity: 1 !important;
}

.plugin-tabs .view-header-icon,
.plugin-tabs .view-action svg,
.plugin-tabs .mod-active .view-header-title {
    opacity: 0;
}

.plugin-tabs .view-header .view-action {
    margin-right: 2px !important;
    margin-left: 6px !important;
    height: calc(var(--headerheight)/2) !important;
    width: 25px !important;
}

.plugin-tabs .view-header:hover .view-header-icon,
.plugin-tabs .view-header:hover .view-action svg,
.plugin-tabs .view-header:hover .view-header-title,
.plugin-tabs .view-header:focus-within .view-header-title,
.plugin-tabs .workspace-split.mod-vertical.mod-root .workspace-split.mod-horizontal .workspace-leaf.mod-active .view-header {
    opacity: 1;
    transition: .2s !important;
}

This is all I've applied and it's not clean, so before using it you'll have to have a proper read, but I've done quite a bit and avoided !importants where reasonable.

[HuangAdam]

Great work!