fixed the initial tab content in the charts page

dauletalzhanov · May 7, 2024 · 57d8b5a · 57d8b5a
1 parent 2c1c6b2
commit 57d8b5a
Show file tree

Hide file tree

Showing 4 changed files with 9 additions and 19 deletions.
diff --git a/src/Components/Ranking.jsx b/src/Components/Ranking.jsx
@@ -1,7 +1,7 @@
 import { useState, useEffect } from "react"
 import { Link } from "react-router-dom"
 
-function Ranking({title, url}){
+function Ranking({title, url, invisible}){
 	const [songs, setSongs] = useState([])
 
 	useEffect(()=>{
@@ -16,7 +16,7 @@ function Ranking({title, url}){
 	}, [])
 
 
-	return(<div className="ranking">
+	return(<div className={`ranking ${invisible?"invisible":""}`}>
 		<p className="ranking-title">{title}</p>
 
 		{songs.map((song, index) => {

diff --git a/src/Pages/CSS/charts_mobile.css b/src/Pages/CSS/charts_mobile.css
@@ -12,11 +12,11 @@
 	}
 
 	.billboard-title > h1 {
-		font-size: 6vw;
+		font-size: 5vw;
 	}
 
 	.billboard-title > p {
-		font-size: 3.5vw;
+		font-size: 3vw;
 	}
 
 	/**************************/

diff --git a/src/Pages/Charts.jsx b/src/Pages/Charts.jsx
@@ -134,15 +134,9 @@ export default function Charts() {
                     <p onClick={handleGlobal}>Global</p>
                 </div>
 
-                <Ranking title='Albums' url={url200} />
+                <Ranking title='Albums' url={url200} invisible={true} />
                 <Ranking title='Songs' url={url100} />
-                <Ranking title='Global' url={urlGlo} />
-
-
-
-
-
-
+                <Ranking title='Global' url={urlGlo} invisible={true} />
 
             </div>
 

diff --git a/src/Pages/Search.jsx b/src/Pages/Search.jsx
@@ -159,16 +159,9 @@ export default function Search(){
 		const id = event.target.getAttribute("id")
 		const song = searchResults[id]
 
-
-
-		//let music = new Audio(song.previewUrl)
-		//await music.play()
 		setMusicSrc(song.previewUrl)
 		dispatch(playTrack(song.previewUrl))
 
-		//const walkman = document.querySelector("audio").parentNode
-		//if(walkman.classList.contains("invisible") == true)
-		//	walkman.classList.toggle("invisible")
 	}
 
 
@@ -190,6 +183,9 @@ export default function Search(){
 		</div>
 
 		<main>
+			<div>
+
+			</div>
 			<ul className="results">
 				{ searchResults.length == 0 ? "No Songs Here" : searchResults.map((song, index)=> {