4 files changed, 30 insertions, 39 deletions
diff --git a/theme/admin/rsrc/css/dark.css b/theme/admin/rsrc/css/dark.css
index 1477bac..ece8bba 100644
--- a/theme/admin/rsrc/css/dark.css
+++ b/theme/admin/rsrc/css/dark.css
@@ -456,7 +456,7 @@ img {
 .item-container.grid {
   width: 100%;
   display: grid;
-  grid-template-columns: auto auto auto;
+  grid-template-columns: 1fr 1fr 1fr;
   grid-column-gap: 1rem;
   grid-row-gap: 1rem;
   column-gap: 1rem;
@@ -498,12 +498,12 @@ img {
 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
 .form-grid {
   display: grid;
-  grid-template-columns: 8rem auto 8rem auto;
+  grid-template-columns: repeat(2, 7.5rem minmax(0, 1fr));
   border-left: 0.05rem solid #1D232B;
   border-bottom: 0.05rem solid #1D232B;
 }
 .form-grid.two-columns {
-  grid-template-columns: auto auto;
+  grid-template-columns: 1fr 2fr;
 }
 .form-grid.no-bottom-border {
   border-bottom: none;
@@ -514,8 +514,7 @@ img {
   background: #4D535B;
 }
 .form-grid > label .fa {
-  margin-left: 0.5rem;
-  margin-right: 1rem;
+  margin: 0 0.5rem;
 }
 .form-grid-item,
 .form-grid > label {
@@ -524,8 +523,7 @@ img {
   border-right: 0.05rem solid #1D232B;
 }
 .form-grid-item.first {
-  grid-column-start: 2;
-  grid-column-end: 5;
+  grid-column: span 3;
 }
 
 .form-border-box {
@@ -697,7 +695,7 @@ label:after {
 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
 @media only screen and (max-width: 90em) {
   .item-container.grid {
-    grid-template-columns: auto auto;
+    grid-template-columns: 1fr 1fr;
   }
 }
 @media only screen and (min-width: 62.5em) {
@@ -709,7 +707,7 @@ label:after {
 }
 @media only screen and (max-width: 62.5em) {
   .item-container.grid {
-    grid-template-columns: auto;
+    grid-template-columns: 1fr;
   }
 }
 @media only screen and (max-width: 50em) {
@@ -748,11 +746,10 @@ label:after {
   }
 
   .form-grid {
-    grid-template-columns: auto auto;
+    grid-template-columns: 7rem 1fr;
   }
-  .form-grid-item.first {
-    grid-column-start: 2;
-    grid-column-end: 3;
+  .form-grid-item, .form-grid-item.first, .form-grid label {
+    grid-column: unset;
   }
 
   .actions {
diff --git a/theme/admin/rsrc/css/import/_responsive.scss b/theme/admin/rsrc/css/import/_responsive.scss
index f6e0b5a..9675071 100644
--- a/theme/admin/rsrc/css/import/_responsive.scss
+++ b/theme/admin/rsrc/css/import/_responsive.scss
@@ -1,6 +1,6 @@
 @media only screen and (max-width: 90em /*1440px*/) {
 	.item-container.grid {
-		grid-template-columns: auto auto;
+		grid-template-columns: 1fr 1fr;
 	}
 }
 
@@ -14,7 +14,7 @@
 
 @media only screen and (max-width: 62.5em /*1000px*/) {
 	.item-container.grid {
-		grid-template-columns: auto;
+		grid-template-columns: 1fr;
 	}
 }
 
@@ -61,11 +61,10 @@
 	}
 
 	.form-grid {
-		grid-template-columns: auto auto;
+		grid-template-columns: 7rem 1fr;
 
-		&-item.first {
-			grid-column-start: 2;
-			grid-column-end: 3;
+		&-item, &-item.first, label {
+			grid-column: unset;
 		}
 	}
 
diff --git a/theme/admin/rsrc/css/import/_styles.scss b/theme/admin/rsrc/css/import/_styles.scss
index 0462a20..88ef8b4 100644
--- a/theme/admin/rsrc/css/import/_styles.scss
+++ b/theme/admin/rsrc/css/import/_styles.scss
@@ -472,7 +472,7 @@ img {
 	&-container.grid {
 		width: 100%;
 		display: grid;
-		grid-template-columns: auto auto auto;
+		grid-template-columns: 1fr 1fr 1fr;
 		grid-column-gap: 1rem;
 		grid-row-gap: 1rem;
 		column-gap: 1rem;
@@ -520,13 +520,13 @@ img {
 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
 .form-grid {
 	display: grid;
-	grid-template-columns: 8rem auto 8rem auto;
+	grid-template-columns: repeat(2, 7.5rem minmax(0, 1fr));
 
 	border-left: 0.05rem solid $borderColor;
 	border-bottom: 0.05rem solid $borderColor;
 
 	&.two-columns {
-		grid-template-columns: auto auto;
+		grid-template-columns: 1fr 2fr;
 	}
 
 	&.no-bottom-border {
@@ -539,8 +539,7 @@ img {
 		background: $formBackgroundColorEmphasize;
 
 		.fa {
-			margin-left: 0.5rem;
-			margin-right: 1rem;
+			margin: 0 0.5rem;
 		}
 	}
 
@@ -552,8 +551,7 @@ img {
 	}
 
 	&-item.first {
-		grid-column-start: 2;
-		grid-column-end: 5;
+		grid-column: span 3;
 	}
 }
 
diff --git a/theme/admin/rsrc/css/main.css b/theme/admin/rsrc/css/main.css
index c1fbc29..95fce4b 100644
--- a/theme/admin/rsrc/css/main.css
+++ b/theme/admin/rsrc/css/main.css
@@ -456,7 +456,7 @@ img {
 .item-container.grid {
   width: 100%;
   display: grid;
-  grid-template-columns: auto auto auto;
+  grid-template-columns: 1fr 1fr 1fr;
   grid-column-gap: 1rem;
   grid-row-gap: 1rem;
   column-gap: 1rem;
@@ -498,12 +498,12 @@ img {
 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
 .form-grid {
   display: grid;
-  grid-template-columns: 8rem auto 8rem auto;
+  grid-template-columns: repeat(2, 7.5rem minmax(0, 1fr));
   border-left: 0.05rem solid #AAA;
   border-bottom: 0.05rem solid #AAA;
 }
 .form-grid.two-columns {
-  grid-template-columns: auto auto;
+  grid-template-columns: 1fr 2fr;
 }
 .form-grid.no-bottom-border {
   border-bottom: none;
@@ -514,8 +514,7 @@ img {
   background: #DDD;
 }
 .form-grid > label .fa {
-  margin-left: 0.5rem;
-  margin-right: 1rem;
+  margin: 0 0.5rem;
 }
 .form-grid-item,
 .form-grid > label {
@@ -524,8 +523,7 @@ img {
   border-right: 0.05rem solid #AAA;
 }
 .form-grid-item.first {
-  grid-column-start: 2;
-  grid-column-end: 5;
+  grid-column: span 3;
 }
 
 .form-border-box {
@@ -697,7 +695,7 @@ label:after {
 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
 @media only screen and (max-width: 90em) {
   .item-container.grid {
-    grid-template-columns: auto auto;
+    grid-template-columns: 1fr 1fr;
   }
 }
 @media only screen and (min-width: 62.5em) {
@@ -709,7 +707,7 @@ label:after {
 }
 @media only screen and (max-width: 62.5em) {
   .item-container.grid {
-    grid-template-columns: auto;
+    grid-template-columns: 1fr;
   }
 }
 @media only screen and (max-width: 50em) {
@@ -748,11 +746,10 @@ label:after {
   }
 
   .form-grid {
-    grid-template-columns: auto auto;
+    grid-template-columns: 7rem 1fr;
   }
-  .form-grid-item.first {
-    grid-column-start: 2;
-    grid-column-end: 3;
+  .form-grid-item, .form-grid-item.first, .form-grid label {
+    grid-column: unset;
   }
 
   .actions {