Add mobile first styling

jchlu · Dec 24, 2017 · 2776461 · 2776461
1 parent 1034014
commit 2776461
Showing 1 changed file with 12 additions and 1 deletion.
diff --git a/src/styles/components/_add-option.scss b/src/styles/components/_add-option.scss
@@ -1,5 +1,6 @@
 .add-option {
   display: flex;
+  flex-direction: column;
   padding: $m-size;
 }
 .add-option__input {
@@ -8,7 +9,7 @@
   border: none;
   border-bottom: .3rem solid darken($color: $dark-blue, $amount: 10);
   flex-grow: 1;
-  margin-right: $s-size;
+  margin: 0 0 $s-size 0;
   padding: $s-size;
 }
 
@@ -17,4 +18,14 @@
   font-style: italic;
   padding: 0 $m-size;
   margin-top: $m-size;
+}
+
+@media (min-width: 45rem) {
+  .add-option {
+    flex-direction: row;
+  }
+
+  .add-option__input {
+    margin: 0 $s-size 0 0;
+  }
 }