diff --git a/index.html b/index.html index 0cddd62..1b8671d 100644 --- a/index.html +++ b/index.html @@ -359,6 +359,142 @@

Naruto EP1S1

+ +
+
+ Video +
+ +
+
+ Author +
+
+

Naruto EP1S1

+ Naruto | 10M Views | 3 Months Ago +
+
+
+ +
+
+ Video +
+ +
+
+ Author +
+
+

Naruto EP1S1

+ Naruto | 10M Views | 3 Months Ago +
+
+
+ +
+
+ Video +
+ +
+
+ Author +
+
+

Naruto EP1S1

+ Naruto | 10M Views | 3 Months Ago +
+
+
+ +
+
+ Video +
+ +
+
+ Author +
+
+

Naruto EP1S1

+ Naruto | 10M Views | 3 Months Ago +
+
+
+ +
+
+ Video +
+ +
+
+ Author +
+
+

Naruto EP1S1

+ Naruto | 10M Views | 3 Months Ago +
+
+
+ +
+
+ Video +
+ +
+
+ Author +
+
+

Naruto EP1S1

+ Naruto | 10M Views | 3 Months Ago +
+
+
+ +
+
+ Video +
+ +
+
+ Author +
+
+

Naruto EP1S1

+ Naruto | 10M Views | 3 Months Ago +
+
+
+ +
+
+ Video +
+ +
+
+ Author +
+
+

Naruto EP1S1

+ Naruto | 10M Views | 3 Months Ago +
+
+
diff --git a/src/css/style.css b/src/css/style.css index b3873f2..82411e3 100644 --- a/src/css/style.css +++ b/src/css/style.css @@ -17,7 +17,7 @@ header { position: fixed; top: 0px; background: #fff; - z-index: 999; + z-index: 998; } header .menu-area { @@ -189,6 +189,7 @@ header .menu-icons button img { position: fixed; top: 0px; transition: display 0.3s ease-in-out; + z-index: 999; } .menu-bar { @@ -296,6 +297,7 @@ header .menu-icons button img { align-items: center; justify-content: start; color: #000; + font-size: 14px; } .menu-bar .menu-group hr { diff --git a/src/js/script.js b/src/js/script.js index b22676b..a51faab 100644 --- a/src/js/script.js +++ b/src/js/script.js @@ -21,6 +21,27 @@ buttons.forEach(button => { }); +const footerBtn = document.querySelectorAll('footer ul li a button'); + +footerBtn.forEach(button => { + if (!button.classList.contains('active')) { + button.addEventListener('mouseover', () => { + // Change the class to 'material-icons' when hovered + const icon = button.querySelector('.material-icons-outlined'); + icon.classList.remove('material-icons-outlined'); + icon.classList.add('material-icons'); + }); + + button.addEventListener('mouseout', () => { + // Revert the class to 'material-icons-outlined' when not hovered + const icon = button.querySelector('.material-icons'); + icon.classList.remove('material-icons'); + icon.classList.add('material-icons-outlined'); + }); + } + +}); + // Get the button with the specified class const favoriteButton = document.querySelector('.menu-bar .menu-group ul li a button.heart');