fix: google analytics gtag forwarding issue

- update toc and code copy button styling
- add unicode_range.py

astro.config.ts

@@ -55,7 +55,7 @@ export default defineConfig({
     mdx(),
     partytown({
       config: {
-        forward: ['dataLayer.push'],
+        forward: ['dataLayer.push', 'gtag'],
       },
     }),
     sitemap(),

public/fonts/Font Subset List/unicode_range.py

@@ -0,0 +1,49 @@
+#!/usr/bin/env python3
+from fontTools.ttLib import TTFont
+import sys
+
+def get_unicode_range(font_file):
+    """Extract unicode-range from font file"""
+    try:
+        # Load the font file
+        font = TTFont(font_file)
+        cmap = font.getBestCmap()
+        
+        # Get Unicode code points for all characters
+        unicode_points = sorted(cmap.keys())
+        
+        # Merge consecutive code points into ranges
+        ranges = []
+        start = unicode_points[0]
+        end = start
+        
+        for point in unicode_points[1:]:
+            if point == end + 1:
+                end = point
+            else:
+                # Add a range
+                if start == end:
+                    ranges.append(f"U+{start:04X}")
+                else:
+                    ranges.append(f"U+{start:04X}-{end:04X}")
+                start = end = point
+        
+        # Add the final range
+        if start == end:
+            ranges.append(f"U+{start:04X}")
+        else:
+            ranges.append(f"U+{start:04X}-{end:04X}")
+        
+        # Generate CSS format
+        return "unicode-range: " + ",".join(ranges) + ";"
+        
+    except:
+        return "Error: Unable to process this font file"
+
+# Usage
+if __name__ == "__main__":
+    if len(sys.argv) != 2:
+        print("Usage: python simple_unicode_range.py fontfile.woff2")
+    else:
+        result = get_unicode_range(sys.argv[1])
+        print(result)

src/components/Widgets/TOC.astro

@@ -96,21 +96,21 @@ const filteredHeadings = headings.filter(heading =>
   --at-apply: 'ml-4 font-semibold 2xl:hidden';
 }
 .toc-list {
-  --at-apply: 'mb-2.3 mt-0 list-none pl-0 space-y-1.1 2xl:(my-1 space-y-1)';
+  --at-apply: 'mb-2.7 mt-1 list-none pl-0 space-y-1.1 2xl:(mb-1 space-y-1)';
 }
 .toc-link-h2, .toc-link-h3, .toc-link-h4 {
   --at-apply: 'text-balance text-sm font-normal no-underline 2xl:(text-3.2 c-secondary/60 transition-colors transition-font-weight ease-out hover:c-secondary hover:font-medium)';
 }
-.toc-list > :first-child {
+/* .toc-list > :first-child {
   --at-apply: 'mt-0';
-}
+} */
 
 /* Initial collapsed state with zero height grid row */
 .accordion-wrapper {
   --at-apply: 'grid rows-[0fr] transition-all duration-350 ease-in-out';
 }
 .accordion-content {
-  --at-apply: 'max-h-58 overflow-hidden pl-4 pr-6 2xl:(max-h-[calc(100vh-26.75rem)] pl-1)';
+  --at-apply: 'max-h-59.5 overflow-hidden pl-4 pr-6 2xl:(max-h-[calc(100vh-26.75rem)] pl-1)';
 }
 
 /* When toggle is checked, expand the wrapper to show content */

src/layouts/Head.astro

@@ -143,6 +143,8 @@ window
 </script>
 
 <!-- Google Analytics -->
+<!-- Define gtag on window object for proper Partytown forwarding -->
+<!-- See https://github.com/QwikDev/partytown/issues/382 -->
 {googleAnalyticsID && (
   <>
     <script
@@ -156,18 +158,18 @@ window
       define:vars={{ googleAnalyticsID, customGoogleAnalyticsJS }}
     >
       window.dataLayer = window.dataLayer || []
-      function gtag(...args) {
+      window.gtag = function () {
-        dataLayer.push(args)
+        // eslint-disable-next-line prefer-rest-params
+        dataLayer.push(arguments)
       }
-      gtag('js', new Date())
+      window.gtag('js', new Date())
-
       if (customGoogleAnalyticsJS) {
-        gtag('config', googleAnalyticsID, {
+        window.gtag('config', googleAnalyticsID, {
           transport_url: new URL(customGoogleAnalyticsJS).origin,
         })
       }
       else {
-        gtag('config', googleAnalyticsID)
+        window.gtag('config', googleAnalyticsID)
       }
     </script>
   </>

src/styles/global.css

@@ -68,7 +68,7 @@ h4:hover .heading-anchor-link svg:hover {
 /* Code Copy Button */
 .code-copy-button {
   --at-apply: 'absolute right-2.2 top-2.2 z-99 aspect-square w-8 cursor-pointer uno-round-border border-secondary/15';
-  --at-apply: 'bg-background c-secondary/80 op-100 hover:c-primary/80 lg:op-0';
+  --at-apply: 'bg-background c-secondary/80 op-100 hover:(border-primary/15 c-primary/80) lg:op-0';
   transition: opacity 300ms ease-out, background-color 150ms ease-out;
 }
 .code-block-wrapper:hover .code-copy-button {