cory/tildefriends
4
5
Fork 1
Code Issues 33 Pull Requests 1 Actions 1 Releases 27 Wiki Activity

Show selected and hovered items in the wiki table of contents.

Browse Source 
git-svn-id: https://www.unprompted.com/svn/projects/tildefriends/trunk@4675 ed5197a5-7fde-0310-b194-c3ffbd925b24
This commit is contained in:
Cory McWilliams 2023-12-12 17:38:10 +00:00
parent 94dd573a81
commit 0b47207949
2 changed files with 13 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
apps/wiki.json
View File

@ -1,5 +1,5 @@
{ {
"type": "tildefriends-app", "type": "tildefriends-app",
"emoji": "📝", "emoji": "📝",
"previous": "&FapSqeXK/JbtaIuh3Ot6SNJ1hR7kGRqZwiML5t5GdGw=.sha256" "previous": "&58whE4qyKCpHyOXRE/wF78B4oGn9DhJHiJcVMPZB2pU=.sha256"
} }

16
apps/wiki/tf-wiki-app.js
View File

@ -240,6 +240,14 @@ class TfCollectionsAppElement extends LitElement {
render() { render() {
let self = this; let self = this;
return html` return html`
<style>
.toc:hover {
background-color: #f00;
}
.toc.selected {
border: 1px solid #fff;
}
</style>
<div> <div>
<tf-id-picker .ids=${this.ids} selected=${this.whoami} @change=${this.on_whoami_changed} ?hidden=${!this.ids?.length}></tf-id-picker> <tf-id-picker .ids=${this.ids} selected=${this.whoami} @change=${this.on_whoami_changed} ?hidden=${!this.ids?.length}></tf-id-picker>
</div> </div>
@ -280,11 +288,11 @@ class TfCollectionsAppElement extends LitElement {
</div> </div>
<div style="display: flex; flex-direction: row"> <div style="display: flex; flex-direction: row">
<div style="flex: 0 0"> <div style="flex: 0 0">
${Object.values(this.wikis || {}).map(wiki => html` ${Object.values(this.wikis || {}).sort((x, y) => x.name.localeCompare(y.name)).map(wiki => html`
<div style="white-space: nowrap" @click=${() => self.on_wiki_changed({detail: {value: wiki}})}>${wiki.name}</div> <div class="toc ${self.wiki?.id === wiki.id ? 'selected' : ''}" style="white-space: nowrap; cursor: pointer" @click=${() => self.on_wiki_changed({detail: {value: wiki}})}>${wiki.name}</div>
<ul> <ul>
${Object.values(self.wiki_docs || {}).filter(doc => doc.parent === wiki?.id).map(doc => html` ${Object.values(self.wiki_docs || {}).filter(doc => doc.parent === wiki?.id).sort((x, y) => x.name.localeCompare(y.name)).map(doc => html`
<li style="white-space: nowrap" @click=${() => self.on_wiki_doc_changed({detail: {value: doc}})}>${doc.name}</li> <li class="toc ${self.wiki_doc?.id === doc.id ? 'selected' : ''}" style="white-space: nowrap; cursor: pointer" @click=${() => self.on_wiki_doc_changed({detail: {value: doc}})}>${doc.name}</li>
`)} `)}
</ul> </ul>
`)} `)}