- fixed ugly <select> field arrows + scrollbar in Firefox

.gitignore

@@ -47,7 +47,6 @@ Temporary Items
 # project files
 # ========================
 .idea
-.sass-cache
 .usage
 *.gz
 composer-dev.lock

public/templates/ui/info_panel.html

@@ -1,4 +1,4 @@
 <div id="{{id}}" class="alert alert-warning">
     <div class="ui-pnotify-icon"><span class="fas fa-exclamation fa-fw fa-lg"></span></div>
-    <h4 class="ui-pnotify-title">Scheduled maintenance: Update v1.5.4 <i class="fas fa-long-arrow-alt-right"></i> v1.5.5; Shutdown: ~16:00 (UTC). ETA ~16:30 (UTC)</h4>
+    <h4 class="ui-pnotify-title">Scheduled maintenance: Update v1.5.5 <i class="fas fa-long-arrow-alt-right"></i> v2.0.0-rc.1; Shutdown: ~12:00 (UTC). ETA ~13:00 (UTC)</h4>
 </div>

sass/layout/_forms.scss

@@ -84,6 +84,15 @@ fieldset[disabled]{
   }
 }
 
+// fix for ugly <select> boxes (Firefox) ==============================================================================
+@supports (-moz-appearance:none) {
+  select {
+    -moz-appearance: none !important;
+    background: $gray-dark url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAFCAMAAABPT11nAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAAZQTFRFiIiIAAAA/v9K/QAAAAJ0Uk5T/wDltzBKAAAAHElEQVR42mJggAFGGMUIZjGCGIwMYIIRCgACDAABOwAVoypkGgAAAABJRU5ErkJggg==') right center no-repeat !important;
+    background-position: calc(100% - 5px) center !important;
+    padding-right: 16px !important;
+  }
+}
 
 // form fields with icons groups (stacked icons) ======================================================================
 .input-icon-left:not(.input-icon-right){

sass/layout/_main.scss

@@ -118,7 +118,12 @@ em,
   }
 }
 
-// scroll bar (webkit only) =======================================================================
+// scroll bar =====================================================================================
+html{
+  scrollbar-width: thin;            // Firefox
+  scrollbar-color: #717171 #222223; // Firefox
+}
+
 ::-webkit-scrollbar {
   display: none;  // hides the scrollbar but is still scrollable
   width: 16px;
@@ -437,8 +442,6 @@ select:active, select:hover {
 }
 
 .select2-results.mCustomScrollbar{
-  overflow-y: scroll;
-
   .select2-results__option--load-more{
     position: absolute;
     margin-top: 50px; // margin gets removed on totalScroll -> enables ajax select options to load next page
@@ -1971,6 +1974,13 @@ code {
   border: none;
   padding: 9px 10px;
 
+  .ui-pnotify-icon{
+    float: left;
+
+    > span{
+      display: block;
+    }
+  }
   .ui-pnotify-title{
     margin-bottom: 0;   // overwrite default "alert" style
   }

sass/library/custom-scrollbar/_mCustomScrollbar.scss

@@ -1,4 +1,4 @@
-$mCustomScrollbarContentPadding: 20px;
+$mCustomScrollbarContentPadding: 16px;
 
 /*
 == malihu jquery custom scrollbar plugin ==

sass/library/select2/theme/pathfinder/_single.scss

@@ -10,7 +10,7 @@
 
   .select2-selection__rendered {
     color: $gray-lighter;
-    line-height: 32px;
+    line-height: 30px; // + 1px border == 32px
     font-family: 'Oxygen Bold';
     padding-left: 15px;