diff --git a/ui/app/components/linked-block.js b/ui/app/components/list-item-row.js
similarity index 83%
rename from ui/app/components/linked-block.js
rename to ui/app/components/list-item-row.js
index cdbaa6c090..1c18d8a17b 100644
--- a/ui/app/components/linked-block.js
+++ b/ui/app/components/list-item-row.js
@@ -1,10 +1,10 @@
import Ember from 'ember';
import hbs from 'htmlbars-inline-precompile';
-let LinkedBlockComponent = Ember.Component.extend({
+let ListItemRowComponent = Ember.Component.extend({
layout: hbs`{{yield}}`,
- classNames: 'linked-block',
+ classNames: 'list-item-row',
routing: Ember.inject.service('-routing'),
queryParams: null,
@@ -28,8 +28,8 @@ let LinkedBlockComponent = Ember.Component.extend({
},
});
-LinkedBlockComponent.reopenClass({
+ListItemRowComponent.reopenClass({
positionalParams: 'params',
});
-export default LinkedBlockComponent;
+export default ListItemRowComponent;
diff --git a/ui/app/styles/components/box-label.scss b/ui/app/styles/components/box-label.scss
index 354dbf95f9..2a7827e8b2 100644
--- a/ui/app/styles/components/box-label.scss
+++ b/ui/app/styles/components/box-label.scss
@@ -8,7 +8,7 @@ label.box-label {
@extend .is-gapless;
border-color: $grey-light;
border-radius: 3px;
- box-shadow: $box-link-shadow, $box-shadow-middle;
+ box-shadow: $box-link-shadow;
text-decoration: none;
transition: box-shadow $speed;
width: 100%;
diff --git a/ui/app/styles/components/linked-block.scss b/ui/app/styles/components/linked-block.scss
deleted file mode 100644
index f407395cd3..0000000000
--- a/ui/app/styles/components/linked-block.scss
+++ /dev/null
@@ -1,16 +0,0 @@
-.linked-block {
- cursor: pointer;
- transition: box-shadow $speed;
- will-change: box-shadow;
-
- &:hover,
- &:focus,
- &:active {
- position: relative;
- box-shadow: 0 2px 0 -1px $grey-light, 0 -2px 0 -1px $grey-light, $box-link-hover-shadow, $box-shadow-middle;
- }
-}
-
-.linked-block .columns {
- @extend .is-flex-center;
-}
diff --git a/ui/app/styles/components/list-item-row.scss b/ui/app/styles/components/list-item-row.scss
new file mode 100644
index 0000000000..62e3c76c43
--- /dev/null
+++ b/ui/app/styles/components/list-item-row.scss
@@ -0,0 +1,28 @@
+.list-item-row {
+ @extend .box;
+ @extend .is-sideless;
+ @extend .is-marginless;
+ padding-left: 0;
+ padding-right: 0;
+
+ &.is-selectable {
+ cursor: pointer;
+ transition: box-shadow $speed, margin $speed, padding $speed;
+ will-change: box-shadow, margin, padding;
+
+ &:hover,
+ &:focus,
+ &:active {
+ margin-left: #{-$column-gap} !important;
+ margin-right: #{-$column-gap} !important;
+ padding-left: $column-gap;
+ padding-right: $column-gap;
+ position: relative;
+ box-shadow: 0 2px 0 -1px $grey-light, 0 -2px 0 -1px $grey-light, $box-link-hover-shadow, $box-shadow-middle;
+ }
+ }
+}
+
+.list-item-row .columns {
+ @extend .is-flex-center;
+}
diff --git a/ui/app/styles/core.scss b/ui/app/styles/core.scss
index 6449bc609d..116035fed7 100644
--- a/ui/app/styles/core.scss
+++ b/ui/app/styles/core.scss
@@ -55,7 +55,7 @@
@import "./components/init-illustration";
@import "./components/info-table-row";
@import "./components/input-hint";
-@import "./components/linked-block";
+@import "./components/list-item-row";
@import "./components/list-pagination";
@import "./components/loader";
@import "./components/login-form";
diff --git a/ui/app/styles/utils/_bulma_variables.scss b/ui/app/styles/utils/_bulma_variables.scss
index 28cbdfae74..7775a0f569 100644
--- a/ui/app/styles/utils/_bulma_variables.scss
+++ b/ui/app/styles/utils/_bulma_variables.scss
@@ -77,7 +77,7 @@ $menu-item-hover-background-color: $grey-lightest;
$menu-item-active-color: $link;
$menu-item-active-background-color: transparent;
-$box-link-shadow: 0 0 0 1px $grey-light;
+$box-link-shadow: 0 0 0 1px $ui-gray-200;
$box-link-hover-shadow: 0 0 0 1px $grey-light;
// animations
diff --git a/ui/app/styles/utils/_colors.scss b/ui/app/styles/utils/_colors.scss
index e3143cc8d6..245d7407dd 100644
--- a/ui/app/styles/utils/_colors.scss
+++ b/ui/app/styles/utils/_colors.scss
@@ -17,6 +17,7 @@ $vault-gray-dark: $vault-gray-700;
// UI Gray
$ui-gray-050: #F7F8FA;
$ui-gray-100: #EBEEF2;
+$ui-gray-200: #DCE0E6;
$ui-gray-300: #BAC1CC;
$ui-gray-500: #6a7786;
$ui-gray-700: #525761;
diff --git a/ui/app/templates/components/identity/item-aliases.hbs b/ui/app/templates/components/identity/item-aliases.hbs
index 1ebafafbba..02372d3341 100644
--- a/ui/app/templates/components/identity/item-aliases.hbs
+++ b/ui/app/templates/components/identity/item-aliases.hbs
@@ -1,9 +1,9 @@
{{#each (if model.alias.id (array model.alias) model.aliases) as |item|}}
- {{#linked-block
+ {{#list-item-row
"vault.cluster.access.identity.aliases.show"
item.id
"details"
- class="box is-sideless is-marginless"
+ class="is-selectable"
}}
@@ -26,7 +26,7 @@
{{identity/popup-alias params=(array item)}}
- {{/linked-block}}
+ {{/list-item-row}}
{{else}}
diff --git a/ui/app/templates/components/identity/item-groups.hbs b/ui/app/templates/components/identity/item-groups.hbs
index 149bf0ea2a..3f4a0f18b4 100644
--- a/ui/app/templates/components/identity/item-groups.hbs
+++ b/ui/app/templates/components/identity/item-groups.hbs
@@ -1,7 +1,7 @@
{{#if model.groupIds}}
{{#each model.directGroupIds as |gid|}}
{{i-con
glyph='folder'
size=14
@@ -9,19 +9,20 @@
}}{{gid}}
{{/each}}
{{#each model.inheritedGroupIds as |gid|}}
- {{#linked-block
- "vault.cluster.access.identity.show" "groups" gid "details"
- class="box is-sideless is-marginless"
- }}
-
{{i-con
- glyph='folder'
- size=14
- class="has-text-grey-light"
- }}{{gid}}
+ glyph='folder'
+ size=14
+ class="has-text-grey-light"
+ }}{{gid}}
+
inherited
- {{/linked-block}}
+ {{/list-item-row}}
{{/each}}
{{else}}
diff --git a/ui/app/templates/components/identity/item-members.hbs b/ui/app/templates/components/identity/item-members.hbs
index 17aba2c3a0..7373495dc4 100644
--- a/ui/app/templates/components/identity/item-members.hbs
+++ b/ui/app/templates/components/identity/item-members.hbs
@@ -1,38 +1,37 @@
{{#if model.hasMembers}}
{{#each model.memberGroupIds as |gid|}}
-
- {{#linked-block
- "vault.cluster.access.identity.show"
- "groups"
- gid
- details
- class="box is-sideless is-marginless"
- }}
-
-
-
- {{#if model.canEdit}}
- {{identity/popup-members params=(array model "memberGroupIds" gid)}}
- {{/if}}
-
-
- {{/linked-block}}
- {{/each}}
- {{#each model.memberEntityIds as |gid|}}
- {{#linked-block
+ {{#list-item-row
"vault.cluster.access.identity.show"
"groups"
gid
details
- class="box is-sideless is-marginless"
+ class="is-selectable"
+ }}
+
+
+
+ {{#if model.canEdit}}
+ {{identity/popup-members params=(array model "memberGroupIds" gid)}}
+ {{/if}}
+
+
+ {{/list-item-row}}
+ {{/each}}
+ {{#each model.memberEntityIds as |gid|}}
+ {{#list-item-row
+ "vault.cluster.access.identity.show"
+ "groups"
+ gid
+ details
+ class="is-selectable"
}}
@@ -50,7 +49,7 @@
{{/if}}
- {{/linked-block}}
+ {{/list-item-row}}
{{/each}}
{{else}}
diff --git a/ui/app/templates/components/identity/item-parent-groups.hbs b/ui/app/templates/components/identity/item-parent-groups.hbs
index c94e854b1d..3f182e9d40 100644
--- a/ui/app/templates/components/identity/item-parent-groups.hbs
+++ b/ui/app/templates/components/identity/item-parent-groups.hbs
@@ -1,11 +1,11 @@
{{#if model.parentGroupIds.length}}
{{#each model.parentGroupIds as |gid|}}
- {{#linked-block
+ {{#list-item-row
"vault.cluster.access.identity.show"
"groups"
gid
details
- class="box is-sideless is-marginless"
+ class="is-selectable"
}}
- {{/linked-block}}
+ {{/list-item-row}}
{{/each}}
{{else}}
diff --git a/ui/app/templates/components/identity/item-policies.hbs b/ui/app/templates/components/identity/item-policies.hbs
index 649d1609b4..2a624e35f1 100644
--- a/ui/app/templates/components/identity/item-policies.hbs
+++ b/ui/app/templates/components/identity/item-policies.hbs
@@ -1,9 +1,9 @@
{{#each model.policies as |policyName|}}
- {{#linked-block
+ {{#list-item-row
"vault.cluster.policy.show"
"acl"
item
- class="box is-sideless is-marginless"
+ class="is-selectable"
}}
@@ -18,7 +18,7 @@
{{/if}}
- {{/linked-block}}
+ {{/list-item-row}}
{{else}}
{{/each}}
-
diff --git a/ui/app/templates/partials/secret-list/aws-role-item.hbs b/ui/app/templates/partials/secret-list/aws-role-item.hbs
index d320516e93..daf7df0310 100644
--- a/ui/app/templates/partials/secret-list/aws-role-item.hbs
+++ b/ui/app/templates/partials/secret-list/aws-role-item.hbs
@@ -1,11 +1,11 @@
-{{#linked-block
+{{#list-item-row
(concat
"vault.cluster.secrets.backend."
"credentials"
(if (not item.id) "-root")
)
item.id
- class="box is-sideless is-marginless"
+ class="is-selectable"
data-test-secret-link=item.id
}}
@@ -33,5 +33,4 @@
{{partial 'partials/role-aws/popup-menu'}}
-{{/linked-block}}
-
+{{/list-item-row}}
diff --git a/ui/app/templates/partials/secret-list/item.hbs b/ui/app/templates/partials/secret-list/item.hbs
index 8baa37315e..a1bf1d834f 100644
--- a/ui/app/templates/partials/secret-list/item.hbs
+++ b/ui/app/templates/partials/secret-list/item.hbs
@@ -1,11 +1,11 @@
-{{#linked-block
+{{#list-item-row
(concat
"vault.cluster.secrets.backend."
(if item.isFolder "list" "show")
(if (not item.id) "-root")
)
item.id
- class="box is-sideless is-marginless"
+ class="is-selectable"
data-test-secret-link=item.id
}}
-{{/linked-block}}
+{{/list-item-row}}
diff --git a/ui/app/templates/partials/secret-list/pki-cert-item.hbs b/ui/app/templates/partials/secret-list/pki-cert-item.hbs
index d2a32e6ec0..23ed624d13 100644
--- a/ui/app/templates/partials/secret-list/pki-cert-item.hbs
+++ b/ui/app/templates/partials/secret-list/pki-cert-item.hbs
@@ -1,11 +1,11 @@
-{{#linked-block
+{{#list-item-row
(concat
"vault.cluster.secrets.backend."
"show"
(if (not item.id) "-root")
)
item.idForNav
- class="box is-sideless is-marginless linked-block"
+ class="is-selectable"
data-test-secret-link=item.id
tagName="div"
}}
@@ -34,4 +34,4 @@
{{pki-cert-popup item=item}}
-{{/linked-block}}
+{{/list-item-row}}
diff --git a/ui/app/templates/partials/secret-list/pki-role-item.hbs b/ui/app/templates/partials/secret-list/pki-role-item.hbs
index 7c5624185b..230389b472 100644
--- a/ui/app/templates/partials/secret-list/pki-role-item.hbs
+++ b/ui/app/templates/partials/secret-list/pki-role-item.hbs
@@ -1,4 +1,4 @@
-{{#linked-block
+{{#list-item-row
(concat
"vault.cluster.secrets.backend."
"credentials"
@@ -7,7 +7,7 @@
item.backend
item.id
queryParams=(hash action="issue")
- class="box is-sideless is-marginless"
+ class="is-selectable"
data-test-secret-link=item.id
tagName="div"
}}
@@ -37,4 +37,4 @@
{{partial "partials/role-pki/popup-menu"}}
-{{/linked-block}}
+{{/list-item-row}}
diff --git a/ui/app/templates/partials/secret-list/ssh-role-item.hbs b/ui/app/templates/partials/secret-list/ssh-role-item.hbs
index 0928ab6ae6..7a4c252e28 100644
--- a/ui/app/templates/partials/secret-list/ssh-role-item.hbs
+++ b/ui/app/templates/partials/secret-list/ssh-role-item.hbs
@@ -1,11 +1,11 @@
-{{#linked-block
+{{#list-item-row
(concat
"vault.cluster.secrets.backend."
(if (eq item.keyType "ca") "sign" "credentials")
(if (not item.id) "-root")
)
item.id
- class="box is-sideless is-marginless"
+ class="is-selectable"
data-test-secret-link=item.id
}}
@@ -40,5 +40,4 @@
{{/if}}
-{{/linked-block}}
-
+{{/list-item-row}}
diff --git a/ui/app/templates/vault/cluster/access/identity/aliases/index.hbs b/ui/app/templates/vault/cluster/access/identity/aliases/index.hbs
index 92c890c8c6..0fcf18bb9e 100644
--- a/ui/app/templates/vault/cluster/access/identity/aliases/index.hbs
+++ b/ui/app/templates/vault/cluster/access/identity/aliases/index.hbs
@@ -1,11 +1,11 @@
{{identity/entity-nav identityType=identityType}}
{{#if model.meta.total}}
{{#each model as |item|}}
- {{#linked-block
+ {{#list-item-row
"vault.cluster.access.identity.aliases.show"
item.id
"details"
- class="box is-sideless is-marginless"
+ class="is-selectable"
data-test-identity-row=true
}}
@@ -34,7 +34,7 @@
{{identity/popup-alias params=(array item) onSuccess=(action "onDelete")}}
- {{/linked-block}}
+ {{/list-item-row}}
{{/each}}
{{else}}
diff --git a/ui/app/templates/vault/cluster/access/identity/index.hbs b/ui/app/templates/vault/cluster/access/identity/index.hbs
index 28d9d9e7c2..4e2159da88 100644
--- a/ui/app/templates/vault/cluster/access/identity/index.hbs
+++ b/ui/app/templates/vault/cluster/access/identity/index.hbs
@@ -1,11 +1,11 @@
{{identity/entity-nav identityType=identityType}}
{{#if model.meta.total}}
{{#each model as |item|}}
- {{#linked-block
+ {{#list-item-row
"vault.cluster.access.identity.show"
item.id
"details"
- class="box is-sideless is-marginless"
+ class="is-selectable"
data-test-identity-row=true
}}
@@ -105,7 +105,7 @@
{{/popup-menu}}
- {{/linked-block}}
+ {{/list-item-row}}
{{/each}}
{{else}}
diff --git a/ui/app/templates/vault/cluster/access/leases/list.hbs b/ui/app/templates/vault/cluster/access/leases/list.hbs
index d9a828393e..624f010f25 100644
--- a/ui/app/templates/vault/cluster/access/leases/list.hbs
+++ b/ui/app/templates/vault/cluster/access/leases/list.hbs
@@ -99,7 +99,7 @@
(if item.isFolder "vault.cluster.access.leases.list" "vault.cluster.access.leases.show")
item.id
}}"
- class="is-flex box is-sideless is-marginless"
+ class="list-item-row is-selectable"
data-test-lease-link={{item.id}}
>
{{i-con
diff --git a/ui/app/templates/vault/cluster/access/methods.hbs b/ui/app/templates/vault/cluster/access/methods.hbs
index 125e77f1a3..fa11e06b47 100644
--- a/ui/app/templates/vault/cluster/access/methods.hbs
+++ b/ui/app/templates/vault/cluster/access/methods.hbs
@@ -14,13 +14,16 @@
{{#each (sort-by "path" model) as |method|}}
- {{i-con glyph="folder" size=14 class="has-text-grey-light"}}
{{method.path}}
+ {{i-con glyph="folder" size=14 class="has-text-grey-light"}}
+
+ {{method.path}}
+
{{#if (eq method.type 'plugin')}}
diff --git a/ui/app/templates/vault/cluster/policies/index.hbs b/ui/app/templates/vault/cluster/policies/index.hbs
index e956e28df4..91fc29a7f9 100644
--- a/ui/app/templates/vault/cluster/policies/index.hbs
+++ b/ui/app/templates/vault/cluster/policies/index.hbs
@@ -48,25 +48,28 @@
{{#if model.meta.total}}
{{#each model as |item|}}
{{#if (eq item.id "root")}}
-
+
{{i-con
glyph='file'
size=14
class="has-text-grey-light"
}}
-
{{item.id}}
+
+ {{item.id}}
+
- The root policy does not contain any rules but can do anything within Vault. It should be used with extreme care.
+ The root policy does not contain any rules but can
+ do anything within Vault. It should be used with extreme care.
{{else}}
- {{#linked-block
+ {{#list-item-row
"vault.cluster.policy.show"
policyType
item.id
- class="box is-sideless is-marginless"
+ class="is-selectable"
data-test-policy-link=item.id
}}
@@ -135,7 +138,7 @@
{{/popup-menu}}
- {{/linked-block}}
+ {{/list-item-row}}
{{/if}}
{{else}}
diff --git a/ui/app/templates/vault/cluster/secrets/backends.hbs b/ui/app/templates/vault/cluster/secrets/backends.hbs
index 3881963175..7fee72e98b 100644
--- a/ui/app/templates/vault/cluster/secrets/backends.hbs
+++ b/ui/app/templates/vault/cluster/secrets/backends.hbs
@@ -13,10 +13,10 @@
{{#each supportedBackends as |backend|}}
- {{#linked-block
+ {{#list-item-row
"vault.cluster.secrets.backend.list-root"
backend.id
- class="box is-sideless is-marginless has-pointer"
+ class="is-selectable"
data-test-secret-backend-row=backend.id
}}
@@ -65,16 +65,16 @@
- {{/linked-block}}
+ {{/list-item-row}}
{{/each}}
{{#each unsupportedBackends as |backend|}}
-
-
+
{{i-con glyph="folder" size=14 class="has-text-grey-light"}} {{backend.path}}