diff options
Diffstat (limited to 'res/style.css')
-rw-r--r-- | res/style.css | 222 |
1 files changed, 21 insertions, 201 deletions
diff --git a/res/style.css b/res/style.css index fbc2ccf..f04dcd3 100644 --- a/res/style.css +++ b/res/style.css @@ -1,16 +1,23 @@ +:root { + --normal-text: #eee; + /*--notable-text: #107d8e;*/ + --notable-text: #50bdce; + --dim-text: #aaa; +} html, body { - color:#3f3b33; + color: var(--normal-text); font-family:"Iosevka Aile", "Dejavu Sans", sans-serif; - background-color:#292929; + /*background-color:#292929;*/ font-size:1.1em; margin:0px; padding:0px; + background:linear-gradient(to top right, #322, #456); } a, a:visited { - color:#107d8e; + color: var(--notable-text); } @@ -26,7 +33,7 @@ h1.title { h1 a:link, h1 a:visited { - color:#444; + color:#777; } @@ -39,17 +46,17 @@ h2, h3, h4, h5, h6 { } h2 { - color:#107d8e; + color: var(--notable-text); font-size:2.2em; } h3 { - color:#207d8e; + color: var(--notable-text); font-size:1.8em; } h4 { - color:#207d8e; + color: var(--notable-text); font-size:1.5em; border:none; } @@ -116,86 +123,31 @@ span.yellow { /** - * Navbar Styles - */ -div#nav-header { - padding-top:.5em; - background-color:#333; - background:linear-gradient(to top right, #211, #234); - box-shadow:0px 0px 4px #4f4b43; - color:#eee; - display:flex; -} - -div#nav-header div#nav-header-logo { - width:30%; -} - -/** - * Nav header link bar - */ -div#nav-header-links { - border:none; - padding:2px 1px 7px 0px; - text-align:right; - vertical-align:top; - width:70%; -} - -div#nav-header-links ul { - padding:4px; - margin:0px; -} - -div#nav-header-links ul li { - list-style:none; - display:inline; - padding:0px 7px; - border-right:1px solid #999; -} - -div#nav-header-links ul li:last-child { - border:none; -} - -div#nav-header-links a, -div#nav-header-links a:link, -div#nav-header-links a:visited { - color:#dff; - text-decoration:none; -} - -div#nav-header-links a:hover { - text-decoration:underline; -} - - -/** * Body Styles */ div#body-wrapper { - background-color:#eee; - padding:7px 0px 20px 0px; + padding:10px 0px 0px 0px; } div#body-content { - background:none; - padding:10px; + padding:5px 15px; margin-left:auto; margin-right:auto; max-width:70em; + backdrop-filter:brightness(93%); + -webkit-backdrop-filter:brightness(93%); } div.quoteblock, pre { - background-color:#f9f9f9; + background-color:#444; border:1px dotted #999; padding:5px 15px 7px 15px; border-radius:5px; margin:5px 0px; - color:#555; + color: var(--dim-text); font-size:1.0em; display:inline-block; } @@ -214,24 +166,6 @@ blockquote { margin-bottom:10px; } -div.index-post { - width:98%; - margin: 10px auto 10px auto; - border:1px solid #ccc; - background-color:#e5e5e5; - border-radius:5px; - padding:10px; -} - -div.index-post .readmore { - display:block; - width:98%; - margin-left:0px; - margin-right:auto; - text-align:right; - font-size:.9em; -} - div#footer { background:linear-gradient(to bottom right, #211, #234); color:#eee; @@ -336,92 +270,11 @@ ul li p { * Header sections */ -/* - * Zeroth level (page label) - */ -div.sect1.index { - width:100%; -} - -/* - * First level (section headers on index page) - */ -div.index.sect1 { - background-color:#e7e7e7; - padding:0px; - border:1px solid #ccc; - width: 100%; - border-radius:4px; - margin:10px 0px 10px 0px; -} - -div.index.sect1 h2 { - padding:3px 0px 3px 7px; - margin:0px; - background-color:#dadada; - border-bottom:2px solid #aaa; - color:#333; - font-size:1.5em; - font-weight:300; -} - -div.index.sect1 div.ulist { - padding-left:0px; -} - -div.index.sect1 div.ulist ul { - list-style-type:none; - padding-left:7px; - margin-left:0px; -} - -div.index.sect1 div.ulist ul li { - border-left:4px solid #bbb; - padding-left:5px; - margin-left:0px; -} - -div.index.sect1 div.ulist ul li:hover { - border-left:4px solid #cc7733; -} - - - -/* - * Second-level nested header sections - */ -div.index.sect1 div.sect2 { - padding-left:5px; - width: 96%; - margin: 10px auto 10px auto; -} - -div.index.sect1 div.sect2 h3 { - padding:7px 0px 2px 0px; - margin:0px; -} - -div.index.sect1 div.sect2 div.ulist { - padding-left:0px; -} - -div.index.sect1 div.sect2 div.ulist ul { - list-style-type:none; - padding-left:2px; - margin-left:0px; -} - -div.index.sect1 div.sect2 div.ulist ul li { - border-left:4px solid #bbb; - padding-left:5px; - margin-left:0px; -} - div.datelastedit p { margin-top:2em; margin-bottom:0px; - color:#888; + color:var(--dim-text); font-style:italic; text-align:right; } @@ -474,36 +327,3 @@ span.docutils.literal { background-color:#e0e0e0; color:#555; } - -/** - * Overrides for portrait mode (EG: a phone or tablet) - */ -/* Smaller mobile displays with a lower resolution */ -@media only screen and (orientation: portrait) and (max-width: 850px) { - /*html, body { font-size: 15px; }*/ - /*div#nav-header, .grid-container-left, .grid-container-right { - grid-template-columns:100%; - }*/ -} - -/* More modern mobile displays with a higher resolution */ -@media screen and (orientation: portrait) { - html, body { font-size: 1em; } - div#nav-header { - position:fixed; - width:100%; - font-size:.9em; - } - div#nav-header div#nav-header-logo img { - padding:4px; - } - div#nav-header div#nav-header-logo { - display:inline-block; - } - div#nav-header-links { - display:inline-block; - } - div#body-wrapper { - padding-top:30px; - } -} |