Better mobile view

This commit is contained in:
Magnus Åhall 2026-06-02 22:50:15 +02:00
parent 1d75aa8c3e
commit 3bd0819cbc
4 changed files with 141 additions and 25 deletions

View file

@ -6,13 +6,23 @@ export class N2Tree extends CustomHTMLElement {
static {// {{{
this.tmpl = document.createElement('template')
this.tmpl.innerHTML = `
<div data-el="logo" id="logo">
<style>
n2-tree {
.el-hide-tree {
font-size: 1.25em;
font-weight: bold;
cursor: pointer;
}
}
</style>
<div id="logo">
<img src="/images/${_VERSION}/logo_small.svg" />
<img src="/images/${_VERSION}/logo.svg" />
<img data-el="search" class='search' src="/images/${_VERSION}/icon_search.svg" style="height: 22px" />
<img data-el="logo" src="/images/${_VERSION}/logo.svg" />
<div data-el="hide-tree">&lt;</div>
</div>
<div class="icons">
<img data-el="sync" class='sync colorize' src="/images/${_VERSION}/icon_refresh.svg" />
<img data-el="search" class='search' src="/images/${_VERSION}/icon_search.svg" style="height: 22px" />
<img data-el="settings" class='settings colorize' src="/images/${_VERSION}/icon_settings.svg" />
</div>
<div data-el="treenodes"></div>
@ -35,6 +45,11 @@ export class N2Tree extends CustomHTMLElement {
this.elSearch.addEventListener('click', () => _mbus.dispatch('op-search'))
this.elSync.addEventListener('click', () => _sync.run())
this.elLogo.addEventListener('click', () => _app.goToNode(ROOT_NODE, false, false))
this.elHideTree.addEventListener('click', event=>{
event.stopPropagation()
document.getElementById('notes2').classList.add('hide-tree')
document.getElementById('notes2').classList.remove('show-tree')
})
_mbus.subscribe('NODE_MODIFIED', ({ detail }) => {
const node = detail.data.node