diff --git a/_includes/head.html b/_includes/head.html index ac72089..e5e5c1e 100644 --- a/_includes/head.html +++ b/_includes/head.html @@ -11,6 +11,7 @@ + diff --git a/_sass/_base.scss b/_sass/_base.scss index deb3290..18016f3 100644 --- a/_sass/_base.scss +++ b/_sass/_base.scss @@ -8,25 +8,6 @@ dl, dd, ol, ul, figure { padding: 0; } - - -/** - * Basic styling - */ - /* -body { - font-family: $base-font-family; - font-size: $base-font-size; - line-height: $base-line-height; - font-weight: 300; - color: $text-color; - background-color: $background-color; - -webkit-text-size-adjust: 100%; -} -*/ - - - /** * Set `margin-bottom` to maintain vertical rhythm */ @@ -37,77 +18,6 @@ ul, ol, dl, figure, margin-bottom: $spacing-unit / 2; } - - -/** - * Images - */ -img { - max-width: 100%; - vertical-align: middle; -} - - - -/** - * Figures - */ -figure > img { - display: block; -} - -figcaption { - font-size: $small-font-size; -} - - - -/** - * Lists - */ -ul, ol { - margin-left: $spacing-unit; -} - -li { - > ul, - > ol { - margin-bottom: 0; - } -} - - - -/** - * Headings - */ -h1, h2, h3, h4, h5, h6 { - font-weight: 300; -} - - - -/** - * Links - */ - /* -a { - color: $brand-color; - text-decoration: none; - - &:visited { - color: darken($brand-color, 15%); - } - - &:hover { - color: $text-color; - text-decoration: underline; - } -} -*/ - - - /** * Blockquotes */ @@ -124,8 +34,6 @@ blockquote { } } - - /** * Code formatting */ @@ -152,30 +60,6 @@ pre { } } - - -/** - * Wrapper - */ -.wrapper { - max-width: -webkit-calc(#{$content-width} - (#{$spacing-unit} * 2)); - max-width: calc(#{$content-width} - (#{$spacing-unit} * 2)); - margin-right: auto; - margin-left: auto; - padding-right: $spacing-unit; - padding-left: $spacing-unit; - @extend %clearfix; - - @include media-query($on-laptop) { - max-width: -webkit-calc(#{$content-width} - (#{$spacing-unit})); - max-width: calc(#{$content-width} - (#{$spacing-unit})); - padding-right: $spacing-unit / 2; - padding-left: $spacing-unit / 2; - } -} - - - /** * Clearfix */ @@ -188,8 +72,6 @@ pre { } } - - /** * Icons */ @@ -205,4 +87,4 @@ pre { fill: $grey-color; } } -} +} \ No newline at end of file diff --git a/_sass/_layout.scss b/_sass/_layout.scss index 422b83d..79a499e 100644 --- a/_sass/_layout.scss +++ b/_sass/_layout.scss @@ -1,8 +1,16 @@ +// +// Generals styles for material design light elements +// + +// Page container + .page-content{ max-width: 1200px; margin: 0 auto; } +// Cards styles + .mdl-card__title { color: #fff; height: 176px; @@ -19,6 +27,8 @@ bottom: 25px; } +// Index highlight card + .section-highlight { position: relative; margin: 10px; diff --git a/_sass/_post.scss b/_sass/_post.scss index b4ff31f..a89accd 100644 --- a/_sass/_post.scss +++ b/_sass/_post.scss @@ -1,3 +1,7 @@ +// +// Styles for post +// + .post-ribbon { width: 100%; height: 40vh; @@ -25,5 +29,4 @@ } } - } diff --git a/css/main.scss b/css/main.scss index f576892..bc70726 100755 --- a/css/main.scss +++ b/css/main.scss @@ -1,48 +1,20 @@ --- # Only the main Sass file needs front matter (the dashes are enough) --- +// +// Main sass file, to import all styles +// + @charset "utf-8"; - - -// Our variables -$base-font-family: Helvetica, Arial, sans-serif; -$base-font-size: 16px; -$small-font-size: $base-font-size * 0.875; -$base-line-height: 1.5; - $spacing-unit: 30px; - $text-color: #111; $background-color: #fdfdfd; $brand-color: #2a7ae2; - $grey-color: #828282; $grey-color-light: lighten($grey-color, 40%); $grey-color-dark: darken($grey-color, 25%); -// Width of the content area -$content-width: 800px; - -$on-palm: 600px; -$on-laptop: 800px; - - - -// Using media queries with like this: -// @include media-query($on-palm) { -// .wrapper { -// padding-right: $spacing-unit / 2; -// padding-left: $spacing-unit / 2; -// } -// } -@mixin media-query($device) { - @media screen and (max-width: $device) { - @content; - } -} - - // Import partials from `sass_dir` (defaults to `_sass`) @import