diff --git a/.lighthouserc.json b/.lighthouserc.json
index 7f508bb..f3058c8 100644
--- a/.lighthouserc.json
+++ b/.lighthouserc.json
@@ -17,7 +17,7 @@
"categories:accessibility": [
"error",
{
- "minScore": 0.9
+ "minScore": 1
}
],
"categories.best-practices" : [
diff --git a/Makefile b/Makefile
index 7220484..f2f699c 100644
--- a/Makefile
+++ b/Makefile
@@ -10,6 +10,9 @@ install:
dev: install
open http://localhost:8000 && sh scripts/dev.sh
+format:
+ deno fmt
+
verify-formatting:
deno fmt --check
diff --git a/src/index.html b/src/index.html
index 2590301..c5e115a 100644
--- a/src/index.html
+++ b/src/index.html
@@ -11,7 +11,7 @@
-
+
MiroPad
@@ -28,8 +28,8 @@
xmlns="http://www.w3.org/2000/svg"
width="30px"
height="30px"
- viewBox="0 0 720 720"
- preserveAspectRatio="xMidYMid meet"
+ viewbox="0 0 720 720"
+ preserveaspectratio="xMidYMid meet"
>
<g id="layer101" fill="#000000" stroke="none">
<path
@@ -54,12 +54,17 @@ <h3>✍️ MiroPad</h3>
</div>
</div>
<div>
- <button id="note-info-button" class="icon-button">
+ <button
+ id="note-info-button"
+ class="icon-button"
+ title="info"
+ aria-label="show note information"
+ >
<svg
xmlns="http://www.w3.org/2000/svg"
width="22"
height="22"
- viewBox="0 0 22 22"
+ viewbox="0 0 22 22"
>
<path
d="M11 4c3.86 0 7 3.14 7 7s-3.14 7-7 7-7-3.14-7-7 3.14-7 7-7m0-2a9 9 0 1 0 0 18 9 9 0 0 0 0-18zm1 8h-2v6h2v-6zm-1-4a1 1 0 1 0 0 2 1 1 0 0 0 0-2z"
@@ -74,7 +79,7 @@ <h3>✍️ MiroPad</h3>
title="Create public permalink"
>
<svg
- viewBox="0 0 16 16"
+ viewbox="0 0 16 16"
version="1.1"
width="16"
height="16"
@@ -94,8 +99,8 @@ <h3>✍️ MiroPad</h3>
<main>
<textarea
aria-label="Keep you notes here safely"
- autocomplete
- autofocus
+ autocomplete="autocomplete"
+ autofocus="autofocus"
class="terminal"
></textarea>
<div id="suggestion" class="suggestion"></div>
@@ -103,11 +108,7 @@ <h3>✍️ MiroPad</h3>
<div class="preview hidden markdown-body"></div>
</main>
<aside class="hidden">
- <editable-list
- title="ToDo"
- add-item-text="Add a ToDo: "
- >
- </editable-list>
+ <editable-list title="ToDo" add-item-text="Add a ToDo: "></editable-list>
</aside>
<div id="commander" class="commander hidden">
<div class="palette frost">
@@ -130,7 +131,7 @@ <h3>INFO</h3>
xmlns="http://www.w3.org/2000/svg"
width="22"
height="22"
- viewBox="0 0 22 22"
+ viewbox="0 0 22 22"
>
<path
d="M18.707 4.707l-1.414-1.414L11 9.586 4.707 3.293 3.293 4.707 9.586 11l-6.293 6.293 1.414 1.414L11 12.414l6.293 6.293 1.414-1.414L12.414 11z"
diff --git a/src/js/components/organisms/commander/commands.ts b/src/js/components/organisms/commander/commands.ts
index e46e28f..806371e 100644
--- a/src/js/components/organisms/commander/commands.ts
+++ b/src/js/components/organisms/commander/commands.ts
@@ -130,7 +130,7 @@ export const commands = () => {
{
title: "Save",
key: "s",
- icon: icon(CheckmarkCircleSVG, "save"),
+ icon: icon(CheckmarkCircleSVG, "save note"),
sortTitle: "Save",
call: async () => {
commander.hide();
@@ -156,7 +156,7 @@ export const commands = () => {
},
{
title: "Full MarkDown view",
- icon: icon(FrameExpandSVG, "full view"),
+ icon: icon(FrameExpandSVG, "full view mode"),
sortTitle: "Full view",
key: "shift m",
call: () => {
@@ -167,7 +167,7 @@ export const commands = () => {
...(isUserLoggedIn() ? [sharePublicLinkCommand] : []),
{
title: "Zen mode",
- icon: icon(LeafSVG, "zen mode"),
+ icon: icon(LeafSVG, "switch to zen mode"),
sortTitle: "Zen mode",
key: "shift z",
call: () => {
diff --git a/static/index.html b/static/index.html
index 16b8111..c1d79fd 100644
--- a/static/index.html
+++ b/static/index.html
@@ -8,7 +8,7 @@
<link rel="icon" href="./favicon.ico">
<meta name="theme-color" content="#000000"/>
<meta name="viewport" content="width=device-width, initial-scale=1">
- <link rel="manifest" href="./manifest.json" crossOrigin="use-credentials" />
+ <link rel="manifest" href="./manifest.json" crossorigin="use-credentials"/>
<link rel="apple-touch-icon" href="./images/icons/icon-192x192.png">
<link rel="stylesheet" href="index.css">
<title>
@@ -21,19 +21,15 @@
<div class="brand">
<div id="logo" class="logo">
<div id="circle-loader"></div>
- <svg version="1.0" xmlns="http://www.w3.org/2000/svg" width="30px" height="30px" viewBox="0 0 720 720"
- preserveAspectRatio="xMidYMid meet">
+ <svg version="1.0" xmlns="http://www.w3.org/2000/svg" width="30px" height="30px" viewbox="0 0 720 720" preserveaspectratio="xMidYMid meet">
<g id="layer101" fill="#000000" stroke="none">
- <path
- d="M17 702 c-15 -17 -17 -55 -17 -344 0 -302 1 -326 18 -341 17 -15 55 -17 344 -17 302 0 326 1 341 18 15 17 17 55 17 344 0 302 -1 326 -18 341 -17 15 -55 17 -344 17 -302 0 -326 -1 -341 -18z" />
+ <path d="M17 702 c-15 -17 -17 -55 -17 -344 0 -302 1 -326 18 -341 17 -15 55 -17 344 -17 302 0 326 1 341 18 15 17 17 55 17 344 0 302 -1 326 -18 341 -17 15 -55 17 -344 17 -302 0 -326 -1 -341 -18z"/>
</g>
<g id="layer102" fill="#00d100" stroke="none">
- <path
- d="M124 527 c-2 -7 9 -60 26 -117 42 -141 49 -199 25 -216 -17 -13 -16 -14 17 -14 49 0 62 19 56 83 -5 51 -5 51 11 27 31 -49 79 -90 104 -90 57 0 71 60 42 170 -8 30 -13 55 -11 57 2 2 35 -30 73 -70 105 -110 145 -113 113 -8 -25 79 -27 161 -4 161 9 0 14 6 12 13 -3 6 -15 12 -29 12 -38 0 -51 -37 -45 -127 3 -43 4 -78 1 -78 -2 0 -36 45 -76 100 -58 80 -77 100 -97 100 -20 0 -23 -4 -20 -22 3 -13 16 -71 28 -129 22 -102 22 -139 1 -139 -25 0 -88 85 -138 188 -52 104 -76 132 -89 99z" />
+ <path d="M124 527 c-2 -7 9 -60 26 -117 42 -141 49 -199 25 -216 -17 -13 -16 -14 17 -14 49 0 62 19 56 83 -5 51 -5 51 11 27 31 -49 79 -90 104 -90 57 0 71 60 42 170 -8 30 -13 55 -11 57 2 2 35 -30 73 -70 105 -110 145 -113 113 -8 -25 79 -27 161 -4 161 9 0 14 6 12 13 -3 6 -15 12 -29 12 -38 0 -51 -37 -45 -127 3 -43 4 -78 1 -78 -2 0 -36 45 -76 100 -58 80 -77 100 -97 100 -20 0 -23 -4 -20 -22 3 -13 16 -71 28 -129 22 -102 22 -139 1 -139 -25 0 -88 85 -138 188 -52 104 -76 132 -89 99z"/>
</g>
<g id="layer103" fill="#00fd00" stroke="none">
- <path
- d="M134 534 c-12 -5 -4 -43 32 -164 33 -113 35 -157 8 -177 -17 -12 -17 -13 3 -13 12 0 34 5 49 10 25 10 26 13 21 58 -4 26 -10 58 -13 71 -10 34 7 20 30 -26 34 -66 55 -83 103 -83 36 0 43 3 48 23 8 30 0 89 -19 152 -8 27 -14 50 -12 52 5 5 70 -58 111 -107 37 -45 73 -64 94 -50 9 5 6 22 -9 62 -33 88 -34 194 -1 174 6 -4 11 -2 11 4 0 20 -32 23 -50 4 -15 -15 -19 -35 -20 -89 0 -38 1 -77 2 -85 5 -23 -14 -27 -26 -6 -6 11 -19 29 -29 40 -10 11 -36 49 -59 83 -43 64 -46 67 -71 57 -11 -4 -12 -14 -7 -43 4 -21 10 -42 13 -48 7 -11 16 -61 24 -136 11 -110 -70 -48 -149 114 -25 52 -48 102 -51 112 -6 17 -13 19 -33 11z" />
+ <path d="M134 534 c-12 -5 -4 -43 32 -164 33 -113 35 -157 8 -177 -17 -12 -17 -13 3 -13 12 0 34 5 49 10 25 10 26 13 21 58 -4 26 -10 58 -13 71 -10 34 7 20 30 -26 34 -66 55 -83 103 -83 36 0 43 3 48 23 8 30 0 89 -19 152 -8 27 -14 50 -12 52 5 5 70 -58 111 -107 37 -45 73 -64 94 -50 9 5 6 22 -9 62 -33 88 -34 194 -1 174 6 -4 11 -2 11 4 0 20 -32 23 -50 4 -15 -15 -19 -35 -20 -89 0 -38 1 -77 2 -85 5 -23 -14 -27 -26 -6 -6 11 -19 29 -29 40 -10 11 -36 49 -59 83 -43 64 -46 67 -71 57 -11 -4 -12 -14 -7 -43 4 -21 10 -42 13 -48 7 -11 16 -61 24 -136 11 -110 -70 -48 -149 114 -25 52 -48 102 -51 112 -6 17 -13 19 -33 11z"/>
</g>
</svg>
</div>
@@ -43,62 +39,55 @@ <h3>✍️ MiroPad</h3>
</div>
</div>
<div>
- <button id="note-info-button" class="icon-button">
- <svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 22 22">
- <path d="M11 4c3.86 0 7 3.14 7 7s-3.14 7-7 7-7-3.14-7-7 3.14-7 7-7m0-2a9 9 0 1 0 0 18 9 9 0 0 0 0-18zm1 8h-2v6h2v-6zm-1-4a1 1 0 1 0 0 2 1 1 0 0 0 0-2z">
- </path>
- </svg>
+ <svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewbox="0 0 22 22">
+ <path d="M11 4c3.86 0 7 3.14 7 7s-3.14 7-7 7-7-3.14-7-7 3.14-7 7-7m0-2a9 9 0 1 0 0 18 9 9 0 0 0 0-18zm1 8h-2v6h2v-6zm-1-4a1 1 0 1 0 0 2 1 1 0 0 0 0-2z"></path>
+ </svg>
+ </button>
+ <a id="permalink" class="anchor hidden" aria-hidden="true" title="Create public permalink">
+ <svg viewbox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true">
+ <path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path>
+ </svg>
+ </a>
+ <div class="divider"></div>
+ <div class="menu"></div>
+ </div>
+ </header>
+ <main>
+ <textarea aria-label="Keep you notes here safely" autocomplete="autocomplete" autofocus="autofocus" class="terminal"></textarea>
+ <div id='suggestion' class="suggestion"></div>
+ <div id='notification' class="notification"></div>
+ <div class="preview hidden markdown-body"></div>
+ </main>
+ <aside class="hidden">
+ <editable-list title="ToDo" add-item-text="Add a ToDo: "></editable-list>
+ </aside>
+ <div id="commander" class="commander hidden">
+ <div class="palette frost">
+ <div>
+ <input/>
+ <button class="btn" type="button">
+ Cancel
</button>
- <a id="permalink" class="anchor hidden" aria-hidden="true" title="Create public permalink">
- <svg viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true">
- <path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path>
- </svg>
- </a>
- <div class="divider"></div>
- <div class="menu"></div>
- </div>
- </header>
- <main>
- <textarea aria-label="Keep you notes here safely" autocomplete autofocus class="terminal"></textarea>
- <div id='suggestion' class="suggestion"></div>
- <div id='notification' class="notification"></div>
- <div class="preview hidden markdown-body"></div>
- </main>
- <aside class="hidden">
- <editable-list
- title="ToDo"
- add-item-text="Add a ToDo: "
- >
- </editable-list>
- </aside>
- <div id="commander" class="commander hidden">
- <div class="palette frost">
- <div>
- <input />
- <button class="btn"
- type="button">
- Cancel
- </button>
- </div>
- <ul id="commands"></ul>
</div>
+ <ul id="commands"></ul>
</div>
- <div class="mobile-dock frost">
+ </div>
+ <div class="mobile-dock frost"></div>
+ <aside class="note-info hidden frost">
+ <div class="note-info-header">
+ <h3>INFO</h3>
+ <button id="note-info-close" class="icon-button">
+ <svg class="icon-cross" xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewbox="0 0 22 22">
+ <path d="M18.707 4.707l-1.414-1.414L11 9.586 4.707 3.293 3.293 4.707 9.586 11l-6.293 6.293 1.414 1.414L11 12.414l6.293 6.293 1.414-1.414L12.414 11z"></path>
+ </svg>
+ </button>
</div>
- <aside class="note-info hidden frost">
- <div class="note-info-header">
- <h3>INFO</h3>
- <button id="note-info-close" class="icon-button">
- <svg class="icon-cross" xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 22 22"><path d="M18.707 4.707l-1.414-1.414L11 9.586 4.707 3.293 3.293 4.707 9.586 11l-6.293 6.293 1.414 1.414L11 12.414l6.293 6.293 1.414-1.414L12.414 11z"></path>
- </svg>
- </button>
- </div>
- <div class="details"></div>
- </aside>
- <footer>
- <div class="console hidden"></div>
- </footer>
- <script type="module" src="./index.js"></script>
- </body>
+ <div class="details"></div>
+ </aside>
+ <footer>
+ <div class="console hidden"></div>
+ </footer>
+ <script type="module" src="./index.js"></script>
+</body>
</html>
\ No newline at end of file