From 821d5ae6539960908eaaeeaba4d024b1dc6a1074 Mon Sep 17 00:00:00 2001
From: Matthias Reumann <matthias.reumann@tum.de>
Date: Tue, 15 Aug 2023 06:37:47 +0200
Subject: [PATCH 1/2] Fix background-size:cover

---
 web/template/home.gohtml | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/web/template/home.gohtml b/web/template/home.gohtml
index af14da5c7..185986f0b 100644
--- a/web/template/home.gohtml
+++ b/web/template/home.gohtml
@@ -369,7 +369,7 @@
                                                 </span>
                                                 </div>
                                                 <a :href="`/w/${livestream.Course.Slug}/${livestream.Stream.ID}`">
-                                                    <div :style="`background:url('/api/stream/${livestream.Stream.ID}/thumbs/live'), url('/thumb-fallback.png')`"
+                                                    <div :style="`background:url('/api/stream/${livestream.Stream.ID}/thumbs/live'), url('/thumb-fallback.png'); background-size: cover;`"
                                                          class="h-full tum-live-thumbnail"></div>
                                                 </a>
                                             </div>
@@ -439,7 +439,7 @@
                                             <article class="tum-live-stream group sm:col-span-1 col-span-full"
                                                      @click.outside="vod.Dropdown.toggle(false)">
                                                 <a :href="course.WatchURL(vod.ID)" class="block mb-2">
-                                                    <div :style="`background: url('/api/stream/${vod.ID}/thumbs/vod'), url('/thumb-fallback.png')`"
+                                                    <div :style="`background: url('/api/stream/${vod.ID}/thumbs/vod'), url('/thumb-fallback.png'); background-size: cover;`"
                                                          class="aspect-video tum-live-thumbnail">
                                                         <div :id="`vod-progress-${vod.ID}`"
                                                              class="tum-live-thumbnail-progress">
@@ -628,7 +628,7 @@
                                                 </template>
                                             </div>
                                             <a :href="`/w/${livestream.Course.Slug}/${livestream.Stream.ID}`">
-                                                <div :style="`background:url('/api/stream/${livestream.Stream.ID}/thumbs/live'), url('/thumb-fallback.png')`"
+                                                <div :style="`background:url('/api/stream/${livestream.Stream.ID}/thumbs/live'), url('/thumb-fallback.png'); background-size: cover;`"
                                                      class="h-full tum-live-thumbnail"></div>
                                             </a>
                                             <div class="tum-live-badge absolute bg-black/[.8] text-white bottom-2 right-2 z-40 text-xs">
@@ -706,7 +706,7 @@
                                 <template x-for="course in recently.get()" :key="course.ID">
                                     <article class="tum-live-stream sm:col-span-1 col-span-full p-3">
                                         <a :href="course.LastRecordingURL()" class="block mb-2">
-                                            <div :style="`background:url('/api/stream/${course.LastRecording.ID}/thumbs/vod'), url('/thumb-fallback.png')`"
+                                            <div :style="`background:url('/api/stream/${course.LastRecording.ID}/thumbs/vod'), url('/thumb-fallback.png'); background-size: cover;`"
                                                  class="aspect-video tum-live-thumbnail">
                                                 <div :id="`vod-progress-${course.LastRecording.ID}`"
                                                      class="tum-live-thumbnail-progress">

From 6a153766c1a5f084c661a8763deb555e010093b7 Mon Sep 17 00:00:00 2001
From: Matthias Reumann <matthias.reumann@tum.de>
Date: Tue, 15 Aug 2023 06:43:12 +0200
Subject: [PATCH 2/2] Fix scroll bug

---
 web/assets/css/home.css  | 5 +++--
 web/template/home.gohtml | 4 ++--
 2 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/web/assets/css/home.css b/web/assets/css/home.css
index cf6c5273b..e0dea7eb0 100644
--- a/web/assets/css/home.css
+++ b/web/assets/css/home.css
@@ -33,12 +33,13 @@
 }
 
 /* Chrome, Safari and Opera */
-#content::-webkit-scrollbar, #notification-list::-webkit-scrollbar, .tum-live-side-navigation::-webkit-scrollbar {
+#content::-webkit-scrollbar, #notification-list::-webkit-scrollbar, .tum-live-side-navigation::-webkit-scrollbar,
+#public-courses::-webkit-scrollbar, #user-courses::-webkit-scrollbar{
     display: none;
 }
 
 /* IE, Edge and Firefox */
-#content, #notification-list, .tum-live-side-navigation {
+#content, #notification-list, .tum-live-side-navigation, #public-courses, #user-courses {
     -ms-overflow-style: none; /* IE and Edge */
     scrollbar-width: none; /* Firefox */
 }
diff --git a/web/template/home.gohtml b/web/template/home.gohtml
index 185986f0b..13a5f0513 100644
--- a/web/template/home.gohtml
+++ b/web/template/home.gohtml
@@ -238,7 +238,7 @@
     <!-- views -->
     <article class="text-3 p-4 grow" :class="{'hidden' : navigation.value}">
         <template x-if="state.isPublicCourses()">
-            <article id="public-courses" class="tum-live-course-list">
+            <article id="public-courses" class="tum-live-course-list h-full overflow-y-scroll">
                 <header>
                     <h1>
                         <i class="text-base fa-solid fa-chalkboard mr-2"></i>
@@ -272,7 +272,7 @@
             </article>
         </template>
         <template x-if="state.isUserCourses()">
-            <article id="user-courses" class="tum-live-course-list">
+            <article id="user-courses" class="tum-live-course-list h-full overflow-y-scroll">
                 <header>
                     <h1>
                         <i class="text-base fa-solid fa-graduation-cap mr-2"></i>