From 1fed5ba4b949b080d9e5727e9b6404688ac90bac Mon Sep 17 00:00:00 2001 From: ziobaga Date: Fri, 17 May 2024 12:32:37 +0200 Subject: [PATCH 1/3] modifiche home e ancore --- Cerca.html | 9 +- assets/css/home.css | 13 ++- assets/js/Cerca.js | 231 ++++++++++++++++++++++++++++++++------------ home.html | 38 ++++---- 4 files changed, 204 insertions(+), 87 deletions(-) diff --git a/Cerca.html b/Cerca.html index e1fff26..751ab05 100644 --- a/Cerca.html +++ b/Cerca.html @@ -24,7 +24,7 @@
-
+
@@ -47,7 +48,7 @@ Search - + La tua libreria @@ -142,7 +143,7 @@
Attività amici
-
+
diff --git a/assets/css/home.css b/assets/css/home.css index 7f9e0e2..cf3b4d6 100644 --- a/assets/css/home.css +++ b/assets/css/home.css @@ -624,11 +624,16 @@ img#brani-preferiti { .coloreCerca { display: flex; - flex-direction: row; - justify-content: space-around; - background: black; - border-radius: 34px; + justify-content: center; + background: rgba(0, 0, 0, 0.495); + border-radius: 40px; padding: 2em; + box-shadow: 5px 5px 20px black; +} + +.img-cerca { + border-radius: 100px; + box-shadow: 2px 2px 50px #0000006e; } .pCastom { diff --git a/assets/js/Cerca.js b/assets/js/Cerca.js index 3e69718..125474b 100644 --- a/assets/js/Cerca.js +++ b/assets/js/Cerca.js @@ -1,68 +1,179 @@ -document.addEventListener('DOMContentLoaded', function() { - const artists = [ - { id: 1, name: "The Beatles", image: "https://api.deezer.com/artist/1/image" }, - { id: 412, name: "Queen", image: "https://api.deezer.com/artist/412/image"}, - { id: 48975581, name: "Geolier", image: "https://api.deezer.com/artist/48975581/image" }, - { id: 3239781, name: "Fedez", image: "https://api.deezer.com/artist/3239781/image" }, - { id: 7979, name: "Fabri Fibra", image: "https://api.deezer.com/artist/7979/image" }, - { id: 1155242, name: "Salmo", image: "https://api.deezer.com/artist/7979/image" }, - { id: 2936, name: "Shiva", image: "https://api.deezer.com/artist/1155242/image" }, - { id: 9375398, name: "Capo Plaza", image: "https://api.deezer.com/artist/9375398/image" }, - { id: 13612387, name: "Måneskin", image: "https://api.deezer.com/artist/13612387/image" }, - { id: 7371074, name: "Sfera Ebbasta", image: "https://api.deezer.com/artist/7371074/image" }, - { id: 1288678, name: "Lazza", image: "https://api.deezer.com/artist/5893334/image" }, - { id: 5893334, name: "Guè", image: "https://api.deezer.com/artist/5893334/image" }, - { id: 10666539, name: "Tedua", image: "https://api.deezer.com/artist/10666539/image" }, - { id: 75618, name: "Marracash", image: "https://api.deezer.com/artist/75618/image" }, - { id: 12246, name: "Taylor Swift", image: "https://api.deezer.com/artist/12246/image" }, - { id: 245432, name: "Annalisa", image: "https://api.deezer.com/artist/245432/image" }, - { id: 145693, name: "ELODIE", image: "https://api.deezer.com/artist/145693/image" }, - { id: 10688385, name: "Rose Villain", image: "https://api.deezer.com/artist/10688385/image" }, - { id: 160, name: "Shakira", image: "https://api.deezer.com/artist/160/image" }, - { id: 564, name: "Rihanna", image: "https://api.deezer.com/artist/564/image" }, - { id: 6550, name: "Gabry Ponte", image: "https://api.deezer.com/artist/6550/image" }, - { id: 6855525, name: "Baby Gang", image: "https://api.deezer.com/artist/6855525/image" }, - { id: 10583405, name: "Bad Bunny", image: "https://api.deezer.com/artist/10583405/image" }, - { id: 246791, name: "Drake", image: "https://api.deezer.com/artist/246791/image" }, - { id: 4495513, name: "Travis Scott", image: "https://api.deezer.com/artist/4495513/image" }, - ]; +document.addEventListener("DOMContentLoaded", function () { + const artists = [ + { + id: 1, + name: "The Beatles", + image: "https://api.deezer.com/artist/1/image", + }, + { + id: 412, + name: "Queen", + image: "https://api.deezer.com/artist/412/image", + }, + { + id: 48975581, + name: "Geolier", + image: "https://api.deezer.com/artist/48975581/image", + }, + { + id: 3239781, + name: "Fedez", + image: "https://api.deezer.com/artist/3239781/image", + }, + { + id: 7979, + name: "Fabri Fibra", + image: "https://api.deezer.com/artist/7979/image", + }, + { + id: 1155242, + name: "Salmo", + image: "https://api.deezer.com/artist/7979/image", + }, + { + id: 2936, + name: "Shiva", + image: "https://api.deezer.com/artist/1155242/image", + }, + { + id: 9375398, + name: "Capo Plaza", + image: "https://api.deezer.com/artist/9375398/image", + }, + { + id: 13612387, + name: "Måneskin", + image: "https://api.deezer.com/artist/13612387/image", + }, + { + id: 7371074, + name: "Sfera Ebbasta", + image: "https://api.deezer.com/artist/7371074/image", + }, + { + id: 1288678, + name: "Lazza", + image: "https://api.deezer.com/artist/5893334/image", + }, + { + id: 5893334, + name: "Guè", + image: "https://api.deezer.com/artist/5893334/image", + }, + { + id: 10666539, + name: "Tedua", + image: "https://api.deezer.com/artist/10666539/image", + }, + { + id: 75618, + name: "Marracash", + image: "https://api.deezer.com/artist/75618/image", + }, + { + id: 12246, + name: "Taylor Swift", + image: "https://api.deezer.com/artist/12246/image", + }, + { + id: 245432, + name: "Annalisa", + image: "https://api.deezer.com/artist/245432/image", + }, + { + id: 145693, + name: "ELODIE", + image: "https://api.deezer.com/artist/145693/image", + }, + { + id: 10688385, + name: "Rose Villain", + image: "https://api.deezer.com/artist/10688385/image", + }, + { + id: 160, + name: "Shakira", + image: "https://api.deezer.com/artist/160/image", + }, + { + id: 564, + name: "Rihanna", + image: "https://api.deezer.com/artist/564/image", + }, + { + id: 6550, + name: "Gabry Ponte", + image: "https://api.deezer.com/artist/6550/image", + }, + { + id: 6855525, + name: "Baby Gang", + image: "https://api.deezer.com/artist/6855525/image", + }, + { + id: 10583405, + name: "Bad Bunny", + image: "https://api.deezer.com/artist/10583405/image", + }, + { + id: 246791, + name: "Drake", + image: "https://api.deezer.com/artist/246791/image", + }, + { + id: 4495513, + name: "Travis Scott", + image: "https://api.deezer.com/artist/4495513/image", + }, + ]; - const container = document.getElementById('cercArtisti'); - const searchInput = document.getElementById('searchInput'); - const searchButton = document.getElementById('searchButton'); + const container = document.getElementById("cercArtisti"); + const searchInput = document.getElementById("searchInput"); + const searchButton = document.getElementById("searchButton"); - searchButton.addEventListener('click', function() { - const searchTerm = searchInput.value.toLowerCase(); - const results = artists.filter(artist => artist.name.toLowerCase().includes(searchTerm)); + searchButton.addEventListener("click", function () { + const searchTerm = searchInput.value.toLowerCase(); + const results = artists.filter((artist) => + artist.name.toLowerCase().includes(searchTerm) + ); - displayResults(results); - }); + displayResults(results); + }); - function displayResults(results) { - // Pulisci il contenuto del contenitore - container.innerHTML = ''; + function displayResults(results) { + // Pulisci il contenuto del contenitore + container.innerHTML = ""; - // Mostra i risultati - results.forEach(artist => { - const artistDiv = createArtistCard(artist); - container.appendChild(artistDiv); - }); - } + // Mostra i risultati + results.forEach((artist) => { + const artistDiv = createArtistCard(artist); + container.appendChild(artistDiv); + }); + } - function createArtistCard(artist) { - const artistDiv = document.createElement('div'); - artistDiv.classList.add('artist-card'); - artistDiv.classList.add('coloreCerca') - - artistDiv.innerHTML = ` -
-

Artista: ${artist.name}

- ${artist.name} - + function createArtistCard(artist) { + const artistDiv = document.createElement("div"); + artistDiv.classList.add("artist-card"); + artistDiv.classList.add("coloreCerca"); -
+ artistDiv.innerHTML = ` +
+
+ ${artist.name} +
+
+
+

Artista: ${artist.name}

+
+
+ +
+
+
`; - - return artistDiv; - } -}); \ No newline at end of file + + return artistDiv; + } +}); diff --git a/home.html b/home.html index 83b8bd5..b8a64e9 100644 --- a/home.html +++ b/home.html @@ -236,7 +236,7 @@

Buonasera

/>
- Death Usb + Le Hit
@@ -249,25 +249,25 @@
Image 1 Image 2 Image 3 Image 4
Image 1 Image 2 Image 3 Image 4
- Cor Veleno + Salmo
@@ -327,25 +327,25 @@
Image 1 Image 2 Image 3 Image 4
Image 1 Image 2 Image 3 Image 4
- Death Row + Hip Hop USA
From 4901ae1c59f896620b04bcdc25fab78b5d1b27ba Mon Sep 17 00:00:00 2001 From: ziobaga Date: Fri, 17 May 2024 12:47:29 +0200 Subject: [PATCH 2/3] modifiche id --- assets/js/Cerca.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/assets/js/Cerca.js b/assets/js/Cerca.js index 125474b..0e93185 100644 --- a/assets/js/Cerca.js +++ b/assets/js/Cerca.js @@ -28,12 +28,12 @@ document.addEventListener("DOMContentLoaded", function () { { id: 1155242, name: "Salmo", - image: "https://api.deezer.com/artist/7979/image", + image: "https://api.deezer.com/artist/1155242/image", }, { id: 2936, name: "Shiva", - image: "https://api.deezer.com/artist/1155242/image", + image: "https://api.deezer.com/artist/2936/image", }, { id: 9375398, @@ -53,7 +53,7 @@ document.addEventListener("DOMContentLoaded", function () { { id: 1288678, name: "Lazza", - image: "https://api.deezer.com/artist/5893334/image", + image: "https://api.deezer.com/artist/1288678/image", }, { id: 5893334, From 52761b21e433545e106f1e5f5933e18b0dc27975 Mon Sep 17 00:00:00 2001 From: Luca Chisari <75541078+Eddy7642@users.noreply.github.com> Date: Fri, 17 May 2024 13:07:23 +0200 Subject: [PATCH 3/3] Tasto Play --- assets/css/home.css | 17 +++++++---------- home.html | 4 +--- 2 files changed, 8 insertions(+), 13 deletions(-) diff --git a/assets/css/home.css b/assets/css/home.css index ea939a8..8a85423 100644 --- a/assets/css/home.css +++ b/assets/css/home.css @@ -262,7 +262,7 @@ ul li a { } .bplay { position: absolute; - left: 45px; + left: 40%; top: 20px; opacity: 0; transition: all ease 0.4s; @@ -275,7 +275,7 @@ ul li a { .bplay2 { position: absolute; - left: 170px; + left: 70%; top: -10px; opacity: 0; transition: all ease 0.4s; @@ -609,31 +609,29 @@ img#brani-preferiti { #searchInput { padding: 10px; border: 2px solid #ccc; - border-radius: 25px; + border-radius: 25px; outline: none; - width: 200px; + width: 200px; background-color: #f0f0f0; } - #searchButton { padding: 10px 20px; border: none; - border-radius: 25px; + border-radius: 25px; background-color: #ccc; - color: #000000; + color: #000000; cursor: pointer; } #searchButton:hover { - background-color: #bbb; + background-color: #bbb; } #giphyFrame { margin-top: 10%; } - @media screen and (max-width: 600px) { .card-title { font-size: 18px; @@ -705,4 +703,3 @@ img#brani-preferiti { color: white; border: none; } - diff --git a/home.html b/home.html index 6d16446..5db378a 100644 --- a/home.html +++ b/home.html @@ -553,9 +553,7 @@
Noyz Narcos
/>
In tendenza
-

- Viral & Trending: le canzoni -

+

Viral & Trending