From 6b7f13e8ef48d74edb92441144051e4225b27f71 Mon Sep 17 00:00:00 2001
From: Puniko <me@absturztaube.ch>
Date: Thu, 29 Dec 2022 10:36:59 +0100
Subject: [PATCH] make webkit style range slider the same

---
 packages/client/src/components/mod-player.vue | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/packages/client/src/components/mod-player.vue b/packages/client/src/components/mod-player.vue
index c7f0b84fb..dcec202fb 100644
--- a/packages/client/src/components/mod-player.vue
+++ b/packages/client/src/components/mod-player.vue
@@ -276,6 +276,7 @@ function display() {
 			width: 90px;
 			padding: 0;
 			margin: 4px 8px;
+			overflow-x: hidden;
 
 			&:focus {
 				outline: none;
@@ -297,6 +298,7 @@ function display() {
 				animate: 0.2s;
 				background: var(--bg);
 				border: 1px solid var(--fg);
+				overflow-x: hidden;
 			}
 
 			&::-webkit-slider-thumb {
@@ -307,7 +309,9 @@ function display() {
 				background: var(--accentLighten);
 				cursor: pointer;
 				-webkit-appearance: none;
-				margin-top: -0.5px;
+				box-shadow: calc(-100vw - 14px) 0 0 100vw var(--accent);
+				clip-path: polygon(1px 0, 100% 0, 100% 100%, 1px 100%, 1px calc(50% + 10.5px), -100vw calc(50% + 10.5px), -100vw calc(50% - 10.5px), 0 calc(50% - 10.5px));
+				z-index: 1;
 			}
 
 			&::-moz-range-track {