diff --git a/.changelog/11577.txt b/.changelog/11577.txt new file mode 100644 index 0000000000..14fe7b0148 --- /dev/null +++ b/.changelog/11577.txt @@ -0,0 +1,3 @@ +```release-note:improvement +ui: Update global notification styling +``` diff --git a/ui/packages/consul-ui/app/components/app-view/README.mdx b/ui/packages/consul-ui/app/components/app-view/README.mdx index b7681597bd..da5e92de42 100644 --- a/ui/packages/consul-ui/app/components/app-view/README.mdx +++ b/ui/packages/consul-ui/app/components/app-view/README.mdx @@ -8,9 +8,7 @@ state: needs-love the app chrome), every 'top level main section/template' should have one of these. -It contains legacy authorization code (that can probably be removed now), and -our flash messages (that should be moved to the `` or `` component and potentially be renamed to `Page` or `View` or similar now +This component will potentially be renamed to `Page` or `View` or similar now that we don't need two words. Other than that it provides the basic layout/slots for our main title, search @@ -86,20 +84,12 @@ breadcrumbs and back again. ``` -## Arguments - -| Argument | Type | Default | Description | -| --- | --- | --- | --- | -| `authorized` | `Boolean` | `true` | Whether the View is authorized or not | -| `enabled` | `Boolean` | `true` | Whether ACLs are enabled or not | - ## Slots | Name | Description | | --- | --- | | `header` | The main title of the page, you probably want to put a `

` in here | | `content` | The main content of the page, and potentially an `` somewhere | -| `notification` | Old style notifications, also see `` | | `breadcrumbs` | Any breadcrumbs, you probably want an `ol/li/a` in here | | `actions` | Any actions relevant for the entire page, probably using `` | | `nav` | Secondary navigation goes in here, also see `` | diff --git a/ui/packages/consul-ui/app/components/app-view/index.hbs b/ui/packages/consul-ui/app/components/app-view/index.hbs index c23fea5396..c40e715eba 100644 --- a/ui/packages/consul-ui/app/components/app-view/index.hbs +++ b/ui/packages/consul-ui/app/components/app-view/index.hbs @@ -4,74 +4,23 @@ > {{yield}}
- {{#each flashMessages.queue as |flash|}} - - {{#if flash.dom}} - {{{flash.dom}}} - {{else}} - {{#let (lowercase component.flashType) (lowercase flash.action) as |status type|}} - {{! flashes automatically ucfirst the type }} - - - {{/let}} - {{/if}} - - {{/each}}
- {{#if authorized}} - {{/if}}
{{yield}}
- {{#if authorized}} {{yield}} - {{/if}}
@@ -79,42 +28,12 @@
- {{#if authorized}} {{yield}} - {{/if}}
- {{#if (not enabled) }} - - -

Welcome to ACLs

- - -

- ACLs are not enabled in this Consul cluster. We strongly encourage the use of ACLs in production environments for the best security practices. -

- - -
  • - Read the documentation -
    • -
  • - Follow the guide -
    • -     -     - {{else if (not authorized)}} - - {{else}} - {{yield}} - {{/if}} + {{yield}}
    diff --git a/ui/packages/consul-ui/app/components/app-view/index.js b/ui/packages/consul-ui/app/components/app-view/index.js index ee99672aaf..b868ab70ee 100644 --- a/ui/packages/consul-ui/app/components/app-view/index.js +++ b/ui/packages/consul-ui/app/components/app-view/index.js @@ -2,6 +2,4 @@ import Component from '@ember/component'; import SlotsMixin from 'block-slots'; export default Component.extend(SlotsMixin, { tagName: '', - authorized: true, - enabled: true, }); diff --git a/ui/packages/consul-ui/app/components/app/index.hbs b/ui/packages/consul-ui/app/components/app/index.hbs index 726f03c61e..68498d61f0 100644 --- a/ui/packages/consul-ui/app/components/app/index.hbs +++ b/ui/packages/consul-ui/app/components/app/index.hbs @@ -1,5 +1,6 @@ {{#let (hash main=(concat guid '-main') + Notification=(component 'app/notification') ) as |exported|}}
    {{t 'components.app.skip_to_content'}} {{!-- @@ -25,7 +26,7 @@ --}}
    @@ -78,6 +79,13 @@
    +
    + {{yield exported to="notifications"}} + +
    {{yield exported to="main"}}