cory/tildefriends
5
6
Fork 2
Code Issues 39 Pull Requests Actions Releases 33 Wiki Activity

I did some CSS, and it was kind of OK.

Browse Source 
git-svn-id: https://www.unprompted.com/svn/projects/tildefriends/trunk@4760 ed5197a5-7fde-0310-b194-c3ffbd925b24
This commit is contained in:
Cory McWilliams
2024-01-12 04:23:31 +00:00
parent 4fd155e68a
commit b2e3c04036
9 changed files with 338 additions and 66 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
apps/ssb/tf-app.js
View File

@ -184,8 +184,10 @@ class TfElement extends LitElement {
render_id_picker() {
return html`
<tf-id-picker id="picker" selected=${this.whoami} .ids=${this.ids} .users=${this.users} @change=${this._handle_whoami_changed}></tf-id-picker>
<button @click=${this.create_identity} id="create_identity">Create Identity</button>
<div style="display: flex">
<tf-id-picker style="flex: 1 1" id="picker" selected=${this.whoami} .ids=${this.ids} .users=${this.users} @change=${this._handle_whoami_changed}></tf-id-picker>
<button class="w3-button w3-dark-grey" @click=${this.create_identity} id="create_identity">Create Identity</button>
</div>
`;
}
@ -283,13 +285,19 @@ class TfElement extends LitElement {
});
}
const k_tabs = {
'📰': 'news',
'📡': 'connections',
'💬': 'mentions',
'🔍': 'search',
'👩‍💻': 'query',
};
let tabs = html`
<div>
<input type="button" class="tab" value="News" ?disabled=${self.tab == 'news'} @click=${() => self.set_tab('news')}></input>
<input type="button" class="tab" value="Connections" ?disabled=${self.tab == 'connections'} @click=${() => self.set_tab('connections')}></input>
<input type="button" class="tab" value="Mentions" ?disabled=${self.tab == 'mentions'} @click=${() => self.set_tab('mentions')}></input>
<input type="button" class="tab" value="Search" ?disabled=${self.tab == 'search'} @click=${() => self.set_tab('search')}></input>
<input type="button" class="tab" value="Query" ?disabled=${self.tab == 'query'} @click=${() => self.set_tab('query')}></input>
<div class="w3-bar w3-black">
${Object.entries(k_tabs).map(([k, v]) => html`
<button title=${v} class="w3-bar-item w3-padding-large w3-hover-gray tab ${self.tab == v ? 'w3-red' : 'w3-black'}" @click=${() => self.set_tab(v)}>${k}</button>
`)}
</div>
`;
let contents =