magnus/Notes2
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Cleaner CSS page management

Browse source
This commit is contained in:
Magnus Åhall 2026-06-12 07:12:38 +02:00
parent cc2415a06d
commit 5dac84efdc
2 changed files with 39 additions and 30 deletions
Download patch file Download diff file Expand all files Collapse all files

50
static/css/notes2.css
View file

@ -218,27 +218,16 @@ button {
} }
} }
/* =============== *
* PAGE MANAGEMENT *
* =============== */
[id^="page-"] { [id^="page-"] {
display: none; display: none;
} }
#main-page { #notes2 {
display: contents; &.page-node {
&:focus-within {
background-color: #faf;
}
&.node {
&.root-node-override {
#page-root {
display: contents;
}
#page-node {
display: none;
}
}
#page-root { #page-root {
display: none; display: none;
@ -249,7 +238,7 @@ button {
} }
} }
&.storage { &.page-storage {
#page-storage { #page-storage {
display: contents; display: contents;
@ -259,7 +248,7 @@ button {
} }
} }
&.history { &.page-history {
#page-history { #page-history {
display: grid; display: grid;
grid-area: n2-pagehistory; grid-area: n2-pagehistory;
@ -267,6 +256,27 @@ button {
n2-pagehistory {} n2-pagehistory {}
} }
} }
&.root-node-override {
[id^="page-"] {
display: none !important;
}
#page-root {
display: contents !important;
}
}
}
#main-page {
display: contents;
&:focus-within {
background-color: #faf;
}
} }
#crumbs { #crumbs {
@ -358,7 +368,7 @@ n2-syncprogress {
} }
#page-root { #page-root {
& > div { &>div {
grid-area: content; grid-area: content;
align-self: start; align-self: start;
margin-top: 64px; margin-top: 64px;

19
static/js/app.mjs
View file

@ -4,6 +4,8 @@ import { N2Sidebar } from 'sidebar'
import { Node } from 'node' import { Node } from 'node'
export class App { export class App {
static PAGES = ['node', 'history', 'storage']
constructor() {// {{{ constructor() {// {{{
this.currentNode = null this.currentNode = null
this.sidebar = new N2Sidebar() this.sidebar = new N2Sidebar()
@ -16,12 +18,15 @@ export class App {
document.getElementById('tree-nodes')?.focus() document.getElementById('tree-nodes')?.focus()
}) })
const mainPage = document.getElementById('main-page') // Start node shows a system-wide page instead of node editing
// since the start node is kind of magic and doesn't fit into
// the syncing system.
const determineNodePage = uuid => { const determineNodePage = uuid => {
const el = document.getElementById('notes2')
if (uuid == ROOT_NODE) if (uuid == ROOT_NODE)
mainPage.classList.add('root-node-override') el.classList.add('root-node-override')
else else
mainPage.classList.remove('root-node-override') el.classList.remove('root-node-override')
} }
_mbus.subscribe('TREE_RENDERED', async () => { _mbus.subscribe('TREE_RENDERED', async () => {
@ -47,13 +52,7 @@ export class App {
}) })
_mbus.subscribe('SHOW_PAGE', ({ detail: { data: { page } } }) => { _mbus.subscribe('SHOW_PAGE', ({ detail: { data: { page } } }) => {
let classList = document.querySelector('#main-page').classList const classList = document.getElementById('notes2').classList
classList.forEach(e =>
classList.remove(e)
)
classList.add(page)
classList = document.querySelector('#notes2').classList
classList.forEach(e => { classList.forEach(e => {
if (e.startsWith('page-')) if (e.startsWith('page-'))
classList.remove(e) classList.remove(e)