mgr/dashboard: Fix layout issues in UI

Improve the CSS3 selectors and use the margin-left values from 'btn-toolbar' Bootstrap.

Signed-off-by: Volker Theile <vtheile@suse.com>

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table/table.component.scss b/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table/table.component.scss
index e545e4e1424a22c1963ce75dcb9c25e1b1acc67c..036c6bbc8e19bab87cc85c6443ccea5426b4ab17 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table/table.component.scss
+++ b/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table/table.component.scss
@@ -205,6 +205,10 @@
     }
     .datatable-pager .pager {
       margin-right: 5px !important;
+      & li:not(:first-child) {
+        /** Add space between buttons */
+        margin-left: 3px;
+      }
       & li > a, & li > span {
         border-radius: 3px;
       }

diff --git a/src/pybind/mgr/dashboard/frontend/src/openattic-theme.scss b/src/pybind/mgr/dashboard/frontend/src/openattic-theme.scss
index ebb2c52a836f392c7dec86a35ef2f6bc69b63788..767eb5caff7221f21fc931e4cdc80d2aab0aa1d2 100755 (executable)
--- a/src/pybind/mgr/dashboard/frontend/src/openattic-theme.scss
+++ b/src/pybind/mgr/dashboard/frontend/src/openattic-theme.scss
@@ -545,8 +545,8 @@ ul.task-queue-pagination {
 .panel .panel-toolbar>.dropdown>a {
   padding-left: 5px;
 }
-.panel .panel-footer > .button-group button.btn {
-  margin-left: 3px;
+.panel .panel-footer > .button-group button.btn:not(:first-child) {
+  margin-left: 5px;
 }
 .panel-dashboard {
   height: 100%;
@@ -1132,8 +1132,8 @@ hr.oa-hr-small {
 }
 
 /* Modal dialog */
-.modal-footer button.btn {
-  margin-left: 3px;
+.modal-footer button.btn:not(:first-child) {
+  margin-left: 5px;
 }
 
 // awesome-bootstrap-checkbox + ForkAwesome