diff --git a/src/components/ConnectivityInfo.vue b/src/components/ConnectivityInfo.vue index 2d5c2679..62ce1e15 100644 --- a/src/components/ConnectivityInfo.vue +++ b/src/components/ConnectivityInfo.vue @@ -4,7 +4,24 @@
-
{{ capitalise(entry.title) }}
+
+ {{ capitalise(entry.title) }} + +
-
- Alert - - - - {{ featuresAlert }} - - -
{{ entry.paths }}
@@ -229,6 +230,7 @@ export default { originsWithDatasets: [], componentsWithDatasets: [], resource: undefined, + featuresAlert: undefined, }), }, availableAnatomyFacets: { @@ -236,7 +238,6 @@ export default { default: () => [], }, }, - // inject: ['getFeaturesAlert'], data: function () { return { controller: undefined, @@ -274,9 +275,6 @@ export default { } return resources; }, - featuresAlert() { - // return this.getFeaturesAlert() - }, originDescription: function () { if ( this.entry && @@ -517,6 +515,9 @@ export default { :deep(.popover-origin-help.el-popover) { text-transform: none !important; // need to overide the tooltip text transform border: 1px solid $app-primary-color; + font-weight: 400; + font-family: Asap, sans-serif, Helvetica; + .el-popper__arrow { &:before { border-color: $app-primary-color; @@ -525,12 +526,27 @@ export default { } } +.info, +.alert { + color: #8300bf; +} + .info { transform: rotate(180deg); - color: #8300bf; margin-left: 8px; } +.alert { + margin-left: 5px; + vertical-align: text-bottom; + + &, + > svg { + width: 1.25rem; + height: 1.25rem; + } +} + .seperator { width: 90%; height: 1px;