tweaks
This commit is contained in:
parent
1372236cc1
commit
49ad53577e
|
@ -1,6 +1,7 @@
|
||||||
:root {
|
:root {
|
||||||
--pad: 1rem;
|
--pad: 1rem;
|
||||||
--pad05: calc(0.5 * var(--pad));
|
--pad05: calc(0.5 * var(--pad));
|
||||||
|
--popup-button-width: 16px;
|
||||||
}
|
}
|
||||||
|
|
||||||
body {
|
body {
|
||||||
|
@ -1031,22 +1032,27 @@ body:not(.find-open) [data-match-highlight-count="1"] .CodeMirror-selection-high
|
||||||
#header:not(.sticky) {
|
#header:not(.sticky) {
|
||||||
position: static;
|
position: static;
|
||||||
}
|
}
|
||||||
#header {
|
#header:not(.sticky) {
|
||||||
display: block;
|
display: block;
|
||||||
|
}
|
||||||
|
#header {
|
||||||
flex: 0 0 auto;
|
flex: 0 0 auto;
|
||||||
height: unset;
|
height: unset;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
overflow: visible;
|
||||||
background: #fff;
|
background: #fff;
|
||||||
border-right: none;
|
border-right: none;
|
||||||
border-bottom: 1px dashed #AAA;
|
border-bottom: 1px dashed #AAA;
|
||||||
padding: var(--pad05) var(--pad05) 0;
|
padding: var(--pad05) var(--pad05) 0;
|
||||||
}
|
}
|
||||||
#header.sticky {
|
#header.sticky {
|
||||||
|
flex-direction: row;
|
||||||
box-shadow: 0 0 3rem -.75rem black;
|
box-shadow: 0 0 3rem -.75rem black;
|
||||||
}
|
}
|
||||||
#header.sticky #basic-info,
|
#header.sticky #basic-info,
|
||||||
#header.sticky #mozilla-format-buttons,
|
#header.sticky #mozilla-format-buttons,
|
||||||
#header.sticky .buttons > button,
|
#header.sticky .buttons > button,
|
||||||
|
#header.sticky .split-btn-pedal,
|
||||||
#heading,
|
#heading,
|
||||||
#header-sticker {
|
#header-sticker {
|
||||||
top: 0;
|
top: 0;
|
||||||
|
@ -1054,11 +1060,14 @@ body:not(.find-open) [data-match-highlight-count="1"] .CodeMirror-selection-high
|
||||||
position: absolute;
|
position: absolute;
|
||||||
visibility: hidden;
|
visibility: hidden;
|
||||||
}
|
}
|
||||||
|
.popup-window #details-wrapper {
|
||||||
|
margin-right: var(--popup-button-width);
|
||||||
|
}
|
||||||
h2 {
|
h2 {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
#basic-info {
|
#basic-info {
|
||||||
margin: 0 16px var(--pad05) 0; /* for popup icon in simple window */
|
margin: 0 var(--popup-button-width) var(--pad05) 0;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
|
@ -1086,15 +1095,36 @@ body:not(.find-open) [data-match-highlight-count="1"] .CodeMirror-selection-high
|
||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
margin: .25em 0 var(--pad05);
|
margin: .25em 0 var(--pad05);
|
||||||
}
|
}
|
||||||
#details-wrapper details[open] {
|
|
||||||
max-height: 10vh;
|
|
||||||
}
|
|
||||||
#details-wrapper[data-open^=".."] details {
|
#details-wrapper[data-open^=".."] details {
|
||||||
max-width: 50%;
|
max-width: 50%;
|
||||||
}
|
}
|
||||||
#details-wrapper[data-open^="..."] {
|
#details-wrapper[data-open^="..."] {
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
}
|
}
|
||||||
|
#details-wrapper details[open] {
|
||||||
|
margin-top: 0;
|
||||||
|
z-index: 1000;
|
||||||
|
}
|
||||||
|
#details-wrapper details[open]:focus-within {
|
||||||
|
z-index: 1001;
|
||||||
|
}
|
||||||
|
#details-wrapper details[open] > summary {
|
||||||
|
position: static;
|
||||||
|
margin-top: 0;
|
||||||
|
}
|
||||||
|
#details-wrapper details[open] > summary + * {
|
||||||
|
position: absolute;
|
||||||
|
overflow-y: auto;
|
||||||
|
max-height: 10vh;
|
||||||
|
background: #fff;
|
||||||
|
box-shadow: 0 6px 20px rgba(0, 0, 0, .3);
|
||||||
|
padding: var(--pad);
|
||||||
|
}
|
||||||
|
#sections-list[open] > #toc,
|
||||||
|
#lint[open] > .lint-report-container {
|
||||||
|
max-width: 50vw;
|
||||||
|
right: 0;
|
||||||
|
}
|
||||||
#options[open],
|
#options[open],
|
||||||
#publish[open],
|
#publish[open],
|
||||||
#lint:not([open]) {
|
#lint:not([open]) {
|
||||||
|
|
|
@ -21,6 +21,7 @@
|
||||||
onclick: embedPopup,
|
onclick: embedPopup,
|
||||||
});
|
});
|
||||||
$root.appendChild(btn);
|
$root.appendChild(btn);
|
||||||
|
$root.classList.add('popup-window');
|
||||||
baseInit.domReady.then(() => {
|
baseInit.domReady.then(() => {
|
||||||
document.body.appendChild(btn);
|
document.body.appendChild(btn);
|
||||||
// Adding a dummy command to show in keymap help popup
|
// Adding a dummy command to show in keymap help popup
|
||||||
|
|
|
@ -320,6 +320,7 @@ body.resizing-v > * {
|
||||||
|
|
||||||
.split-btn {
|
.split-btn {
|
||||||
position: relative;
|
position: relative;
|
||||||
|
white-space: nowrap;
|
||||||
}
|
}
|
||||||
.split-btn-pedal {
|
.split-btn-pedal {
|
||||||
margin-left: -1px !important;
|
margin-left: -1px !important;
|
||||||
|
|
Loading…
Reference in New Issue
Block a user