X-Git-Url: http://git.draconx.ca/gitweb/homepage.git/blobdiff_plain/8047c9c84ae645321839dd5fbeb59fd785c3ea5b..de605446b3ed408672aecd74462a25de41c1367c:/content/style.css diff --git a/content/style.css b/content/style.css index 8f6d630..0f4b097 100644 --- a/content/style.css +++ b/content/style.css @@ -22,13 +22,153 @@ body { margin: 1em; } -p { +h1 { + font-size: 2em; + max-width: 30em; /* 60rem */ +} + +h2 { + font-size: 1.5em; + max-width: 40em; /* 60rem */ +} + +a:link { + color: mediumblue; +} + +a:active { + color: red; +} + +a:visited { + color: purple; +} + +p, body>div { text-align: justify; padding: 0; margin: 1em 0; max-width: 50em; } +ul, ol, dl { + max-width: 50em; + padding: 0; + margin: 0; +} + +dt, dd, li { + text-align: justify; + margin: 0 0 0 2em; + padding: 0; +} + +dl.terms>dt { + display: list-item; + font-weight: bold; + text-align: left; + + float: left; +} + +dt::after { + content: " "; +} + +ul.ordered>li { + list-style: none; +} + +ul.ordered>li>span:first-child, ul.ordered>li>*:first-child>span:first-child { + display: inline-block; + text-align: right; + + margin-left: -1.8em; + min-width: 1.8em; +} + +hr { + clear: both; + text-align: left; + margin: 0.5em 0; + max-width: 50em; + border: 0; + border-top: 1px solid lightgray; +} + +small.permalink { + font-size: small; + color: slategray; +} +.permalink a:link, .permalink a:visited { + color: slategray; +} + +@media not screen { + small.permalink { + visibility: hidden; + } +} + +#footer { + max-width: 44em; + margin: 0; + padding: 0 3em; + text-align: center; +} + +#footer>p { + display: inline-block; + color: slategray; + font-size: 0.8em; + max-width: 100%; + margin: 0.2em 0; +} + +kbd { + font-family: monospace; + font-size: small; +} + +kbd::before { + content: "% "; +} + +#breadcrumbs, #sitetitle { text-align: left; } +#breadcrumbs>*, #sitetitle>* { font-size: 0.8em; } + +#sitetitle>* { + float: right; + display: inline-block; +} + +#breadcrumbs>strong { + vertical-align: top; + margin: 0; + padding: 0; +} + +#breadcrumbs>ul { + list-style-type: none; + vertical-align: top; + display: inline; + margin: 0; + padding: 0; +} + +#breadcrumbs>ul>li { + display: inline; + padding: 0; + margin: 0; +} + +#breadcrumbs>ul>li::before { content: "/ " } +#breadcrumbs>ul>li:first-child::before { content: none; } + @media (max-width: 512px) { - p { text-align: left; } + body { margin: 0.6em; } + ul ul { margin-left: -1.2em; } } + +@media (max-width: 28em) { li, dd, dt, p, #footer>p { text-align: left; } } +@media (max-width: 35em) { #sitetitle>* { float: none; } }