craftingguide/website
1
0
Fork 0
Code Pull Requests Actions Activity

Add reactive styles for Tablets

Browse Source
This commit is contained in:
Andrew Miner
2016-04-23 20:10:09 -07:00
parent 64e118a2c8
commit a8d08b93c5
13 changed files with 126 additions and 58 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/client/site/header/header.scss
+24 -10
View File
@@ -23,15 +23,25 @@
img {
position : relative;
top : -$size-minecraft-block * 0.5;
left : -$size-minecraft-block * 0.5;
height : $size-minecraft-block * 2.0;
width : $size-minecraft-block * 2.0;
height : $size-minecraft-block * 1.5;
width : $size-minecraft-block * 1.5;
@include screen-size(desktop) {
top : -$size-minecraft-block * 0.5;
left : -$size-minecraft-block * 0.5;
height : $size-minecraft-block * 2.0;
width : $size-minecraft-block * 2.0;
}
}
}
h1 {
flex: 1 1 auto;
white-space: nowrap;
@include screen-size(tablet) {
font-size: $font-size-xlarge;
}
}
.addthis_sharing_toolbox {
@@ -40,7 +50,6 @@
min-width : 144px;
margin-right : $size-margin-small;
&.placeholder {
border : 1px solid orange;
text-align : center;
@@ -62,15 +71,20 @@
align-items : center;
display : flex;
flex-wrap : wrap;
justify-content : space-around;
justify-content : center;
padding : $size-margin-medium $size-margin-medium;
padding-top : 0;
.button {
flex : 1 1 20%;
min-width : 4 * $size-minecraft-block;
max-width : 5 * $size-minecraft-block;
margin-top: $size-margin-medium;
flex : 1 1 calc(20% - 8px);
min-width : 3 * $size-minecraft-block;
max-width : 5 * $size-minecraft-block;
margin-top : $size-margin-medium;
margin-right : $size-margin-small;
&:last-child {
margin-right: 0;
}
}
}