X-Git-Url: https://git.r.bdr.sh/rbdr/blog/blobdiff_plain/05d725fad196f53874c5d15ca493962986f8af73..d50db372c93af9f55e670fddf7015975a0e247c4:/static/css/style.css diff --git a/static/css/style.css b/static/css/style.css index 2a35a63..0261e9d 100644 --- a/static/css/style.css +++ b/static/css/style.css @@ -1,163 +1,21 @@ -* { - margin: 0; - padding: 0; +canvas { + width: 64px; + height: 64px; + display: inline-block; + background-color: gainsboro; } -body { - background-image: url('/images/header_background.png'); - background-size: auto 300px; - background-attachment: fixed; - line-height: 1.45em; - - font-family: Times, 'Times New Roman', serif; -} - -header { - background-image: url('/images/header_foreground.png'); - background-repeat: no-repeat; - background-size: auto 300px; - height: 300px; -} - -header a { - color: transparent; - display: block; - max-height: 500px; -} - -main { - background-color: white; - padding: 1.414em 4.53em; - display: flex; - flex-flow: column; - align-items: center; -} - -h1, h2, h3 { - font-weight: 400; - width: 100%; -} -h1 { - font-size: 2rem; - line-height: 1.05em; - max-width: 30rem; - margin: 0.5em 0 0.5em; - text-transform: uppercase; -} -h2, h3 { - max-width: 30rem; - font-size: 1rem; - margin: 2em 0; -} - -h2 { font-variant: small-caps; } -h3 { font-style: italic; } - -ul, ol, img { - width: 100%; - margin: 1.414em 0; - max-width: 30em; -} - -p { - max-width: 30em; - text-align: justify; - text-indent: 1.5em; -} - -hr + p, -h1 + p, -h2 + p, -h3 + p { - text-indent: 0; -} - -ul, ol { margin-left: 1.414em; } - -code { - background-color: whitesmoke; - padding: 0.2em 0.5em; -} - -pre { - background-color: whitesmoke; - padding: 1em; - font-size: 1.231em; - max-width: 30em; - margin: 1.414em 0 1.414em -1em; -} - -hr { - border: 0; - border-bottom: 1px solid #666; - width: 30em; - margin: 1.414em 0; -} - -hr.separator { - width: 100%; - border-bottom: 10px solid #666; -} - -footer, -footer a { - color: #fff; - background-color: blue; -} -footer p { - font-family: arial, sans-serif; - text-align: left; - text-indent: 0; - padding: 1.414em; -} - -/* Image and caption sttyles */ - -p img { - margin-left: -1.125em; -} - -hr + p img, -h1 + p img, -h2 + p img, -h3 + p img { - margin-left: 0; -} - -img { - width: 100%; - max-width: 30em; -} - -img + em { - color: #999; - display: block; - margin: -1.414em 0 1.414em; - text-align: right; -} - -/* Dark Mode Support */ - @media (prefers-color-scheme: dark) { - main { - background-color: black; + body { color: white; - } - - code, - pre { - background-color: #444; + background-color: black; } a { - color: #53FFFF; + color: #5dc1fd; } a:visited { - color: #FF55FF; - } - - hr.separator { - border-bottom: 10px solid #999; + color: #ed6eff; } }