From 2780fd8958292893349ea085cdb638473c2befc4 Mon Sep 17 00:00:00 2001
From: Mariya Shusharina <mariya.shushar@gmail.com>
Date: Sun, 22 Sep 2024 14:08:43 +0200
Subject: [PATCH] fix: adjust progress-bar work, change opacity of buttons'
 blik

---
 index.html | 2 +-
 scripts.js | 4 ++++
 style.css  | 6 +++---
 3 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/index.html b/index.html
index e719603..6447c0e 100644
--- a/index.html
+++ b/index.html
@@ -35,7 +35,7 @@ <h1>Audio Player</h1>
 				</div>
 
 				<div class="song-length-div">
-					<input type="range" class="song-length" min="0" max="" value="0" onchange="songTimeChange(this.value)">
+					<input type="range" class="song-length" min="0" max="100" value="0" onchange="songTimeChange(this.value)">
 				</div>
 
 				<div class="audio-div">
diff --git a/scripts.js b/scripts.js
index 4e9665f..0e1de1b 100644
--- a/scripts.js
+++ b/scripts.js
@@ -180,8 +180,12 @@ function timeUpdate() {
 	timeConverter();
 
 	currTimeDiv.textContent = songTime;
+
+	progressBar.value = Math.round((songTime / songMaxTime) * 100);
 }
 
+
+
 window.onload = function() {
 
 	songMaxTime = Math.round(audio.duration);
diff --git a/style.css b/style.css
index 46a1a45..b7ac3c7 100644
--- a/style.css
+++ b/style.css
@@ -182,7 +182,7 @@ input[type="range"]::-webkit-slider-thumb {
 	background-repeat: no-repeat;
 	background-position: top;
 	background-size: contain;
-	opacity:  0.4;
+	opacity:  0.3;
 	z-index: 10;
 }
 
@@ -218,7 +218,7 @@ input[type="range"]::-webkit-slider-thumb {
 	background-repeat: no-repeat;
 	background-position: top;
 	background-size: contain;
-	opacity:  0.4;
+	opacity:  0.3;
 	z-index: 10;
 }
 
@@ -233,7 +233,7 @@ input[type="range"]::-webkit-slider-thumb {
 	background-repeat: no-repeat;
 	background-position: top;
 	background-size: contain;
-	opacity:  0.4;
+	opacity:  0.3;
 	z-index: 10;
 }