Update CSS

6 files changed, 119 insertions, 89 deletions

diff --git a/css/custom/blockquotes.less b/css/custom/blockquotes.less
new file mode 100644
index 0000000..3984472
--- /dev/null
+++ b/css/custom/blockquotes.less
@@ -0,0 +1,18 @@
+@import "../variables.less";
+
+.quoteblock {
+	width: 90%;
+	margin: 0 auto;
+	border-left: double black;
+	padding: 0.5em;
+	background-color: @blockBackgroundColor;
+
+	blockquote {
+		font-style: italic;
+	}
+
+	div.attribution {
+		text-align: right;
+		margin-right: 1em;
+	}
+}
diff --git a/css/custom/helpers.less b/css/custom/helpers.less
new file mode 100644
index 0000000..2c4d80b
--- /dev/null
+++ b/css/custom/helpers.less
@@ -0,0 +1,5 @@
+@import "../variables.less";
+
+.center {
+	text-align: center;
+}
diff --git a/css/custom/navigation.less b/css/custom/navigation.less
new file mode 100644
index 0000000..9c9ef4e
--- /dev/null
+++ b/css/custom/navigation.less
@@ -0,0 +1,30 @@
+@import "../variables.less";
+
+// Navigation bar
+nav {
+	padding-bottom: 8px;
+	border-bottom: double @bodyTextColor;
+	text-align: center;
+	font-family: Sans;
+
+	a, a:visited {
+		margin: 0 0.5em;
+		font-size: 24px;
+		text-decoration: none;
+		color: @bodyTextColor;
+	}
+
+	.brand-name {
+		text-align: center;
+		display: block;
+		font-weight: bold;
+		font-size: 32px;
+		color: @bodyTextColor;
+		margin-bottom: 8px;
+	}
+}
+
+// Generic links
+a, a:visited {
+  color: @linkColor;
+}
diff --git a/css/formats/asciidoc.less b/css/formats/asciidoc.less
new file mode 100644
index 0000000..89dfcb2
--- /dev/null
+++ b/css/formats/asciidoc.less
@@ -0,0 +1,45 @@
+@import "../variables.less";
+
+.toc {
+	font-weight: bold;
+
+	ul {
+		font-weight: normal;
+		list-style-type: decimal;
+	}
+}
+
+.admonitionblock {
+	background-color: @blockBackgroundColor;
+	border: 1px solid @blockBorderColor;
+	margin: 0.5em auto 1.75em auto;
+	width: 90%;
+	padding: 0.5em;
+
+	table {
+		td.icon {
+			text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
+			font-size: 1.5em;
+
+			div.title {
+				margin: 0 1em;
+			}
+		}
+
+		td.content {
+			padding: 0 1.125em;
+			border-left: 1px solid #ddd;
+		}
+	}
+}
+
+div#footnotes {
+	font-size: smaller;
+
+	hr {
+		margin-top: 2em;
+		width: 80%;
+		text-align: left;
+		color: @blockBorderColor;
+	}
+}
diff --git a/css/main.less b/css/main.less
index 199ef30..21f7a8e 100644
--- a/css/main.less
+++ b/css/main.less
@@ -1,21 +1,13 @@
-@bodybgColor: #fefefe;
-@bodyTextColor: #454545;
-
-// Link Colors
-@linkColor: #07a;
-@linkVisitedColor: #07a;
-@linkVisitedInvertedColor: #ac5a82;
-// ===============
-
-@wrongColor: #c0392b;
-@shittyBlue: #0000EE;
-@shittyViolet: #551A8B;
-@motherfuckingColor: #16a085;
-@blockQuoteColor: #456;
-@openQuoteColor: #666;
+@import "./variables.less";
+
+@import "./custom/blockquotes.less";
+@import "./custom/helpers.less";
+@import "./custom/navigation.less";
+
+@import "./formats/asciidoc.less";
 
 html {
-  background-color: @bodybgColor;
+	background-color: @bodyBackgroundColor;
 }
 
 body {
@@ -32,33 +24,6 @@ small {
   font-size: 0.7em;
 }
 
-nav {
-	padding-bottom: 8px;
-	border-bottom: double @bodyTextColor;
-	text-align: center;
-	font-family: Sans;
-
-	a, a:visited {
-		margin: 0 0.5em;
-		font-size: 24px;
-		text-decoration: none;
-		color: @bodyTextColor;
-	}
-
-	.brand-name {
-		text-align: center;
-		display: block;
-		font-weight: bold;
-		font-size: 32px;
-		color: @bodyTextColor;
-		margin-bottom: 8px;
-	}
-}
-
-a, a:visited {
-  color: @linkColor;
-}
-
 li p {
 	margin: 0;
 }
@@ -67,57 +32,13 @@ table {
 	width: 100%;
 }
 
-blockquote{
-  color: @blockQuoteColor;
-  margin-left: 0;
-  margin-top: 2em;
-  margin-bottom: 2em;
-
-  span{
-    float: left;
-    margin-left: 1rem;
-    padding-top: 1rem;
-  }
-
-  author{
-    display: block;
-    clear: both;
-    font-size: 0.6em;
-    margin-left: 2.4rem;
-    font-style: oblique;
-
-    &:before{
-      content: "- ";
-      margin-right: 1em;
-    }
-  }
-
-  &::before{
-    font-family: "Times New Roman", Times, Arial;
-    color: @openQuoteColor;
-    content: open-quote;
-    font-size: 2.2em;
-    font-weight: 600;
-    float: left;
-    margin-top: 0em;
-    margin-right: 0.2rem;
-    width: 1.2rem;
-  }
-
-  &::after{
-    content: "";
-    display: block;
-    clear: both;
-  }
-}
-
 pre.pygments {
-	border: double @openQuoteColor;
+	border: 2px solid @blockBorderColor;
 	padding: 8px;
 }
 
 code {
-	background-color: #eee;
+	background-color: @blockBackgroundColor;
 	padding: 2px;
 }
 
diff --git a/css/variables.less b/css/variables.less
new file mode 100644
index 0000000..88347cf
--- /dev/null
+++ b/css/variables.less
@@ -0,0 +1,11 @@
+// Main site colors
+@bodyBackgroundColor: #fefefe;
+@bodyTextColor: #454545;
+
+// Link Colors
+@linkColor: #07a;
+@linkVisitedInvertedColor: #ac5a82;
+
+// Special blocks
+@blockBackgroundColor: #f6f6f6;
+@blockBorderColor: #d7d7d7;