From d2aca488ad90197489c4778894b53cbc4c520a94 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Cl=C3=A9ment=20Le=20Bihan?= <clement.lebihan773@gmail.com>
Date: Sun, 26 Nov 2023 18:53:58 +0100
Subject: [PATCH] Minor bugfixes for Desktop css compliance

---
 front/views/V2/DiscoveryView.tsx | 10 ++++------
 1 file changed, 4 insertions(+), 6 deletions(-)

diff --git a/front/views/V2/DiscoveryView.tsx b/front/views/V2/DiscoveryView.tsx
index bec0985..8c88cb5 100644
--- a/front/views/V2/DiscoveryView.tsx
+++ b/front/views/V2/DiscoveryView.tsx
@@ -12,6 +12,8 @@ import GoldenRatio from '../../components/V2/GoldenRatio';
 const HomeView = (props: RouteProps<{}>) => {
 	const songsQuery = useQuery(API.getSongSuggestions);
 	const navigation = useNavigation();
+	const screenSize = useBreakpointValue({ base: 'small', md: 'big' });
+	const isPhone = screenSize === 'small';
 	const artistsQueries = useQueries(
 		(songsQuery.data ?? []).map((song) => API.getArtist(song.artistId))
 	);
@@ -52,10 +54,7 @@ const HomeView = (props: RouteProps<{}>) => {
 						style={{
 							width: '100%',
 							maxWidth: 1100,
-							// maxHeight: 500,
-							// aspectRatio: 1.618,
-							// golden ratio in vertical
-							aspectRatio: 0.618,
+							aspectRatio: isPhone ? 0.618 : 1.618,
 						}}
 					>
 						<GoldenRatio />
@@ -80,12 +79,11 @@ const HomeView = (props: RouteProps<{}>) => {
 						>
 							{'Suggestions'}
 						</Text>
-						{songsQuery.isLoading && <Text>Loading...</Text>}
 						<View
 							style={{
 								flexDirection: 'row',
 								flexWrap: 'wrap',
-								justifyContent: 'center',
+								justifyContent: isPhone ? 'center' : 'flex-start',
 								alignItems: 'flex-start',
 								gap: 16,
 							}}