mgr/dashboard: Tree SCSS file

In order to align the CSS in all ng2-tree usages.

Fixes: https://tracker.ceph.com/issues/41575
Signed-off-by: Stephan Müller <smueller@suse.com>

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/iscsi-target-details/iscsi-target-details.component.scss b/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/iscsi-target-details/iscsi-target-details.component.scss
index 202e7be97e7f06cdd3e46af958aaeba3d4a8b6a4..be874e065695d36067a31434e7361d2d303e6d0e 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/iscsi-target-details/iscsi-target-details.component.scss
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/iscsi-target-details/iscsi-target-details.component.scss
@@ -1,3 +1,5 @@
+@import 'ng2-tree.scss';
+
 ::ng-deep tree .fa {
   font-weight: unset !important;
 }

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/crushmap/crushmap.component.scss b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/crushmap/crushmap.component.scss
index 65c94d5050ae38c6b4899268eaabd5516462bca0..a8d8b4074d61ef80cdce55e01927eb34e8041350 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/crushmap/crushmap.component.scss
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/crushmap/crushmap.component.scss
@@ -1,21 +1 @@
-::ng-deep tree-internal .tree li {
-  cursor: pointer;
-}
-
-::ng-deep tree-internal .tree .node-value {
-  color: #2b99a8;
-  border-radius: 5px;
-}
-
-::ng-deep tree-internal .tree .node-selected {
-  background-color: #d9edf7;
-  color: #212121;
-}
-
-::ng-deep tree-internal .tree .node-value:hover {
-  color: #212121;
-}
-
-::ng-deep tree-internal .tree .node-value:after {
-  height: 0;
-}
+@import 'ng2-tree.scss';

diff --git a/src/pybind/mgr/dashboard/frontend/src/styles/ng2-tree.scss b/src/pybind/mgr/dashboard/frontend/src/styles/ng2-tree.scss
new file mode 100644 (file)
index 0000000..62164c0
--- /dev/null
+++ b/src/pybind/mgr/dashboard/frontend/src/styles/ng2-tree.scss
@@ -0,0 +1,25 @@
+@import 'defaults';
+
+/* ng2-tree */
+::ng-deep tree-internal .tree {
+  li {
+    cursor: pointer;
+  }
+  .node-value {
+    &:hover {
+      color: #212121;
+    }
+    &:after {
+      height: 0;
+    }
+    color: #2b99a8;
+    border-radius: 5px;
+  }
+  .node-selected {
+    background-color: #d9edf7;
+    color: #212121;
+  }
+  .loading-children {
+    display: none;
+  }
+}