feat navigation: style checkboxes in navigation

feat preferences: Show Hidden Files and Show Directories First options working

src/less/components/navigation.less

@@ -52,6 +52,39 @@ nav {
       padding-bottom: 0;
       border-bottom: none;
     }
+
+    label {
+      clear: left;
+
+      &::after {
+        content: '';
+        display: block;
+
+        float: right;
+
+        margin-right: 13px;
+
+        border-radius: 50%;
+
+        width: 10px;
+        height: 10px;
+
+        background: transparent;
+
+        border: 1px solid @overlay;
+      }
+    }
+
+    input {
+      clear: right;
+      float: right;
+
+      display: none;
+    }
+
+    input:checked + label::after {
+      background: @blue;
+    }
   }
 
   i {

src/less/styles/forms.less

@@ -13,3 +13,28 @@ input {
 
   .light-medium;
 }
+
+input[type="checkbox"] {
+  width: 0;
+  height: 0;
+}
+
+input[type="checkbox"]::before {
+  content: '';
+  display: block;
+
+  border: 1px solid @gray;
+
+  background: transparent;
+
+  border-radius: 50%;
+
+  width: 10px;
+  height: 10px;
+
+  box-sizing: border-box;
+
+  &:checked {
+    background: @blue;
+  }
+}