]> _ Git - eif-extranet.git/commitdiff
wait #5483 @0:20
authorVincent Vanwaelscappel <vincent@cubedesigners.com>
Tue, 27 Sep 2022 10:22:35 +0000 (12:22 +0200)
committerVincent Vanwaelscappel <vincent@cubedesigners.com>
Tue, 27 Sep 2022 10:22:35 +0000 (12:22 +0200)
inc/menu.php
js/script.js
style/inc/menu.sass
style/style.sass

index 29e2a8283b395ed6ecfc27f45d1304e1093a42a4..13604b7d57e46857b843afdf4f56e768672c4e1e 100644 (file)
@@ -6,7 +6,7 @@
         </div>
         <nav>
             <ul>
-                <li data-tooltip="Mon portefeuille">
+                <li>
                     <a href="#" class="open-submenu">
                         <div data-icon="menu-portefeuille"></div>
                         <span>Mon portefeuille</span>
@@ -17,7 +17,7 @@
                         <li><a href="simulations.html">Simulations</a></li>
                     </ul>
                 </li>
-                <li data-tooltip="Mes missions">
+                <li>
                     <a href="#" class="open-submenu">
                         <div data-icon="menu-missions"></div>
                         <span>Mes missions</span>
@@ -28,7 +28,7 @@
                         <li><a href="rapport.html">Rapport</a></li>
                     </ul>
                 </li>
-                <li data-tooltip="Outils experts">
+                <li>
                     <a href="#" class="open-submenu">
                         <div data-icon="menu-mode-expert"></div>
                         <span>Outils experts</span>
                         <li><a href="refacturation.html">Refacturation</a></li>
                     </ul>
                 </li>
-                <li data-tooltip="Veille EIF">
+                <li>
                     <a href="#">
                         <div data-icon="menu-veille-EIF"></div>
                         <span>Veille EIF</span>
                     </a>
                 </li>
-                <li data-tooltip="Mon compte">
+                <li>
                     <a href="#" class="open-submenu">
                         <div data-icon="menu-mon-compte"></div>
                         <span>Mon compte</span>
index 32e9098fe3ade48fa1ceaa59991ab401201e3c35..66270a55eee4c0ac9d4f6e7b86e71aa705e75643 100644 (file)
@@ -4,6 +4,20 @@ $(function () {
         tippy(this, {content: $(this).attr('data-tooltip')});
     });
 
+    // Tooltip du menu (uniquement en mode compact)
+    $("#menu nav>ul>li>a").each(function () {
+        tippy(this, {content: $(this).find('span').text(), trigger: 'manual', theme: 'menu'});
+    });
+    $(document).on('mouseover', '.menu-compact #menu nav>ul>li>a', function () {
+        this._tippy.show();
+        clearTimeout(this._tippyHideTimeout);
+    }).on('mouseout', '#menu nav>ul>li>a', function () {
+        var $this = this;
+        this._tippyHideTimeout = setTimeout(function () {
+            $this._tippy.hide();
+        }, 50);
+    });
+
     // Ajouter les symboles SVG
     $("[data-icon]").each(function () {
         $(this).append(getSpriteIcon('eif-' + $(this).data('icon')));
@@ -28,7 +42,7 @@ $(function () {
     });
 });
 
-function resize(){
+function resize() {
 
 }
 
index 6f244111e3ae8e5bebda6514df48f14d202f9783..0e0f9b6d2d08833e19234c631ca1fd66904ffc2c 100644 (file)
@@ -142,4 +142,14 @@ header
 
     .toggle-menu
       svg
-        transform: scale(1, 1)
\ No newline at end of file
+        transform: scale(1, 1)
+
+.tippy-box[data-theme~='menu']
+  $tooltip-menu-background: #ccc
+  background-color: $tooltip-menu-background
+  color: #000
+
+  &[data-placement^='top'], &[data-placement^='bottom'], &[data-placement^='left'], &[data-placement^='right']
+    > .tippy-arrow::before
+      border-top-color: $tooltip-menu-background
+
index 77550c0b72061abc3be17f88d1e6f5c27295d1a6..bf0a63376ec43f4614d67014db14761c2095e68e 100644 (file)
@@ -46,10 +46,10 @@ main
       article
         height: 100px
         text-align: right
+        color: $headings-color
 
         strong
           font-weight: 900
-          color: $headings-color
           font-size: 36px
           margin-top: 10px
           display: block