Fix new footer (#251)

datagouv · Jan 13, 2025 · 3888d9c · 3888d9c
1 parent dbca4c9
commit 3888d9c
Showing 1 changed file with 14 additions and 14 deletions.
diff --git a/components/SiteFooter/SiteFooter.vue b/components/SiteFooter/SiteFooter.vue
@@ -45,25 +45,25 @@
             </div>
           </div>
           <div class="w-full md:pl-[8%] md:w-1/3">
-            <div class="fr-follow__social">
+            <div class="flex flex-col items-start justify-between h-full">
               <p class="font-extrabold text-2xl leading-8 text-gray-title">
                 {{ $t("Follow us") }}
                 <br> {{ $t("on social media") }}
               </p>
-              <ul class="flex justify-between list-none m-0 p-0 *:p-0">
+              <ul class="flex justify-between list-none m-0 p-0 *:p-0 -ml-4">
                 <li>
                   <a
-                    class="fr-link !inline-flex after:!content-none"
+                    class="link !inline-flex after:!content-none mx-2 !p-2 min-h-10 mh-10 mw-10 !no-underline"
                     :title="$t('Twitter - new tab')"
                     href="https://twitter.com/datagouvfr"
                     target="_blank"
                   >
-                    <RiTwitterXLine />
+                    <RiTwitterLine />
                   </a>
                 </li>
                 <li>
                   <a
-                    class="fr-link !inline-flex after:!content-none"
+                    class="link !inline-flex after:!content-none mx-2 !p-2 min-h-10 mh-10 mw-10 !no-underline"
                     :title="$t('Linkedin - new tab')"
                     href="https://www.linkedin.com/company/data-gouv-fr/"
                     target="_blank"
@@ -73,7 +73,7 @@
                 </li>
                 <li>
                   <a
-                    class="fr-link !inline-flex after:!content-none"
+                    class="link !inline-flex after:!content-none mx-2 !p-2 min-h-10 mh-10 mw-10 !no-underline"
                     :title="$t('Mastodon - new tab')"
                     href="https://social.numerique.gouv.fr/@datagouvfr"
                     target="_blank"
@@ -83,7 +83,7 @@
                 </li>
                 <li>
                   <a
-                    class="fr-link !inline-flex after:!content-none"
+                    class="link !inline-flex after:!content-none mx-2 !p-2 min-h-10 mh-10 mw-10 !no-underline"
                     :title="$t('Github - new tab')"
                     href="https://github.com/datagouv/data.gouv.fr"
                     target="_blank"
@@ -93,7 +93,7 @@
                 </li>
                 <li>
                   <NuxtLinkLocale
-                    class="fr-link !inline-flex after:!content-none"
+                    class="link !inline-flex after:!content-none mx-2 !p-2 min-h-10 mh-10 mw-10 !no-underline"
                     :title="$t('RSS - new tab')"
                     to="datasets/recent.atom"
                     :external="true"
@@ -116,7 +116,7 @@
         <div class="fr-container">
           <div class="fr-grid-row fr-grid-row--start fr-grid-row--gutters">
             <div class="fr-col-12 fr-col-sm-3">
-              <h3 class="fr-footer__top-cat">
+              <h3 class="fr-footer__top-cat !text-xs !leading-5 !mb-3">
                 {{ $t('Open Data') }}
               </h3>
               <ul class="fr-footer__top-list">
@@ -132,7 +132,7 @@
               </ul>
             </div>
             <div class="fr-col-12 fr-col-sm-3">
-              <h3 class="fr-footer__top-cat">
+              <h3 class="fr-footer__top-cat !text-xs !leading-5 !mb-3">
                 {{ $t('Platform') }}
               </h3>
               <ul class="fr-footer__top-list">
@@ -148,7 +148,7 @@
               </ul>
             </div>
             <div class="fr-col-12 fr-col-sm-3">
-              <h3 class="fr-footer__top-cat">
+              <h3 class="fr-footer__top-cat !text-xs !leading-5 !mb-3">
                 {{ $t('Resources') }}
               </h3>
               <ul class="fr-footer__top-list">
@@ -164,7 +164,7 @@
               </ul>
             </div>
             <div class="fr-col-12 fr-col-sm-3">
-              <h3 class="fr-footer__top-cat">
+              <h3 class="fr-footer__top-cat !text-xs !leading-5 !mb-3">
                 {{ $t('Development') }}
               </h3>
               <ul class="fr-footer__top-list">
@@ -213,7 +213,7 @@
               href="/"
               :title="$t('Go back to website home - data.gouv.fr - République Française')"
             >
-              <SiteLogo />
+              <SiteLogo class="text-gray-logo text-xl tracking-wide" />
             </a>
           </div>
           <div class="fr-footer__content">
@@ -307,7 +307,7 @@
 </template>
 
 <script setup lang="ts">
-import { RiGithubLine, RiLinkedinBoxLine, RiMastodonLine, RiRssLine, RiTwitterXLine } from '@remixicon/vue'
+import { RiGithubLine, RiLinkedinBoxLine, RiMastodonLine, RiRssLine, RiTwitterLine } from '@remixicon/vue'
 
 const config = useRuntimeConfig()