Improve accessibility features
This commit is contained in:
Paul Nicoué
parent
b138a0df21
commit
d5d951c8df
8 changed files with 112 additions and 48 deletions
|
|
@ -2,6 +2,24 @@
|
|||
// ANIMATIONS
|
||||
// ----------------------------------------------------------------------------
|
||||
|
||||
@-webkit-keyframes expand-outline {
|
||||
from {
|
||||
outline-offset: 0;
|
||||
}
|
||||
to {
|
||||
outline-offset: 2px;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes expand-outline {
|
||||
from {
|
||||
outline-offset: 0;
|
||||
}
|
||||
to {
|
||||
outline-offset: 2px;
|
||||
}
|
||||
}
|
||||
|
||||
@-webkit-keyframes wave-up {
|
||||
0% {
|
||||
top: 0;
|
||||
|
|
|
|||
|
|
@ -46,6 +46,7 @@
|
|||
--black: #000;
|
||||
--transparent-black: rgba(0, 0, 0, 0.8);
|
||||
--jet: #333333;
|
||||
--transparent-jet: rgba(51, 51, 51, 0.8);
|
||||
--granite-gray: #666666;
|
||||
--spanish-gray: #999999;
|
||||
--light-gray: #cccccc;
|
||||
|
|
@ -54,7 +55,8 @@
|
|||
|
||||
// Plyr (audio player)
|
||||
|
||||
--plyr-color-main: var(--transparent-black);
|
||||
--plyr-color-main: var(--transparent-jet);
|
||||
--plyr-tab-focus-color: var(--white);
|
||||
}
|
||||
|
||||
// Media queries
|
||||
|
|
|
|||
2
assets/css/style.min.css
vendored
2
assets/css/style.min.css
vendored
File diff suppressed because one or more lines are too long
|
|
@ -1 +1 @@
|
|||
{"version":3,"sourceRoot":"","sources":["partials/_minireset.css","partials/_fonts.scss","partials/_variables.scss","partials/_animations.scss","style.scss"],"names":[],"mappings":"CAIA,yGAuBI,SACA,UAGJ,kBAMI,eACA,mBAGJ,GACI,gBAGJ,oBAGI,SAGJ,KACI,sBAGJ,qBACI,mBAGJ,UAEI,YACA,eAGJ,OACI,SAGJ,MACI,yBACA,iBAGJ,MAEI,UCtEJ,WACI,qBACA,+DACA,gBACA,kBAGJ,WACC,qBACA,8DACA,gBACA,kBAGD,WACC,qBACA,8DACA,gBACA,kBAGD,WACC,qBACA,oEACA,gBACA,kBAGD,WACC,qBACA,gEACA,gBACA,kBAGD,WACC,qBACA,sEACA,gBACA,kBAGD,WACC,qBACA,4DACA,gBACA,kBAGD,WACC,qBACA,kEACA,gBACA,kBAKD,WACC,gCACA,oFACA,gBACA,kBChED,MAII,kDACA,6DACA,2BACA,0BACA,6BACA,wBACA,uBACA,4BACA,6BACA,2BACA,uBACA,uBACA,uBAIA,4BACA,wBACA,oBACA,oCACA,sCACA,uFACA,oCACA,sCACA,sHACA,yCACA,2CACA,sCACA,wCACA,6FACA,qBACA,2BACA,+BACA,mMAIA,cACA,wCACA,eACA,wBACA,wBACA,sBACA,cACA,8CAIA,4CAQJ,qCAEI,MAII,yBACA,4BACA,2BACA,qBACA,uBACA,uBAIA,kBACA,oCACA,sCACA,oCACA,sCACA,uFACA,2CACA,yCClFR,2BACI,GACF,MAEE,IACF,YAED,KACC,OAIF,mBACC,GACC,MAEE,IACF,YAED,KACC,OAIF,6BACI,GACF,SAEE,IACF,eAED,KACC,UAIF,qBACI,GACF,SAEE,IACF,eAED,KACC,UCrCF,KACI,oCACA,gCACA,kCACA,iBACA,8BAGJ,SAGI,mBAGJ,GACI,oCACA,8BACA,gCAGJ,GACI,oCACA,8BACA,gCACA,kBAGJ,GACI,oCACA,8BACA,gCACA,qBAGJ,EACI,mBACA,oCAGJ,OACI,oCAGJ,GACI,kBAKJ,EACI,iBACA,0BACA,2CACA,sCACA,mCAEA,yBAGI,mBAOR,KACI,iBACA,kBACA,iBACA,aACA,KACI,+DAMR,yBACC,kBAGD,OACI,iBAGJ,KACI,eAGJ,OACI,iBASJ,YACC,WACG,gCACA,YACH,iKACA,0CACA,iDACG,oBACA,oBACA,aACA,yBACA,sBACA,8BACA,yBACA,sBACA,mBACH,UACA,mBACC,yDAED,cACC,yDAED,WACC,yDAGD,mBACC,eACA,sCACA,uFACA,sCACA,0CACA,+CACA,0CACA,uCAGD,qBACC,uDACA,mDACA,+CAIF,kBACI,kBACH,+CACA,0CACA,uCACA,8BACG,0BACH,sBAEA,yBACC,6BACA,yBACA,qBAIF,uBACI,qBAGJ,iBACC,kBACA,UAGD,wBACC,kBACA,UACA,uBACA,wBACA,UACA,gBACA,YACA,kBACA,4BACA,eACA,oBACA,oBACA,aACA,yBACA,sBACA,mBACA,mBACC,+DAED,cACC,+DAED,WACC,+DAGD,4BACC,WACA,YACA,YACA,cACM,mBACL,sDAEK,cACL,sDAEK,WACL,sDAIF,yCACC,kBACA,UAGD,yCACC,kBACA,UAGE,6DAEF,6BACA,yBACA,qBAGD,sCACC,8BAEA,0CACC,oCACG,gCACA,4BAGJ,uDACC,UAGD,uDACC,UAKH,sBACC,eACA,UACA,MACA,WACA,gBACA,gBACA,aACA,8GACA,0CACA,mBACA,kBACA,gBACA,+CACA,0CACA,uCAIC,4BACC,yCAGD,4BACC,kBACA,yCAGD,yDAEC,cACA,eACA,wBACA,qBACA,mCACA,+BACA,2BACA,+CACA,0CACA,uCAGD,oGAGC,mBAIF,oDACC,wBAEA,sDACC,mBAIF,+BACC,oCACA,gCACA,4BAKE,qHAEC,gCACA,4BACA,wBACA,+CACA,0CACA,uCAPD,qHAEC,gCACA,4BACA,wBACA,+CACA,0CACA,uCAPD,qHAEC,gCACA,4BACA,wBACA,+CACA,0CACA,uCAPD,qHAEC,gCACA,4BACA,wBACA,+CACA,0CACA,uCAPD,qHAEC,gCACA,4BACA,wBACA,+CACA,0CACA,uCAPD,qHAEC,gCACA,4BACA,wBACA,gDACA,2CACA,wCAPD,qHAEC,gCACA,4BACA,wBACA,gDACA,2CACA,wCAPD,qHAEC,gCACA,4BACA,wBACA,gDACA,2CACA,wCAPD,qHAEC,gCACA,4BACA,wBACA,gDACA,2CACA,wCAPD,uHAEC,gCACA,4BACA,wBACA,gDACA,2CACA,wCAPD,uHAEC,gCACA,4BACA,wBACA,gDACA,2CACA,wCAPD,uHAEC,gCACA,4BACA,wBACA,gDACA,2CACA,wCAPD,uHAEC,gCACA,4BACA,wBACA,gDACA,2CACA,wCAPD,uHAEC,gCACA,4BACA,wBACA,gDACA,2CACA,wCAPD,uHAEC,gCACA,4BACA,wBACA,gDACA,2CACA,wCAPD,uHAEC,gCACA,4BACA,wBACA,gDACA,2CACA,wCAPD,uHAEC,gCACA,4BACA,wBACA,gDACA,2CACA,wCAPD,uHAEC,gCACA,4BACA,wBACA,gDACA,2CACA,wCAPD,uHAEC,gCACA,4BACA,wBACA,gDACA,2CACA,wCAPD,uHAEC,gCACA,4BACA,wBACA,gDACA,2CACA,wCAOL,yBACC,eACA,UACA,MACA,OACA,YACA,aACA,8BACA,UACA,oBACA,oBACA,6CACA,wCACA,qCAEA,kCACC,WACA,oBACA,eAIF,qCAEC,sBACC,gBAIF,qCAEC,sBACC,gBAUF,cACI,mCACA,0CACA,YACA,oFACA,oBACA,oBACA,aACA,wBACA,qBACA,uBACA,yBACA,sBACA,mBAGJ,WACI,YACA,iBACA,aACA,KACI,iMAIJ,4BACA,wBACA,cAGJ,iBACI,iBAEA,qBACI,gBACA,2BACA,iBACA,4CAMJ,sCACI,mBACA,mBACA,kBACI,4DAEJ,cACI,4DAEJ,UACI,4DAIR,sCACI,oBACA,qBACA,kBACI,2DAEJ,cACI,2DAEJ,UACI,2DAOR,sCACI,mBACA,mBACA,kBACI,4DAEJ,cACI,4DAEJ,UACI,4DAIR,sCACI,oBACA,qBACA,kBACI,2DAEJ,cACI,2DAEJ,UACI,2DAIR,sCACI,iBACA,wBAMJ,sCACI,mBACA,mBACA,kBACI,4DAEJ,cACI,4DAEJ,UACI,4DAIR,sCACI,oBACA,qBACA,kBACI,2DAEJ,cACI,2DAEJ,UACI,2DAIR,sCACI,sBACA,qBACA,kBACI,sEAEJ,cACI,sEAEJ,UACI,sEAIR,sCACI,uBACA,uBACA,kBACI,uEAEJ,cACI,uEAEJ,UACI,uEAKZ,gBACI,mBACA,8BACA,qBACA,UACA,6CACA,wCACA,qCAEA,oBACI,UACA,6CACA,wCACA,qCAIR,yBACI,UAEA,6BACI,UAIR,2BACI,yCACA,oCAGJ,6BACI,2CACA,sCAKJ,oCAEI,mCACA,YACA,0FAGJ,kCAEI,kBAGJ,gDAEI,gCACA,YAEA,gFACI,kBAKA,kHAEI,kBAIR,sDACF,oCAEM,sHAEI,kBAGV,4DACC,kBACA,mBAGD,kEACC,mBAGD,0EACC,YACA,kBACA,MACA,OAKH,kBACI,cACA,2BACA,YAEA,oCACI,wBAGJ,oEAEI,cACA,gBAKA,+CACI,mBAIR,6BACI,sBACA,oBACA,wBACA,mCACA,kBAIR,qCAIQ,oCACI,yBAOZ,eACI,mCACA,YACA,0FAGJ,cACI,kBAGJ,gBACI,gCACA,YACA,kBAGJ,eACI,kBACA,kBAEA,iBACI,qBACA,aACA,mBACA,mBACA,4BACA,qBACA,yCACA,sDACA,iDACA,8CAEA,sEAGI,8BAWZ,YACI,mCACA,gCACA,YACA,gFACA,oBACA,oBACA,aACA,4BACA,6BACA,0BACA,sBACA,yBACA,sBACA,mBAGJ,oBACI,oBACA,oBACA,aACA,yBACA,sBACA,mBAEA,sBACF,uBACA,wBACA,kBACA,4BACM,oBACA,oBACA,aACA,wBACA,qBACA,uBACA,yBACA,sBACA,mBACN,+CACA,0CACA,uCAEM,wBACI,kBAGJ,0BACL,kBACM,0CACA,qCACA,kCAIP,yDAEC,qBAMD,uDACC,UACA,WAMD,mDACC,UACA,WAKH,uBACI,oCACA,kBAGJ,qCAEI,YACI,8BACA,6BACA,uBACA,mBACA,yBACA,sBACA,8BACA,sBACA,mBACA,qBAGJ,oBACI,QAGJ,uBACI,QACA","file":"style.min.css"}
|
||||
{"version":3,"sourceRoot":"","sources":["partials/_minireset.css","partials/_fonts.scss","partials/_variables.scss","partials/_animations.scss","style.scss"],"names":[],"mappings":"CAIA,yGAuBI,SACA,UAGJ,kBAMI,eACA,mBAGJ,GACI,gBAGJ,oBAGI,SAGJ,KACI,sBAGJ,qBACI,mBAGJ,UAEI,YACA,eAGJ,OACI,SAGJ,MACI,yBACA,iBAGJ,MAEI,UCtEJ,WACI,qBACA,+DACA,gBACA,kBAGJ,WACC,qBACA,8DACA,gBACA,kBAGD,WACC,qBACA,8DACA,gBACA,kBAGD,WACC,qBACA,oEACA,gBACA,kBAGD,WACC,qBACA,gEACA,gBACA,kBAGD,WACC,qBACA,sEACA,gBACA,kBAGD,WACC,qBACA,4DACA,gBACA,kBAGD,WACC,qBACA,kEACA,gBACA,kBAKD,WACC,gCACA,oFACA,gBACA,kBChED,MAII,kDACA,6DACA,2BACA,0BACA,6BACA,wBACA,uBACA,4BACA,6BACA,2BACA,uBACA,uBACA,uBAIA,4BACA,wBACA,oBACA,oCACA,sCACA,uFACA,oCACA,sCACA,sHACA,yCACA,2CACA,sCACA,wCACA,6FACA,qBACA,2BACA,+BACA,mMAIA,cACA,wCACA,eACA,yCACA,wBACA,wBACA,sBACA,cACA,8CAIA,0CACA,qCAQJ,qCAEI,MAII,yBACA,4BACA,2BACA,qBACA,uBACA,uBAIA,kBACA,oCACA,sCACA,oCACA,sCACA,uFACA,2CACA,yCCpFR,kCACI,KACF,iBAED,GACC,oBAIF,0BACC,KACC,iBAED,GACC,oBAIF,2BACI,GACF,MAEE,IACF,YAED,KACC,OAIF,mBACC,GACC,MAEE,IACF,YAED,KACC,OAIF,6BACI,GACF,SAEE,IACF,eAED,KACC,UAIF,qBACI,GACF,SAEE,IACF,eAED,KACC,UCvDF,KACI,oCACA,gCACA,kCACA,iBACA,8BAGJ,SAGI,mBAGJ,GACI,oCACA,8BACA,gCAGJ,GACI,oCACA,8BACA,gCACA,kBAGJ,GACI,oCACA,8BACA,gCACA,qBAGJ,EACI,mBACA,oCAGJ,OACI,oCAGJ,GACI,kBAKJ,EACI,iBACA,0BACH,kBACG,2CACA,sCACA,mCAEA,yBAGI,mBAGP,gBACC,gCACA,mBACA,gDACG,2CAML,KACI,iBACA,kBACA,iBACA,aACA,KACI,+DAMR,yBACC,kBAGD,OACI,iBAGJ,KACI,eAGJ,OACI,iBASJ,YACC,WACG,gCACA,YACH,iKACA,0CACA,iDACG,oBACA,oBACA,aACA,yBACA,sBACA,8BACA,yBACA,sBACA,mBACH,UACA,mBACC,yDAED,cACC,yDAED,WACC,yDAGD,mBACC,eACA,sCACA,uFACA,sCACA,0CACA,+CACA,0CACA,uCAGD,qBACC,uDACA,mDACA,+CAIF,kBACI,kBACH,+CACA,0CACA,uCACA,8BACG,0BACH,sBAEA,yBACC,6BACA,yBACA,qBAIF,uBACI,qBAGJ,iBACC,kBACA,UAGD,wBACC,kBACA,UACA,uBACA,wBACA,UACA,gBACA,YACA,kBACA,4BACA,eACA,oBACA,oBACA,aACA,yBACA,sBACA,mBACA,mBACC,+DAED,cACC,+DAED,WACC,+DAGD,4BACC,WACA,YACA,YACA,cACM,mBACL,sDAEK,cACL,sDAEK,WACL,sDAIF,yCACC,kBACA,UAGD,yCACC,kBACA,UAGE,6DAEF,6BACA,yBACA,qBAGD,sCACC,8BAEA,0CACC,oCACG,gCACA,4BAGJ,uDACC,UAGD,uDACC,UAKH,sBACC,eACA,UACA,MACA,WACA,gBACA,gBACA,aACA,8GACA,0CACA,mBACA,kBACA,gBACA,+CACA,0CACA,uCAIC,4BACC,yCAGD,4BACC,kBACA,yCAGD,6BACC,eACA,mCACA,+BACA,2BACA,+CACA,0CACA,uCAEA,iEAEC,wBAGD,+BACC,qBAEA,gHAGC,mBAGD,6CACC,gCAMJ,oDACC,wBAEA,sDACC,mBAIF,+BACC,oCACA,gCACA,4BAKE,2DACC,gCACA,4BACA,wBACA,+CACA,0CACA,uCAND,2DACC,gCACA,4BACA,wBACA,+CACA,0CACA,uCAND,2DACC,gCACA,4BACA,wBACA,+CACA,0CACA,uCAND,2DACC,gCACA,4BACA,wBACA,+CACA,0CACA,uCAND,2DACC,gCACA,4BACA,wBACA,+CACA,0CACA,uCAND,2DACC,gCACA,4BACA,wBACA,gDACA,2CACA,wCAND,2DACC,gCACA,4BACA,wBACA,gDACA,2CACA,wCAND,2DACC,gCACA,4BACA,wBACA,gDACA,2CACA,wCAND,2DACC,gCACA,4BACA,wBACA,gDACA,2CACA,wCAND,4DACC,gCACA,4BACA,wBACA,gDACA,2CACA,wCAND,4DACC,gCACA,4BACA,wBACA,gDACA,2CACA,wCAND,4DACC,gCACA,4BACA,wBACA,gDACA,2CACA,wCAND,4DACC,gCACA,4BACA,wBACA,gDACA,2CACA,wCAND,4DACC,gCACA,4BACA,wBACA,gDACA,2CACA,wCAND,4DACC,gCACA,4BACA,wBACA,gDACA,2CACA,wCAND,4DACC,gCACA,4BACA,wBACA,gDACA,2CACA,wCAND,4DACC,gCACA,4BACA,wBACA,gDACA,2CACA,wCAND,4DACC,gCACA,4BACA,wBACA,gDACA,2CACA,wCAND,4DACC,gCACA,4BACA,wBACA,gDACA,2CACA,wCAND,4DACC,gCACA,4BACA,wBACA,gDACA,2CACA,wCAOL,yBACC,eACA,UACA,MACA,OACA,YACA,aACA,8BACA,UACA,oBACA,oBACA,6CACA,wCACA,qCAEA,kCACC,WACA,oBACA,eAIF,qCAEC,sBACC,gBAIF,qCAEC,sBACC,gBAUF,cACI,mCACA,0CACA,YACA,oFACA,oBACA,oBACA,aACA,wBACA,qBACA,uBACA,yBACA,sBACA,mBAGJ,WACI,YACA,iBACA,aACA,KACI,iMAIJ,4BACA,wBACA,cAGJ,iBACI,iBAEA,qBACI,gBACA,2BACA,iBACA,4CAMJ,sCACI,mBACA,mBACA,kBACI,4DAEJ,cACI,4DAEJ,UACI,4DAIR,sCACI,oBACA,qBACA,kBACI,2DAEJ,cACI,2DAEJ,UACI,2DAOR,sCACI,mBACA,mBACA,kBACI,4DAEJ,cACI,4DAEJ,UACI,4DAIR,sCACI,oBACA,qBACA,kBACI,2DAEJ,cACI,2DAEJ,UACI,2DAIR,sCACI,iBACA,wBAMJ,sCACI,mBACA,mBACA,kBACI,4DAEJ,cACI,4DAEJ,UACI,4DAIR,sCACI,oBACA,qBACA,kBACI,2DAEJ,cACI,2DAEJ,UACI,2DAIR,sCACI,sBACA,qBACA,kBACI,sEAEJ,cACI,sEAEJ,UACI,sEAIR,sCACI,uBACA,uBACA,kBACI,uEAEJ,cACI,uEAEJ,UACI,uEAKZ,gBACI,mBACA,8BACA,qBACA,UACA,6CACA,wCACA,qCAEA,oBACI,UACA,6CACA,wCACA,qCAIR,yBACI,UAEA,6BACI,UAIR,2BACI,yCACA,oCAGJ,6BACI,2CACA,sCAKJ,oCAEI,mCACA,YACA,0FAGJ,kCAEI,kBAGJ,gDAEI,gCACA,YAEA,gFACI,kBAKA,kHAEI,kBAIR,sDACF,oCAEM,sHAEI,kBAGV,4DACC,kBACA,mBAGD,kEACC,kBAGD,0EACC,YACA,kBACA,MACA,OAKH,kBACI,cACA,2BACA,YAEA,oCACI,wBAGJ,oEAEI,cACA,gBAKA,+CACI,mBAIR,6BACI,sBACA,oBACA,wBACA,mCACA,kBACA,oCAIR,qCAIQ,oCACI,yBAOZ,eACI,mCACA,YACA,0FAGJ,cACI,kBAGJ,gBACI,gCACA,YACA,kBAGJ,eACI,kBACA,kBAEA,iBACI,qBACA,aACA,mBACA,mBACA,4BACA,qBACA,yCACA,sDACA,iDACA,8CAEA,sEAGI,8BAWZ,YACI,mCACA,gCACA,YACA,gFACA,oBACA,oBACA,aACA,4BACA,6BACA,0BACA,sBACA,yBACA,sBACA,mBAGJ,oBACI,oBACA,oBACA,aACA,yBACA,sBACA,mBAEA,sBACF,uBACA,wBACA,kBACA,4BACM,oBACA,oBACA,aACA,wBACA,qBACA,uBACA,yBACA,sBACA,mBACN,+CACA,0CACA,uCAEM,wBACI,kBAGJ,0BACL,kBACM,0CACA,qCACA,kCAIP,qFAGC,qBAMD,uDACC,UACA,WAMD,mDACC,UACA,WAKH,uBACI,oCACA,kBAGJ,qCAEI,YACI,8BACA,6BACA,uBACA,mBACA,yBACA,sBACA,8BACA,sBACA,mBACA,qBAGJ,oBACI,QAGJ,uBACI,QACA","file":"style.min.css"}
|
||||
|
|
@ -61,6 +61,7 @@ em {
|
|||
a {
|
||||
color: var(--jet);
|
||||
text-decoration: underline;
|
||||
border-radius: 2px;
|
||||
-webkit-transition: color 200ms ease-in-out;
|
||||
-o-transition: color 200ms ease-in-out;
|
||||
transition: color 200ms ease-in-out;
|
||||
|
|
@ -70,8 +71,14 @@ a {
|
|||
&:active {
|
||||
color: var(--black);
|
||||
}
|
||||
}
|
||||
|
||||
&:focus-visible {
|
||||
outline: 1px dashed var(--black);
|
||||
outline-offset: 2px;
|
||||
-webkit-animation: expand-outline 200ms ease-out;
|
||||
animation: expand-outline 200ms ease-in-out;
|
||||
}
|
||||
}
|
||||
|
||||
// General grid layout
|
||||
|
||||
|
|
@ -286,24 +293,33 @@ footer {
|
|||
border-top: 1px solid var(--granite-gray);
|
||||
}
|
||||
|
||||
a,
|
||||
span {
|
||||
display: block;
|
||||
div {
|
||||
padding: 1rem 0;
|
||||
color: var(--light-gray);
|
||||
text-decoration: none;
|
||||
-webkit-transform: translateX(100%);
|
||||
-ms-transform: translateX(100%);
|
||||
transform: translateX(100%);
|
||||
-webkit-transition: transform 400ms ease-in-out;
|
||||
-o-transition: transform 400ms ease-in-out;
|
||||
transition: transform 400ms ease-in-out;
|
||||
}
|
||||
|
||||
a:hover,
|
||||
a:focus,
|
||||
a:active {
|
||||
color: var(--white);
|
||||
a,
|
||||
span {
|
||||
color: var(--light-gray);
|
||||
}
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active {
|
||||
color: var(--white);
|
||||
}
|
||||
|
||||
&:focus-visible {
|
||||
outline: 1px dashed var(--white);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -323,8 +339,7 @@ footer {
|
|||
@for $i from 1 through 20 {
|
||||
.header-bar__nav-item-#{$i} {
|
||||
|
||||
a,
|
||||
span {
|
||||
div {
|
||||
-webkit-transform: translateX(0);
|
||||
-ms-transform: translateX(0);
|
||||
transform: translateX(0);
|
||||
|
|
@ -626,7 +641,7 @@ footer {
|
|||
}
|
||||
|
||||
li + li {
|
||||
margin: 0.5rem 0 0 0;
|
||||
margin: 1rem 0 0 0;
|
||||
}
|
||||
|
||||
li:before {
|
||||
|
|
@ -666,6 +681,7 @@ footer {
|
|||
margin: 1rem auto 0 auto;
|
||||
font-size: var(--caption-font-size);
|
||||
font-style: italic;
|
||||
line-height: var(--text-line-height);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -783,6 +799,7 @@ footer {
|
|||
|
||||
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active {
|
||||
transform: scale(1.1);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -21,13 +21,14 @@ let videoPlayers = [];
|
|||
// HEADER BAR ANIMATION //
|
||||
|
||||
const headerBar = document.querySelector('.header-bar');
|
||||
const headerLogo =document.querySelector('.header-bar__logo');
|
||||
const headerLogo = document.querySelector('.header-bar__logo');
|
||||
let scrollOffset = 0;
|
||||
|
||||
// NAVIGATION MENU ANIMATION //
|
||||
|
||||
const headerNavBtn = document.querySelector('.header-bar__nav-button');
|
||||
const headerNavMenu = document.querySelector('.header-bar__nav-menu');
|
||||
const headerNavMenuListEls = document.querySelectorAll('.header-bar__nav-menu li');
|
||||
const headerNavOverlay = document.querySelector('.header-bar__nav-overlay');
|
||||
const touchPosition = {
|
||||
initialX: null,
|
||||
|
|
@ -181,12 +182,8 @@ function setUpVideoPlayers() {
|
|||
'duration',
|
||||
'mute',
|
||||
'volume',
|
||||
'settings',
|
||||
'fullscreen'
|
||||
],
|
||||
settings: [
|
||||
'quality'
|
||||
],
|
||||
i18n: {
|
||||
play: 'Lire',
|
||||
pause: 'Mettre sur pause',
|
||||
|
|
@ -198,20 +195,6 @@ function setUpVideoPlayers() {
|
|||
unmute: 'Activer le son',
|
||||
enterFullscreen: 'Activer le mode plein écran',
|
||||
exitFullscreen: 'Quitter le mode plein écran'
|
||||
},
|
||||
tooltips: {
|
||||
controls: true,
|
||||
seek: true
|
||||
},
|
||||
quality: {
|
||||
default: 720,
|
||||
options: [
|
||||
1080,
|
||||
720,
|
||||
480,
|
||||
360,
|
||||
240,
|
||||
]
|
||||
}
|
||||
});
|
||||
}
|
||||
|
|
@ -268,6 +251,16 @@ function toggleHeaderNav() {
|
|||
}
|
||||
}
|
||||
|
||||
// Open header navigation
|
||||
function openHeaderNav() {
|
||||
if (headerNavBtn && headerNavMenu) {
|
||||
headerNavBtn.classList.add('header-bar__nav-button--custom-focus');
|
||||
headerNavMenu.classList.add('header-bar__nav-menu--visible');
|
||||
headerNavOverlay.classList.add('header-bar__nav-overlay--visible');
|
||||
document.body.classList.add('body--hidden-overflow-y');
|
||||
}
|
||||
}
|
||||
|
||||
// Close header navigation
|
||||
function closeHeaderNav() {
|
||||
if (headerNavBtn && headerNavMenu) {
|
||||
|
|
@ -295,6 +288,24 @@ function closeHeaderNavOnClick() {
|
|||
});
|
||||
}
|
||||
|
||||
// Open header navigation on menu list focusin event
|
||||
function openHeaderNavBeforeFocus() {
|
||||
if (headerNavMenuListEls) {
|
||||
for (let i = 0; i < headerNavMenuListEls.length; i++) {
|
||||
headerNavMenuListEls[i].addEventListener('focusin', openHeaderNav);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Close header navigation on menu list focusout event
|
||||
function closeHeaderNavAfterFocus() {
|
||||
if (headerNavMenuListEls) {
|
||||
for (let i = 0; i < headerNavMenuListEls.length; i++) {
|
||||
headerNavMenuListEls[i].addEventListener('focusout', closeHeaderNav);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Close header navigation on touchstart and touchmove events (swipe right)
|
||||
function closeHeaderNavOnSwipe() {
|
||||
headerNavMenu.addEventListener('touchstart', function(e) {
|
||||
|
|
@ -352,4 +363,6 @@ document.addEventListener('scroll', function() {
|
|||
|
||||
toggleHeaderNavOnClick();
|
||||
closeHeaderNavOnClick();
|
||||
openHeaderNavBeforeFocus();
|
||||
closeHeaderNavAfterFocus();
|
||||
closeHeaderNavOnSwipe();
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue