diff --git a/ui-v2/app/components/popover-menu.js b/ui-v2/app/components/popover-menu.js index 55c1ba5262..3079f9eb30 100644 --- a/ui-v2/app/components/popover-menu.js +++ b/ui-v2/app/components/popover-menu.js @@ -9,6 +9,9 @@ export default Component.extend(Slotted, { expanded: false, keyboardAccess: true, onchange: function() {}, + // TODO: this needs to be made dynamic/auto detect + // for now use this to set left/right explicitly + position: '', init: function() { this._super(...arguments); this.guid = this.dom.guid(this); diff --git a/ui-v2/app/styles/base/components/menu-panel/layout.scss b/ui-v2/app/styles/base/components/menu-panel/layout.scss index 44823cd128..c40289c4e0 100644 --- a/ui-v2/app/styles/base/components/menu-panel/layout.scss +++ b/ui-v2/app/styles/base/components/menu-panel/layout.scss @@ -15,6 +15,9 @@ /* or be hardcoded */ /* min-height: 143px; */ } +%menu-panel [role='menuitem']::after { + float: right; +} %menu-panel-sub-panel { position: absolute; top: 0; @@ -28,6 +31,7 @@ } %menu-panel:not(.left) { right: 0px; + left: auto; } %menu-panel.left { left: 0px; diff --git a/ui-v2/app/styles/components/main-nav-horizontal/index.scss b/ui-v2/app/styles/components/main-nav-horizontal/index.scss index ae5d8bd337..333e688576 100644 --- a/ui-v2/app/styles/components/main-nav-horizontal/index.scss +++ b/ui-v2/app/styles/components/main-nav-horizontal/index.scss @@ -18,6 +18,9 @@ %main-nav-horizontal > ul > li.is-active > label > * { @extend %main-nav-horizontal-action-active; } +%main-nav-horizontal label + div { + @extend %main-nav-horizontal-drop-nav; +} %main-nav-horizontal-drop-nav { @extend %menu-panel; } diff --git a/ui-v2/app/styles/components/main-nav-horizontal/skin.scss b/ui-v2/app/styles/components/main-nav-horizontal/skin.scss index d0ea088e04..a4f6e35df8 100644 --- a/ui-v2/app/styles/components/main-nav-horizontal/skin.scss +++ b/ui-v2/app/styles/components/main-nav-horizontal/skin.scss @@ -32,7 +32,7 @@ color: inherit; } %main-nav-horizontal-toggle, -%main-nav-horizontal input { +%main-nav-horizontal input[type='checkbox'] { display: none; } %main-nav-horizontal [type='checkbox'] + label > *::after { diff --git a/ui-v2/app/styles/components/product.scss b/ui-v2/app/styles/components/product.scss index 1787d34eb0..f047be48d7 100644 --- a/ui-v2/app/styles/components/product.scss +++ b/ui-v2/app/styles/components/product.scss @@ -3,6 +3,16 @@ html body > svg { display: none; } +%main-nav-horizontal .docs-link a::after { + @extend %with-learn-icon, %as-pseudo; +} + +%main-nav-horizontal .learn-link a::after { + @extend %with-docs-icon, %as-pseudo; +} +%main-nav-horizontal .feedback-link a::after { + @extend %with-logo-github-monochrome-icon, %as-pseudo; +} html.ember-loading body > svg { @extend %brand-loader; } diff --git a/ui-v2/app/styles/components/product/index.scss b/ui-v2/app/styles/components/product/index.scss index 0cfc8c3de4..ae9742d37b 100644 --- a/ui-v2/app/styles/components/product/index.scss +++ b/ui-v2/app/styles/components/product/index.scss @@ -24,9 +24,6 @@ %secondary-nav { @extend %main-nav-horizontal; } -%primary-nav label + div { - @extend %main-nav-horizontal-drop-nav; -} @media #{$--lt-horizontal-nav} { %primary-nav { margin-top: 65px; diff --git a/ui-v2/app/templates/components/hashicorp-consul.hbs b/ui-v2/app/templates/components/hashicorp-consul.hbs index f6f844b717..c68b77e7b8 100644 --- a/ui-v2/app/templates/components/hashicorp-consul.hbs +++ b/ui-v2/app/templates/components/hashicorp-consul.hbs @@ -16,7 +16,7 @@ {{#if (and (eq nspaces.length 1) (not canManageNspaces)) }} {{nspace.Name}} {{ else }} - {{#popover-menu}} + {{#popover-menu position='left'}} {{#block-slot name='trigger'}} {{nspace.Name}} {{/block-slot}} @@ -51,7 +51,7 @@ {{#if (or (not dcs) (eq dcs.length 1)) }} {{dc.Name}} {{ else }} - {{#popover-menu}} + {{#popover-menu position='left'}} {{#block-slot name='trigger'}} {{dc.Name}} {{/block-slot}} @@ -90,7 +90,23 @@ - Documentation + {{#popover-menu position='right'}} + {{#block-slot name='trigger'}} + Help + {{/block-slot}} + {{#block-slot name='menu'}} + + Documentation + + + HashiCorp Learn + + + + Provide Feedback + + {{/block-slot}} + {{/popover-menu}} Settings diff --git a/ui-v2/app/templates/components/popover-menu.hbs b/ui-v2/app/templates/components/popover-menu.hbs index 9b7b4721f4..2bfc2cbd7f 100644 --- a/ui-v2/app/templates/components/popover-menu.hbs +++ b/ui-v2/app/templates/components/popover-menu.hbs @@ -7,7 +7,7 @@ {{/yield-slot}} {{/toggle-button}} - + {{#each submenus as |sub|}} diff --git a/ui-v2/config/environment.js b/ui-v2/config/environment.js index bb8b92b768..f046bc0682 100644 --- a/ui-v2/config/environment.js +++ b/ui-v2/config/environment.js @@ -71,6 +71,7 @@ module.exports = function(environment, $ = process.env) { CONSUL_NSPACES_ENABLED: false, CONSUL_HOME_URL: 'https://www.consul.io', + CONSUL_REPO_ISSUES_URL: 'https://github.com/hashicorp/consul/issues/new/choose', CONSUL_DOCS_URL: 'https://www.consul.io/docs', CONSUL_DOCS_LEARN_URL: 'https://learn.hashicorp.com/consul', CONSUL_DOCS_API_URL: 'https://www.consul.io/api',