SCSS -> SASS

This commit is contained in:
Felipe M 2016-12-19 10:24:08 +01:00
parent 6d58962e08
commit abd9c07ac8
13 changed files with 134 additions and 140 deletions

View file

@ -1,19 +1,17 @@
body.blog
&.post
article
h1
font-size: 1.8em
margin-bottom: 0.3em
article.blog-post
h1
font-size: 1.8em
margin-bottom: 0.3em
.info
font-size: 0.9em
.info
font-size: 0.9em
.content
margin-top: 1em
.content
margin-top: 1em
img
display: block
margin: 0 auto
img
display: block
margin: 0 auto
img
box-shadow: 0 1px 3px rgba(0,0,0,0.2)
img
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2)

View file

@ -0,0 +1,43 @@
*
+box-sizing(border-box)
$pad: 20px
.grid
background: white
margin: 0 0 $pad 0
&:after
/* Or @extend clearfix
content: ""
display: table
clear: both
[class*='col-']
float: left
padding-right: $pad
.grid &:last-of-type
padding-right: 0
.col-2-3
width: 66.66%
.col-1-3
width: 33.33%
.col-1-2
width: 50%
.col-1-4
width: 25%
.col-1-8
width: 12.5%
/* Opt-in outside padding
.grid-pad
padding: $pad 0 $pad $pad
[class*='col-']:last-of-type
padding-right: $pad

View file

@ -1,48 +0,0 @@
* {
@include box-sizing(border-box);
}
$pad: 20px;
.grid {
background: white;
margin: 0 0 $pad 0;
&:after {
/* Or @extend clearfix */
content: "";
display: table;
clear: both;
}
}
[class*='col-'] {
float: left;
padding-right: $pad;
.grid &:last-of-type {
padding-right: 0;
}
}
.col-2-3 {
width: 66.66%;
}
.col-1-3 {
width: 33.33%;
}
.col-1-2 {
width: 50%;
}
.col-1-4 {
width: 25%;
}
.col-1-8 {
width: 12.5%;
}
/* Opt-in outside padding */
.grid-pad {
padding: $pad 0 $pad $pad;
[class*='col-']:last-of-type {
padding-right: $pad;
}
}

View file

@ -0,0 +1,50 @@
body
font-family: "Antic Slab"
font-size: 20px
line-height: 1.5em
.center
margin: 0 auto
max-width: 920px
a
text-decoration: underilne
color: #c24e4a
img max-width: 100%
header
h1
font-size: 1.5em
margin-bottom: 0
text-align: right
h2
font-size: 0.8em
font-weight: normal
margin-top: 0
display: none
nav.main-menu
text-align: right
footer
font-size: 0.7em
padding-top: 1em
hr.light
border: 0px
margin: 1em 0 1em 0
border-top: #CCC 1px solid
p:first-child
margin-top: 0
.text-center
text-align: center
.text-right
text-align: right
.float-right
float: right

View file

@ -1,57 +0,0 @@
body {
font-family: 'Antic Slab';
font-size: 20px;
line-height: 1.5em
}
.center {
margin: 0 auto;
max-width: 920px;
}
a {
text-decoration: underilne;
//color: inherit !important;
color: #c24e4a;
//color: #3da3b7;
}
img { max-width: 100%; }
header {
h1 { margin-bottom: 0; font-size: 1.5em; text-align: right; }
h2 {
font-size: 0.8em;
font-weight: normal;
margin-top: 0;
display: none;
}
}
nav.main-menu {
text-align: right;
}
footer {
font-size: 0.7em;
padding-top: 1em;
}
hr.light {
border: 0px;
margin: 1em 0 1em 0;
border-top: #CCC 1px solid;
}
p:first-child {
margin-top: 0;
}
.text-center {
text-align: center;
}
.float-right {
float: right;
}

View file

@ -0,0 +1,6 @@
$desktop: "(max-width: 992px)"
$until-desktop: "(min-width: 768px)"
$tablet: "(max-width: 768px)"
$until-tablet: "(min-width: 768px)"
$mobile: "(max-width: 480px)"
$until-mobile: "(min-width: 480px)"

View file

@ -1,6 +0,0 @@
$desktop: "(max-width: 992px)";
$until-desktop: "(min-width: 768px)";
$tablet: "(max-width: 768px)";
$until-tablet: "(min-width: 768px)";
$mobile: "(max-width: 480px)";
$until-mobile: "(min-width: 480px)";

View file

@ -0,0 +1,4 @@
=box-sizing($type)
-webkit-box-sizing: $type
-moz-box-sizing: $type
box-sizing: $type

View file

@ -1,5 +0,0 @@
@mixin box-sizing($type) {
-webkit-box-sizing: $type;
-moz-box-sizing: $type;
box-sizing: $type;
}

View file

@ -0,0 +1,7 @@
@import ./mediaqueries
@import ./mixins
@import ./grid
@import ./layout
@import ./blog
@import ./table
@import ./syntax

View file

@ -1,7 +0,0 @@
@import "./mediaqueries";
@import "./mixins";
@import "./grid";
@import "./layout";
@import "./blog";
@import "./table";
@import "./syntax";

View file

@ -8,6 +8,8 @@ improvements to the workstation that made my life easier.
After other two weeks I will post a summary with the good and bad parts.
<!-- readmore -->
## Stuff fixed
### Lightdm black screen

View file

@ -1,11 +1,18 @@
{% macro render_blog_post(post, from_index=false) %}
<article class="center">
{% set summary = post.body.html.split('<!-- readmore -->') %}
<article class="blog-post center">
<h1><a href="{{ post|url }}">{{ post.title }}</a></h1>
<div class="info">
Published on {{ post.pub_date }} with <a href="#">no comments.</a>
</div>
<div class="content">
{{ post.body }}
{% if from_index and summary|length > 1 %}
{{ summary[0] }}
<p class="text-right"><a href="{{ post|url }}">Read more</a></p>
{% else %}
{{ post.body }}
{% endif %}
</div>
<hr class="light">
</article>
{% endmacro %}