From fb2bef5c0b06160c6d1288201384d7ef4f206d7a Mon Sep 17 00:00:00 2001
From: Vincent Vanwaelscappel <vincent@cubedesigners.com>
Date: Tue, 27 Sep 2022 10:27:36 +0200
Subject: [PATCH] wip #5481 @1.5

---
 inc/chart-menu.php                           |   5 ++
 placeholders/dummy_500x400_000000_ffffff.png | Bin 0 -> 7475 bytes
 placeholders/dummy_500x500_000000_ffffff.png | Bin 0 -> 8775 bytes
 style/inc/menu.sass                          |  13 ++--
 style/style.sass                             |  61 +++++++++++--------
 tableau-de-bord.php                          |  49 ++++++++++++++-
 6 files changed, 95 insertions(+), 33 deletions(-)
 create mode 100644 inc/chart-menu.php
 create mode 100644 placeholders/dummy_500x400_000000_ffffff.png
 create mode 100644 placeholders/dummy_500x500_000000_ffffff.png

diff --git a/inc/chart-menu.php b/inc/chart-menu.php
new file mode 100644
index 0000000..9fca78c
--- /dev/null
+++ b/inc/chart-menu.php
@@ -0,0 +1,5 @@
+<nav>
+    <a href="#" data-tooltip="Télécharger" data-icon=""></a>
+    <a href="#" data-tooltip="Imprimer" data-icon=""></a>
+    <a href="#" data-tooltip="En savoir plus" data-icon=""></a>
+</nav>
\ No newline at end of file
diff --git a/placeholders/dummy_500x400_000000_ffffff.png b/placeholders/dummy_500x400_000000_ffffff.png
new file mode 100644
index 0000000000000000000000000000000000000000..4af5252024c0d48a9f93596ff1183fde83478cb7
GIT binary patch
literal 7475
zcmeHMX;)L{7RC?;p%^IOz!WOBTA5TtCLvM8)KwWQlZptoVw8{s43j_-B30U=prwLH
z8LBOj*-}FYAqfse5rt4@LK0~d0wDw>B#@Akd%$(q{d#`@AF|fYIq%-@KJVH4d7ib;
zk0C)Q6C*1l9UUE$V_zNlMn`9Z9Q@rf)CaGe{Ojiq9UU9hu_K4V($7lyom~k70|swJ
z@XFzvM{FK$`$0EH+OBW0<9_$PJ$ua$J@SWITBhtey5G~RcbDO&?Yp-^_ue-&I-nbs
zY`-Z%e|!FnMt6lx94C6E32VHm@!_9$y$>zSmW@ycNrT;*flJf<=Qw~CGq)X?t+N3F
zCG|maH_C;{T8rSd|C<aAlZ`2>cML5|O~rcmE*e1%P3@7$$|&76qcS@i>B>D4YQN?W
z;ahz)^q|lT$`|(_tB#=G;93OJUH0}|<NduBs}Vpyy8fDh+^~Uiw(`fSj~PH)-9H*e
zhK6!T;C{W;2%um6S}6MvaO*7>?|-=(L1zO6XR>BcAP@)(X&(47Q^RD;TJq~Dub=XI
zVXU{`I%2Hj@;a6LKZG4o_Vfjud~oGMmn$Y%)*{Nc4mvphd_=@n&oamRf)RWn(6-QB
z>YEz>j4sH)kPAbDyy843?tWKw{TD!897FQTT6p7OFwugm=-4CD*pQaSpIxGsHCxi7
z8?Mz`T-*tb00l*tLw)-xbeVgb7Eoh`(zF^Sj4mXp-?gC2uUtr<dt$JK{h|b2?lqPn
zsecv&d?@bJ$gLlnl9$GFbI}z<#jQVgmL>m__{M$clgJq2qReG1>SQ^g+w0kun5?As
zI9!Fol()3AJpJ4BmH8J+<z9XEzdt!%x5l?64ZqVJX&8Jun)gBn0;&$XcDH0YB-b`|
z_$YplrG@iWKtbo2G`4+s^$yU=sR)x`-^Ko!ITrZzxg4!VR;b240c2!tCI(ehh`$?~
zV~uM$moD!`DIH6u`&!<mHc#}BfrY2`GHU8jbef4$kSVL%CcEtXdUyL#X!9<6F8zl~
zkv#K@D8^(3893_mtI<yZC_wr{TiGV<%0drp<4pw}biy|k1)LLHRlh3?wmY3DM_cE6
zPe0VvV#~U83j=oW-~Lg2*2;xB)09(FI^8GekjgV8Phg0ZMDCK}TrEpLRPz0S10MZp
zw9P*^A3F879yDWKUmHPH4u4l*0_MdhEpq^sB%<m=yDsdLw6UZY0Q+>v<4}<(1PlKH
z$6lVufu!%wQo-z<>tfQ!ujK@3n`7e-x%pWN4^O=>juE^XYnuI?cz5|397z0198@y<
zX7cB+UA)8zuNH@55MzWMUxPCDOVroAZP`g;&hkX5V=zY+?|fdG(>iTzC|CIcf!&E&
zkA0MeSK{wGhw#i61egI*lp)Q28$6tj;dJF!@lGrWXyermGN69}EId{(O;x>oVL6it
zJJ+j$5+E$S#Tcz>NK;+s{Q*aP@7gx^R1<<{;m~I`vr-wGn_6l`%ANLHGTB!f_&Pl+
zY%u?&-IaH@6Zx7i=fgMf1$9~!`IOEgwQv$DU(!Xse;`k?r)Trk+`g<ysA}n#rJ8I(
zl#Rw9I}SC)JZ(H45N`klwS;drT09Hw@OZ9SsL<LpuoR<nrPxpJiym~vQTF-$i$hI<
z^*Qn`Fj@2YwQAUw@lGu)l^dhRjeE0QzunE9BvnpRQ^A6f!T)eo?`f%}%^_kHMNowv
zwDs>>L6v3R8WCLE5;N3K<9eBkm0n8!!{q16UKHH+GFs({9F3%o-mQ*=M-U{Z9t-Ew
z_&nhxNyviJJBL^iZwOgMak8-GrJT{QN+mpF^N4GP7SJ733dv;d1?Cy!P@*yo!n80I
zGy7?>n^2Xht<aP{m2+&O{3ogLEIw5dOvPtdj0n&+xZ7Pu8uw){>YO^X`?fNs|6S5n
zx|_8OY<|jLn<dZ;L?grFsKSG}h(@H+HXk@Wqi;5RKN~6BUKNc+#je0EGn4B1dh8j>
zcBw_0@q;KFBkujBSpdGw80Q+`$zdY~fH&H_1NDe-IK2d?Z7*u(*Ej&|311P`_wNRd
z7dD|Os1iTzHc%K{e@$9P%KYpR0}Mab{nB>h4ee(_H88()p(X&&yQ*0&gT$#nie2hz
zw9|c66oCOAzNu6{!!e`mURC!FCuR{x?0B9K9M^+YE*)(K8ssSuVw=<(o~}a55Z_DV
zonJ5hX-kRTXef{F9F=uIM3{d>Wsh%pt7ra#txyAC*_X7$5!(q(?)P4>pGGoeNytDw
z6$n^9SNz8WBz2$QHWII%L7Z`FEf<onIbD{LPUO6BzY$E6VVRdIdx#;&Gb<Foy$73*
z?}`tvY*gQQ8ICz8(!<+RoWV_<4~@P_g{m<BU>lvc+GU7;^Ur7Vs`-jrcLB48ynIg&
zUm{OH9vFT(#d|p%H>xS@0l?auVJ;5k4|z?O_3?oVe+3YS_j9SZN{J+D(GM(F!i@y~
z*kTBTSlp^$H6yiUvtC1K>Qd@v+Z5?EeEzFls1BDLseg*BUmc9lBy&ZflOz@nr>i!Y
zcQTHp_(k@oLI<~)iY2An{`9A$eh+{>ZQ`8mxAZn=1aadZc!^@DiR?-dobDs@Ys(sN
zMIyItk~5NuzF9`F!dy()kM)mr+dyHLl%D8>svOk7J&Ei~uDT0KtQ}<7`BL9#0x#C$
zn!uGu{<m_YUIgD#lW8oE<AgNN2F8YB&ni8-^;Ew+<d_eiK~~~%==1w1^P+?5w^jxj
zOwt&_H(?;GBaI)-f6wlYY*+boKS*OJ31a+J3^|6%_LABPIeR9bJ*}enDK}=-PXK;b
z!_ydeg7fS7CKF1u5%|KVN0sF8*a2mpLyVbqZV0)x6*0i+rcJ$!oSJBNQ4tl`a-3{Z
zz=otvS5q6Duq#eV1+vnyvF$Qh4cw-ck^<^D&^_!v4r`THek~uq-tM9YRk@@{)tudr
zrVTu*><n7#xYa0Tkgrv$W&0Nh(|ubWH)0Mpz*-pU8M-9UgWn@)3HR97z5EA_r8(|9
zni7fm%$qFQcm#y)Fz!;l(PMj+O469y$X3OBj(=}Hs4ANaAL3HMzzLrc^4o{JZni1?
zLScv>D;2>x80sCKBo|Kdoa69RuSOemiG7WWfwmNogpQ~#I8h#EBMXeIIN_8e&u+#S
zOyxvgkT#!unFixBsO9R!lky!c^VQ=FcjY2Z@{n;wJ~Y8&^CV4OE<D+Q_t5Xf?&(7m
zc6DzU0tDG+6<OcM;ZapKGRFM%1k+O7nA4*voAVM)tTbOiFy}AL$9>k)i7yS-JfEz3
zrJ0&YdPC&8W*(odlKG;?TG4Lcy5%L}B;X_k56?!IXF7ZbZ1OvG8r%+UuIN{XPDa6g
zDZMl!{|Xt}>ZGGKEvaE3-ZSefT%??u!HUx{$-4oKQV3raDK|4{os}uNEV9wt{%94!
zZ<y8!^522Id#|@QL!qkX9a6L-B#&g05dL;iyN7NXW%-TBVK!o}>DH{$CuKJaRvzcB
zL^ykg%e)^F?>c+m6p~{{6$@k3>1YqG8us-Y3CL~mARp;te?g7xNq^iO5ShNzCGULX
z2o}2IDK-COY_IL8)Mb)~V`8<K6BSt>I_E%AhktnH6iU6lMasN38Xg(#ZbM#~H^9Bj
z{Lr}*t$Ev(el^eUhZ`7Rd9osRRllst3E1Tl@2~f4Nh))*CeGn&uY1uNti{-hyoLcf
z>^P{hmJ^?wp+3PnuYhE+wFB`dQ(P=isX!o}@LVlG@Nr$jq;5`+#J}wd^(ix2V9iTr
zGiOQa2eRr6dP)s(1lD9jc)i#7>yvT|Ms?^&D4|5H41}<xOoZy}BB?h2Uv<(diufj=
zVoO03DZQtlg;U}X1*4o}K2LGM;B?6<_0%D$xX$)YLBX^N%R6z_=QIMOhYLNm*W!#T
zfSu7Vd@fQ5LZZ?{#GFHOo?JDF)SRDg(kM{!&|-`2i#K23ti)J&{e+LKji8mJ<;BNi
z#&4tSPD$9=;K5=`Mqm^MxOKxXQUDEc9*#nSS~B-p0Rl*`%y%d_c-d1U@5@!dmb?!M
zg6|XEr=@hE-yG(AW}{oT=XajUF#>E^vzVfzh$l&DLyBBlX^%_G+pFXM=DFGx+4?pv
z*kO4QWOe-#D>AcS^F_j0X%0%Q)1+*jswzE9C|@X-CTj(?#LD=z(#D1O;sa-iiv!~~
zJp`T)6?rbLyQHU2qDjr4o0^%5&3wPxxH^PFe!78D{=3<$j{`6>P+j)A6|K#^c7Usn
zS^f6O+9Ye;W&Om~3ue7v*5P6uE!W9n?NiS>SFTHi|0<;=#HjSR!-4SK+2F@eonrw(
KM;Z>tUi}X=K54W7

literal 0
HcmV?d00001

diff --git a/placeholders/dummy_500x500_000000_ffffff.png b/placeholders/dummy_500x500_000000_ffffff.png
new file mode 100644
index 0000000000000000000000000000000000000000..07509049ef01d63790526aa88252a376606ef248
GIT binary patch
literal 8775
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
E0MZ~(i2wiq

literal 0
HcmV?d00001

diff --git a/style/inc/menu.sass b/style/inc/menu.sass
index 66aa3a6..6f24411 100644
--- a/style/inc/menu.sass
+++ b/style/inc/menu.sass
@@ -12,6 +12,7 @@ header
   height: calc(100% - 2 * $space)
   background-color: $menu-background
   font-size: 14px
+  z-index: 1
 
   #logo-client
     padding: $space
@@ -37,7 +38,7 @@ header
 
   nav
     position: absolute
-    top: 115px
+    top: 90px
 
     & > ul > li
       position: relative
@@ -109,9 +110,11 @@ header
       transform-origin: 50% 50%
       transform: scale(-1, 1)
 
-
 .menu-compact
-  $space: 15px
+  main
+    padding: $space $space $space $space*3+70px
+
+  $compact-menu-space: 15px
   $width: 70px
 
   header
@@ -124,11 +127,11 @@ header
       display: none
 
     #logo-client, #logo-eif
-      padding: $space
+      padding: $compact-menu-space
 
     nav > ul > li
       > a
-        padding: $space
+        padding: $compact-menu-space
         height: $width
 
         span
diff --git a/style/style.sass b/style/style.sass
index c8fa4f2..ea88b9c 100644
--- a/style/style.sass
+++ b/style/style.sass
@@ -12,16 +12,6 @@ main
   padding: $space $space $space $space*3+150px
 
   section
-    article
-      position: relative
-      background-color: #fff
-      border-radius: 6px
-      transition: all 0.5s
-      &:hover
-        box-shadow: 0 0 50px rgba(0,0,0,0.05)
-
-
-  section.indicators
     padding: 15px 0
 
     h2
@@ -30,36 +20,53 @@ main
       font-size: 24px
       font-weight: 900
       margin-bottom: 9px
+
     .grid
       display: grid
-      grid-template-columns: repeat( 3, 1fr )
+      grid-template-columns: repeat( 3, 1fr)
       grid-gap: 25px
-      align-items: start
 
     article
-
-      height: 100px
+      position: relative
+      background-color: #fff
+      border-radius: 6px
+      transition: box-shadow 0.5s
       padding: 15px
-      text-align: right
+
+      &:hover
+        box-shadow: 0 0 50px rgba(0, 0, 0, 0.1)
 
       h4
         color: $light-color
         font-size: 16px
         font-weight: 400
 
-      strong
-        font-weight: 900
-        color: $headings-color
-        font-size: 36px
-        margin-top: 10px
-        display: block
+    &.indicators
+      article
+        height: 100px
+        text-align: right
+
+        strong
+          font-weight: 900
+          color: $headings-color
+          font-size: 36px
+          margin-top: 10px
+          display: block
 
-      svg
-        position: absolute
-        top: 15px
-        left: 15px
-        height: 70px
-        width: auto
+        svg
+          position: absolute
+          top: 15px
+          left: 15px
+          height: 70px
+          width: auto
 
+    &.charts
+      article
+        .chart
+          img
+            width: 100%
+            height: 100%
+            object-fit: contain
+            object-position: 50% 0
 
 @import "inc/menu"
diff --git a/tableau-de-bord.php b/tableau-de-bord.php
index fcdfacb..4c021d3 100644
--- a/tableau-de-bord.php
+++ b/tableau-de-bord.php
@@ -20,7 +20,7 @@
             </article>
             <article data-icon="icone-honoraires">
                 <h4>Honoraires en attente de règlement</h4>
-                <strong>1 195 434</strong>
+                <strong>1 195 434 €</strong>
             </article>
             <article data-icon="icone-optimisation">
                 <h4>Optimisation moyenne</h4>
@@ -28,4 +28,51 @@
             </article>
         </div>
     </section>
+    <section class="charts">
+        <h2>Panorama des dossiers en cours</h2>
+        <div class="grid">
+            <article>
+                <h4>Phasage des dossiers en cours</h4>
+                <div class="chart">
+                    <img src="placeholders/dummy_500x500_000000_ffffff.png">
+                </div>
+                <?php include "inc/chart-menu.php" ?>
+            </article>
+            <article>
+                <h4>Détail des dossiers en cours d’audit</h4>
+                <div class="chart">
+                    <img src="placeholders/dummy_500x500_000000_ffffff.png">
+                </div>
+                <?php include "inc/chart-menu.php" ?>
+            </article>
+            <article>
+                <h4>Détail des dossiers en cours d’audit</h4>
+                <div class="chart">
+                    <img src="placeholders/dummy_500x500_000000_ffffff.png">
+                </div>
+                <?php include "inc/chart-menu.php" ?>
+            </article>
+            <article>
+                <h4>Nature des missions confiées</h4>
+                <div class="chart">
+                    <img src="placeholders/dummy_500x400_000000_ffffff.png">
+                </div>
+                <?php include "inc/chart-menu.php" ?>
+            </article>
+            <article>
+                <h4>Détail des dossiers en cours d’audit</h4>
+                <div class="chart">
+                    <img src="placeholders/dummy_500x400_000000_ffffff.png">
+                </div>
+                <?php include "inc/chart-menu.php" ?>
+            </article>
+            <article>
+                <h4>Actifs audités par EIF</h4>
+                <div class="chart">
+                    <img src="placeholders/dummy_500x400_000000_ffffff.png">
+                </div>
+                <?php include "inc/chart-menu.php" ?>
+            </article>
+        </div>
+    </section>
 <?php include "inc/foot.php" ?>
\ No newline at end of file
-- 
2.39.5