Make adjustments for mobile

This commit is contained in:
Andrew Miner
2017-07-23 20:06:02 -07:00
parent 59217a5fea
commit c45572997f
3 changed files with 76 additions and 34 deletions
@@ -8,6 +8,7 @@
.view__crafting_table
.input_inventory
.view__inventory
.grid_block
.input_grid
.view__crafting_grid
.tool
@@ -15,9 +15,16 @@
margin-right: $size-margin-large;
}
.input_grid {
.grid_block {
flex: 1 1 100%;
display: flex;
align-items: center;
justify-content: center;
.input_grid {
flex: 0 0 auto;
align-items : center;
display : flex;
flex-direction : column;
@@ -53,6 +60,7 @@
margin-top : $size-margin-medium;
}
}
}
.output_inventory {
flex: 1 1 100%;
@@ -60,3 +68,36 @@
margin-left: $size-margin-large;
}
}
@include screen-size(mobile) {
.view__crafting_table {
border-bottom: 1px solid $color-gray-light;
padding-bottom: $size-margin-medium;
flex-direction: column;
align-items: center;
.input_inventory {
flex: 0 0 auto;
margin-bottom: $size-margin-small;
}
.grid_block {
flex: 0 0 auto;
.tool {
margin-bottom: $size-margin-medium;
}
}
.output_inventory {
flex: 0 0 auto;
margin-left: 0;
}
.view__inventory {
margin-left: $size-margin-medium;
margin-right: $size-margin-medium;
}
}
}