Merge branch 'inverse_colours' into 'v3'

Inverse colours

See merge request openflexure/openflexure-microscope-server!236

webapp/src/assets/less/theme.less

@@ -340,6 +340,8 @@ a:hover {
 .uk-button {
     border-radius: @button-border-radius;
     padding: 0 8px;
+    border-color: @global-border;
+    margin-bottom: 2px;
 }
 
 .uk-button-default {
@@ -351,6 +353,7 @@ a:hover {
     background-color: rgba(180, 180, 180, 0.10);
     border-color: @global-primary-background;
     color: @button-text-color;
+    margin-bottom: 4px;
 }
 
 .uk-button-danger {
@@ -360,6 +363,17 @@ a:hover {
 }
 
 .hook-inverse() {
+    .uk-button {
+        background-color: rgba(180, 180, 180, 0.15);
+        color: @inverse-primary-muted-color;
+        border-color: @inverse-primary-muted-color;
+    }
+    .uk-button:hover {
+        background-color: @inverse-primary-muted-color;
+        color: #fff;
+        border-color: #fff;
+    }
+
     .uk-button-primary {
         background-color: rgba(180, 180, 180, 0.15);
         color: @inverse-primary-muted-color;
@@ -369,6 +383,7 @@ a:hover {
     .uk-button-primary:hover {
         background-color: @inverse-primary-muted-color;
         color: #fff;
+        border-color: #fff;
     }
 }
 

webapp/src/components/labThingsComponents/actionButton.vue

@@ -19,7 +19,7 @@
       <button
         type="button"
         :hidden="taskStarted"
-        class="uk-button uk-margin-remove uk-width-1-1"
+        class="uk-button uk-width-1-1"
         :class="[buttonPrimary ? 'uk-button-primary' : 'uk-button-default']"
         @click="bootstrapTask()"
       >

webapp/src/components/tabContentComponents/scanListContent.vue

@@ -14,6 +14,7 @@
           <div>
             <button
               class="uk-button uk-button-default uk-width-1-1"
+              style="margin-top:5px;margin-bottom: 2px"
               type="button"
               @click="deleteAllScans()"
             >
@@ -23,6 +24,7 @@
           <div>
             <button
               class="uk-button uk-button-default uk-width-1-1"
+              style="margin-top:5px;margin-bottom: 2px"
               type="button"
               @click="updateScans()"
             >
@@ -55,7 +57,7 @@
                 @response="downloadZipFile"
                 @error="modalError"
               />
-              <button class="uk-button" @click="deleteScan(item.name)">
+              <button class="uk-button uk-button-default uk-width-1-1" @click="deleteScan(item.name)">
                 Delete
               </button>
               <action-button

webapp/src/components/tabContentComponents/slideScanContent.vue

@@ -5,7 +5,7 @@
   <!-- Grid managing tab content -->
   <div v-else uk-grid class="uk-height-1-1 uk-margin-remove uk-padding-remove">
     <div class="control-component uk-padding-small">
-      <div v-show="!scanning">
+      <div v-show="!scanning" class="uk-padding-small">
         <ul uk-accordion="multiple: true">
           <li>
             <a class="uk-accordion-title" href="#">Configure</a>