Add BerkeleyMono font with S3 download for release builds

Author: charlesvien

.github/workflows/twig-release.yml

@@ -12,6 +12,9 @@ concurrency:
 jobs:
   publish:
     runs-on: macos-latest
+    permissions:
+      id-token: write
+      contents: write
     env:
       NODE_OPTIONS: "--max-old-space-size=8192"
       NODE_ENV: production
@@ -68,6 +71,17 @@ jobs:
       - name: Install dependencies
         run: pnpm install --frozen-lockfile
 
+      - name: Configure AWS credentials
+        uses: aws-actions/configure-aws-credentials@v4
+        with:
+          role-to-assume: ${{ secrets.AWS_TWIG_APP_ASSETS_ROLE_ARN }}
+          aws-region: ${{ secrets.AWS_TWIG_APP_ASSETS_REGION }}
+          mask-aws-account-id: true
+          unset-current-credentials: true
+
+      - name: Download BerkeleyMono fonts from S3
+        run: aws s3 cp s3://${{ secrets.AWS_TWIG_APP_ASSETS_BUCKET }}/fonts/ apps/twig/assets/fonts/BerkeleyMono/ --recursive
+
       - name: Build electron-trpc package
         run: pnpm --filter @posthog/electron-trpc run build
 

.gitignore

@@ -50,3 +50,6 @@ test-results/
 
 # Downloaded binaries
 apps/twig/resources/codex-acp/
+
+# Licensed fonts (downloaded from S3 during CI)
+apps/twig/assets/fonts/BerkeleyMono/

apps/twig/src/renderer/styles/globals.css

@@ -2,6 +2,38 @@
 @tailwind components;
 @tailwind utilities;
 
+@font-face {
+  font-family: "Berkeley Mono";
+  src: url("/assets/fonts/BerkeleyMono/BerkeleyMono-Regular.woff2")
+    format("woff2");
+  font-weight: 400;
+  font-style: normal;
+}
+
+@font-face {
+  font-family: "Berkeley Mono";
+  src: url("/assets/fonts/BerkeleyMono/BerkeleyMono-Oblique.woff2")
+    format("woff2");
+  font-weight: 400;
+  font-style: italic;
+}
+
+@font-face {
+  font-family: "Berkeley Mono";
+  src: url("/assets/fonts/BerkeleyMono/BerkeleyMono-Bold.woff2")
+    format("woff2");
+  font-weight: 700;
+  font-style: normal;
+}
+
+@font-face {
+  font-family: "Berkeley Mono";
+  src: url("/assets/fonts/BerkeleyMono/BerkeleyMono-Bold-Oblique.woff2")
+    format("woff2");
+  font-weight: 700;
+  font-style: italic;
+}
+
 @font-face {
   font-family: "JetBrains Mono";
   src: url("/assets/fonts/JetBrainsMono/JetBrainsMono-Light.woff2")
@@ -131,17 +163,17 @@
 .radix-themes {
   /* Font families */
   --default-font-family:
-    "JetBrains Mono", "Monaco", "Menlo", "Ubuntu Mono", "Courier New", monospace;
+    "Berkeley Mono", "JetBrains Mono", "Monaco", "Menlo", "Ubuntu Mono", "Courier New", monospace;
   --heading-font-family:
-    "JetBrains Mono", "Monaco", "Menlo", "Ubuntu Mono", "Courier New", monospace;
+    "Berkeley Mono", "JetBrains Mono", "Monaco", "Menlo", "Ubuntu Mono", "Courier New", monospace;
   --code-font-family:
-    "JetBrains Mono", "Monaco", "Menlo", "Ubuntu Mono", "Courier New", monospace;
+    "Berkeley Mono", "JetBrains Mono", "Monaco", "Menlo", "Ubuntu Mono", "Courier New", monospace;
   --strong-font-family:
-    "JetBrains Mono", "Monaco", "Menlo", "Ubuntu Mono", "Courier New", monospace;
+    "Berkeley Mono", "JetBrains Mono", "Monaco", "Menlo", "Ubuntu Mono", "Courier New", monospace;
   --em-font-family:
-    "JetBrains Mono", "Monaco", "Menlo", "Ubuntu Mono", "Courier New", monospace;
+    "Berkeley Mono", "JetBrains Mono", "Monaco", "Menlo", "Ubuntu Mono", "Courier New", monospace;
   --quote-font-family:
-    "JetBrains Mono", "Monaco", "Menlo", "Ubuntu Mono", "Courier New", monospace;
+    "Berkeley Mono", "JetBrains Mono", "Monaco", "Menlo", "Ubuntu Mono", "Courier New", monospace;
 
   /* Font weights - mapped to JetBrains Mono weights */
   --font-weight-light: 300;
@@ -156,7 +188,7 @@
 
 body {
   font-family:
-    "JetBrains Mono", "Monaco", "Menlo", "Ubuntu Mono", "Courier New", monospace;
+    "Berkeley Mono", "JetBrains Mono", "Monaco", "Menlo", "Ubuntu Mono", "Courier New", monospace;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
 }
@@ -211,7 +243,7 @@ body {
 
 .plan-markdown code {
   font-family:
-    "JetBrains Mono", "Monaco", "Menlo", "Ubuntu Mono", "Courier New", monospace;
+    "Berkeley Mono", "JetBrains Mono", "Monaco", "Menlo", "Ubuntu Mono", "Courier New", monospace;
   font-size: 11px;
   background: rgba(0, 0, 0, 0.2);
   padding: 0 4px;
@@ -546,7 +578,7 @@ body {
 }
 
 .sidebar-tree {
-  font-family: "JetBrains Mono", monospace;
+  font-family: "Berkeley Mono", "JetBrains Mono", monospace;
   font-size: 12px;
   line-height: 1.5;
   color: var(--gray-11);

apps/twig/tailwind.config.js

@@ -46,7 +46,7 @@ module.exports = {
         },
       },
       fontFamily: {
-        mono: ["JetBrains Mono", "Consolas", "Monaco", "monospace"],
+        mono: ["Berkeley Mono", "JetBrains Mono", "Consolas", "Monaco", "monospace"],
       },
     },
   },