From 93ebf086e0a6cfc3ec981c9236caabe3707987db Mon Sep 17 00:00:00 2001 From: John Cowen Date: Mon, 19 Nov 2018 14:57:22 +0000 Subject: [PATCH] UI: Use buttons instead of anchors where appropriate (#4939) Use buttons instead of anchors where appropriate --- .../components/action-group/layout.scss | 12 +++-- .../styles/components/action-group/skin.scss | 8 +++- ui-v2/app/styles/components/buttons.scss | 5 +- ui-v2/app/styles/core/typography.scss | 3 +- ui-v2/app/templates/dc/acls/index.hbs | 42 ++++++++-------- .../app/templates/dc/acls/policies/index.hbs | 2 +- ui-v2/app/templates/dc/acls/tokens/index.hbs | 48 ++++++++++--------- ui-v2/app/templates/dc/intentions/index.hbs | 2 +- ui-v2/app/templates/dc/kv/index.hbs | 2 +- 9 files changed, 69 insertions(+), 55 deletions(-) diff --git a/ui-v2/app/styles/components/action-group/layout.scss b/ui-v2/app/styles/components/action-group/layout.scss index 06a47fb2a..b5f054932 100644 --- a/ui-v2/app/styles/components/action-group/layout.scss +++ b/ui-v2/app/styles/components/action-group/layout.scss @@ -1,6 +1,14 @@ %action-group label span { display: none; } +%action-group-action { + width: 170px; + padding: 10px 10px; + text-align: left; +} +%action-group li > * { + @extend %action-group-action; +} %action-group::before { margin-left: -1px; } @@ -59,10 +67,6 @@ position: relative; z-index: 1; } -%action-group li a { - width: 170px; - padding: 10px 10px; -} %action-group input[type='radio'], %action-group input[type='radio'] ~ ul, %action-group input[type='radio'] ~ .with-confirmation > ul { diff --git a/ui-v2/app/styles/components/action-group/skin.scss b/ui-v2/app/styles/components/action-group/skin.scss index 73e72a2a9..7ef8d4377 100644 --- a/ui-v2/app/styles/components/action-group/skin.scss +++ b/ui-v2/app/styles/components/action-group/skin.scss @@ -5,7 +5,8 @@ /* frame-gray */ background-color: $gray-050; } -%action-group label { +%action-group label, +%action-group-action { cursor: pointer; } %action-group label::after, @@ -26,7 +27,10 @@ %action-group ul::before { border-color: $color-action; } -%action-group li a:hover { +%action-group-action { + background-color: $white; +} +%action-group-action:hover { @extend %frame-blue-800; } %action-group ul, diff --git a/ui-v2/app/styles/components/buttons.scss b/ui-v2/app/styles/components/buttons.scss index 977dc0897..9047a583d 100644 --- a/ui-v2/app/styles/components/buttons.scss +++ b/ui-v2/app/styles/components/buttons.scss @@ -3,12 +3,13 @@ button[type='submit'], a.type-create { @extend %primary-button; } +// the :not(li)'s here avoid styling action-group buttons button[type='reset'], -button[type='button']:not(.copy-btn):not(.type-delete), +:not(li) > button[type='button']:not(.copy-btn):not(.type-delete), html.template-error div > a { @extend %secondary-button; } -button.type-delete { +:not(li) > button.type-delete { @extend %dangerous-button; } button.copy-btn { diff --git a/ui-v2/app/styles/core/typography.scss b/ui-v2/app/styles/core/typography.scss index 4107ebf9f..2331c49c9 100644 --- a/ui-v2/app/styles/core/typography.scss +++ b/ui-v2/app/styles/core/typography.scss @@ -52,7 +52,7 @@ caption { } th, %breadcrumbs a, -%action-group a, +%action-group-action, %tab-nav, %tooltip-bubble { font-weight: $typo-weight-medium; @@ -80,6 +80,7 @@ h2, font-size: $typo-size-500; } body, +%action-group-action, pre code, input, textarea, diff --git a/ui-v2/app/templates/dc/acls/index.hbs b/ui-v2/app/templates/dc/acls/index.hbs index 57f94c894..3617db3c9 100644 --- a/ui-v2/app/templates/dc/acls/index.hbs +++ b/ui-v2/app/templates/dc/acls/index.hbs @@ -43,28 +43,28 @@ {{#block-slot 'action' as |confirm|}} {{#action-group index=index onchange=(action change) checked=(if (eq checked index) 'checked')}} +
  • + +
    • +{{/if}} +
  • + +
    • +{{# if (not-eq item.ID 'anonymous') }} +
  • + +
    • +{{/if}} + {{/action-group}} {{/block-slot}} {{#block-slot 'dialog' as |execute cancel message name|}} diff --git a/ui-v2/app/templates/dc/acls/policies/index.hbs b/ui-v2/app/templates/dc/acls/policies/index.hbs index 0f5aac482..e5bf59aca 100644 --- a/ui-v2/app/templates/dc/acls/policies/index.hbs +++ b/ui-v2/app/templates/dc/acls/policies/index.hbs @@ -61,7 +61,7 @@ Edit
  • - Delete +
    • {{/if}} diff --git a/ui-v2/app/templates/dc/acls/tokens/index.hbs b/ui-v2/app/templates/dc/acls/tokens/index.hbs index 16eb04b9f..c4b5f13c2 100644 --- a/ui-v2/app/templates/dc/acls/tokens/index.hbs +++ b/ui-v2/app/templates/dc/acls/tokens/index.hbs @@ -26,7 +26,7 @@ {{/if}} {{#if (token/is-legacy items)}} -

    Update. We have upgraded our ACL System to allow the creation of reusable policies that can be applied to tokens. Read more about the changes and how to upgrade legacy tokens in our documentation.

    +

    Update. We have upgraded our ACL System to allow the creation of reusable policies that can be applied to tokens. Read more about the changes and how to upgrade legacy tokens in our documentation.

    {{/if}} {{#changeable-set dispatcher=searchable}} {{#block-slot 'set' as |filtered|}} @@ -68,32 +68,33 @@ {{#block-slot 'action' as |confirm|}} {{#action-group index=index onchange=(action change) checked=(if (eq checked index) 'checked')}} {{/action-group}} @@ -102,6 +103,9 @@

    {{#if (eq name 'delete')}} {{message}} +{{#if (eq item.AccessorID token.AccessorID)}} + Warning: This is the token you are currently using! +{{/if}} {{else if (eq name 'logout')}} Are you sure you want to stop using this ACL token? This will log you out. {{else if (eq name 'use')}} diff --git a/ui-v2/app/templates/dc/intentions/index.hbs b/ui-v2/app/templates/dc/intentions/index.hbs index ed103d92d..db4540389 100644 --- a/ui-v2/app/templates/dc/intentions/index.hbs +++ b/ui-v2/app/templates/dc/intentions/index.hbs @@ -63,7 +63,7 @@ Edit

  • - Delete +
    • {{/action-group}} diff --git a/ui-v2/app/templates/dc/kv/index.hbs b/ui-v2/app/templates/dc/kv/index.hbs index a9d10cd82..50aca9506 100644 --- a/ui-v2/app/templates/dc/kv/index.hbs +++ b/ui-v2/app/templates/dc/kv/index.hbs @@ -59,7 +59,7 @@ {{if item.isFolder 'View' 'Edit'}}
  • - Delete +
    • {{/action-group}}