From 2f99e9a656b8c73cf9842f706fda962d3f7b1005 Mon Sep 17 00:00:00 2001
From: Vrifox <gitea@vrifox.cc>
Date: Fri, 30 Oct 2020 22:54:19 +0100
Subject: [PATCH] closes #13

---
 scss/import/dashboard.scss  |  43 +++------------
 scss/import/include.scss    | 105 ++++++++++++++++++++++++++++++++++++
 scss/import/repository.scss |  78 +++++----------------------
 3 files changed, 126 insertions(+), 100 deletions(-)

diff --git a/scss/import/dashboard.scss b/scss/import/dashboard.scss
index 9a56390..ebbad2e 100644
--- a/scss/import/dashboard.scss
+++ b/scss/import/dashboard.scss
@@ -5,38 +5,7 @@
   .dashboard-navbar {
     .secondary.menu {
       .item {
-        .dropdown {
-          &:hover {
-            .context.user.menu {
-              display: none;
-            }
-          }
-          .text {
-            color: $white;
-          }
-          .context.user.menu {
-            background: $bg50;
-            .header {
-              color: $white;
-            }
-            .scrolling.menu.items {
-              border: 0;
-            }
-            .item {
-              border-radius: 0;
-              color: $white !important;
-              &:hover {
-                background: $bg40;
-              }
-              &.active {
-                background: $bg40 !important;
-                &:hover {
-                  background: $bg30 !important;
-                }
-              }
-            }
-          }
-        }
+        @include dropdown-floating;
       }
     }
   }
@@ -203,10 +172,14 @@
         }
       }
       .column.twelve {
-        .column {
-          @include open-closed-buttons;
-          @include search-issues;
+        .column.three {
+          .column {
+            @include open-closed-buttons;
+            @include search-issues;
+            @include dropdown;
+          }
         }
+        @include issue-list;
       }
     }
   }
diff --git a/scss/import/include.scss b/scss/import/include.scss
index 1065e29..595e4f6 100644
--- a/scss/import/include.scss
+++ b/scss/import/include.scss
@@ -79,6 +79,7 @@
 
 @mixin open-closed-buttons {
   .basic.button {
+    font-family: $font-family;
     &:not(.active) {
       background: $bg60;
       color: $white;
@@ -117,6 +118,7 @@
         background: $bg40;
         border: 2px solid $bg60;
         color: $white;
+        font-family: $font-family;
         &:focus {
           background: $bg50;
           border: 2px solid $bg60;
@@ -126,6 +128,7 @@
       .button {
         background: $bg60;
         border: 0;
+        font-family: $font-family;
         &:hover {
           background: $bg50;
         }
@@ -133,3 +136,105 @@
     }
   }
 }
+
+@mixin issue-list {
+  .issue.list {
+    .item {
+      border-bottom: 1px dashed $bg70;
+      .label {
+        background: $white;
+        color: $bg60;
+      }
+      .title {
+        border-bottom: 1px solid transparent;
+        color: $white;
+        transition: border .2s, color .2s;
+        &:hover {
+          border-bottom: 1px solid $red;
+          color: $red;
+        }
+      }
+      .desc {
+        color: $white-dark;
+        a.milestone {
+          color: $white !important;
+          &:hover {
+            color: $red !important;
+          }
+        }
+      }
+    }
+  }
+}
+
+@mixin dropdown {
+  .dropdown {
+    background: $bg60;
+    border-radius: $border-radius;
+    color: $white;
+    padding: 10px 0 10px 13px;
+    &:first-of-type {
+      margin-left: auto;
+    }
+    &:hover {
+      background: $bg50;
+      .menu {
+        @if $nojavascript == true {
+          display: block;
+        }
+      }
+    }
+    span.text {
+      i.dropdown.icon {
+        padding: 0;
+      }
+    }
+    .menu {
+      background: $bg60;
+      border: 1px solid $bg50;
+      box-shadow: none;
+      margin-top: 0;
+      .item {
+        color: $white !important;
+        &:hover {
+          background: $bg50;
+        }
+      }
+    }
+  }
+}
+
+@mixin dropdown-floating {
+  .dropdown.floating {
+    &:hover {
+      .context.user.menu {
+        display: none;
+      }
+    }
+    .text {
+      color: $white;
+    }
+    .context.user.menu {
+      background: $bg50;
+      .header {
+        color: $white;
+      }
+      .scrolling.menu.items {
+        border: 0;
+      }
+      .item {
+        border-radius: 0;
+        color: $white !important;
+        &:hover {
+          background: $bg40;
+        }
+        &.active {
+          background: $bg40 !important;
+          &:hover {
+            background: $bg30 !important;
+          }
+        }
+      }
+    }
+  }
+}
diff --git a/scss/import/repository.scss b/scss/import/repository.scss
index fa00240..1214591 100644
--- a/scss/import/repository.scss
+++ b/scss/import/repository.scss
@@ -411,84 +411,32 @@
       .column {
         @include open-closed-buttons;
         .filter.menu {
-          .item {
-            background: $bg60;
-            color: $white;
-            &:first-of-type {
-              margin-left: auto;
-            }
-            &:hover {
-              background: $bg50;
-              .menu {
+          @include dropdown;
+          .dropdown.label-filter {
+            .menu {
+              .info {
                 @if $nojavascript == true {
-                  display: block;
+                  display: none;
                 }
               }
-            }
-            &.label-filter {
-              .menu {
-                .info {
+              .item {
+                &.label-filter-item {
+                  @if $nojavascript == true {
+                    padding-left: 25px !important;
+                  }
+                }
+                .label.color {
                   @if $nojavascript == true {
                     display: none;
                   }
                 }
-                .item {
-                  &.label-filter-item {
-                    @if $nojavascript == true {
-                      padding-left: 25px !important;
-                    }
-                  }
-                  .label.color {
-                    @if $nojavascript == true {
-                      display: none;
-                    }
-                  }
-                }
-              }
-            }
-            .menu {
-              background: $bg60;
-              border: 1px solid $bg50;
-              box-shadow: none;
-              margin-top: 0;
-              .item {
-                color: $white !important;
-                &:hover {
-                  background: $bg50;
-                }
               }
             }
           }
         }
       }
     }
-    .issue.list {
-      .item {
-        border-bottom: 1px dashed $bg70;
-        .label {
-          background: $white;
-          color: $bg60;
-        }
-        .title {
-          border-bottom: 1px solid transparent;
-          color: $white;
-          transition: border .2s, color .2s;
-          &:hover {
-            border-bottom: 1px solid $red;
-            color: $red;
-          }
-        }
-        .desc {
-          color: $white-dark;
-          a.milestone {
-            color: $white !important;
-            &:hover {
-              color: $red !important;
-            }
-          }
-        }
-      }
-    }
+    @include issue-list;
   }
 }