diff --git a/ui-v2/app/styles/app.scss b/ui-v2/app/styles/app.scss index cebc321f17..9fa550d5f8 100644 --- a/ui-v2/app/styles/app.scss +++ b/ui-v2/app/styles/app.scss @@ -45,6 +45,7 @@ @import 'components/notice'; @import 'routes/dc/service/index'; +@import 'routes/dc/nodes/index'; @import 'routes/dc/kv/index'; main a { diff --git a/ui-v2/app/styles/components/table.scss b/ui-v2/app/styles/components/table.scss index 49578096e3..c78786af28 100644 --- a/ui-v2/app/styles/components/table.scss +++ b/ui-v2/app/styles/components/table.scss @@ -1,4 +1,9 @@ @import './icons'; +@import './tag'; +td strong { + @extend %tag; + background-color: $gray; +} th { color: $text-light !important; } @@ -53,12 +58,6 @@ table td a { tbody { overflow-x: visible !important; } -td strong { - display: inline-block; - background-color: $gray; - padding: 1px 5px; - border-radius: $radius-small; -} th, td:not(.actions), td:not(.actions) a { diff --git a/ui-v2/app/styles/components/tag.scss b/ui-v2/app/styles/components/tag.scss new file mode 100644 index 0000000000..f31eb7be8c --- /dev/null +++ b/ui-v2/app/styles/components/tag.scss @@ -0,0 +1,5 @@ +%tag { + display: inline-block; + padding: 1px 5px; + border-radius: $radius-small; +} diff --git a/ui-v2/app/styles/routes/dc/nodes/index.scss b/ui-v2/app/styles/routes/dc/nodes/index.scss new file mode 100644 index 0000000000..f7c3003bea --- /dev/null +++ b/ui-v2/app/styles/routes/dc/nodes/index.scss @@ -0,0 +1,6 @@ +// TODO: Generalize this, also see services/index +html.template-node.template-show td.tags span { + @extend %tag; + background-color: $gray; + margin-bottom: 0.5em; +} diff --git a/ui-v2/app/styles/routes/dc/service/index.scss b/ui-v2/app/styles/routes/dc/service/index.scss index 975da4ad7a..d60c5c77a0 100644 --- a/ui-v2/app/styles/routes/dc/service/index.scss +++ b/ui-v2/app/styles/routes/dc/service/index.scss @@ -1,9 +1,15 @@ +@import '../../../components/tag'; html.template-service.template-show main dl { display: flex; margin-bottom: 1.4em; } -html.template-service.template-show main dt::after { - content: ':'; - display: inline-block; - margin-right: 0.2em; +html.template-service.template-show main dt { + display: none; +} +// TODO: Generalize this, also see nodes/index +html.template-service.template-list td.tags span, +html.template-service.template-show main dd span { + @extend %tag; + background-color: $gray; + margin-bottom: 0.5em; } diff --git a/ui-v2/app/templates/dc/nodes/-services.hbs b/ui-v2/app/templates/dc/nodes/-services.hbs index 185875f3ce..1aeaa01be3 100644 --- a/ui-v2/app/templates/dc/nodes/-services.hbs +++ b/ui-v2/app/templates/dc/nodes/-services.hbs @@ -20,9 +20,11 @@