web: app icons v2 (#6410)
* fix more icons stuff Signed-off-by: Jens Langhammer <jens@goauthentik.io> * refactor app icon into separate component Signed-off-by: Jens Langhammer <jens@goauthentik.io> * update locale Signed-off-by: Jens Langhammer <jens@goauthentik.io> * make app icon work correctly in admin list and app view page Signed-off-by: Jens Langhammer <jens@goauthentik.io> --------- Signed-off-by: Jens Langhammer <jens@goauthentik.io>
This commit is contained in:
@ -91,6 +91,11 @@ export class PageHeader extends AKElement {
|
||||
.notification-trigger.has-notifications {
|
||||
color: var(--pf-global--active-color--100);
|
||||
}
|
||||
h1 {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center !important;
|
||||
}
|
||||
`,
|
||||
];
|
||||
}
|
||||
@ -120,10 +125,10 @@ export class PageHeader extends AKElement {
|
||||
renderIcon(): TemplateResult {
|
||||
if (this.icon) {
|
||||
if (this.iconImage && !this.icon.startsWith("fa://")) {
|
||||
return html`<img class="pf-icon" src="${this.icon}" alt="page icon" /> `;
|
||||
return html`<img class="pf-icon" src="${this.icon}" alt="page icon" />`;
|
||||
}
|
||||
const icon = this.icon.replaceAll("fa://", "fa ");
|
||||
return html`<i class=${icon}></i> `;
|
||||
return html`<i class=${icon}></i>`;
|
||||
}
|
||||
return html``;
|
||||
}
|
||||
@ -147,8 +152,8 @@ export class PageHeader extends AKElement {
|
||||
<section class="pf-c-page__main-section pf-m-light">
|
||||
<div class="pf-c-content">
|
||||
<h1>
|
||||
${this.renderIcon()}
|
||||
<slot name="header"> ${this.header} </slot>
|
||||
<slot name="icon">${this.renderIcon()}</slot>
|
||||
<slot name="header">${this.header}</slot>
|
||||
</h1>
|
||||
${this.description ? html`<p>${this.description}</p>` : html``}
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user