From e45a841503edd59a687a0ed03660b070ab6d8404 Mon Sep 17 00:00:00 2001 From: Bill Niblock Date: Fri, 12 Jan 2018 15:27:48 -0500 Subject: [PATCH] Implement Corrupt: My custom Jekyll Theme Corrupt is a very simple site layout. It has two columns, one which is the main content column, and one which serves as a small summary column. The layout is designed for simplicity, and does not feature any significant menu. The layout is responsive, too! --- _layouts/corrupt.html | 73 ++++++++++ _layouts/default.html | 76 ----------- _layouts/old.html | 132 ++++++++++++++++++ index.html | 7 +- src/corrupt.css | 230 ++++++++++++++++++++++++++++++++ src/{styles.css.bkp => old.css} | 0 6 files changed, 438 insertions(+), 80 deletions(-) create mode 100644 _layouts/corrupt.html delete mode 100644 _layouts/default.html create mode 100644 _layouts/old.html create mode 100644 src/corrupt.css rename src/{styles.css.bkp => old.css} (100%) diff --git a/_layouts/corrupt.html b/_layouts/corrupt.html new file mode 100644 index 0000000..5af1cd9 --- /dev/null +++ b/_layouts/corrupt.html @@ -0,0 +1,73 @@ + + + + The Internet Vagabond :: {{ page.tabtitle }} + + + + + + + +
+
+
+
+
The
Internet
Vagabond
+
+
+
+ {{ content }} +

[{{ page.author }}][{{ page.pub }}][{{ page.tags }}]

+
+
+
+
+
+ +
+
+ + diff --git a/_layouts/default.html b/_layouts/default.html deleted file mode 100644 index f035c5e..0000000 --- a/_layouts/default.html +++ /dev/null @@ -1,76 +0,0 @@ - - - - The Internet Vagabond :: {{ page.tabtitle }} - - - - - - - - -
-
-
-
-
The
Internet
Vagabond
-
-
-
-
- {{ content }} -
-
-
- -
- - diff --git a/_layouts/old.html b/_layouts/old.html new file mode 100644 index 0000000..734caf5 --- /dev/null +++ b/_layouts/old.html @@ -0,0 +1,132 @@ + + + + The Internet Vagabond :: {{ page.tabtitle }} + + + + + + + + + + + +
+ + +
+ +
+ + + + + + +
+ + +
+ + {{ content }} + +
+ +
+ + diff --git a/index.html b/index.html index e3c43f3..e33d4c5 100644 --- a/index.html +++ b/index.html @@ -1,14 +1,13 @@ --- - layout: default tabtitle: Home --- {% for post in site.posts %}

{{ post.title }}

-
-
Published: {{ post.date }}
-
Tagged: {{ post.tags }}
+
+
Published: {{ post.pub }}
+
Tagged: {{ post.tags }}
{{ post.short_desc }}
diff --git a/src/corrupt.css b/src/corrupt.css new file mode 100644 index 0000000..99f6b3a --- /dev/null +++ b/src/corrupt.css @@ -0,0 +1,230 @@ +/* + * Corrupt: A simple, responsive theme for Jekyll + * CSS for theinternetvagabond.com + * (C)2015 Bill Niblock + * Licensed under the WTFPL [http://www.wtfpl.net] +*/ + + +/* General */ +html { + font-family: sans-serif; + /* Change this value to any color you want */ + --hilite: #8D3FC5; +} + +body { + background-color: #202020; + margin: 0; +} + +a,a:visited,a:link,a:focus { + text-decoration: underline; color: white; +} + +a:hover { + font-style: italic; +} + +.cor_page { + display: flex; flex-flow: row wrap; +} + +.cor_content { + width: 100%; + background-color: #3B3B3B; +} + +/* Header */ +.cor_head { + position: fixed; top: 0px; left: 0px; right: 0px; + margin: 0px; padding: 10px; z-index: 1; + background-color: #202020; + border-bottom: 1px solid var(--hilite); + box-shadow: 0px 5px 30px -5px var(--hilite); +} + +.title { + display: flex; + margin: 0px 25px; padding: 0px; +} + +.title div { + margin: 0px; padding: 0px; + font: 0.8em "Lucida Sans Unicode", "Lucida Grande", sans-serif; + color: darkgrey; letter-spacing: 0.8em; +} + +.title div::first-letter { + margin: 0px; padding: 0px 2px; + font: 0.8em "Lucida Sans Unicode", "Lucida Grande", sans-serif; + color: white; +} + +/* Sidebar */ +.cor_menu { + display: flex; + background-color: #202020; + z-index: 2; width: 100%; +} + +.cor_menu a:link,a:visited,a:focus { + text-decoration: none; + color: darkgrey; +} + +.cor_menu a:hover { + font-weight: normal; + color: white; +} + +.cor_footer { + display: flex; flex-flow: row wrap; + text-align: center; + border-top: 1px solid var(--hilite); + box-shadow: 0px 0px 30px 0px var(--hilite); +} + +.cor_footer #about { + display: flex; + flex-flow: column; +} + +.cor_footer #about p { + line-height: 1.5em; letter-spacing: 0.1em; text-align: left; color: white; + padding: 0em 1em; +} + +.cor_footer #about h2 { + text-align: right; + padding: 10px; + font: 1.0em "Lucida Sans Unicode", "Lucida Grande", sans-serif; + color: darkgrey; letter-spacing: 0.6em; +} + +.cor_footer #social { + display: flex; flex-flow: row; width: 100%; + padding-bottom: 15px; +} + +.cor_footer #social div { + width: 25%; text-align: center; +} + +/* Index */ +#posts a,a:visited,a:link,a:focus { + color: darkgrey; + text-decoration: none; +} + +#posts a:hover { + font-style: normal; + color: white; +} + +#posts #details { + display: flex; flex-flow: row wrap; + text-align: center; + padding: 10px; + border-top: 1px solid darkgrey; + font: 0.8em "Lucida Sans Unicode", "Lucida Grande", sans-serif; + color: darkgrey; letter-spacing: 0.4em; +} + +#posts #date { + width: 100%; + text-align: center; + color: grey; +} + +#posts #tags { + width: 100%; + text-align: center; + color: grey; +} + +#posts #desc { + padding: 0em 2em 2em 2em; + color: white; +} + +/* Content */ +#content { + margin: 75px 5% 5% 5%; + line-height: 1.5em; letter-spacing: 0.1em; +} + +#content h1 { + padding: 10px; + font: 1.2em "Lucida Sans Unicode", "Lucida Grande", sans-serif; + color: darkgrey; letter-spacing: 0.5em; +} + +#content h1::first-letter { + margin: 0px; padding: 0px; + font: 1.2em "Lucida Sans Unicode", "Lucida Grande", sans-serif; + color: white; +} + +#content h2 { + text-align: left; + padding: 10px; + border-bottom: 1px solid darkgrey; + font: 1.0em "Lucida Sans Unicode", "Lucida Grande", sans-serif; + color: darkgrey; letter-spacing: 0.6em; +} + +#content h3 { + text-align: right; + padding: 10px; + border-bottom: 1px solid darkgrey; + font: 1.0em "Lucida Sans Unicode", "Lucida Grande", sans-serif; + color: darkgrey; letter-spacing: 0.6em; +} + +#content h4 { + text-align: center; + padding: 10px; + border-top: 1px solid darkgrey; + font: 0.8em "Lucida Sans Unicode", "Lucida Grande", sans-serif; + color: darkgrey; letter-spacing: 0.4em; +} + +#content p { + padding: 0em 2em; + color: white; +} + +/* Mobile First */ +@media only screen and (min-width: 1250px) and (min-height: 750px) { + .title div { + font: 1.2em "Lucida Sans Unicode", "Lucida Grande", sans-serif; + color: darkgrey; letter-spacing: 1.2em; + } + .title div::first-letter { + font: 1.2em "Lucida Sans Unicode", "Lucida Grande", sans-serif; + } + .cor_content { + width: 80%; + } + #posts #date { + width: 50%; + text-align: left; + color: grey; + } + + #posts #tags { + width: 50%; + text-align: right; + color: grey; + } + .cor_menu { + width: 20%; + } + .cor_footer { + position: fixed; + bottom: 0; + border: none; + box-shadow: unset; + } +} diff --git a/src/styles.css.bkp b/src/old.css similarity index 100% rename from src/styles.css.bkp rename to src/old.css