Merge branch 'master' into fix_tab_switch

Author: haslinghuis

locales/en/messages.json

@@ -64,6 +64,7 @@
     "jquery-ui-npm": "^1.12.0",
     "lru_map": "^0.3.3",
     "marked": "^0.8.0",
+    "multiple-select": "^1.5.2",
     "nw-vue-devtools-prebuilt": "^0.0.10",
     "object-hash": "^2.0.3",
     "select2": "^4.0.13",
@@ -125,7 +126,7 @@
     "temp": "^0.9.1",
     "vinyl-source-stream": "^2.0.0",
     "vue-template-compiler": "^2.6.12",
-    "yarn": "^1.22.0"
+    "yarn": "^1.22.17"
   },
   "optionalDependencies": {
     "gulp-appdmg": "^1.0.3"

package.json

@@ -111,6 +111,11 @@ dialog {
     border: 1px solid #ffbb2a;
 }
 
+.standard_input {
+    background: var(--boxBackground);
+    color: white;
+}
+
 #quad-status_wrapper {
     color: #393b3a;
 }

src/css/dark-theme.css

@@ -78,6 +78,18 @@ a.disabled {
     background-position: center;
 }
 
+.standard_input {
+    padding-left: 3px;
+    height: 20px;
+    line-height: 20px;
+    text-align: left;
+    border-radius: 3px;
+    font-size: 12px;
+    font-weight: normal;
+    border: 1px solid var(--subtleAccent);
+    background: var(--boxBackground);
+}
+
 /* Help-Icon  */
 .helpicon {
     float: right;
@@ -740,8 +752,19 @@ input[type="number"]::-webkit-inner-spin-button {
     background-image: url(../images/icons/cf_icon_link_active.svg);
 }
 
+/** Header (not phones) **/
+@media not all and (max-width: 575px) {
+    .visible-on-phone-only {
+        display: none !important;
+    }
+}
+
 /** Header (phones) **/
 @media all and (max-width: 575px) {
+    .visible-on-desktop-only {
+        display: none !important;
+    }
+
     .headerbar {
         height: 56px;
         background: rgba(0, 0, 0, 0.15);
@@ -1541,10 +1564,67 @@ dialog .dialog_toolbar .btn a.disabled {
     opacity: 0.5;
 }
 
+.dialogYesNo .dialogYesNoContent {
+    margin-bottom: 12px;
+    margin-top: 12px;
+    white-space: pre-line;
+}
+
+.dialogYesNo .dialogYesNo-yesButton, .dialogYesNo .dialogYesNo-noButton {
+    margin: 0px;
+}
+
+.dialogYesNo .dialogYesNo-yesButton {
+    margin-right: 12px;
+}
+
+.dialogYesNo {
+    width: fit-content;
+    max-width: 400px;
+}
+
+.dialogWait {
+    width: fit-content;
+    max-width: 500px;
+    min-width: 300px;
+}
+
+.dialogWait .data-loading {
+    margin-top: 16px;
+    margin-bottom: 16px;
+    margin-left: auto;
+    margin-right: auto;
+    width: 100px;
+    height: 100px;
+}
+
+.dialogWait .dialogWaitTitle {
+    margin-left: auto;
+    margin-right: auto;
+    margin-bottom: 16px;
+    width: fit-content;
+}
+
+.dialogInformation .dialogInformationContent {
+    margin-bottom: 12px;
+    margin-top: 12px;
+    white-space: pre-line;
+}
+
+.dialogInformation .dialogInformation-confirmButton {
+    margin: 0px;
+}
+
+.dialogInformation {
+    width: fit-content;
+    max-width: 400px;
+}
+
 @media all and (max-width: 575px) {
     dialog {
         position: fixed;
-        width: calc(100% - 2em) !important;
+        width: calc(100% - 2em - 2px) !important; /* 2px - border */
+        max-width: unset;
         height: auto !important;
         bottom: 0;
         top: 56px;
@@ -2348,7 +2428,6 @@ input {
 .noUi-connect {
     box-shadow: none;
 }
-
 /** Responsive grid **/
 @media all and (max-width: 575px) {
     .sm, .md, .lg, .xl {

src/css/main.css

@@ -200,7 +200,7 @@
     cursor: default;
     color: #fff;
     background-color: #AFAFAF;
-    border: none;
+    border: 1px solid #AFAFAF;
     pointer-events: none;
     text-shadow: none;
     opacity: 0.5;

src/css/tabs/firmware_flasher.css

@@ -7,6 +7,8 @@
 }
 .tab-options .margin-bottom {
     margin-bottom: 10px;
+    display: grid;
+    grid-template-columns: fit-content(300px) 1fr;
 }
 .tab-options select {
     background: var(--boxBackground);

src/css/tabs/options.css

@@ -163,13 +163,17 @@
     padding-right: 5px;
 }
 
-.tab-pid_tuning table.compensation td:first-child {
+.tab-pid_tuning table.compensation td:first-child:not(.filterTable) {
     width: 65px;
     text-align: center;
     vertical-align: top;
     padding-top: 4px;
 }
 
+.tab-pid_tuning table.filterTable.compensation td:first-child {
+    width: 5%;
+}
+
 .tab-pid_tuning table.compensation td:last-child {
     width: 100%;
 }
@@ -914,10 +918,6 @@
     table-layout: auto;
 }
 
-.tab-pid_tuning table.filterTable td:first-child {
-    width: 25%;
-}
-
 @media only screen and (max-width: 1205px) {
 
 .tab-pid_tuning .subtab-pid .spacer_left {