From 31bf193543416c6738f14a507a37e34c308bb174 Mon Sep 17 00:00:00 2001
From: Michel Roux <xefir@crystalyx.net>
Date: Tue, 16 Jan 2024 21:15:12 +0100
Subject: [PATCH] fix: add same image background style to player bar to address
 light mode text issue (closes #38)

---
 src/components/Feed/Banner.vue |  1 +
 src/components/Player/Bar.vue  | 12 ++++++++++++
 2 files changed, 13 insertions(+)

diff --git a/src/components/Feed/Banner.vue b/src/components/Feed/Banner.vue
index 96678da..7b280b2 100644
--- a/src/components/Feed/Banner.vue
+++ b/src/components/Feed/Banner.vue
@@ -109,6 +109,7 @@ export default {
 		position: absolute;
 		top: 0;
 		width: 100%;
+		z-index: -1;
 	}
 
 	.content {
diff --git a/src/components/Player/Bar.vue b/src/components/Player/Bar.vue
index dafa8eb..b746a02 100644
--- a/src/components/Player/Bar.vue
+++ b/src/components/Player/Bar.vue
@@ -1,5 +1,6 @@
 <template>
 	<div v-if="player.episode" class="footer">
+		<img class="background" :src="player.episode.image">
 		<Loading v-if="!player.loaded" />
 		<ProgressBar v-if="player.loaded" />
 		<div v-if="player.loaded" class="player">
@@ -39,6 +40,17 @@ export default {
 </script>
 
 <style scoped>
+	.background {
+		filter: blur(1rem) brightness(50%);
+		height: auto;
+		left: 0;
+		opacity: .4;
+		position: absolute;
+		top: 0;
+		width: 100%;
+		z-index: -1;
+	}
+
 	.footer {
 		background-color: rgba(66, 66, 66, .9);
 		bottom: 0;