use flexbox to wrap settings tiles correctly

new icon for different tags ignore test files in codeclimate test
2020-10-19 21:12:07 +00:00
parent b21d2a29cc
commit 28f3d6db70
22 changed files with 307 additions and 55 deletions
--- a/src/pages/SettingsPage/GeneralSettings.module.css
+++ b/src/pages/SettingsPage/GeneralSettings.module.css
@@ -1,4 +1,5 @@
 .GeneralForm {
+    margin-top: 55px;
    width: 60%;
 }

@@ -6,3 +7,16 @@
    margin-top: 25px;
    width: 40%;
 }
+
+.infoheader {
+    display: flex;
+    flex-wrap: wrap;
+}
+
+/* On screens that are 722px wide or less, make the columns stack on top of each other instead of next to each other */
+@media screen and (max-width: 722px) {
+    .infoheader {
+        flex-direction: column;
+    }
+}
+