aboutsummaryrefslogtreecommitdiffhomepage
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/css/index.css56
-rw-r--r--src/editor.mjs4
2 files changed, 32 insertions, 28 deletions
diff --git a/src/css/index.css b/src/css/index.css
index 53a5587..7ae5906 100644
--- a/src/css/index.css
+++ b/src/css/index.css
@@ -10,42 +10,46 @@
10 10
11body { 11body {
12 width: 100vw; 12 width: 100vw;
13 min-width: 700px;
14 height: 100vh; 13 height: 100vh;
14}
15 15
16 &[data-mode='editing'] { 16main {
17 display: flex; 17 display: flex;
18 align-items: stretch; 18 align-items: stretch;
19 width: 100%;
20 min-width: 700px;
21 height: 100%;
22}
19 23
20 /* gap: 0.5em; */ 24main[data-mode='editing'] {
25 /* gap: 0.5em; */
21 26
22 padding: 0.5em; 27 padding: 0.5em;
23 28
24 .Dumby { 29 .Dumby {
25 flex: 0 0 50%; 30 flex: 0 0 50%;
26 min-width: 45%; 31 min-width: 45%;
27 max-width: calc(50% - 0.5em); 32 max-width: calc(50% - 0.5em);
28 height: 100%; 33 height: 100%;
29 34
30 border: var(--content-border); 35 border: var(--content-border);
31 border-radius: var(--content-border-radius); 36 border-radius: var(--content-border-radius);
32 order: 1; 37 order: 1;
33 38
34 &.focus { 39 &.focus {
35 border: var(--content-focus-border); 40 border: var(--content-focus-border);
36 outline: var(--content-focus-border); 41 outline: var(--content-focus-border);
37 }
38 } 42 }
43 }
39 44
40 .editor { 45 .editor {
41 display: block; 46 display: block;
42 flex: 0 0 50%; 47 flex: 0 0 50%;
43 min-width: 45%; 48 min-width: 45%;
44 max-width: calc(50% - 0.5em); 49 max-width: calc(50% - 0.5em);
45 height: 100%; 50 height: 100%;
46 51
47 order: 2; 52 order: 2;
48 }
49 } 53 }
50} 54}
51 55
diff --git a/src/editor.mjs b/src/editor.mjs
index ad1a863..f6c7dab 100644
--- a/src/editor.mjs
+++ b/src/editor.mjs
@@ -32,7 +32,7 @@ new window.MutationObserver(mutaions => {
32 const mutation = mutaions.at(-1) 32 const mutation = mutaions.at(-1)
33 const layout = dumbyContainer.dataset.layout 33 const layout = dumbyContainer.dataset.layout
34 if (layout !== 'normal' || mutation.oldValue === 'normal') { 34 if (layout !== 'normal' || mutation.oldValue === 'normal') {
35 delete context.dataset.mode 35 context.dataset.mode = ''
36 } 36 }
37}).observe(dumbyContainer, { 37}).observe(dumbyContainer, {
38 attributes: true, 38 attributes: true,
@@ -92,7 +92,7 @@ new window.MutationObserver(() => {
92const toggleEditing = () => { 92const toggleEditing = () => {
93 const mode = context.dataset.mode 93 const mode = context.dataset.mode
94 if (mode === 'editing') { 94 if (mode === 'editing') {
95 delete context.dataset.mode 95 context.dataset.mode = ''
96 } else { 96 } else {
97 context.dataset.mode = 'editing' 97 context.dataset.mode = 'editing'
98 } 98 }