extra fixes

next.config.js

@@ -9,7 +9,7 @@ const withNextIntl = createNextIntlPlugin();
 var nextConfig = {
   output: 'export',
   images: {
-    loader: 'custom',
+    unoptimized: true,
   },
 }
 

src/components/language/LanguageSwitcher.module.css

@@ -12,10 +12,10 @@
 }
 
 .selectedLanguage {
-  padding: 0.8rem 1rem;
+  padding-left: 1px;
+  padding-right: 3px;
   color: rgb(117, 115, 115);
-  font-family: Montserrat;
-  font-size: 13px;
+  font-size: clamp(10px, 1.25vw, 34px);
   font-weight: 500;
   line-height: 16px;
   letter-spacing: 0%;
@@ -44,8 +44,7 @@
 .option {
   padding: 0.8rem 1rem;
   color: rgb(117, 115, 115);
-  font-family: Montserrat;
-  font-size: 13px;
+  font-size: clamp(10px, 1.25vw, 34px);
   font-weight: 500;
   line-height: 16px;
   letter-spacing: 0%;

src/components/language/LanguageSwitcher.tsx

@@ -2,6 +2,9 @@ import { useState, ChangeEvent, ReactNode, useTransition } from 'react';
 import Image from 'next/image';
 import { useRouter, usePathname, useParams } from 'next/navigation';
 import styles from './LanguageSwitcher.module.css';
+import { Montserrat } from 'next/font/google';
+
+const montserrat = Montserrat({ subsets: ['latin', 'cyrillic'] })
 
 type LocaleOption = {
   code: string;
@@ -42,7 +45,7 @@ const LanguageSwitcher = () => {
   return (
     <div className={styles.container} onClick={toggleDropdown}>
       <Image src="/menu/language.svg" width={20} height={16} alt="Icon change language" className={styles.icon} />
-      <div className={styles.selectedLanguage}>
+      <div className={`${styles.selectedLanguage} ${montserrat.className}`}>
         {locales.find((locale) => locale.code === selectedLocale)?.label}
       </div>
       <Image src="/menu/arrow.png" width={6} height={3} alt="Arrow change language" className={`${styles.arrow} ${isOpen ? styles.open : ''}`}/>
@@ -51,7 +54,7 @@ const LanguageSwitcher = () => {
           {locales.map((locale) => (
             <li
               key={locale.code}
-              className={styles.option}
+              className={`${styles.option} ${montserrat.className}`}
               onClick={() => onSelectChange({ target: { value: locale.code } } as ChangeEvent<HTMLSelectElement>)}
             >
               {locale.label}

src/components/navigation/DesktopNavigation.tsx

@@ -1,20 +1,20 @@
 import styles from './desktop.module.css';
 import { Murecho } from 'next/font/google';
 import { Open_Sans } from 'next/font/google';
-import Logo from './logo';
 import LanguageSwitcher from '../language/LanguageSwitcher';
 import {useTranslations} from 'next-intl';
+import Image from 'next/image';
 
-const murecho = Murecho({ subsets: ['latin'] });
-const open_sans = Open_Sans({ subsets: ['latin'] });
+const murecho = Murecho({ subsets: ['latin', 'cyrillic'] });
+const open_sans = Open_Sans({ subsets: ['latin', 'cyrillic'] });
 
 export default function DesktopNavigation() {
   const t = useTranslations('Menu');
   return (
     <div style={{ paddingLeft: 'clamp(4vw, 9vw, 10.55vw)', paddingRight: 'clamp(4vw, 9vw, 10.55vw)', width: '100vw' }}>
       <div className={styles['menu-container'] + ' flex flex-row justify-between'}>
         <div className='flex flex-row items-center'>
-          <Logo />
+        <Image src="/menu/logo.png" width={6} height={3} alt="AploCoin logo" className={styles.logo}/>
           <div className='flex flex-row'>
             <a className={`${styles['url-button']} ${murecho.className}`}>{t('whatIsAplo')}</a>
             <a className={`${styles['url-button']} ${murecho.className}`}>{t('mining')}</a>

src/components/navigation/desktop.module.css

@@ -4,30 +4,42 @@
     margin-bottom: 1.56vh;
     box-shadow: 0px 2px 4px 0px rgba(50, 50, 93, 0.1);
     background: rgb(255, 255, 255);
+    padding: 0px 2.01vw;
 }
 
+.logo {
+    height: auto;
+    width: 4.375vw;
+    padding: 3.5px;
+    margin-right: clamp(8px, 2.08vw, 50px);
+}
+
+
 .url-button{
     color: rgb(125, 125, 125);
-    font-size: clamp(12px, 1.25vw, 34px);
+    font-size: clamp(10px, 1.25vw, 34px);
     font-weight: 500;
     letter-spacing: 0%;
     text-align: center;
-    margin-right: clamp(8px, 3.95vw, 50px);
+    margin-right: clamp(8px, 2.77vw, 50px);
 }
 
 .donate-button {
     display: flex;
     align-items: center;
+    justify-content: center;
+    width: 7vw;
+    height: 3.5vh;
     border-radius: 2px;
     background: rgb(51, 128, 179);
-    padding: clamp(8px, 0.78vh, 24px) clamp(20px, 2.43vw, 50px);
+    margin-right: 2.77vw;
 }
 
 .donate-text {
     height: auto;
     color: rgb(255, 255, 255);
-    font-size: clamp(8px, 1.11vw, 34px);
+    font-size: clamp(10px, 1vw, 34px);
     font-weight: 700;
     text-align: right;
     text-transform: uppercase;
-}
+}