Save locale

src/components/LanguageSelector.tsx

@@ -7,11 +7,16 @@ export default () => {
   const [t, { locale }] = useI18n();
 
   const avaliableLocales = ['en', 'ru'];
-  const preferredLocales = navigator.languages.map((lang) => lang.substring(0, 2));
+  const savedLocale = localStorage.getItem('locale');
-  for (const lang of preferredLocales) {
+  if (savedLocale) {
-    if (avaliableLocales.includes(lang)) {
+    locale(savedLocale);
-      locale(lang);
+  } else {
-      break;
+    const preferredLocales = navigator.languages.map((lang) => lang.substring(0, 2));
+    for (const lang of preferredLocales) {
+      if (avaliableLocales.includes(lang)) {
+        locale(lang);
+        break;
+      }
     }
   }
 
@@ -26,6 +31,7 @@ export default () => {
             locale('ru')
             break;
         }
+        localStorage.setItem('locale', locale());
       }}
       class={styles.LanguageSelector}
     >

src/components/Links.tsx

@@ -6,21 +6,18 @@ export default () => {
       <a 
         href='https://github.com/anatolykopyl'
         target='_blank'
-        class='hover-grad'
       >
         github
       </a>
       <a 
         href='https://www.linkedin.com/in/akopyl/'
         target='_blank'
-        class='hover-grad'
       >
         linkedin
       </a>
       <a 
         href='https://t.me/avkopyl'
         target='_blank'
-        class='hover-grad'
       >
         telegram
       </a>

src/components/Projects/Project.tsx

@@ -18,7 +18,6 @@ export default (props: {project: Project}) => {
         <a
           href={props.project.link}
           target="_blank"
-          class='hover-grad'
         >
           <h2>{props.project.name}</h2>
         </a>

src/components/Projects/Projects.tsx

@@ -18,7 +18,6 @@ export default () => {
     <div
       use:observer={(event) => {
         if (event.isIntersecting) {
-          console.log(chapterName);
           if (!state.scrolling()) {
             setters.setVisibleChapter(chapterName);
           } else if (state.visibleChapter() === chapterName) {

src/index.css

@@ -69,24 +69,3 @@ textarea:focus, input:focus{
 input::placeholder, textarea::placeholder {
   color: var(--clr-text-secondary);
 }
-
-.hover-grad {
-  background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab, var(--clr-text), var(--clr-text), var(--clr-text));
-  -webkit-background-clip: text;
-  -webkit-text-fill-color: transparent;
-  background-size: 200% auto;
-}
-
-.hover-grad:hover {
-  animation: gradient 1s ease forwards;
-  animation-iteration-count: 1;
-}
-
-@keyframes gradient {
-	0% {
-		background-position: 0% 50%;
-	}
-	100% {
-		background-position: 100% 50%;
-	}
-}