From b975c0332e1ff1b0982ee8f152f64013c9c98c21 Mon Sep 17 00:00:00 2001
From: Hykilpikonna <admin@moecraft.cc>
Date: Sun, 12 Apr 2020 13:52:31 -0400
Subject: [PATCH] [F] Dynamically update width with js

---
 src/pages/course-selection/course-selection.vue | 13 +++++++++++--
 1 file changed, 11 insertions(+), 2 deletions(-)

diff --git a/src/pages/course-selection/course-selection.vue b/src/pages/course-selection/course-selection.vue
index 766d6b5..46fa33b 100644
--- a/src/pages/course-selection/course-selection.vue
+++ b/src/pages/course-selection/course-selection.vue
@@ -21,8 +21,8 @@
 
             <!-- Course list -->
             <el-col :span="8" class="overall-span">
-                <el-card id="course-list" class="large right">
-                    <div class="header">
+                <el-card id="course-list" ref="cl" class="large right">
+                    <div class="header" :style="{width: courseListWidth + 'px'}">
                         <div class="text">Course List</div>
 
                         <!-- Search -->
@@ -54,6 +54,8 @@
         directory: any[] = []
         loading = true
 
+        courseListWidth: number = 10;
+
         created()
         {
             // Get courses
@@ -73,6 +75,12 @@
             })
         }
 
+        updated()
+        {
+            console.log(this.$refs);
+            this.courseListWidth = (<Vue> this.$refs.cl).$el.clientWidth - 20;
+        }
+
         get filteredCourses()
         {
             return this.courseInfo.filter(c => c.name.toLowerCase().includes(this.search))
@@ -110,6 +118,7 @@
         {
             position: fixed;
             background: white;
+
             .text
             {
                 margin-top: 15px;