diff options
Diffstat (limited to 'assets/scss')
-rw-r--r-- | assets/scss/style.scss | 183 |
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"; +} |