Converted modals to Bootstrap 4 Material Design

src/web/stylesheets/layout/_controls.css

@@ -29,6 +29,7 @@
     text-align: center;
     color: var(--primary-font-colour);
     font-size: 14px;
+    cursor: pointer;
 }
 
 #auto-bake-label .checkbox-decorator {
@@ -38,3 +39,7 @@
 #bake {
     box-shadow: none;
 }
+
+#controls .btn {
+    border-radius: 0;
+}

src/web/stylesheets/layout/_modals.css

@@ -6,29 +6,12 @@
  * @license Apache-2.0
  */
 
-.option-item .bootstrap-switch {
-    margin: 15px 10px;
+.modal-content {
+    background-color: var(--primary-background-colour);
 }
 
-.option-item button {
-    margin: 10px;
-}
-
-.option-item label {
-    font-weight: normal;
-}
-
-.option-item input[type=number] {
-    margin: 15px 10px;
-    width: 80px;
-    height: 28px;
-    padding: 3px 10px;
-    vertical-align: middle;
-}
-
-.option-item select {
-    margin: 10px;
-    display: inline-block;
+.option-item {
+    margin-bottom: 20px;
 }
 
 #edit-favourites-list {
@@ -55,11 +38,15 @@
     margin: 10px 0 20px 20px;
 }
 
+#save-link-group {
+    padding-top: 0;
+}
+
 .save-link-options {
     float: right;
 }
 
-.save-link-options input{
+.save-link-options label {
     margin-left: 10px;
 }
 
@@ -79,7 +66,9 @@
 }
 
 #save-texts textarea {
-    border-top: none;
-    box-shadow: none;
     height: 200px;
 }
+
+#faqs a.btn {
+    text-transform: unset;
+}

src/web/stylesheets/layout/_operations.css

@@ -31,3 +31,29 @@
     border: 2px dashed var(--rec-list-operation-font-colour) !important;
     padding: 8px 8px 9px 8px;
 }
+
+.operation input.form-control,
+.operation select.form-control,
+.operation .bmd-label-floating,
+.operation .bmd-label-static {
+    padding-left: 5px;
+    padding-right: 5px;
+}
+
+.operation [class^='bmd-label'],
+.operation [class*=' bmd-label'] {
+    color: #388e3c;
+}
+
+.operation .is-focused [class^='bmd-label'],
+.operation .is-focused [class*=' bmd-label'],
+.operation .is-focused [class^='bmd-label'],
+.operation .is-focused [class*=' bmd-label'] {
+    color: #1976d2;
+}
+
+.operation .form-control {
+    background-color: transparent;
+    border-color: var(--primary-border-colour);
+    color: var(--primary-font-colour);
+}