web: rework and expand tooltips (#6435)
* web: replace custom tooltip with pfe-tooltip Signed-off-by: Jens Langhammer <jens@goauthentik.io> * add tooltips to all edit buttons Signed-off-by: Jens Langhammer <jens@goauthentik.io> * add tooltips to remaining table actions Signed-off-by: Jens Langhammer <jens@goauthentik.io> * add a bunch more tooltips Signed-off-by: Jens Langhammer <jens@goauthentik.io> * update locale Signed-off-by: Jens Langhammer <jens@goauthentik.io> --------- Signed-off-by: Jens Langhammer <jens@goauthentik.io>
This commit is contained in:
@ -100,7 +100,7 @@ export class LibraryApplication extends AKElement {
|
||||
class="pf-c-button pf-m-control pf-m-small pf-m-block"
|
||||
href="/if/admin/#/core/applications/${this.application?.slug}"
|
||||
>
|
||||
<i class="fas fa-pencil-alt"></i> ${msg("Edit")}
|
||||
<i class="fas fa-edit"></i> ${msg("Edit")}
|
||||
</a>
|
||||
`
|
||||
: html``}
|
||||
|
||||
@ -22,6 +22,7 @@ import "@goauthentik/elements/sidebar/Sidebar";
|
||||
import { DefaultTenant } from "@goauthentik/elements/sidebar/SidebarBrand";
|
||||
import "@goauthentik/elements/sidebar/SidebarItem";
|
||||
import { ROUTES } from "@goauthentik/user/Routes";
|
||||
import "@patternfly/elements/pf-tooltip/pf-tooltip.js";
|
||||
|
||||
import { msg } from "@lit/localize";
|
||||
import { CSSResult, TemplateResult, css, html } from "lit";
|
||||
@ -211,7 +212,12 @@ export class UserInterface extends Interface {
|
||||
});
|
||||
}}
|
||||
>
|
||||
<i class="fas fa-code" aria-hidden="true"></i>
|
||||
<pf-tooltip
|
||||
position="top"
|
||||
content=${msg("Open API drawer")}
|
||||
>
|
||||
<i class="fas fa-code" aria-hidden="true"></i>
|
||||
</pf-tooltip>
|
||||
</button>
|
||||
</div>`
|
||||
: html``}
|
||||
@ -238,7 +244,12 @@ export class UserInterface extends Interface {
|
||||
? "pf-m-unread"
|
||||
: ""}"
|
||||
>
|
||||
<i class="fas fa-bell" aria-hidden="true"></i>
|
||||
<pf-tooltip
|
||||
position="top"
|
||||
content=${msg("Open Notification drawer")}
|
||||
>
|
||||
<i class="fas fa-bell" aria-hidden="true"></i>
|
||||
</pf-tooltip>
|
||||
<span class="pf-c-notification-badge__count"
|
||||
>${this.notificationsCount}</span
|
||||
>
|
||||
@ -253,7 +264,9 @@ export class UserInterface extends Interface {
|
||||
type="button"
|
||||
href="#/settings"
|
||||
>
|
||||
<i class="fas fa-cog" aria-hidden="true"></i>
|
||||
<pf-tooltip position="top" content=${msg("Settings")}>
|
||||
<i class="fas fa-cog" aria-hidden="true"></i>
|
||||
</pf-tooltip>
|
||||
</a>
|
||||
</div>`
|
||||
: html``}
|
||||
@ -262,7 +275,9 @@ export class UserInterface extends Interface {
|
||||
href="/flows/-/default/invalidation/"
|
||||
class="pf-c-button pf-m-plain"
|
||||
>
|
||||
<i class="fas fa-sign-out-alt" aria-hidden="true"></i>
|
||||
<pf-tooltip position="top" content=${msg("Sign out")}>
|
||||
<i class="fas fa-sign-out-alt" aria-hidden="true"></i>
|
||||
</pf-tooltip>
|
||||
</a>
|
||||
</div>
|
||||
${this.me.user.isSuperuser
|
||||
|
||||
@ -6,6 +6,7 @@ import "@goauthentik/elements/forms/DeleteBulkForm";
|
||||
import "@goauthentik/elements/forms/ModalForm";
|
||||
import { PaginatedResponse, Table, TableColumn } from "@goauthentik/elements/table/Table";
|
||||
import "@goauthentik/user/user-settings/mfa/MFADeviceForm";
|
||||
import "@patternfly/elements/pf-tooltip/pf-tooltip.js";
|
||||
|
||||
import { msg } from "@lit/localize";
|
||||
import { TemplateResult, html } from "lit";
|
||||
@ -142,7 +143,9 @@ export class MFADevicesPage extends Table<Device> {
|
||||
<ak-user-mfa-form slot="form" deviceType=${item.type} .instancePk=${item.pk}>
|
||||
</ak-user-mfa-form>
|
||||
<button slot="trigger" class="pf-c-button pf-m-plain">
|
||||
<i class="fas fa-edit"></i>
|
||||
<pf-tooltip position="top" content=${msg("Edit")}>
|
||||
<i class="fas fa-edit"></i>
|
||||
</pf-tooltip>
|
||||
</button>
|
||||
</ak-forms-modal>
|
||||
`,
|
||||
|
||||
@ -11,6 +11,7 @@ import "@goauthentik/elements/forms/ModalForm";
|
||||
import { PaginatedResponse } from "@goauthentik/elements/table/Table";
|
||||
import { Table, TableColumn } from "@goauthentik/elements/table/Table";
|
||||
import "@goauthentik/user/user-settings/tokens/UserTokenForm";
|
||||
import "@patternfly/elements/pf-tooltip/pf-tooltip.js";
|
||||
|
||||
import { msg } from "@lit/localize";
|
||||
import { CSSResult, TemplateResult, html } from "lit";
|
||||
@ -155,14 +156,18 @@ export class UserTokenList extends Table<Token> {
|
||||
<ak-user-token-form slot="form" .instancePk=${item.identifier}>
|
||||
</ak-user-token-form>
|
||||
<button slot="trigger" class="pf-c-button pf-m-plain">
|
||||
<i class="fas fa-edit"></i>
|
||||
<pf-tooltip position="top" content=${msg("Edit")}>
|
||||
<i class="fas fa-edit"></i>
|
||||
</pf-tooltip>
|
||||
</button>
|
||||
</ak-forms-modal>
|
||||
<ak-token-copy-button
|
||||
class="pf-c-button pf-m-plain"
|
||||
identifier="${item.identifier}"
|
||||
>
|
||||
<i class="fas fa-copy"></i>
|
||||
<pf-tooltip position="top" content=${msg("Copy token")}>
|
||||
<i class="fas fa-copy"></i>
|
||||
</pf-tooltip>
|
||||
</ak-token-copy-button>
|
||||
`,
|
||||
];
|
||||
|
||||
Reference in New Issue
Block a user