Rejiggled error display.

This commit is contained in:
2024-04-17 20:56:33 -04:00
parent 848ef21c7c
commit 5448e773d8
4 changed files with 75 additions and 42 deletions

View File

@ -169,15 +169,35 @@ class TfNavigationElement extends LitElement {
style="text-overflow: ellipsis; overflow: hidden; white-space: nowrap; max-width: 100%"
@click=${self.toggle_id_dropdown}
>
${self.names[this.identity]}${self.names[this.identity] === this.identity ? '' : html` - ${this.identity}`}
${self.names[this.identity]}${self.names[this.identity] ===
this.identity
? ''
: html` - ${this.identity}`}
</button>
<div id="id_dropdown" class="w3-dropdown-content w3-bar-block w3-card-4" style="max-width: 100%">
<button class="w3-bar-item w3-button w3-border" @click=${() => window.location.href = "/~core/identity"}>Manage Identities...</button>
<button class="w3-bar-item w3-button w3-border" @click=${self.edit_profile}>Edit Profile...</button>
<div
id="id_dropdown"
class="w3-dropdown-content w3-bar-block w3-card-4"
style="max-width: 100%"
>
<button
class="w3-bar-item w3-button w3-border"
@click=${() => (window.location.href = '/~core/identity')}
>
Manage Identities...
</button>
<button
class="w3-bar-item w3-button w3-border"
@click=${self.edit_profile}
>
Edit Profile...
</button>
${this.identities.map(
(x) => html`
<button
class="w3-bar-item w3-button ${x === self.identity ? 'w3-cyan' : ''}"
class="w3-bar-item w3-button ${x === self.identity
? 'w3-cyan'
: ''}"
@click=${() => self.set_active_identity(x)}
style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap"
>
@ -243,6 +263,10 @@ class TfNavigationElement extends LitElement {
}
}
clear_error() {
this.status = {};
}
/**
* TODOC
* @returns
@ -319,22 +343,23 @@ class TfNavigationElement extends LitElement {
@click=${() => (self.show_permissions = !self.show_permissions)}
>🎛️</a
>
${status.message
? html`
<span
class="w3-bar-item"
style="vertical-align: top; white-space: pre; color: ${this
.status.color ?? kErrorColor}"
>${this.status.message}</span
>
`
: undefined}
${this.render_permissions()}
${Object.keys(this.spark_lines)
.sort()
.map((x) => this.spark_lines[x])}
${this.render_login()} ${this.render_identity()}
</div>
${this.status.message
? html`
<link type="text/css" rel="stylesheet" href="/static/w3.css" />
<div class="w3-model w3-animate-top" style="position: absolute; left: 50%; transform: translate(-50%); z-index: 1">
<dijv class="w3-modal-content w3-card-4" style="display: block; padding: 1em">
<span @click=${self.clear_error} class="w3-button w3-display-topright">&times;</span>
<div style="color: ${this.status.color ?? kErrorColor}"><b>ERROR:</b><p style="white-space: pre">${this.status.message}</p></div>
</div>
</div>
`
: undefined}
`;
}
}