feat: geziak argitzen ditu

front/src/views/components/Oina/Oina.module.scss

@@ -1,3 +1,5 @@
+@import '../../../styles/tools/mixins/font.scss';
+
 .wrapper {
   display: flex;
   justify-content: center;
@@ -18,3 +20,63 @@
     outline: 2px solid var(--color-morea);
   }
 }
+
+.geziaLogo {
+  animation-duration: 2s;
+  animation-iteration-count: infinite;
+  animation-name: bounce-2;
+  animation-timing-function: ease;
+
+  height: var(--size-base);
+  width: auto;
+
+  @keyframes bounce-2 {
+    0% {
+      transform: rotate(270deg) translateX(0);
+    }
+    50% {
+      transform: rotate(270deg) translateX(var(--size-tiny));
+    }
+    100% {
+      transform: rotate(270deg) translateX(0);
+    }
+  }
+}
+
+.oinaLink {
+  display: inline-flex;
+  flex-direction: column;
+  align-items: center;
+  gap: var(--size-tiny);
+
+  @include tinyFont;
+
+  transition: color 0.4s ease;
+
+  svg {
+    path {
+      transition: fill 0.4s ease;
+      fill: var(--color-beltza);
+    }
+  }
+
+  &:focus {
+    outline: 3px solid var(--color-morea);
+  }
+
+  &:hover {
+    color: var(--color-morea);
+
+    svg {
+      path {
+        transition: fill 0.4s ease;
+        fill: var(--color-morea);
+      }
+    }
+  }
+}
+
+.igoWrapper {
+  display: flex;
+  justify-content: center;
+}

front/src/views/components/Oina/Oina.tsx

@@ -2,15 +2,25 @@ import React from 'react';
 
 import { Link } from 'gatsby';
 
+import Gezia from '../../../assets/gezia.svg';
 import * as styles from './Oina.module.scss';
 
 export const Oina: React.FC = () => (
-  <footer className={styles.wrapper}>
-    <Link className={styles.esteka} to="/lege-oharra">
-      Lege oharra
-    </Link>
-    <Link className={styles.esteka} to="/pribatutasun-politika">
-      Pribatutasun politika
-    </Link>
-  </footer>
+  <>
+    <div className={styles.igoWrapper}>
+      <a className={styles.oinaLink} href="#top">
+        <Gezia className={styles.geziaLogo} />
+        IGO
+      </a>
+    </div>
+
+    <footer className={styles.wrapper}>
+      <Link className={styles.esteka} to="/lege-oharra">
+        Lege oharra
+      </Link>
+      <Link className={styles.esteka} to="/pribatutasun-politika">
+        Pribatutasun politika
+      </Link>
+    </footer>
+  </>
 );