add active class to LinkTo (#17780)

This commit is contained in:
claire bontempo 2022-11-02 11:58:42 -07:00 committed by GitHub
parent 707111b78f
commit 3041e2d7dc
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 10 additions and 5 deletions

View file

@ -55,7 +55,8 @@
color: $menu-item-hover-color;
}
&.is-active {
&.active,
.is-active {
background-color: $menu-item-active-background-color;
color: $menu-item-active-color;
}

View file

@ -12,10 +12,11 @@
<NamespacePicker @class="navbar-item" @namespace={{this.namespaceQueryParam}} />
</li>
{{/if}}
<li class={{if (is-active-route "vault.cluster.secrets") "is-active"}}>
<li>
<LinkTo
@route="vault.cluster.secrets"
@current-when="vault.cluster.secrets vault.cluster.settings.mount-secret-backend vault.cluster.settings.configure-secret-backend"
class={{if (is-active-route "vault.cluster.secrets") "is-active"}}
{{on "click" Nav.closeDrawer}}
data-test-navbar-item="secrets"
>
@ -23,11 +24,12 @@
</LinkTo>
</li>
{{#if (has-permission "access")}}
<li class={{if (is-active-route "vault.cluster.access") "is-active"}}>
<li>
<LinkTo
@route={{get (route-params-for "access") "route"}}
@models={{get (route-params-for "access") "models"}}
@current-when="vault.cluster.access vault.cluster.settings.auth"
class={{if (is-active-route "vault.cluster.access") "is-active"}}
{{on "click" Nav.closeDrawer}}
data-test-navbar-item="access"
>
@ -36,11 +38,12 @@
</li>
{{/if}}
{{#if (has-permission "policies")}}
<li class={{if (is-active-route (array "vault.cluster.policies" "vault.cluster.policy")) "is-active"}}>
<li>
<LinkTo
@route="vault.cluster.policies"
@models={{get (route-params-for "policies") "models"}}
@current-when="vault.cluster.policies vault.cluster.policy"
class={{if (is-active-route (array "vault.cluster.policies" "vault.cluster.policy")) "is-active"}}
{{on "click" Nav.closeDrawer}}
data-test-navbar-item="policies"
>
@ -49,10 +52,11 @@
</li>
{{/if}}
{{#if (has-permission "tools")}}
<li class={{if (is-active-route "vault.cluster.tools") "is-active"}}>
<li>
<LinkTo
@route="vault.cluster.tools.tool"
@models={{get (route-params-for "tools") "models"}}
class={{if (is-active-route "vault.cluster.tools") "is-active"}}
{{on "click" Nav.closeDrawer}}
>
Tools