Add webassets project
Webassets enables SCSS compilation and asset minification
The pelican-assets plugin was added to integrate it into Pelican
diff --git a/static/css/style.scss b/static/css/style.scss
new file mode 100644
index 0000000..c5eacd5
--- /dev/null
+++ b/static/css/style.scss
@@ -0,0 +1,355 @@
+@charset "UTF-8";
+
+$black: #000000;
+$white: #ffffff;
+$light-grey: #eeeeee;
+$med-grey: #5f5f5f;
+$dark-grey: #202020;
+
+$code-border: #c7c7c7;
+$code-background: #f6f6f6;
+$code-linebg: #dddddd;
+
+$blue: #0e94ec;
+$accent: $blue;
+
+@import url("//fonts.googleapis.com/css?family=Ubuntu|Ubuntu+Mono");
+$sans: 'Ubuntu', sans-serif;
+$mono: 'Ubuntu Mono', monospace;
+
+$border_color: #c2c2c2;
+$pag_label_size: 60px;
+$logo_size: 150px;
+
+$content_size: 640px;
+$horiz_pad: 40px;
+
+//The minimum size the screen can be without scaling the main content
+$min_screen: floor((($content_size + $horiz_pad * 2) * 1.33));
+
+body {
+ margin: 0;
+ padding: 0;
+ background-color: $white;
+ color: $dark-grey;
+ font-family: $sans;
+ font-size: 16px;
+ min-width: 300px;
+}
+
+a {
+ color: $black;
+ text-decoration: none;
+}
+
+a[href]:not(.nohover) {
+ &:hover{
+ color: $accent;
+ }
+}
+
+hr {
+ background-color: $border_color;
+ height: 1px;
+ border: none;
+}
+
+aside {
+ div#user_meta {
+ padding: $horiz_pad 20px $horiz_pad 20px;
+ text-align: center;
+
+ img#logo {
+ width: $logo_size;
+ height: $logo_size;
+ border-radius: 50%;
+ }
+
+ h2 {
+ margin: 15px 0 5px 0;
+ }
+
+ p {
+ margin: 0px;
+ font-size: 14px;
+ }
+
+ i {
+ width: 30px;
+ text-align: center;
+ vertical-align: middle;
+ }
+
+ div.social {
+ margin-top:15px;
+
+ a {
+ display: inline-block;
+ height: 30px;
+ }
+ }
+
+ ul {
+ margin: 0px;
+ padding-left: 0px;
+ font-size: 16px;
+ list-style-type: none;
+
+ li {
+ line-height: 2em;
+
+ a {
+ i {
+ padding-left: 5px;
+ }
+ }
+ }
+ }
+ }
+}
+
+main {
+ position: relative;
+ width: 100%;
+ margin: auto;
+
+ header {
+ padding: 0px $horiz_pad 0px $horiz_pad;
+ border-top: $border_color 1px solid;
+ border-bottom: $border_color 1px solid;
+ text-align: center;
+ color: $med-grey;
+
+ p {
+ font-weight: bold;
+ font-size: 16px;
+ text-transform: uppercase;
+ }
+
+ p#header {
+ color: $black;
+ }
+
+ p:not(#header){
+ a {
+ color: $med-grey;
+ &:hover{
+ color: $accent;
+ }
+ }
+ }
+ }
+
+ article {
+ padding: 10px $horiz_pad 10px $horiz_pad;
+ max-width: $content_size;
+ margin: auto;
+
+ div.article_title {
+ }
+
+ div.article_text {
+ line-height: 1.375em;
+ a {
+ text-decoration: underline;
+ }
+
+ @mixin codeformat {
+ color: black;
+ font-size: 14px;
+ font-family: $mono;
+ }
+
+ code {
+ @include codeformat;
+ padding: 2px 3px;
+ background: $light-grey;
+ }
+
+ pre {
+ @include codeformat;
+ line-height: 1.125em;
+ margin-bottom: 0px;
+ margin-top: 0px;
+ padding-top: 5px;
+ padding-bottom: 10px;
+ }
+
+ div.highlight pre {
+ padding-left: 10px;
+ overflow-x: auto;
+ border: 1px solid $code-border;
+ border-left: 3px solid $accent;
+ background: $code-background;
+ }
+
+ /* Line numbers are enabled*/
+ table.highlighttable {
+ table-layout: fixed;
+ width: 100%;
+ border: 1px solid $code-border;
+ border-collapse: collapse;
+
+ pre {
+ border: none;
+ }
+
+ td {
+ padding: 0px;
+ }
+
+ td.linenos {
+ width: 30px;
+ overflow: hidden;
+ text-align: right;
+ border-left: 3px solid $accent;
+ border-right: 1px solid $code-border;
+ background: $code-linebg;
+ vertical-align:top;
+
+ div.linenodiv pre {
+ padding-right: 4px;
+ float: right;
+ }
+ }
+ }
+
+ div.admonition {
+
+ border-width: 1px 1px 1px 7px;
+ border-radius: 10px;
+ border-style: solid;
+ border-color: $code-border;
+ border-left-color: $dark-grey;
+ background-color: $code-background;
+
+ &.update, &.hint, &.important, &.note, &.tip {
+ border-left-color: $accent;
+ }
+
+ &.warning, &.attention, &.caution, &.danger {
+ border-left-color: red;
+ }
+
+ p {
+ margin: 0px;
+ padding: 10px 15px;
+ }
+
+ p.admonition-title{
+ text-transform: uppercase;
+ font-weight: bold;
+ padding: 5px 15px;
+ border-bottom: 1px solid $code-border;
+ }
+ }
+
+ blockquote {
+ margin: 22px 2px 22px 2px;
+ padding-left: $horiz_pad;
+ color: $med-grey;
+ font-style: italic;
+ }
+ }
+
+ div.article_meta {
+ font-size: 12px;
+ color: $med-grey;
+ }
+
+ div#article_comments{
+ padding-top: 10px;
+ padding-bottom: 10px;
+
+ i {
+ padding-right: 10px;
+ }
+ }
+ }
+
+ footer {
+ border-top: $border_color 1px solid;
+ padding: 30px $horiz_pad 30px $horiz_pad;
+
+ div#paginator {
+ font-weight: bold;
+ font-size: 15px;
+ text-transform: uppercase;
+ overflow: auto;
+ text-align: center;
+
+ div{
+ display: inline-block;
+ }
+
+ span {
+ width: $pag_label_size;
+ }
+
+ span#left {
+ float: left;
+ text-align: left;
+ }
+
+ span#right {
+ float: right;
+ text-align: right;
+ }
+ }
+ }
+
+ div#ending_message {
+ border-top: $border_color 1px solid;
+ padding: 0 $horiz_pad 0 $horiz_pad;
+ color: $med-grey;
+ font-size: 10px;
+ }
+}
+
+@media screen and (min-width: $min_screen) {
+ aside {
+ width: 25%;
+ height: 100%;
+ position: absolute;
+ top: 0;
+ left: 0;
+
+ h2 {
+ margin: 10px 0 0 0;
+ }
+
+ div#user_meta {
+ max-width: 192px;
+ text-align: right;
+ margin: 0 20px 0 auto;
+ }
+ }
+
+ main {
+ position: absolute;
+ top: 0;
+ left: 25%;
+ width: 75%;
+ margin-left: -1px;
+ border-left: $border_color 1px solid;
+ overflow-x: hidden;
+ overflow-y: hidden;
+
+ header {
+ padding: 10px $horiz_pad 10px $horiz_pad;
+ border-top: 0;
+ text-align: left;
+ }
+
+ article {
+ width: $content_size;
+ margin: 0;
+ }
+
+ footer{
+ div#paginator {
+ width: $content_size;
+ }
+ }
+ }
+}