Modify utility grid classes to be mobile first responsive
Also added minor utility functions.
This commit is contained in:
parent
7462765a84
commit
2c617eec9c
@ -134,6 +134,13 @@ html {
|
||||
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 */
|
||||
.grid-container.fifths {
|
||||
grid-template-columns: repeat(5, 1fr);
|
||||
@ -151,15 +158,14 @@ html {
|
||||
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
|
||||
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
||||
html {
|
||||
@ -417,6 +423,10 @@ form {
|
||||
float: right; }
|
||||
.u-pull-left {
|
||||
float: left; }
|
||||
.u-align-left {
|
||||
text-align: left; }
|
||||
.u-align-right {
|
||||
text-align: right; }
|
||||
|
||||
|
||||
/* Misc
|
||||
|
Loading…
Reference in New Issue
Block a user