Import new minimalist design

1 files changed, 183 insertions, 0 deletions

diff --git a/assets/scss/style.scss b/assets/scss/style.scss
new file mode 100644
index 0000000..98afe53
--- /dev/null
+++ b/assets/scss/style.scss
@@ -0,0 +1,183 @@
+@import "node_modules/tachyons-sass/tachyons.scss";
+
+div.highlight pre {
+  overflow-x: scroll;
+}
+
+.header ul {
+  clear: both;
+  max-height: 0;
+  transition: max-height 0.2s ease-out;
+}
+
+/* menu icon */
+
+.header .menu-icon .navicon {
+  display: block;
+  height: 2px;
+  position: relative;
+  transition: background 0.2s ease-out;
+  width: 18px;
+}
+
+.header .menu-icon .navicon:before,
+.header .menu-icon .navicon:after {
+  background: #ebdbb2;
+  content: "";
+  display: block;
+  height: 100%;
+  position: absolute;
+  transition: all 0.2s ease-out;
+  width: 100%;
+}
+
+.header .menu-icon .navicon:before {
+  top: 6px;
+}
+
+.header .menu-icon .navicon:after {
+  top: -6px;
+}
+
+/* menu btn */
+.header .menu-btn:checked ~ .menu-icon {
+  .navicon {
+    background: transparent;
+  }
+  .navicon:before {
+    transform: rotate(-45deg);
+  }
+  .navicon:after {
+    transform: rotate(45deg);
+  }
+}
+
+.header .menu-btn:checked ~ .menu-icon:not(.steps) {
+  .navicon:before,
+  .navicon:after {
+    top: 0;
+  }
+}
+
+.header .menu-btn:checked ~ ul {
+  max-height: 240px;
+}
+
+@media screen and (min-width: 30em) {
+  .header ul {
+    clear: none;
+    float: right;
+    max-height: none;
+  }
+}
+
+.w3-theme-l5 {
+  color: #000 !important;
+  background-color: #f7fcf5 !important;
+}
+.w3-theme-l4 {
+  color: #000 !important;
+  background-color: #e4f4dc !important;
+}
+.w3-theme-l3 {
+  color: #000 !important;
+  background-color: #c9e9ba !important;
+}
+.w3-theme-l2 {
+  color: #000 !important;
+  background-color: #aedd97 !important;
+}
+.w3-theme-l1 {
+  color: #000 !important;
+  background-color: #94d274 !important;
+}
+.w3-theme-d1 {
+  color: #fff !important;
+  background-color: #69bf3e !important;
+}
+.w3-theme-d2 {
+  color: #fff !important;
+  background-color: #5da937 !important;
+}
+.w3-theme-d3 {
+  color: #fff !important;
+  background-color: #519430 !important;
+}
+.w3-theme-d4 {
+  color: #fff !important;
+  background-color: #467f29 !important;
+}
+.w3-theme-d5 {
+  color: #fff !important;
+  background-color: #3a6a22 !important;
+}
+
+.w3-theme-light {
+  color: #000 !important;
+  background-color: #f7fcf5 !important;
+}
+.w3-theme-dark {
+  color: #fff !important;
+  background-color: #3a6a22 !important;
+}
+.w3-theme-action {
+  color: #fff !important;
+  background-color: #3a6a22 !important;
+}
+
+.w3-theme {
+  color: #fff !important;
+  background-color: #79c753 !important;
+}
+.w3-text-theme {
+  color: #79c753 !important;
+}
+.w3-theme-border {
+  border-color: #79c753 !important;
+}
+.w3-hover-theme:hover {
+  color: #fff !important;
+  background-color: #79c753 !important;
+}
+
+blockquote {
+  @extend .bl, .bw2, .w3-theme-border, .pl2;
+}
+
+// POSTS
+.main-content,
+footer {
+  a {
+    @extend .link, .light-gray, .underline;
+  }
+
+  p code {
+    @extend .bg-black-30, .pa1;
+  }
+}
+// Projects status feed
+.status-feed {
+  dt {
+    @extend .b;
+  }
+  dd a {
+    @extend .link, .w3-theme-d2, .pa1, .br3;
+  }
+}
+
+// Title font
+@font-face {
+  font-family: "BerkshireSwash-Regular";
+  src: url("/css/fonts/BerkshireSwash-Regular.ttf.woff") format("woff"),
+    url("/css/fonts/BerkshireSwash-Regular.ttf.svg#BerkshireSwash-Regular")
+      format("svg"),
+    url("/css/fonts/BerkshireSwash-Regular.ttf.eot"),
+    url("/css/fonts/BerkshireSwash-Regular.ttf.eot?#iefix")
+      format("embedded-opentype");
+  font-weight: normal;
+  font-style: normal;
+}
+
+.berkshire-swash {
+  font-family: "BerkshireSwash-Regular";
+}