mirror of https://github.com/status-im/consul.git
ui: Implement EmberTooltips to Upstreams (#7930)
* Add ember-tooltips addon * Create Tooltip component with styling and test * Implement Tooltip into Upstreams
This commit is contained in:
Kenia
John Cowen
parent
5d77ba076a
commit
91b22f21ba
|
|
@ -0,0 +1,3 @@
|
|||
<EmberTooltip @popperContainer=".app-view">
|
||||
{{yield}}
|
||||
</EmberTooltip>
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
import Component from '@ember/component';
|
||||
|
||||
export default Component.extend({
|
||||
tagName: '',
|
||||
});
|
||||
|
|
@ -50,3 +50,8 @@
|
|||
%tooltip-bottom::after {
|
||||
bottom: -12px;
|
||||
}
|
||||
|
||||
// Ember Tooltips
|
||||
.ember-tooltip {
|
||||
padding: 12px;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -24,6 +24,15 @@
|
|||
border-bottom-width: 18px;
|
||||
}
|
||||
%tooltip-bubble {
|
||||
border-radius: $decor-radius-200;
|
||||
border-radius: $decor-radius-100;
|
||||
box-shadow: $decor-elevation-400;
|
||||
}
|
||||
|
||||
// Ember Tooltips
|
||||
.ember-tooltip {
|
||||
background-color: $gray-700;
|
||||
border-radius: $decor-radius-100;
|
||||
}
|
||||
.ember-tooltip[x-placement^='top'] .ember-tooltip-arrow {
|
||||
border-top-color: $gray-700;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -130,3 +130,8 @@ pre code,
|
|||
font-size: 16px !important;
|
||||
}
|
||||
}
|
||||
|
||||
//Ember Tooltip
|
||||
.ember-tooltip {
|
||||
font-size: $typo-size-800;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -8,7 +8,7 @@
|
|||
{{/if}}
|
||||
{{#if (gt proxy.Proxy.Upstreams.length 0)}}
|
||||
<section class="proxy-upstreams">
|
||||
<h3>Upstreams</h3>
|
||||
<h3> Upstreams</h3>
|
||||
<ul data-test-proxy-upstreams>
|
||||
{{#let proxy.Datacenter as |proxyDatacenter|}}
|
||||
{{#each proxy.Proxy.Upstreams as |item|}}
|
||||
|
|
@ -21,12 +21,18 @@
|
|||
{{#if (not-eq item.DestinationType 'prepared_query')}}
|
||||
<li class="nspace">
|
||||
{{or item.DestinationNamespace 'default'}}
|
||||
<Tooltip>
|
||||
Namespace
|
||||
</Tooltip>
|
||||
</li>
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
{{#if (and (not-eq item.Datacenter proxyDatacenter) (not-eq item.Datacenter ""))}}
|
||||
<li class="datacenter">
|
||||
{{item.Datacenter}}
|
||||
<Tooltip>
|
||||
Datacenter
|
||||
</Tooltip>
|
||||
</li>
|
||||
{{/if}}
|
||||
{{#if (gt item.LocalBindPort 0)}}
|
||||
|
|
@ -37,6 +43,9 @@
|
|||
@value={{combinedAddress}}
|
||||
@name="Address"
|
||||
/>
|
||||
<Tooltip>
|
||||
Address
|
||||
</Tooltip>
|
||||
</li>
|
||||
{{/let}}
|
||||
{{/if}}
|
||||
|
|
|
|||
|
|
@ -15,6 +15,9 @@
|
|||
{{#if (not-eq item.Namespace nspace)}}
|
||||
<li class="nspace">
|
||||
{{item.Namespace}}
|
||||
<Tooltip>
|
||||
Namespace
|
||||
</Tooltip>
|
||||
</li>
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
|
|
@ -25,6 +28,9 @@
|
|||
@value={{item.GatewayConfig.ListenerPort}}
|
||||
@name="Port"
|
||||
/>
|
||||
<Tooltip>
|
||||
Port
|
||||
</Tooltip>
|
||||
</li>
|
||||
{{/if}}
|
||||
</ul>
|
||||
|
|
|
|||
|
|
@ -106,6 +106,7 @@
|
|||
"ember-sinon-qunit": "4.0.1",
|
||||
"ember-source": "~3.16.0",
|
||||
"ember-test-selectors": "^4.0.0",
|
||||
"ember-tooltips": "^3.4.3",
|
||||
"ember-truth-helpers": "^2.0.0",
|
||||
"eslint-plugin-ember": "^7.7.2",
|
||||
"eslint-plugin-node": "^11.0.0",
|
||||
|
|
|
|||
|
|
@ -0,0 +1,25 @@
|
|||
import { module, test } from 'qunit';
|
||||
import { setupRenderingTest } from 'ember-qunit';
|
||||
import { render } from '@ember/test-helpers';
|
||||
import { hbs } from 'ember-cli-htmlbars';
|
||||
|
||||
module('Integration | Component | tooltip', function(hooks) {
|
||||
setupRenderingTest(hooks);
|
||||
|
||||
test('it renders', async function(assert) {
|
||||
// Set any properties with this.set('myProperty', 'value');
|
||||
// Handle any actions with this.set('myAction', function(val) { ... });
|
||||
|
||||
await render(hbs`<Tooltip />`);
|
||||
|
||||
assert.equal(this.element.textContent.trim(), '');
|
||||
|
||||
// Template block usage:
|
||||
await render(hbs`
|
||||
<Tooltip>
|
||||
</Tooltip>
|
||||
`);
|
||||
|
||||
assert.equal(this.element.textContent.trim(), '');
|
||||
});
|
||||
});
|
||||
|
|
@ -3306,7 +3306,7 @@ broccoli-output-wrapper@^3.1.1:
|
|||
heimdalljs-logger "^0.1.10"
|
||||
symlink-or-copy "^1.2.0"
|
||||
|
||||
broccoli-persistent-filter@^1.1.6, broccoli-persistent-filter@^1.4.3:
|
||||
broccoli-persistent-filter@^1.1.5, broccoli-persistent-filter@^1.1.6, broccoli-persistent-filter@^1.4.3:
|
||||
version "1.4.6"
|
||||
resolved "https://registry.yarnpkg.com/broccoli-persistent-filter/-/broccoli-persistent-filter-1.4.6.tgz#80762d19000880a77da33c34373299c0f6a3e615"
|
||||
integrity sha512-0RejLwoC95kv4kta8KAa+FmECJCK78Qgm8SRDEK7YyU0N9Cx6KpY3UCDy9WELl3mCXLN8TokNxc7/hp3lL4lfw==
|
||||
|
|
@ -3456,6 +3456,11 @@ broccoli-source@^1.1.0:
|
|||
resolved "https://registry.yarnpkg.com/broccoli-source/-/broccoli-source-1.1.0.tgz#54f0e82c8b73f46580cbbc4f578f0b32fca8f809"
|
||||
integrity sha1-VPDoLItz9GWAy7xPV48LMvyo+Ak=
|
||||
|
||||
broccoli-source@^2.0.0:
|
||||
version "2.1.2"
|
||||
resolved "https://registry.yarnpkg.com/broccoli-source/-/broccoli-source-2.1.2.tgz#e9ae834f143b607e9ec114ade66731500c38b90b"
|
||||
integrity sha512-1lLayO4wfS0c0Sj50VfHJXNWf94FYY0WUhxj0R77thbs6uWI7USiOWFqQV5dRmhAJnoKaGN4WyLGQbgjgiYFwQ==
|
||||
|
||||
broccoli-source@^3.0.0:
|
||||
version "3.0.0"
|
||||
resolved "https://registry.yarnpkg.com/broccoli-source/-/broccoli-source-3.0.0.tgz#c7c9ba24505941b72a0244568285bc859f69dfbd"
|
||||
|
|
@ -3494,6 +3499,14 @@ broccoli-stew@^3.0.0:
|
|||
symlink-or-copy "^1.2.0"
|
||||
walk-sync "^1.1.3"
|
||||
|
||||
broccoli-string-replace@^0.1.2:
|
||||
version "0.1.2"
|
||||
resolved "https://registry.yarnpkg.com/broccoli-string-replace/-/broccoli-string-replace-0.1.2.tgz#1ed92f85680af8d503023925e754e4e33676b91f"
|
||||
integrity sha1-HtkvhWgK+NUDAjkl51Tk4zZ2uR8=
|
||||
dependencies:
|
||||
broccoli-persistent-filter "^1.1.5"
|
||||
minimatch "^3.0.3"
|
||||
|
||||
broccoli-templater@^2.0.1:
|
||||
version "2.0.2"
|
||||
resolved "https://registry.yarnpkg.com/broccoli-templater/-/broccoli-templater-2.0.2.tgz#285a892071c0b3ad5ebc275d9e8b3465e2d120d6"
|
||||
|
|
@ -5216,6 +5229,26 @@ ember-cli-htmlbars@^4.0.5, ember-cli-htmlbars@^4.0.8, ember-cli-htmlbars@^4.2.2:
|
|||
strip-bom "^4.0.0"
|
||||
walk-sync "^2.0.2"
|
||||
|
||||
ember-cli-htmlbars@^4.2.0:
|
||||
version "4.3.1"
|
||||
resolved "https://registry.yarnpkg.com/ember-cli-htmlbars/-/ember-cli-htmlbars-4.3.1.tgz#4af8adc21ab3c4953f768956b7f7d207782cb175"
|
||||
integrity sha512-CW6AY/yzjeVqoRtItOKj3hcYzc5dWPRETmeCzr2Iqjt5vxiVtpl0z5VTqHqIlT5fsFx6sGWBQXNHIe+ivYsxXQ==
|
||||
dependencies:
|
||||
"@ember/edition-utils" "^1.2.0"
|
||||
babel-plugin-htmlbars-inline-precompile "^3.0.1"
|
||||
broccoli-debug "^0.6.5"
|
||||
broccoli-persistent-filter "^2.3.1"
|
||||
broccoli-plugin "^3.1.0"
|
||||
common-tags "^1.8.0"
|
||||
ember-cli-babel-plugin-helpers "^1.1.0"
|
||||
fs-tree-diff "^2.0.1"
|
||||
hash-for-dep "^1.5.1"
|
||||
heimdalljs-logger "^0.1.10"
|
||||
json-stable-stringify "^1.0.1"
|
||||
semver "^6.3.0"
|
||||
strip-bom "^4.0.0"
|
||||
walk-sync "^2.0.2"
|
||||
|
||||
ember-cli-inject-live-reload@^2.0.2:
|
||||
version "2.0.2"
|
||||
resolved "https://registry.yarnpkg.com/ember-cli-inject-live-reload/-/ember-cli-inject-live-reload-2.0.2.tgz#95edb543b386239d35959e5ea9579f5382976ac7"
|
||||
|
|
@ -5941,6 +5974,23 @@ ember-text-measurer@^0.5.0:
|
|||
dependencies:
|
||||
ember-cli-babel "^7.1.0"
|
||||
|
||||
ember-tooltips@^3.4.3:
|
||||
version "3.4.3"
|
||||
resolved "https://registry.yarnpkg.com/ember-tooltips/-/ember-tooltips-3.4.3.tgz#a017de33e53a9b9ca6d38b8c2f829cc3024b8f8b"
|
||||
integrity sha512-/swhfhodVvpKi6R+tkcqLgS0YTMo3S6Mzb8qtfTneFSz+tBhY/kd/+eI8OIZf9qocpJ9b54dbbqTw5ZBkeZe2g==
|
||||
dependencies:
|
||||
broccoli-file-creator "^2.1.1"
|
||||
broccoli-funnel "^2.0.2"
|
||||
broccoli-merge-trees "^2.0.0"
|
||||
broccoli-source "^2.0.0"
|
||||
broccoli-string-replace "^0.1.2"
|
||||
ember-cli-babel "^7.13.0"
|
||||
ember-cli-htmlbars "^4.2.0"
|
||||
ember-maybe-in-element "^0.4.0"
|
||||
popper.js "^1.12.5"
|
||||
resolve "^1.10.1"
|
||||
tooltip.js "^1.1.5"
|
||||
|
||||
ember-truth-helpers@2.1.0, ember-truth-helpers@^2.0.0, ember-truth-helpers@^2.1.0:
|
||||
version "2.1.0"
|
||||
resolved "https://registry.yarnpkg.com/ember-truth-helpers/-/ember-truth-helpers-2.1.0.tgz#d4dab4eee7945aa2388126485977baeb33ca0798"
|
||||
|
|
@ -10356,6 +10406,11 @@ pn@^1.1.0:
|
|||
resolved "https://registry.yarnpkg.com/pn/-/pn-1.1.0.tgz#e2f4cef0e219f463c179ab37463e4e1ecdccbafb"
|
||||
integrity sha512-2qHaIQr2VLRFoxe2nASzsV6ef4yOOH+Fi9FBOVH6cqeSgUnoyySPZkxzLuzd+RYOQTRpROA0ztTMqxROKSb/nA==
|
||||
|
||||
popper.js@^1.0.2, popper.js@^1.12.5:
|
||||
version "1.16.1"
|
||||
resolved "https://registry.yarnpkg.com/popper.js/-/popper.js-1.16.1.tgz#2a223cb3dc7b6213d740e40372be40de43e65b1b"
|
||||
integrity sha512-Wb4p1J4zyFTbM+u6WuO4XstYx4Ky9Cewe4DWrel7B0w6VVICvPwdOpotjzcf6eD8TsckVnIMNONQyPIUFOUbCQ==
|
||||
|
||||
portfinder@^1.0.25:
|
||||
version "1.0.25"
|
||||
resolved "https://registry.yarnpkg.com/portfinder/-/portfinder-1.0.25.tgz#254fd337ffba869f4b9d37edc298059cb4d35eca"
|
||||
|
|
@ -12420,6 +12475,13 @@ toidentifier@1.0.0:
|
|||
resolved "https://registry.yarnpkg.com/toidentifier/-/toidentifier-1.0.0.tgz#7e1be3470f1e77948bc43d94a3c8f4d7752ba553"
|
||||
integrity sha512-yaOH/Pk/VEhBWWTlhI+qXxDFXlejDGcQipMlyxda9nthulaxLZUNcUqFxokp0vcYnvteJln5FNQDRrxj3YcbVw==
|
||||
|
||||
tooltip.js@^1.1.5:
|
||||
version "1.3.3"
|
||||
resolved "https://registry.yarnpkg.com/tooltip.js/-/tooltip.js-1.3.3.tgz#2ad0d77bb6776a76e117eac0afcd3c7d3a237121"
|
||||
integrity sha512-XWWuy/dBdF/F/YpRE955yqBZ4VdLfiTAUdOqoU+wJm6phJlMpEzl/iYHZ+qJswbeT9VG822bNfsETF9wzmoy5A==
|
||||
dependencies:
|
||||
popper.js "^1.0.2"
|
||||
|
||||
torii@^0.10.1:
|
||||
version "0.10.1"
|
||||
resolved "https://registry.yarnpkg.com/torii/-/torii-0.10.1.tgz#caad0a81e82189fc0483b65e68ee28041ad3590f"
|
||||
|
|
|
|||
Loading…
Reference in New Issue