Initial Commit

sass/_base.scss

@@ -0,0 +1,131 @@
+$light-fonts: "Fira Sans Light", sans-serif;
+$normal-fonts: "Fira Sans", sans-serif;
+$page-width: 800px;
+$primary-color: #333;
+$bg-color: #eee;
+$page-color: #ddd;
+$header-bg: #1d3c67;
+$header-fg: #ffffff;
+$link-color: #33f;
+$link-hover: #00d;
+$menu-bg: #231d67;
+$menu-fg: #e8e9f3;
+$menu_btn-selected: #1d6167;
+$menu_btn-size: 10px;
+
+html {
+  background-color: $page-color;
+}
+@media only screen and (min-width: $page-width){
+    html {
+        padding:10px;
+    }
+}
+@font-face {
+    font-family: "Fira Sans Light";
+    font-style: normal;
+    font-weight: 300;
+    src: local("Fira Sans Light"), local("FiraSans-Light"), url("fonts/Fira Sans Light.woff2") format("woff2");
+}
+@font-face {
+    font-family: "Fira Sans";
+    font-style: normal;
+    font-weight: 400;
+    src: local("Fira Sans"), local("FiraSans-Regular"), url("fonts/Fira Sans.woff2") format("woff2");
+}
+body {
+    max-width: $page-width;
+    margin: auto;
+    font-family: $light-fonts;
+    background-color: $bg-color;
+}
+header {
+  height: 150px;
+  background-color: $header-bg;
+  background-size: cover;
+  background-repeat: no-repeat;
+  background-position: center center;
+  display: flex;
+  align-items: center;
+  padding: 10px;
+  .date, h1 {
+    color: $header-fg;
+    text-shadow: black 0px 0px 0.1em;
+  }
+}
+h1 {
+  font-size: 28pt;
+}
+h2 {
+  font-size: 22pt;
+}
+h3 {
+  font-size: 18pt;
+}
+p, h1, h2, h3, pre {
+  padding: 0px 10px 3px 10px;
+}
+p, ul {
+  font-size: 14pt;
+  color: $primary-color;
+}
+p {
+  text-align: justify;
+}
+footer {
+  font-size: 8pt;
+  text-align: center;
+  color: #555;
+  padding: 10px;
+}
+footer a,
+footer a:visited {
+  color: #66f;
+}
+a,
+a:visited {
+  font-family: $light-fonts;
+  text-decoration: none;
+  color: $link-color;
+}
+a:hover{
+  text-decoration: underline;
+  color: $link-hover;
+}
+li {
+  list-style-type: circle;
+  margin-bottom: 4pt;
+}
+nav {
+  display: flex;
+  background-color: $menu-bg;
+  menu {
+    padding: 0px;
+    display:block;
+    margin: 0px;
+    width: 100%;
+  }
+  li {
+    a {
+      padding: $menu_btn-size;
+      text-shadow: black 0px 0px 0.1em;
+      font-family: $normal-fonts;
+      font-weight: 900;
+    }
+    a, a:hover {
+      color: $menu-fg;
+    }
+    a:hover {
+      background-color: $menu_btn-selected;
+      text-decoration: none;
+    }
+    a.nav_selected {
+      background-color: $menu_btn-selected;
+    }
+    font-size: 14pt;
+    margin: 0px;
+    padding: $menu_btn-size 0px $menu_btn-size 0px;
+    list-style-type: none;
+    float: left;
+  }
+}

sass/style.scss

@@ -0,0 +1 @@
+@use "base";