From 963e1bc46e7d27d4b9faa7a3da7e689a24f76c4c Mon Sep 17 00:00:00 2001
From: WardPearce <wardpearce@pm.me>
Date: Sun, 13 Oct 2024 21:03:36 +1300
Subject: [PATCH] Improve thumbnail list responsiveness

---
 materialious/android/app/build.gradle |  4 ++--
 materialious/electron/package.json    |  2 +-
 materialious/package.json             |  2 +-
 materialious/src/lib/VideoList.svelte | 15 +++++++++++++--
 update_versions.py                    |  2 +-
 5 files changed, 18 insertions(+), 7 deletions(-)

diff --git a/materialious/android/app/build.gradle b/materialious/android/app/build.gradle
index 97297d37..bf339f09 100644
--- a/materialious/android/app/build.gradle
+++ b/materialious/android/app/build.gradle
@@ -7,8 +7,8 @@ android {
         applicationId "us.materialio.app"
         minSdkVersion rootProject.ext.minSdkVersion
         targetSdkVersion rootProject.ext.targetSdkVersion
-        versionCode 58
-        versionName "1.6.7"
+        versionCode 59
+        versionName "1.6.8"
         testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner"
         aaptOptions {
              // Files and dirs to omit from the packaged assets dir, modified to accommodate modern web apps.
diff --git a/materialious/electron/package.json b/materialious/electron/package.json
index 501fbbd2..bf3418ad 100644
--- a/materialious/electron/package.json
+++ b/materialious/electron/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "Materialious",
-	"version": "1.6.7",
+	"version": "1.6.8",
 	"description": "Modern material design for Invidious.",
 	"author": {
 		"name": "Ward Pearce",
diff --git a/materialious/package.json b/materialious/package.json
index 347e7db2..1ef03b91 100644
--- a/materialious/package.json
+++ b/materialious/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "materialious",
-	"version": "1.6.7",
+	"version": "1.6.8",
 	"private": true,
 	"scripts": {
 		"dev": "vite dev",
diff --git a/materialious/src/lib/VideoList.svelte b/materialious/src/lib/VideoList.svelte
index 497c96fd..7a5792d1 100644
--- a/materialious/src/lib/VideoList.svelte
+++ b/materialious/src/lib/VideoList.svelte
@@ -1,4 +1,5 @@
 <script lang="ts">
+	import { onMount } from 'svelte';
 	import { _ } from 'svelte-i18n';
 	import { get } from 'svelte/store';
 	import { removePlaylistVideo } from './Api';
@@ -7,18 +8,28 @@
 	import { authStore } from './store';
 
 	export let videos: VideoBase[] | Video[] | Notification[] | PlaylistPageVideo[] = [];
-	export let oneItemPerRow: boolean = false;
 	export let playlistId: string = '';
 	export let playlistAuthor: string = '';
 
 	let hiddenVideos: string[] = [];
 	let auth = get(authStore);
+	let largeCol = '2';
 
 	async function removePlaylistItem(indexId: string, videoId: string) {
 		if (!playlistId) return;
 		await removePlaylistVideo(playlistId, indexId);
 		hiddenVideos = [...hiddenVideos, videoId];
 	}
+
+	onMount(() => {
+		addEventListener('resize', () => {
+			if (innerWidth <= 1750) {
+				largeCol = '6';
+			} else {
+				largeCol = '2';
+			}
+		});
+	});
 </script>
 
 <div class="page right active">
@@ -26,7 +37,7 @@
 	<div class="grid">
 		{#each videos as video}
 			{#if !hiddenVideos.includes(video.videoId)}
-				<div class={`s12 m${oneItemPerRow ? '12' : '6'} l${oneItemPerRow ? '12' : '2'}`}>
+				<div class="s12 m6 l{largeCol}">
 					<article class="no-padding" style="height: 100%;">
 						<Thumbnail
 							on:videoHidden={() => (hiddenVideos = [...hiddenVideos, video.videoId])}
diff --git a/update_versions.py b/update_versions.py
index c2a7882d..0ee90f66 100644
--- a/update_versions.py
+++ b/update_versions.py
@@ -5,7 +5,7 @@ import json
 import os
 import re
 
-LATEST_VERSION = "1.6.7"
+LATEST_VERSION = "1.6.8"
 WORKING_DIR = os.path.join(os.path.dirname(os.path.realpath(__file__)), "materialious")
 
 ROOT_PACKAGE = os.path.join(WORKING_DIR, "package.json")