From ad86b43767a745e39344242137e3ff69e6500277 Mon Sep 17 00:00:00 2001
From: BobChao87 <bobchao87@gmail.com>
Date: Wed, 29 Dec 2021 01:48:26 -0800
Subject: [PATCH] Change collapsed sidebar state computation

Fixes a bug where the collapsed value was being computed serverside and
causing the sidebar to be expanded by default on mobile.

Related to Issue #44
---
 pages/marathon/_marathon.vue | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/pages/marathon/_marathon.vue b/pages/marathon/_marathon.vue
index 2e80b44b..c9ef71b9 100644
--- a/pages/marathon/_marathon.vue
+++ b/pages/marathon/_marathon.vue
@@ -16,8 +16,7 @@ export default Vue.extend({
   data() {
     return {
       marathonId: this.$route.params.marathon,
-      // Show the sidebar by default on desktop-class devices
-      collapsed: (globalThis.innerWidth ?? 1024) < 1024,
+      collapsed: false,
     };
   },
 
@@ -42,6 +41,11 @@ export default Vue.extend({
     },
   },
 
+  mounted(): void {
+    // Show the sidebar by default on desktop-class devices
+    this.collapsed = (globalThis.innerWidth ?? 1024) < 1024;
+  },
+
   watch: {
     $route(to, from): void {
       // Detect when the path changes (not anchors in the same page or queries)