BitGoblin/Bones
1
0
Fork 0
Code Issues 5 Pull Requests Packages Projects Releases Wiki Activity

Modify utility grid classes to be mobile first responsive

Browse Source 
Also added minor utility functions.
This commit is contained in:
Steve
2019-01-26 16:31:27 -05:00
parent 7462765a84
commit 2c617eec9c
1 changed files with 27 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
css/barebones.css
View File

@@ -134,6 +134,13 @@ html {
grid-template-columns: minmax(200px, 1fr); grid-template-columns: minmax(200px, 1fr);
} }
/* grids to 3 columns above mobile sizes */
@media (min-width: 600px) {
.grid-container {
grid-template-columns: repeat(3, 1fr);
padding: 10px 0;
}
/* basic grids */ /* basic grids */
.grid-container.fifths { .grid-container.fifths {
grid-template-columns: repeat(5, 1fr); grid-template-columns: repeat(5, 1fr);
@@ -151,15 +158,14 @@ html {
grid-template-columns: 1fr; grid-template-columns: 1fr;
} }
/* grids to 3 columns above mobile sizes */
@media (min-width: 600px) {
.grid-container {
grid-template-columns: repeat(3, 1fr);
padding: 10px 0;
}
} }
/* Base Styles /* Base Styles
–––––––––––––––––––––––––––––––––––––––––––––––––– */ –––––––––––––––––––––––––––––––––––––––––––––––––– */
html { html {
@@ -417,6 +423,10 @@ form {
float: right; } float: right; }
.u-pull-left { .u-pull-left {
float: left; } float: left; }
.u-align-left {
text-align: left; }
.u-align-right {
text-align: right; }
/* Misc /* Misc