theme picker: preselect the saved theme

This commit is contained in:
Tasia Iso 2024-03-21 22:29:39 +01:00
parent a1f221879b
commit 58dbf42a3a
3 changed files with 9 additions and 4 deletions

View File

@ -21,7 +21,7 @@ tfrpc.register(async function getThemes() {
});
tfrpc.register(async function getTheme() {
// TODO
return 'solarized';
return 'gruvbox';
});
tfrpc.register(async function setTheme() {
// TODO

View File

@ -35,7 +35,7 @@ class TfIdentityManagerElement extends LitElement {
try {
const newID = await tfrpc.rpc.addID(words);
if (newID) alert('Successfully imported a new identity');
if (newID) alert('Successfully imported a new identity.');
else alert('This identity already exists or is invalid.');
await tfrpc.rpc.reload();
} catch (err) {

View File

@ -1,4 +1,4 @@
import {LitElement, html} from './lit-all.min.js';
import {LitElement, html, nothing} from './lit-all.min.js';
import * as tfrpc from '/static/tfrpc.js';
class TfThemePickerElement extends LitElement {
@ -16,6 +16,10 @@ class TfThemePickerElement extends LitElement {
async load() {
this.themes = await tfrpc.rpc.getThemes();
this.selected = await tfrpc.rpc.getTheme();
let select = this.renderRoot?.querySelector('#theme-select');
select.value = this.selected;
}
changed(event) {
@ -32,11 +36,12 @@ class TfThemePickerElement extends LitElement {
<select
name="theme"
id="theme-select"
?hidden=${!this.themes?.length}
@change=${this.changed}
>
${(this.themes ?? []).map(
(id) => html`<option value=${id}>${id}</option>`
(name) => html`<option value=${name}>${name}</option>`
)}
</select>
`;