diff --git a/assets/css/_html.css b/assets/css/_html.css index 34dd11f2d..4fa3a53f0 100644 --- a/assets/css/_html.css +++ b/assets/css/_html.css @@ -25,7 +25,7 @@ @import "keyboard-shortcuts.css"; @import "quick-switch.css"; @import "autocomplete.css"; -@import "tooltips.css"; +@import "tooltips.css"; /* must remain below functions */ @import "copy-button.css"; @import "settings.css"; @import "toast.css"; diff --git a/assets/css/content/cheatsheet.css b/assets/css/content/cheatsheet.css index e27d94d8d..d5cd67c5c 100644 --- a/assets/css/content/cheatsheet.css +++ b/assets/css/content/cheatsheet.css @@ -23,6 +23,7 @@ /* h2 */ .page-cheatmd .content-inner h2 { + font-size: 1.6rem; margin: var(--vertical-space) 0; column-span: all; color: var(--gray700); @@ -36,6 +37,7 @@ /* h3 */ .page-cheatmd .content-inner h3 { + font-size: 1.375rem; margin: 0 0 1em; font-weight: 400; } @@ -66,6 +68,7 @@ /* h4 */ .page-cheatmd .content-inner h4 { + font-size: 1rem; display: block; margin: 0; padding: 0.25em var(--horizontal-space); diff --git a/assets/css/content/functions.css b/assets/css/content/functions.css index c5c00d3e5..152398614 100644 --- a/assets/css/content/functions.css +++ b/assets/css/content/functions.css @@ -25,11 +25,14 @@ position: relative; } +/* !important used in order to beat main heading styles (which use #id selectors), +in both HTML and ePub. */ .content-inner .detail-header .signature { font-family: var(--monoFontFamily); - font-size: 13px; font-weight: 700; - line-height: 2em; + font-size: 13px !important; + line-height: 2em !important; + margin: 0 !important; } .content-inner .detail-header:hover a.detail-link, diff --git a/assets/css/content/general.css b/assets/css/content/general.css index e7083205d..99d9431c6 100644 --- a/assets/css/content/general.css +++ b/assets/css/content/general.css @@ -62,15 +62,6 @@ color: var(--textHeaders); } -.content-inner h1 { - font-size: 2em; - margin: 0.5em 0; -} - -.content-inner h1.section-heading { - margin: 1.5em 0 0.5em; -} - .content-inner div.group-description { margin: 0 0 3em; } @@ -79,15 +70,43 @@ font-weight: 400; } -.content-inner h2 { - font-size: 1.6em; - padding-top: 1em; - margin-bottom: 0.5em; -} +/* Headings +Summary, Callbacks and Functions sections output h1 and h2, +which we style as h2 and h3. */ + +.content-inner { + & h1 { + font-size: 2rem; + margin-top: 1.75em; + } + + & h2, + & :is(#summary, #callbacks, #functions) h1 { + font-size: 1.75rem; + margin-top: 1.5em; + margin-bottom: 0.5em; + } + + & h3, + & :is(#summary, #callbacks, #functions) h2 { + font-size: 1.45rem; + margin-top: 1.5em; + margin-bottom: 0.5em; + } -.content-inner h3 { - font-size: 1.375em; - margin: 1em 0 0.5em; + & :is(h4, h5, h6) { + font-size: 1.15rem; + margin-top: 1.25em; + margin-bottom: 0.5em; + } + + & :is(h5, h6) { + font-weight: normal; + } + + & h6 { + font-size: 1rem; + } } .content-inner li + li { @@ -140,6 +159,18 @@ overflow: auto; border-radius: var(--borderRadius-base); + & :is(h1, h2, h3, h4, h5, h6) { + margin: 1.25rem 0; + } + + & :is(h1, h2, h3) { + font-size: 1.375rem; + } + + & :is(h4, h5, h6) { + font-size: 1rem; + } + & :is(code, pre code) { background-color: var(--admCodeBackground); border: 1px solid var(--admCodeBorder); @@ -151,7 +182,7 @@ } & :is(h1, h2, h3, h4, h5, h6):first-child { - padding-bottom: 1em; + padding-bottom: 1rem; border-bottom: 2px solid hsl(from currentColor h s l / 15%); } diff --git a/assets/css/tooltips.css b/assets/css/tooltips.css index c5fa721a0..355d975a0 100644 --- a/assets/css/tooltips.css +++ b/assets/css/tooltips.css @@ -33,10 +33,12 @@ as it has absolute positioning, so doesn't impact the layout and click events pa overflow: auto; } +/* !important used in order to beat main heading and functions signature styles. */ .tooltip .tooltip-body .signature { min-width: 320px; width: 100%; - line-height: 1em; + line-height: 1em !important; + margin: .75em 0 !important; } .tooltip .tooltip-body .detail-header {