diff --git a/static/css/markdown.css b/static/css/markdown.css
index e29ec9e..bd68c7b 100644
--- a/static/css/markdown.css
+++ b/static/css/markdown.css
@@ -1,11 +1,27 @@
.el-node-markdown {
padding-top: 16px;
- h1 {
- border-bottom: 1px solid #ccc;
+ .heading-container {
+ display: grid;
+ grid-template-columns: min-content 1fr;
+ grid-gap: 16px;
+ white-space: nowrap;
+ align-items: center;
margin-top: 32px;
margin-bottom: 8px;
+ &:first-child {
+ margin-top: 32px;
+ }
+
+ .line {
+ border-bottom: 1px solid var(--line-color);
+ }
+ }
+
+ h1 {
+ border-bottom: 1px solid #ccc;
+
display: inline-block;
font-size: 1.25em;
@@ -14,24 +30,33 @@
background-color: var(--color1);
padding: 4px 12px;
- &:first-child {
- margin-top: 32px;
- }
+ margin-top: 0px;
+ margin-bottom: 0px;
+
}
h2 {
font-size: 1.25em;
- margin-top: 32px;
+ margin-top: 0px;
margin-bottom: 0px;
color: var(--color1);
}
+ h2+.line,
+ h3+.line {
+ border-bottom: none !important;
+ }
+
h3:before {
font-size: 1.0em;
content: "> ";
color: var(--color1);
}
+ a {
+ color: var(--color1);
+ }
+
p {
line-height: 150%;
}
diff --git a/static/css/notes2.css b/static/css/notes2.css
index b4d7e02..9805b82 100644
--- a/static/css/notes2.css
+++ b/static/css/notes2.css
@@ -307,65 +307,28 @@ button {
}
n2-syncprogress {
- --radius: 8px;
+ position: absolute;
+ top: 16px;
+ right: 16px;
+ padding: 8px 16px;
+ z-index: 16384;
+ border-radius: 6px;
+ font-weight: bold;
+ background-color: var(--color1);
+ color: #fff;
display: grid;
- grid-area: sync;
- display: grid;
- justify-items: center;
+ grid-template-columns: min-content repeat(3, min-content);
+ grid-gap: 8px 8px;
+ white-space: nowrap;
align-items: center;
+ justify-items: end;
- position: relative;
-
- opacity: 0;
- transition: height 0s 500ms, opacity 500ms linear, visibility 0s 500ms;
-
- &.show {
- opacity: 1;
- transition: visibility, height 0s, opacity 500ms linear;
+ img {
+ grid-row: 1/3;
+ height: 34px;
+ margin-right: 8px;
}
-
- progress {
- width: 100%;
- height: 24px;
- border-radius: 8px;
- }
-
- .count {
- position: absolute;
- top: 16px;
- width: 100%;
- white-space: nowrap;
- color: #888;
- text-align: center;
- font-size: 12pt;
- font-weight: bold;
- }
-
- progress[value]::-webkit-progress-bar {
- background-color: #eee;
- box-shadow: 0 2px var(--radius) rgba(0, 0, 0, 0.25) inset;
- border-radius: var(--radius);
- }
-
- progress[value]::-moz-progress-bar {
- background-color: #eee;
- box-shadow: 0 2px var(--radius) rgba(0, 0, 0, 0.25) inset;
- border-radius: var(--radius);
- }
-
- progress[value]::-webkit-progress-value {
- background: rgb(186, 95, 89);
- background: linear-gradient(180deg, rgba(186, 95, 89, 1) 0%, rgba(254, 95, 85, 1) 50%, rgba(186, 95, 89, 1) 100%);
- border-radius: var(--radius);
- }
-
- progress[value]::-moz-progress-value {
- background: rgb(186, 95, 89);
- background: linear-gradient(180deg, rgba(186, 95, 89, 1) 0%, rgba(254, 95, 85, 1) 50%, rgba(186, 95, 89, 1) 100%);
- border-radius: var(--radius);
- }
-
}
/* ============================================================= */
diff --git a/static/images/icon_transfer.svg b/static/images/icon_transfer.svg
new file mode 100644
index 0000000..59c900e
--- /dev/null
+++ b/static/images/icon_transfer.svg
@@ -0,0 +1,49 @@
+
+
+
+
diff --git a/static/js/app.mjs b/static/js/app.mjs
index 688b476..38aebd4 100644
--- a/static/js/app.mjs
+++ b/static/js/app.mjs
@@ -199,6 +199,7 @@ export class App {
_mbus.dispatch('NODE_UI_OPEN', node)
_mbus.dispatch('TREE_EXPANSION', { expand: false, when: 'narrow' })
_mbus.dispatch('NODE_UNMODIFIED')
+ _mbus.dispatch('SHOW_PAGE', { page: 'node' })
}//}}}
pageIsVisible(page) {// {{{
let classList = document.querySelector('#main-page').classList
diff --git a/static/js/marked_position.mjs b/static/js/marked_position.mjs
index 62a6996..175f490 100644
--- a/static/js/marked_position.mjs
+++ b/static/js/marked_position.mjs
@@ -114,7 +114,12 @@ export class MarkedPosition {
renderer: {
heading(token) {
const content = this.parser.parseInline(token.tokens)
- return `${content}\n`
+ return `
+
+ `
},
paragraph(token) {
diff --git a/static/js/sidebar.mjs b/static/js/sidebar.mjs
index 285fd44..da05750 100644
--- a/static/js/sidebar.mjs
+++ b/static/js/sidebar.mjs
@@ -346,7 +346,8 @@ export class N2Sidebar extends CustomHTMLElement {
}
if (siblingBefore !== null && siblingExpanded && siblingBefore.hasChildren()) {
- _mbus.dispatch("GO_TO_NODE", { nodeUUID: siblingBefore.Children[siblingBefore.Children.length - 1]?.UUID, dontPush: false, dontExpand: true })
+ const nodeVisuallyAbove = this.getLastExpandedNode(siblingBefore)
+ _mbus.dispatch("GO_TO_NODE", { nodeUUID: nodeVisuallyAbove.UUID, dontPush: false, dontExpand: true })
return
}
diff --git a/static/js/sync.mjs b/static/js/sync.mjs
index 291e0b9..47777f5 100644
--- a/static/js/sync.mjs
+++ b/static/js/sync.mjs
@@ -166,8 +166,9 @@ export class N2SyncProgress extends CustomHTMLElement {
static {// {{{
this.tmpl = document.createElement('template')
this.tmpl.innerHTML = `
-
- 0 / 0
+ 
+ 0
/
0
+ 0
/
0
`
}// }}}
constructor() {//{{{
@@ -211,9 +212,8 @@ export class N2SyncProgress extends CustomHTMLElement {
this.render()
}//}}}
render() {//{{{
- this.elProgress.max = this.state.nodesToSync
- this.elProgress.value = this.state.nodesSynced
- this.elCount.innerText = `${this.state.nodesSynced} / ${this.state.nodesToSync}`
+ this.elDownloadTransferred.innerText = this.state.nodesSynced
+ this.elDownloadTotal.innerText = this.state.nodesToSync
}//}}}
setSyncState(state) {// {{{
if (state)
diff --git a/views/pages/notes2.gotmpl b/views/pages/notes2.gotmpl
index 1142eda..422b672 100644
--- a/views/pages/notes2.gotmpl
+++ b/views/pages/notes2.gotmpl
@@ -22,6 +22,8 @@
+
+