From ef3470c1d2fe90305396952a1e46447764963b7f Mon Sep 17 00:00:00 2001 From: jornmann Date: Thu, 17 Nov 2022 22:53:36 +0200 Subject: [PATCH] add the papes styles --- css/the-papes.css | 127 ++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 127 insertions(+) create mode 100644 css/the-papes.css diff --git a/css/the-papes.css b/css/the-papes.css new file mode 100644 index 0000000..b4607a9 --- /dev/null +++ b/css/the-papes.css @@ -0,0 +1,127 @@ +html, body { + margin: 0; + background-color: #c0c0c0; +} +body { + margin: auto; + width: 1000px; + font-family: serif; +} +div.window-bar { + background: repeating-linear-gradient( + 45deg, + #ffffff 0px, + #ffffff 1px, + #eeeeee 2px, + #ffffff 3px, + #ffffff 4px, + #ffffff 5px, + #eeeeee 6px, + #ffffff 7px, + #ffffff 8px + ); + color: #000000; + /*padding: 2px 8px 2px 8px;*/ + padding: 4px 8px 4px 8px; +} +div.window { + background-color: #eeeeee; + margin: 10px; + margin-left: 260px; +} +div.bio-window { + left: 0; + top: 0; + position: fixed; + width: 250px; + height: 100%; + margin: 0; +} +@media screen and (max-width: 1000px) { + body { + width: 100%; + } + div.bio-window { + position: relative; + width: calc(100% - 20px); + margin: 10px; + } + div.window { + background-color: #eeeeee; + margin: 10px; + } + +} +div.window-content { + padding: 15px; +} +.post-date { + color: #808080; +} +img.pfp { + padding: 2px; + border: 2px solid #000000; + display: block; + margin: auto; +} +div.bio { + grid-area: bio; +} +.clearfix::after { + content: ""; + clear: both; + display: table; +} +hr { + border: 1px solid #000000; +} +footer { + width: 250px; + left: 0; + bottom: 0; + position: fixed; + text-align: center; +} +a.options { + text-decoration: none; +} +a.options:visited { + color: #0000ee; +} +.monospace { + font-family: monospace; +} +img.mood { + vertical-align: middle; +} +div.hidden-info { + display: none; + font-family: monospace; +} +label.show-info { + color: #0000ee; + cursor: pointer; +} +label.show-info:active { + color: #ff0000; +} +input.show-info:checked ~ div.hidden-info { + display: flex; +} +pre.hidden-info { + margin: 5px 0px 0px 0px; +} +div.grid-container { + display: grid; + grid-template-columns: auto auto auto; +} +div.bio-grid-container { + display: grid; + /*grid-template-columns: 98px auto auto;*/ + grid-template-areas: + 'pfp bio'; +} +pre { + white-space: pre-wrap; + word-break: break-word; +}