From 47b306313cf48c91f343e0783bd0280c3d7ecb75 Mon Sep 17 00:00:00 2001
From: Arthur DANJOU <arthurdanjou@outlook.fr>
Date: Wed, 27 Oct 2021 21:37:24 +0200
Subject: [PATCH] Working on blobity

---
 src/components/Banner.vue       |  6 +++---
 src/components/MobileNavbar.vue |  1 +
 src/components/SocialList.vue   | 12 ++++++------
 3 files changed, 10 insertions(+), 9 deletions(-)

diff --git a/src/components/Banner.vue b/src/components/Banner.vue
index 802881e..e7c8b6b 100755
--- a/src/components/Banner.vue
+++ b/src/components/Banner.vue
@@ -1,14 +1,14 @@
 <template>
   <section class="my-16 w-full flex items-center justify-center">
     <div class="text-center flex flex-col items-center">
-      <h1 class="text-6xl flex font-bold text-gray-600 dark:text-gray-400">
+      <h1 class="text-5xl md:text-6xl xl:flex font-bold text-gray-600 dark:text-gray-400">
         {{ $t('home.banner.hello') }} <span class="flex z-index-3 text-black dark:text-white mx-2">Arthur Danjou</span> <span class="hey">👋</span>,
       </h1>
-      <h2 class="my-6 text-4xl text-black dark:text-white">
+      <h2 class="my-6 text-3xl md:text-4xl text-black dark:text-white">
         <strong>{{ $t('home.banner.role') }}</strong>. <br />
         <span class="text-gray-600 dark:text-gray-400">{{ $t('home.banner.student.main') }}</span> <strong>{{ $t('home.banner.student.strong') }} 🎓</strong>.
       </h2>
-      <div class="select-none mt-4 text-5xl text-gray-800 mb-10 dark:text-gray-300">
+      <div class="flex flex-col md:flex-row select-none mt-4 text-4xl md:text-5xl text-gray-800 mb-10 dark:text-gray-300">
         <span id="develop" class="color blue">{{ $t('home.banner.color.develop') }}</span>
         <span id="publish" class="color">{{ $t('home.banner.color.publish') }}</span>
         <span id="improve" class="color">{{ $t('home.banner.color.improve') }}</span>
diff --git a/src/components/MobileNavbar.vue b/src/components/MobileNavbar.vue
index f6281a8..95831d1 100644
--- a/src/components/MobileNavbar.vue
+++ b/src/components/MobileNavbar.vue
@@ -64,6 +64,7 @@ export default defineComponent({
     const $router = useRouter()
     $router.afterEach(() => {
       store.commit('TOGGLE_OPENED', false)
+      document.getElementById('nav')!.classList.remove('z-50')
       setTimeout(() => {
         document.getElementById('slider')!.style.maxHeight = 'none'
       }, 600)
diff --git a/src/components/SocialList.vue b/src/components/SocialList.vue
index 2b68ee4..d89d3ea 100644
--- a/src/components/SocialList.vue
+++ b/src/components/SocialList.vue
@@ -1,21 +1,21 @@
 <template>
   <div class="social-links">
-    <a class="z-index-3" data-blobity-magnetic="false" target="_blank" href="https://twitter.com/ArthurDanj" rel="noopener noreferrer">
+    <a class="xl:z-index-3" data-blobity-magnetic="false" target="_blank" href="https://twitter.com/ArthurDanj" rel="noopener noreferrer">
       <TwitterIcon />
     </a>
-    <a class="z-index-3" data-blobity-magnetic="false" target="_blank" href="https://github.com/ArthurDanjou" rel="noopener noreferrer">
+    <a class="xl:z-index-3" data-blobity-magnetic="false" target="_blank" href="https://github.com/ArthurDanjou" rel="noopener noreferrer">
       <GithubIcon />
     </a>
-    <a class="z-index-3" data-blobity-magnetic="false" target="_blank" href="https://www.polywork.com/arthurdanjou" rel="noopener noreferrer">
+    <a class="xl:z-index-3" data-blobity-magnetic="false" target="_blank" href="https://www.polywork.com/arthurdanjou" rel="noopener noreferrer">
       <PolyworkIcon />
     </a>
-    <a class="z-index-3" data-blobity-magnetic="false" target="_blank" href="https://www.twitch.tv/arthurdanjou" rel="noopener noreferrer">
+    <a class="xl:z-index-3" data-blobity-magnetic="false" target="_blank" href="https://www.twitch.tv/arthurdanjou" rel="noopener noreferrer">
       <TwitchIcon />
     </a>
-    <a class="z-index-3" data-blobity-magnetic="false" target="_blank" href="https://go.arthurdanjou.fr/discord" rel="noopener noreferrer">
+    <a class="xl:z-index-3" data-blobity-magnetic="false" target="_blank" href="https://go.arthurdanjou.fr/discord" rel="noopener noreferrer">
       <DiscordIcon />
     </a>
-    <a class="z-index-3" data-blobity-magnetic="false" target="_blank" href="mailto:contact@arthurdanjou.fr" rel="noopener noreferrer">
+    <a class="xl:z-index-3" data-blobity-magnetic="false" target="_blank" href="mailto:contact@arthurdanjou.fr" rel="noopener noreferrer">
       <MailIcon />
     </a>
   </div>