From 35a615246e44bd1073cbfa50a1d466231ad6e870 Mon Sep 17 00:00:00 2001
From: isUnknown <adrien.payet@outlook.com>
Date: Wed, 28 Aug 2024 13:44:15 +0200
Subject: [PATCH] finish logo animation

---
 assets/css/src/generic.css |  2 +-
 assets/css/src/nav.css     | 36 ++++++++++++++----------------------
 site/snippets/nav.php      |  8 ++++----
 3 files changed, 19 insertions(+), 27 deletions(-)

diff --git a/assets/css/src/generic.css b/assets/css/src/generic.css
index c6ff7f0..818f5c6 100644
--- a/assets/css/src/generic.css
+++ b/assets/css/src/generic.css
@@ -45,7 +45,7 @@ body.progress * {
 }
 
 .logo > *:not(:first-child) {
-  margin-left: 2.3ch;
+  margin-left: 2.27ch;
   transition: margin 0.3s ease-in-out;
 }
 
diff --git a/assets/css/src/nav.css b/assets/css/src/nav.css
index 56ab751..db25b0c 100644
--- a/assets/css/src/nav.css
+++ b/assets/css/src/nav.css
@@ -110,31 +110,23 @@
 }
 
 /* Main nav small */
-.main-nav .logo {
-  line-height: 0.5;
-}
-.main-nav .logo__detail {
-  display: inline-block;
-  overflow: hidden;
-  max-width: 10rem;
-  height: 2.2rem;
-  line-height: 1;
-  transform: translateY(0.55rem);
-  margin-left: 0;
-  transition: max-width 0.8s cubic-bezier(0.23, 1, 0.32, 1);
-}
-
-.main-nav--small .logo__detail {
-  max-width: 0;
-  height: 1.5rem;
-  pointer-events: none;
-  transform: translateY(0.4rem);
-}
-
 .main-nav--small .logo {
   font-size: var(--font-size-m);
 }
+.main-nav .logo > * {
+  height: 1.8ch;
+  max-width: 10rem;
+  overflow: hidden;
+  transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
+}
 
 .main-nav--small .logo > *:not(:first-child) {
-  margin-left: 1.34ch;
+  margin-left: 1.25ch;
+}
+
+.main-nav--small .logo > * {
+  max-width: 1ch;
+}
+.main-nav--small .logo > *:nth-child(2) {
+  max-width: 0.9ch;
 }
diff --git a/site/snippets/nav.php b/site/snippets/nav.php
index 0493ed8..81d10bb 100644
--- a/site/snippets/nav.php
+++ b/site/snippets/nav.php
@@ -4,13 +4,13 @@
   <nav class="main-nav">
       <h1 class="logo">
         <span>
-          N<span class="logo__detail">ouveau</span>
+          Nouveau
         </span>
         <span>
-          T<span class="logo__detail">héâtre</span>
+          Théâtre
         </span>
         <span>
-          B<span class="logo__detail">esançon</span>
+          Besançon
         </span>
       </h1>
     </a>
@@ -62,7 +62,7 @@
     <?php endforeach ?>
     <li class="expanded-nav__links">
       <div class="expanded-nav__ticketing">
-        <a href="<?= option('ticketingUrl') ?>" target="_blank" title="Aller à la billetterie"><?php snippet('ticket') ?> Billetterie</a>
+        <a class="ticket-link" href="<?= option('ticketingUrl') ?>" target="_blank" title="Aller à la billetterie"><?php snippet('ticket') ?> Billetterie</a>
       </div>
       <div class="expanded-nav__socials">
         <strong>Suivez-nous</strong>