Modify utility grid classes to be mobile first responsive

Also added minor utility functions.
This commit is contained in:
Steve 2019-01-26 16:31:27 -05:00
parent 7462765a84
commit 2c617eec9c

View File

@ -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