From f954585ea098ee5d6619c62a8fa48a904474ab3f Mon Sep 17 00:00:00 2001 From: 53hornet Date: Tue, 14 Dec 2021 15:27:05 -0500 Subject: refactor: move css to its own file --- includes/head.php | 188 ++--------------------------------------------------- includes/style.css | 181 +++++++++++++++++++++++++++++++++++++++++++++++++++ index.php | 2 - pages/links.php | 4 +- 4 files changed, 188 insertions(+), 187 deletions(-) create mode 100644 includes/style.css diff --git a/includes/head.php b/includes/head.php index 748e4b7..6e0bc4e 100644 --- a/includes/head.php +++ b/includes/head.php @@ -2,204 +2,24 @@ + 53hornet - + - 53hornet ➙ %s', $title); - } else { - echo '53hornet'; - } - ?> - - +
diff --git a/includes/style.css b/includes/style.css new file mode 100644 index 0000000..e3189fd --- /dev/null +++ b/includes/style.css @@ -0,0 +1,181 @@ +@font-face { + font-family: "Iosevka Slab"; + font-display: swap; + src: url("/assets/iosevka-slab-regular.woff2"); +} + +:root { + --balboa: #195970; + --ruby: #9b111e; + --slate: #b9c2ca; + --charcoal: #798d94; + --white: white; + --box-radius: 0.25em; + --box-border: 0.5em solid var(--white); +} + +body { + font-family: "Iosevka Slab", monospace; + font-size: 1.5em; + background-color: var(--balboa); + color: var(--white); + max-width: 50em; + margin: auto; + padding: 1em; +} + +hr { + color: var(--white); +} + +nav { + list-style-type: none; + text-align: center; +} + +nav ul { + padding: 0; + margin: 0; +} + +nav li { + display: inline-block; + margin: 0.5em; + padding: 0.5em; +} + +nav svg { + padding-right: 0.5em; + width: 24px; + height: 24px; +} + +nav svg path, +nav svg rect { + fill: var(--white); +} + +a:link { + color: var(--slate); + background-color: var(--balboa); + border-radius: var(--box-radius); +} + +a:visited { + color: var(--charcoal); +} + +a:hover { + transition: 0.25s; + background-color: var(--slate); + color: var(--balboa); + text-decoration: none; +} + +nav a:link, +nav a:visited, +nav a:hover, +nav a:active { + background-color: var(--balboa); + display: flex; + align-items: center; + color: var(--white); + text-decoration: none; +} + +pre { + white-space: pre-wrap; + display: block; + background-color: var(--charcoal); + padding: 1em; + border-radius: var(--box-radius); + border-left: var(--box-border); + border-right: var(--box-border); + overflow: auto; +} + +.description { + background-color: var(--ruby); + padding: 1em; + border-radius: var(--box-radius); + border-left: var(--box-border); + border-right: var(--box-border); +} + +h1, +blockquote { + font-style: oblique; +} + +header { + text-align: center; +} + +article ul { + list-style: none; + padding: 0; + margin: 0; +} + +article ul li { + padding: 0.5em; +} + +article ul li:before { + content: "➙"; + padding-right: 0.5em; +} + +article ol li { + padding: 0.5em; +} + +p img { + display: block; + margin-top: 1em; + margin-left: auto; + margin-right: auto; + max-width: 75%; + height: auto; + border-radius: var(--box-radius); + border-left: var(--box-border); + border-right: var(--box-border); +} + +iframe { + display: block; + margin-left: auto; + margin-right: auto; +} + +.list { + overflow-x: auto; +} + +.list table { + width: 100%; +} + +.list td, +th { + padding: 0.5em; + text-align: left; + border-bottom: 1px solid var(--charcoal); +} + +.form { + text-align: center; +} + +.form input { + font-size: 1em; + margin-top: 1em; + border-radius: 3em; + box-sizing: border-box; + padding: 0.5em; + border: 0; +} + +.form .description { + display: none; +} diff --git a/index.php b/index.php index c00e8b5..f9ad9cf 100644 --- a/index.php +++ b/index.php @@ -1,9 +1,7 @@ = '0' && $page[0] <= '9' && is_readable("./posts/$page.php")) { diff --git a/pages/links.php b/pages/links.php index eb51de8..546b90b 100644 --- a/pages/links.php +++ b/pages/links.php @@ -14,12 +14,14 @@
  • Doug Wildrick's Rubber Parts for HET
    • -

    *nix

    +

    *nix, *BSD

    Software Engineering & Development

    -- cgit v1.2.3