Show tab names on large enough screens. Inspired by tasio's #61.

This commit is contained in:
Cory McWilliams 2024-05-12 06:58:01 -04:00
parent 47838d5e48
commit f669371349
2 changed files with 3 additions and 2 deletions

View File

@ -1,5 +1,5 @@
{ {
"type": "tildefriends-app", "type": "tildefriends-app",
"emoji": "🐌", "emoji": "🐌",
"previous": "&raSj7ozmSDNGmB6TtjDk7oOiTc33ZN+RrBMASJ2F4cA=.sha256" "previous": "&cN1BLgsD5fU8QzkNbtKR/Ie1fO3miBq8FVSpgNqFbrc=.sha256"
} }

View File

@ -345,13 +345,14 @@ class TfElement extends LitElement {
([k, v]) => html` ([k, v]) => html`
<button <button
title=${v} title=${v}
class="w3-bar-item w3-padding-large w3-hover-theme tab ${self.tab == class="w3-bar-item w3-padding w3-hover-theme tab ${self.tab ==
v v
? 'w3-theme-l2' ? 'w3-theme-l2'
: 'w3-theme-l1'}" : 'w3-theme-l1'}"
@click=${() => self.set_tab(v)} @click=${() => self.set_tab(v)}
> >
${k} ${k}
<span class=${self.tab == v ? '' : 'w3-hide-small'}>${v.charAt(0).toUpperCase() + v.substring(1)}</span>
</button> </button>
` `
)} )}