quick fix

src/app.tsx

@@ -160,10 +160,10 @@ function AppLayout(props: { children: any }) {
         <LeftBar />
         <div
           id="center-body"
-          class="bg-base relative h-screen w-screen overflow-x-hidden md:ml-62.5 md:w-[calc(100vw-500px)]"
+          class="bg-base relative h-screen w-screen overflow-x-hidden md:ml-62.5 md:w-[calc(100vw-500px)] 2xl:ml-72 2xl:w-[calc(100vw-576px)]"
         >
           <noscript>
-            <div class="bg-yellow text-crust border-text fixed top-0 z-150 border-b-2 p-4 text-center font-semibold md:w-[calc(100vw-500px)]">
+            <div class="bg-yellow text-crust border-text fixed top-0 z-150 border-b-2 p-4 text-center font-semibold md:w-[calc(100vw-500px)] xl:ml-72 xl:w-[calc(100vw-576px)]">
               JavaScript is disabled. Features will be limited.
             </div>
           </noscript>

src/components/Bars.tsx

@@ -366,7 +366,7 @@ export function LeftBar() {
   const getMainNavStyles = () => {
     const baseStyles = {
       "transition-timing-function": "cubic-bezier(0.4, 0, 0.2, 1)",
-      width: "250px",
+      width: windowWidth() < 1536 ? "250px" : "288px",
       "padding-top": "env(safe-area-inset-top)",
       "padding-bottom": "env(safe-area-inset-bottom)"
     };

src/components/Btop.tsx

@@ -39,10 +39,10 @@ export function Btop(props: BtopProps) {
 
   onMount(() => {
     if (typeof window !== "undefined") {
-      setIsMobile(window.innerWidth < BREAKPOINTS.MOBILE);
+      setIsMobile(window.innerWidth < BREAKPOINTS.MOBILE_MAX_WIDTH);
 
       const handleResize = () => {
-        setIsMobile(window.innerWidth < BREAKPOINTS.MOBILE);
+        setIsMobile(window.innerWidth < BREAKPOINTS.MOBILE_MAX_WIDTH);
       };
       window.addEventListener("resize", handleResize);
       onCleanup(() => window.removeEventListener("resize", handleResize));

src/context/bars.tsx

@@ -1,8 +1,6 @@
 import { Accessor, createContext, useContext } from "solid-js";
 import { createSignal } from "solid-js";
 
-export const STATIC_BAR_SIZE = 250;
-
 const BarsContext = createContext<{
   leftBarVisible: Accessor<boolean>;
   setLeftBarVisible: (visible: boolean) => void;

src/env/server.ts

@@ -5,8 +5,8 @@ const serverEnvSchema = z.object({
   JWT_SECRET_KEY: z.string().min(1),
   AWS_REGION: z.string().min(1),
   AWS_S3_BUCKET_NAME: z.string().min(1),
-  _AWS_ACCESS_KEY: z.string().min(1),
-  _AWS_SECRET_KEY: z.string().min(1),
+  MY_AWS_ACCESS_KEY: z.string().min(1),
+  MY_AWS_SECRET_KEY: z.string().min(1),
   GOOGLE_CLIENT_SECRET: z.string().min(1),
   GITHUB_CLIENT_SECRET: z.string().min(1),
   EMAIL_SERVER: z.string().min(1),
@@ -113,8 +113,8 @@ export const getMissingEnvVars = (): string[] => {
     "JWT_SECRET_KEY",
     "AWS_REGION",
     "AWS_S3_BUCKET_NAME",
-    "_AWS_ACCESS_KEY",
-    "_AWS_SECRET_KEY",
+    "MY_AWS_ACCESS_KEY",
+    "MY_AWS_SECRET_KEY",
     "GOOGLE_CLIENT_SECRET",
     "GITHUB_CLIENT_SECRET",
     "EMAIL_SERVER",

src/routes/api/Gaze/appcast.xml.ts

@@ -13,8 +13,8 @@ export async function GET(event: APIEvent) {
   const key = "api/Gaze/appcast.xml";
 
   const credentials = {
-    accessKeyId: env._AWS_ACCESS_KEY,
-    secretAccessKey: env._AWS_SECRET_KEY
+    accessKeyId: env.MY_AWS_ACCESS_KEY,
+    secretAccessKey: env.MY_AWS_SECRET_KEY
   };
 
   try {

src/routes/api/downloads/[filename].ts

@@ -25,7 +25,10 @@ export async function GET(event: APIEvent) {
   }
 
   // Validate filename format (only allow Gaze files)
-    if (!filename.startsWith("Gaze") || (!filename.endsWith(".dmg") && !filename.endsWith(".delta"))) {
+  if (
+    !filename.startsWith("Gaze") ||
+    (!filename.endsWith(".dmg") && !filename.endsWith(".delta"))
+  ) {
     return new Response("Invalid file format", {
       status: 400,
       headers: {
@@ -38,8 +41,8 @@ export async function GET(event: APIEvent) {
   const key = `downloads/${filename}`;
 
   const credentials = {
-        accessKeyId: env._AWS_ACCESS_KEY,
-        secretAccessKey: env._AWS_SECRET_KEY
+    accessKeyId: env.MY_AWS_ACCESS_KEY,
+    secretAccessKey: env.MY_AWS_SECRET_KEY
   };
 
   try {

src/server/api/routers/downloads.test.ts

@@ -27,8 +27,8 @@ vi.mock("@aws-sdk/s3-request-presigner", () => ({
 
 // Mock environment variables
 process.env.AWS_REGION = "us-east-1";
-process.env._AWS_ACCESS_KEY = "test-access-key";
-process.env._AWS_SECRET_KEY = "test-secret-key";
+process.env.MY_AWS_ACCESS_KEY = "test-access-key";
+process.env.MY_AWS_SECRET_KEY = "test-secret-key";
 process.env.VITE_DOWNLOAD_BUCKET_STRING = "test-bucket";
 
 describe("downloads router", () => {

src/server/api/routers/downloads.ts

@@ -1,6 +1,10 @@
 import { createTRPCRouter, publicProcedure } from "../utils";
 import { z } from "zod";
-import { S3Client, GetObjectCommand, ListObjectsV2Command } from "@aws-sdk/client-s3";
+import {
+  S3Client,
+  GetObjectCommand,
+  ListObjectsV2Command
+} from "@aws-sdk/client-s3";
 import { getSignedUrl } from "@aws-sdk/s3-request-presigner";
 import { env } from "~/env/server";
 import { TRPCError } from "@trpc/server";
@@ -14,7 +18,10 @@ const assets: Record<string, string> = {
 /**
  * Get the latest Gaze DMG from S3 by finding the most recent file in downloads/ folder
  */
-async function getLatestGazeDMG(client: S3Client, bucket: string): Promise<string> {
+async function getLatestGazeDMG(
+  client: S3Client,
+  bucket: string
+): Promise<string> {
   try {
     const listCommand = new ListObjectsV2Command({
       Bucket: bucket,
@@ -29,9 +36,9 @@ async function getLatestGazeDMG(client: S3Client, bucket: string): Promise<strin
     }
 
     // Filter for .dmg files only and sort by LastModified (newest first)
-    const dmgFiles = response.Contents
-      .filter((obj) => obj.Key?.endsWith(".dmg"))
-      .sort((a, b) => {
+    const dmgFiles = response.Contents.filter((obj) =>
+      obj.Key?.endsWith(".dmg")
+    ).sort((a, b) => {
       const dateA = a.LastModified?.getTime() || 0;
       const dateB = b.LastModified?.getTime() || 0;
       return dateB - dateA; // Descending order (newest first)
@@ -57,8 +64,8 @@ export const downloadsRouter = createTRPCRouter({
       const bucket = env.VITE_DOWNLOAD_BUCKET_STRING;
 
       const credentials = {
-        accessKeyId: env._AWS_ACCESS_KEY,
-        secretAccessKey: env._AWS_SECRET_KEY
+        accessKeyId: env.MY_AWS_ACCESS_KEY,
+        secretAccessKey: env.MY_AWS_SECRET_KEY
       };
 
       const client = new S3Client({
@@ -98,7 +105,10 @@ export const downloadsRouter = createTRPCRouter({
         console.error(error);
         throw new TRPCError({
           code: "INTERNAL_SERVER_ERROR",
-          message: error instanceof Error ? error.message : "Failed to generate download URL"
+          message:
+            error instanceof Error
+              ? error.message
+              : "Failed to generate download URL"
         });
       }
     })

src/server/api/routers/misc.ts

@@ -46,8 +46,8 @@ export const miscRouter = createTRPCRouter({
       }
 
       const credentials = {
-        accessKeyId: env._AWS_ACCESS_KEY,
-        secretAccessKey: env._AWS_SECRET_KEY
+        accessKeyId: env.MY_AWS_ACCESS_KEY,
+        secretAccessKey: env.MY_AWS_SECRET_KEY
       };
 
       try {
@@ -80,8 +80,8 @@ export const miscRouter = createTRPCRouter({
     )
     .mutation(async ({ input }) => {
       const credentials = {
-        accessKeyId: env._AWS_ACCESS_KEY,
-        secretAccessKey: env._AWS_SECRET_KEY
+        accessKeyId: env.MY_AWS_ACCESS_KEY,
+        secretAccessKey: env.MY_AWS_SECRET_KEY
       };
 
       try {
@@ -135,8 +135,8 @@ export const miscRouter = createTRPCRouter({
     .query(async ({ input }) => {
       try {
         const credentials = {
-          accessKeyId: env._AWS_ACCESS_KEY,
-          secretAccessKey: env._AWS_SECRET_KEY
+          accessKeyId: env.MY_AWS_ACCESS_KEY,
+          secretAccessKey: env.MY_AWS_SECRET_KEY
         };
 
         const client = new S3Client({
@@ -195,8 +195,8 @@ export const miscRouter = createTRPCRouter({
     .mutation(async ({ input }) => {
       try {
         const credentials = {
-          accessKeyId: env._AWS_ACCESS_KEY,
-          secretAccessKey: env._AWS_SECRET_KEY
+          accessKeyId: env.MY_AWS_ACCESS_KEY,
+          secretAccessKey: env.MY_AWS_SECRET_KEY
         };
 
         const s3params = {
@@ -234,8 +234,8 @@ export const miscRouter = createTRPCRouter({
     .mutation(async ({ input }) => {
       try {
         const credentials = {
-          accessKeyId: env._AWS_ACCESS_KEY,
-          secretAccessKey: env._AWS_SECRET_KEY
+          accessKeyId: env.MY_AWS_ACCESS_KEY,
+          secretAccessKey: env.MY_AWS_SECRET_KEY
         };
 
         const s3params = {