public/assets/css/dash/atomic.css

@@ -0,0 +1,72 @@
+/*
+ * Atomic CSS
+ *
+ * Small, reusable classes
+ */
+
+
+/*
+ * Padding
+ */
+.p1 { padding: 5px; }
+.pt1 { padding-top: 5px; }
+.pl1 { padding-left: 5px; }
+.pr1 { padding-right: 5px; }
+.pb1 { padding-bottom: 5px; }
+
+.p2 { padding: 10px; }
+.pt2 { padding-top: 10px; }
+.pl2 { padding-left: 10px; }
+.pr2 { padding-right: 10px; }
+.pb2 { padding-bottom: 10px; }
+
+
+/*
+ * Margin
+ */
+.mt1 { margin-top: 5px; }
+.ml1 { margin-left: 5px; }
+.mr1 { margin-right: 5px; }
+.mb1 { margin-bottom: 5px; }
+
+.mt2 { margin-top: 10px; }
+.ml2 { margin-left: 10px; }
+.mr2 { margin-right: 10px; }
+.mb2 { margin-bottom: 10px; }
+
+
+/*
+ * Layout
+ */
+.row {
+    display: flex;
+}
+
+.col {
+    display: flex;
+    flex-direction: column;
+}
+
+.items-center {
+    display: flex;
+    align-items: center;
+}
+
+.justify-center {
+    display: flex;
+    justify-content: flex;
+}
+
+.grow {
+    flex-grow: 1;
+}
+
+
+/*
+ * Borders and rounding
+ */
+.rounded {
+    overflow: hidden;
+    border-radius: 5px;
+}
+

public/assets/css/dash/init.css

@@ -96,25 +96,6 @@ section.restore-backup form input {
   }
 }
 
-/* Atomic */
-.p1 { padding: 5px; }
-.mr2 { margin-right: 10px; }
-.mb2 { margin-bottom: 10px; }
-
-.items-center {
-  display: flex;
-  align-items: center;
-}
-
-.grow {
-  flex-grow: 1;
-}
-
-.rounded {
-  overflow: hidden;
-  border-radius: 5px;
-}
-
 .form-label {
   height: 30px;
   width: 90px;
@@ -126,8 +107,6 @@ section.restore-backup form input {
 
 .form-input {
   height: 30px;
-  padding-bottom: 2px;
-  padding-top: 8px;
 }
 
 .form-button {

public/assets/css/dash/start.css

@@ -1,3 +1,4 @@
+@import url("atomic.css");
 @import url("colors.css");
 @import url("forms.css");
 @import url("typography.css");