disc gradient improvements

cdleveille · Jun 9, 2024 · 8530417 · 8530417
1 parent a6f7075
commit 8530417
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 5 deletions.
diff --git a/src/components/disc/Disc.tsx b/src/components/disc/Disc.tsx
@@ -25,10 +25,11 @@ export const Disc = ({ disc }: DiscProps) => {
 		background_color: backgroundColor
 	} = disc;
 
-	const outerGradient = backgroundColor === "#000000" ? "#666666" : "#222222";
+	const innerGradient = backgroundColor === "#000000" ? "#333333" : backgroundColor;
+	const outerGradient = "#000000";
 
 	const gradient: React.CSSProperties = {
-		background: `radial-gradient(circle, ${backgroundColor} 45%, ${outerGradient} 90%)`
+		background: `radial-gradient(circle, ${innerGradient} 50%, ${outerGradient} 100%)`
 	};
 
 	return (

diff --git a/src/components/disc/DiscDetail.tsx b/src/components/disc/DiscDetail.tsx
@@ -40,10 +40,11 @@ export const DiscDetail = ({ disc }: DiscDetailProps) => {
 		background_color: backgroundColor
 	} = disc;
 
-	const outerGradient = backgroundColor === "#000000" ? "#444444" : "#000000";
+	const innerGradient = backgroundColor === "#000000" ? "#222222" : backgroundColor;
+	const outerGradient = "#000000";
 
 	const gradient: React.CSSProperties = {
-		background: `radial-gradient(circle, ${backgroundColor} 45%, ${outerGradient} 90%)`
+		background: `radial-gradient(circle, ${innerGradient} 50%, ${outerGradient} 95%)`
 	};
 
 	const isDiscInBag = selectedBag?.discs.includes(id) ?? false;

diff --git a/src/components/disc/DiscGrid.tsx b/src/components/disc/DiscGrid.tsx
@@ -50,7 +50,7 @@ export const DiscGrid = () => {
 		disabled: !hasMoreDiscsToRender,
 		onLoadMore: renderMoreDiscs,
 		rootMargin: "0px 0px 16px 0px",
-		delayInMs: 50
+		delayInMs: 10
 	});
 
 	if (isBagView && !selectedBag) {
@@ -104,6 +104,7 @@ export const DiscGrid = () => {
 					horizontal: "left"
 				}}
 				sx={{ marginTop: "0.5rem" }}
+				disableScrollLock
 			>
 				<BagList onClose={handleBagListClose} />
 			</Popover>