Various bug fixes (#128)

* fix: bundle ESM packages to improve library compatibility

* fix: avoid safari rendering bug

* fix: select new tab when creating one

* fix: heading selection rendering on firefox/gecko

Author: LuLaValva

src/routes/+layout.style.scss

@@ -73,6 +73,10 @@ p {
 ::selection {
   color: var(--section-color-dim-alt, var(--color-red-dim-alt));
   background-color: var(--section-color-alt, var(--color-red-alt));
+  -webkit-text-fill-color: var(
+    --section-color-dim-alt,
+    var(--color-red-dim-alt)
+  );
 }
 
 body {

src/routes/playground/tags/playground/tags/editor/tags/tabs/tabs.marko

@@ -89,8 +89,8 @@ div class=styles.tabs
 
       if (filename) {
         if (!filename.includes(".")) filename += ".marko";
+        selected = tabs.length;
         tabs = [...tabs, { path: filename, content: "" }];
-        selected = tabs.length - 1;
       }
     }
     ,class=styles.add

src/styles/sticky.scss

@@ -23,7 +23,17 @@ $pageLinksHeight: 3.5rem;
 }
 
 @mixin supported {
+  // On large screens, exclude Safari because of a rendering bug with scaleY
+  @supports (animation-timeline: scroll()) and (not (-webkit-hyphens: none)) {
+    @media (width >= 48rem) and (height >= 38rem) {
+      @content;
+    }
+  }
+
+  // On small screens, include Safari
   @supports (animation-timeline: scroll()) {
-    @content;
+    @media (width < 48rem) or (height < 38rem) {
+      @content;
+    }
   }
 }

src/util/workspace/cdn-plugin.ts

@@ -14,7 +14,10 @@ export function cdnPlugin(): Plugin {
       }
 
       if (/^[^\0.\/]/.test(id)) {
-        return { id: `https://esm.sh/${id}`, external: true };
+        return {
+          id: `https://esm.sh/${id}?bundle`,
+          external: true,
+        };
       }
     },
   };