joshua/dash-website
1
0
Fork 0
mirror of https://github.com/seigler/dash-website synced 2025-07-28 15:36:09 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

[Update] Post: Style related posts for smaller viewports

Browse source
This commit is contained in:
0xfff 2016-11-05 17:03:31 +01:00
parent f167fef8d6
commit 3173f4d360
3 changed files with 45 additions and 10 deletions
Download patch file Download diff file Expand all files Collapse all files

2
src/scss/_featurepost.scss
View file

@ -61,7 +61,7 @@ $m: 'featurepost';
margin: 0 pxToRem(-20px);
.featurepost {
display: block;
display: block;
width: 100%;
@include mq($from: small) {

44
src/scss/_section.scss
View file

@ -65,22 +65,56 @@ $m: 'section';
&--post {
.#{$m} {
&__sidebar {
display: inline-block;
width: 30%;
vertical-align: top;
padding-left: pxToRem(40px);
display: block;
width: 100%;
margin-top: pxToRem(120px);
margin-left: pxToRem(-20px);
margin-right: pxToRem(-20px);
.featurepost {
max-width: 100%;
@include mq($from: small, $to: medium) {
width: 49%;
}
margin-bottom: pxToReM(60px);
@include mq($to: medium) {
&__preview {
display: block;
height: 1px;
}
}
}
&-title {
@include font-claim();
text-align: center;
margin-bottom: pxToRem(40px);
@include mq($from: medium) {
@include visuallyhidden();
}
}
@include mq($from: medium) {
display: inline-block;
width: 30%;
vertical-align: top;
margin: 0;
padding-left: pxToRem(40px);
}
}
&__main {
display: inline-block;
width: 69%;
vertical-align: top;
@include mq($to: medium) {
width: 100%;
}
}
}
}