@limcpf/everything-is-a-markdown 0.4.2 → 0.5.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@limcpf/everything-is-a-markdown",
-  "version": "0.4.2",
+  "version": "0.5.0",
   "license": "MIT",
   "private": false,
   "type": "module",

package/src/runtime/app.css

@@ -60,6 +60,10 @@
   --sidebar-mobile-shadow: 0 24px 48px rgba(76, 79, 105, 0.2);
   --accent-hover: #7030d0;
   --accent-strong: #6732ca;
+  --badge-new-bg: var(--latte-red);
+  --badge-new-fg: #ffffff;
+  --mobile-toggle-bg: var(--latte-mauve);
+  --mobile-toggle-fg: #ffffff;
   --desktop-sidebar-default: 420px;
   --desktop-sidebar-min: 320px;
   --desktop-viewer-min: 680px;
@@ -103,6 +107,10 @@
   --sidebar-mobile-shadow: 0 24px 48px rgba(0, 0, 0, 0.45);
   --accent-hover: #a985f6;
   --accent-strong: #dfcbff;
+  --badge-new-bg: var(--mocha-red);
+  --badge-new-fg: var(--mocha-crust);
+  --mobile-toggle-bg: var(--mocha-mauve);
+  --mobile-toggle-fg: var(--mocha-crust);
 }
 
 * {
@@ -483,7 +491,7 @@ a:hover {
   font-size: 0.68rem;
   font-weight: 600;
   letter-spacing: 0.02em;
-  color: var(--latte-overlay1);
+  color: var(--latte-subtext1);
 }
 
 .tree-label {
@@ -534,8 +542,8 @@ a:hover {
   letter-spacing: 0.03em;
   padding: 2px 6px;
   border-radius: 999px;
-  color: white;
-  background: var(--latte-red);
+  color: var(--badge-new-fg);
+  background: var(--badge-new-bg);
 }
 
 /* Active badge */
@@ -590,7 +598,7 @@ a:hover {
 
 .status-encoding {
   font-family: ui-monospace, "SFMono-Regular", Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
-  color: var(--latte-overlay0);
+  color: var(--latte-subtext1);
 }
 
 .sidebar-footer-actions {
@@ -739,8 +747,8 @@ a:hover {
   gap: 6px;
   border: 0;
   border-radius: 999px;
-  background: var(--latte-mauve);
-  color: #fff;
+  background: var(--mobile-toggle-bg);
+  color: var(--mobile-toggle-fg);
   min-height: 48px;
   padding: 0 16px;
   font-size: 0.9rem;
@@ -837,7 +845,7 @@ body.mobile-toggle-left .mobile-menu-toggle {
   min-height: 22px;
   font-size: 0.85rem;
   font-family: ui-monospace, "SFMono-Regular", Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
-  color: var(--latte-subtext0);
+  color: var(--latte-subtext1);
 }
 
 .meta-item {
@@ -855,7 +863,7 @@ body.mobile-toggle-left .mobile-menu-toggle {
   font-size: 0.74rem;
   font-weight: 700;
   letter-spacing: 0.03em;
-  color: var(--latte-overlay1);
+  color: var(--latte-subtext1);
 }
 
 .meta-tags {
@@ -873,7 +881,7 @@ body.mobile-toggle-left .mobile-menu-toggle {
   max-width: 72ch;
   margin: 0 auto;
   text-wrap: pretty;
-  color: var(--latte-subtext0);
+  color: var(--latte-subtext1);
 }
 
 .viewer-content h1,
@@ -930,7 +938,7 @@ body.mobile-toggle-left .mobile-menu-toggle {
   background: rgba(230, 233, 239, 0.5);
   border-radius: 0 8px 8px 0;
   font-style: normal;
-  color: var(--latte-subtext0);
+  color: var(--latte-subtext1);
 }
 
 /* Inline code */

package/src/runtime/app.js

@@ -889,11 +889,15 @@ async function start() {
     }
 
     if (!isCompactLayout()) {
-      sidebar.removeAttribute("aria-hidden");
+      sidebar.removeAttribute("inert");
       return;
     }
 
-    sidebar.setAttribute("aria-hidden", String(!isOpen));
+    if (isOpen) {
+      sidebar.removeAttribute("inert");
+    } else {
+      sidebar.setAttribute("inert", "");
+    }
   };
 
   const openSidebar = () => {

package/src/template.ts

@@ -199,7 +199,9 @@ export function renderAppShellHtml(
 ${headMeta}
     <link rel="preconnect" href="https://fonts.googleapis.com" />
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
-    <link rel="stylesheet" href="${escapeHtmlAttribute(symbolFontStylesheet)}" />
+    <link rel="preload" as="style" href="${escapeHtmlAttribute(symbolFontStylesheet)}" />
+    <link rel="stylesheet" href="${escapeHtmlAttribute(symbolFontStylesheet)}" media="print" onload="this.media='all'" />
+    <noscript><link rel="stylesheet" href="${escapeHtmlAttribute(symbolFontStylesheet)}" /></noscript>
     <link rel="stylesheet" href="${escapeHtmlAttribute(assets.cssHref)}" />
   </head>
   <body>
@@ -330,7 +332,9 @@ export function render404Html(assets: AppShellAssets = DEFAULT_ASSETS): string {
     <title>404 - File-System Blog</title>
     <link rel="preconnect" href="https://fonts.googleapis.com" />
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
-    <link rel="stylesheet" href="${escapeHtmlAttribute(symbolFontStylesheet)}" />
+    <link rel="preload" as="style" href="${escapeHtmlAttribute(symbolFontStylesheet)}" />
+    <link rel="stylesheet" href="${escapeHtmlAttribute(symbolFontStylesheet)}" media="print" onload="this.media='all'" />
+    <noscript><link rel="stylesheet" href="${escapeHtmlAttribute(symbolFontStylesheet)}" /></noscript>
     <link rel="stylesheet" href="${escapeHtmlAttribute(assets.cssHref)}" />
   </head>
   <body>