decades and awards words are removed

components/HeaderTopbar/HeaderTopbar.js

@@ -5,21 +5,32 @@ import Link from 'next/link'
 import Logo from '/public/images/logo.png'
 import Image from 'next/image'
 import { useTranslation } from 'next-i18next'
+import { changeLanguage } from '../../utils/commonFunction.utils'
+import { useRouter } from 'next/router'
 
 const HeaderTopbar = () => {
   const { t } = useTranslation('common')
 
+  const router = useRouter()
+
+  const handleLanguageChange = () => {
+    changeLanguage(router, 'es'); // always switch to Spanish
+  };
+
   return (
     <>
       <div
-        className="header-top py-2 d-none d-lg-block"
+        className="header-top py-2 "
         style={{
           background: 'linear-gradient(90deg, #C12026 11.32%, #E14448 95.28%)',
         }}
       >
         <div className="container-fluid">
+          <div className='d-flex justify-content-center align-items-center gap-5 flex-wrap'>
             <div className="text-center" style={{ color: 'white' }}>
-            Para cambiar al español, haz clic en la opción en la parte inferior derecha del encabezado.
+              Haz clic en el botón para cambiar a español.
+            </div>
+            <button onClick={handleLanguageChange} className='white-button'>Haz clic aquí</button>
           </div>
         </div>
       </div>

styles/sass/layout/_header.scss

@@ -2025,10 +2025,11 @@
 .responsivemenu a:not([href]):not([class]):hover {
 	color: #ddd;
 }
+
 .responsive-entry-media {
 	position: relative;
 	width: 100%;
-    aspect-ratio:28 / 9; 
+	aspect-ratio: 28 / 9;
 	overflow: hidden;
 }
 
@@ -2041,7 +2042,7 @@
 .responsive-entry-media2 {
 	position: relative;
 	width: 100%;
-    aspect-ratio:3 / 2; 
+	aspect-ratio: 3 / 2;
 	overflow: hidden;
 }
 
@@ -2051,3 +2052,12 @@
 	object-fit: cover;
 }
 
+.white-button {
+	border: none;
+	background-color: white;
+	color: #c12026;
+	border-radius: 2px;
+	padding: 5px 10px;
+	font-size: 16px;
+	font-weight: bold;
+}