Various UI fixes

AppleBlox · Oct 27, 2024 · 1db421f · 1db421f
1 parent 45d43ce
commit 1db421f
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 8 deletions.
diff --git a/frontend/src/windows/main/app.css b/frontend/src/windows/main/app.css
@@ -19,7 +19,6 @@
 	line-height: 1.5;
 	font-weight: 400;
 
-	color: rgba(255, 255, 255, 0.87);
 	background-color: #242424;
 
 	font-synthesis: none;
@@ -37,7 +36,7 @@
 		--popover-foreground: 0 0% 0%;
 		--card: 0 0% 94%;
 		--card-foreground: 0 0% 4%;
-		--border: 0 0% 87.84%;
+		--border: 0 0% 80%;
 		--input: 0 0% 88%;
 		--primary: 346.19 64.65% 42.16%;
 		--primary-foreground: 0 0% 100%;

diff --git a/frontend/src/windows/main/components/color-image.svelte b/frontend/src/windows/main/components/color-image.svelte
@@ -3,16 +3,25 @@
 
 	export let src: string;
 	export let alt: string;
-	export let color = '';
+	export let color = '#000000'; // Default to black if no color provided
 
 	let className = '';
 	export { className as class };
 </script>
 
 <div class={cn('relative', className)}>
-	<img {src} {alt} class="w-full h-full object-contain" />
+	<img 
+		{src} 
+		{alt} 
+		class="w-full h-full object-contain"
+		style="visibility: hidden;"
+	/>
 	<div
-		class={`absolute inset-0 bg-${color}`}
-		style="mask-image: url({src}); mask-size: contain; mask-repeat: no-repeat; mask-position: center;"
-	></div>
-</div>
+		class="absolute inset-0"
+		style:mask-image={`url(${src})`}
+		style:mask-size="contain"
+		style:mask-repeat="no-repeat"
+		style:mask-position="center"
+		style:background-color={color}
+	/>
+</div>