Pull header and social buttons to side panel
/* ==UserStyle==
@name codesandbox.io: collapse header for larger editor
@namespace myfonj
@version 1.0.0
@description Pull header and social buttons to side panel
@author myf
@license CC0
==/UserStyle== */
/*
https://greasyfork.org/en/scripts/441676/versions/new
*/
@-moz-document domain("codesandbox.io") {
/* categorisation */
}
@-moz-document url-prefix("https://codesandbox.io/s/") {
header:not(:hover):not(:focus-within) {
width: 55px;
overflow: hidden;
}
header:not(:hover):not(:focus-within) a[href="/dashboard"] {
opacity: 0;
}
header {
z-index: 100;
position: fixed;
right: auto;
left: 0;
}
/* reclaim header space */
nav[aria-label="Sandbox Navigation"] + div {
top: 0 !important;
}
/* sweep social buttons to panel */
nav[aria-label="Sandbox Navigation"] + div > .SplitPane > .Pane1 > [class*="elements__Container"] > :last-child {
position: fixed;
bottom: .33em; left: .33em;
display: flex;
flex-direction: column;
}
nav[aria-label="Sandbox Navigation"] + div > .SplitPane > .Pane1 > [class*="elements__Container"] > :last-child > div {
display: contents;
}
}