diff options
| Commit | d562b299e014f3881bc53bb99fdde6d812143ae4 (patch) | |
|---|---|---|
| Author | 2023-01-10 12:32:43 +0200 | |
| Committer | 2023-01-10 12:32:43 +0200 | |
| Files | b378ca918c3718d249fc4ab7429e36f3fffb953c | |
| syndamia.com-d562b299e014f3881bc53bb99fdde6d812143ae4.tar syndamia.com-d562b299e014f3881bc53bb99fdde6d812143ae4.tar.gz syndamia.com-d562b299e014f3881bc53bb99fdde6d812143ae4.zip | ||
| Parent | 02130d044ad367b97acb3a6d7a47283059521c45 (diff) | |
[presentation] Updated styling to be in new format
1 files changed, 87 insertions, 163 deletions
| -rw-r--r-- | src/presentation.css | 250 |
diff --git a/src/presentation.css b/src/presentation.css index 0e9a053..5e6e24a 100644 --- a/src/presentation.css +++ b/src/presentation.css @@ -1,190 +1,114 @@ /* Stylesheet override */ -article { - font-size: 22px; - max-width: calc(297mm + 2em); -} - +article { max-width: calc(297mm + 2em); font-size: 22px; } h2, h3, h4, h5, h6 { - display: block; - margin-block-start: 0; - margin-block-end: 0.5em; -} - -h2 + a, h3 + a, h4 + a, h5 + a, h6 + a { - display: none; -} + display: block; + margin-block-start: 0; + margin-block-end: 0.5em; + } + .h-anchor { display: none; } /* Presentation controller */ -#presentCont { - margin: 0.5em 0.5em 0.5em 0; -} - -#presentCont > img { - height: 1.4em; -} +#presentCont { margin: 0.5em 0.5em 0.5em 0; } + #presentCont > img { height: 1.4em; } + /* Presenting mode */ + #presentCont { display: initial; } /* Slides styles */ -.frow { - flex-direction: row; -} - -.frow > *:not(:last-child) { - margin-right: 0.5em; -} - -.fcol { - flex-direction: column; -} - -.fcol > *:not(:last-child) { - margin-bottom: 0.5em; -} - -.frow, .fcol { - display: flex; - flex-wrap: nowrap; -} - -.frow > *, .fcol > * { - flex: 1; -} - -.frow, .fcol, .frow > *, .fcol > *, .slide > * { - min-width: 0; - min-height: 0; -} - .slide { - display: flex; - flex-direction: column; - width: 297mm; /* Size of landscape A4 paper */ - height: 210mm; - - padding: 1em; - box-sizing: border-box; -} - -.slide img:not(.clicked-image) { - max-height: 100%; - height: auto; - max-width: 100%; - width: auto; -} - -.slide .svg { - max-height: 1em !important; -} - -.centered { - text-align: center; -} - -.centered h1::after, .centered h2::after, .centered h3::after { - content: " \2550" -} - -.flexer { - flex: 1; -} - -.font35 { - font-size: 35px; -} + box-sizing: border-box; + display: flex; + flex-direction: column; + height: 210mm; + padding: 1em; + width: 297mm; /* Size of landscape A4 paper */ + } + .slide img:not(.clicked-image) { + height: auto; + max-height: 100%; + max-width: 100%; + width: auto; + } + .slide .svg { max-height: 1em !important; } -.font30 { - font-size: 30px; -} + .frow, .fcol { display: flex; flex-wrap: nowrap; } + .frow, .fcol, .frow > *, .fcol > *, .slide > * { + min-height: 0; + min-width: 0; + } + .frow > *, .fcol > * { flex: 1; } + .frow { flex-direction: row; } + .frow > *:not(:last-child) { margin-right: 0.5em; } + .fcol { flex-direction: column; } + .fcol > *:not(:last-child) { margin-bottom: 0.5em; } -.font27 { - font-size: 27px; -} + .centered { text-align: center; } + .centered h1::after, .centered h2::after, .centered h3::after { + content: " \2550" + } + .flexer { flex: 1; } + .fright { float: right; text-align: right; } -.font20 { - font-size: 20px; -} + .font35, .font30, .font27, .font20, .font18 { + line-height: 1.5em; + } + .font35 { font-size: 35px; } + .font30 { font-size: 30px; } + .font27 { font-size: 27px; } + .font20 { font-size: 20px; } + .font18 { font-size: 18px; } -.font18 { - font-size: 18px; -} +/* Presenting mode */ -.font35, .font30, .font27, .font20, .font18 { - line-height: 1.5em; -} +.absolute-slide { + border: none; + height: min(100vh, 100vw / 1.414); + left: 0; + margin: 0 auto; + position: absolute; + right: 0; + top: 0; + visibility: visible; + width: min(100vh * 1.414, 100vw); + } + .invisible { visibility: hidden; } + .nodisplay { display: none; } + .no-overflow { overflow: hidden; } + .body-bg-color { background-color: var(--bg-color); } -.fright { - float: right; - text-align: right; -} +.absolute-cont { + bottom: 0; + opacity: 40%; + position: absolute; + right: 0; + visibility: visible; + z-index: 10; + } /* Media specific stylings */ @media screen { .slide { - border: 1px solid var(--fg-color); - margin-bottom: 1em; - } + border: 1px solid var(--fg-color); + margin-bottom: 1em; + } } @media print { article, body { - margin: 0; - border: none !important; - padding: 0; - max-width: auto; - } - - nav, article > p, article > h1, article > h2, article > h3, article > h4, article > h5, article > h6 { - display: none !important; - } - - .slide { - width: 296.99mm; - height: 209.5mm; - } -} - -/* Presenting mode */ - -#presentCont { - display: initial; -} - -.invisible { - visibility: hidden; -} - -.nodisplay { - display: none; + border: none !important; + margin: 0; + max-width: auto; + padding: 0; + } + nav, article > p, article > h1, article > h2, article > h3, article > h4, article > h5, article > h6 { + display: none !important; + } + .slide { + height: 209.5mm; + width: 296.99mm; + } } -.no-overflow { - overflow: hidden; -} - -.body-bg-color { - background-color: var(--bg-color); -} - -.absolute-slide { - visibility: visible; - position: absolute; - top: 0; - left: 0; - right: 0; - margin: 0 auto; - height: min(100vh, 100vw / 1.414); - width: min(100vh * 1.414, 100vw); - border: none; -} - -.absolute-cont { - visibility: visible; - position: absolute; - bottom: 0; - right: 0; - opacity: 40%; - z-index: 10; -} |