From f619550c738f177a3caa783cd44aebddeb6d69cd Mon Sep 17 00:00:00 2001 From: FazCodeFR <30906528+FazCodeFR@users.noreply.github.com> Date: Tue, 4 Jun 2024 15:52:16 +0200 Subject: [PATCH 1/6] Add 404 page --- .../components/erreur/erreur.component.html | 171 +- .../components/erreur/erreur.component.scss | 1570 ++++++++++++----- 2 files changed, 1241 insertions(+), 500 deletions(-) diff --git a/src/app/components/erreur/erreur.component.html b/src/app/components/erreur/erreur.component.html index 0918be9..831ac6d 100644 --- a/src/app/components/erreur/erreur.component.html +++ b/src/app/components/erreur/erreur.component.html @@ -1,35 +1,142 @@ - -
-
-
-
-
-
- + +
+
+

404

+

OOPS... PAGE NON TROUVÉE

+ + + Retour à l'accueil + - -
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
-
-
- -
- -
-
-

404

-

Page non trouvée...

-
-
- -
-
- - -
\ No newline at end of file +
\ No newline at end of file diff --git a/src/app/components/erreur/erreur.component.scss b/src/app/components/erreur/erreur.component.scss index 76648bf..36c7a95 100644 --- a/src/app/components/erreur/erreur.component.scss +++ b/src/app/components/erreur/erreur.component.scss @@ -1,507 +1,1141 @@ - -label { - cursor: pointer; -} - -a { - margin: 0; - padding: 0; - vertical-align: baseline; - background: transparent; - text-decoration: none; - color: #000; -} - -input, select, button, textarea { - margin: 0; - font-size: 100%; -} - -html, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, -a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, -small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, -fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, input { - border: 0; - outline: 0; - font-size: 100%; - vertical-align: baseline; - background: transparent; -} - - -.top-header:before { - background-image: url(https://1.bp.blogspot.com/-gxsOcYWghHA/Xp_izTh4sFI/AAAAAAAAU8s/y637Fwg99qAuzW9na_NT_uApny8Vce95gCEwYBhgL/s1600/header-footer-gradient-bg.png); -} -.top-header:before { - content: ''; + .btn { + font-size:14px; + color:#fff; + letter-spacing:1px; + overflow:hidden; + position:relative; + text-transform:uppercase; + border-color:#fff; + border: 2px solid; + border-radius:0; + padding: 12px 4vw; + background:transparent; + box-shadow:none; + position: relative; + z-index: 2; + } + + .btn:hover, + .btn:focus, + .btn:active { + background:transparent; + color:#000; + border-color:#222; + border: 2px solid #fff; + outline:none; + box-shadow:none; + } + + .btn .mask { + background: #fff none repeat scroll 0 0; display: block; + height: 100%; + left: 0; + position: absolute; + top: 0; + width: 0; + z-index: -1; + -moz-transition: all 0.9s cubic-bezier(0.2, 1, 0.25, 1) 0s; + -o-transition: all 0.9s cubic-bezier(0.2, 1, 0.25, 1) 0s; + -webkit-transition: all 0.9s cubic-bezier(0.2, 1, 0.25, 1) 0s; + transition: all 0.9s cubic-bezier(0.2, 1, 0.25, 1) 0s; + } + + .btn:hover .mask { width: 100%; - height: 4px; - background-repeat: repeat-x; - background-size: contain; + } + + .huge-section { + min-height: 100vh + } + + .huge-side { + min-height: 100vh + } + + .left-side { + background: #242424; + } + .left-side > .row { + margin-left: 20px; + } + + .left-side .huge-content { + color: #fff; + min-height: 100vh; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + margin: auto; + } + + .left-side .huge-content .logo { + height: 32px; + margin: 60px 0 100px; + } + + .left-side .huge-content h1 { + font-size: 42px; + } + + .left-side .huge-content h2 { + font-size: 22px; + line-height: 1.5; + margin-bottom: 50px; + } + + .left-side .btn { + margin-bottom: 80px; + } + + .left-side .social-icons { + position: absolute; + bottom: 30px; + padding: 0; + } + + .left-side .social-icons li { + display: inline-block; + float: left; + margin-right: 20px; + } + + .left-side .social-icons li:last-child { + margin-right: 0; + } + + .left-side .social-icons li a { + color: #fff; + } + + .left-side .social-icons li a:hover { + opacity: .8; + } + + .right-side { + margin: 0; + padding: 0; + overflow: hidden; + } + + .right-side .huge-background-img { + height: 100vh; + } + + /**********************************/ + /******** 3.0 Cat Swinging ********/ + /**********************************/ + .all-wrap { + -webkit-animation: bob 7s cubic-bezier(0.5, 0, 0.5, 1) infinite both; + animation: bob 7s cubic-bezier(0.5, 0, 0.5, 1) infinite both; + } + + .all { + top: 15rem; + left: calc(50% - 2.5rem); + position: absolute; + width: 5rem; + height: 5rem; + -webkit-transform-origin: center -20rem; + transform-origin: center -20rem; + -webkit-animation: swing 7s cubic-bezier(0.5, 0, 0.5, 1) infinite both; + animation: swing 7s cubic-bezier(0.5, 0, 0.5, 1) infinite both; + } + .all:before { + height: 20rem; + width: 2px; + background-color: #DB242A; + left: calc(50% - 1px); + bottom: 20rem; + } + + .yarn { + position: absolute; + top: 0; + left: -16px; + width: 80px; + height: 80px; + border-radius: 50%; + background-image: -webkit-radial-gradient(top left, circle, #e97c7f, #db242a 50%, #af1d22); + background-image: radial-gradient(circle at top left, #e97c7f, #db242a 50%, #af1d22); + z-index: 1; + } + .yarn:before, .yarn:after { + position: absolute; + width: 20px; + height: 20px; + border-radius: 50%; + background-color: white; + top: -1px; + } + .yarn:before { + left: calc(50% + 7px); + background-color: #b1bce6; + } + .yarn:after { + right: calc(50% + 7px); + background-color: #D5E8F8; + } + + .cat-wrap { + position: absolute; + top: 0; + left: calc(50% - 45px); + width: 90px; + height: 130px; + -webkit-animation: reverse-swing 7s cubic-bezier(0.5, 0, 0.5, 1) infinite both; + animation: reverse-swing 7s cubic-bezier(0.5, 0, 0.5, 1) infinite both; + -webkit-transform-origin: top center; + transform-origin: top center; + } + + .cat { position: absolute; top: 0; left: 0; - opacity:0.5; -} - - -.starsec{ - content: " "; + width: 100%; + height: 100%; + -webkit-animation: swing 7s 0.2s infinite both; + animation: swing 7s 0.2s infinite both; + -webkit-transform-origin: top center; + transform-origin: top center; + } + + .cat-upper { position: absolute; - width: 3px; - height: 3px; - background: transparent; - box-shadow: 571px 173px #00BCD4, 1732px 143px #00BCD4, 1745px 454px #FF5722, 234px 784px #00BCD4, 1793px 1123px #FF9800, 1076px 504px #03A9F4, 633px 601px #FF5722, 350px 630px #FFEB3B, 1164px 782px #00BCD4, 76px 690px #3F51B5, 1825px 701px #CDDC39, 1646px 578px #FFEB3B, 544px 293px #2196F3, 445px 1061px #673AB7, 928px 47px #00BCD4, 168px 1410px #8BC34A, 777px 782px #9C27B0, 1235px 1941px #9C27B0, 104px 1690px #8BC34A, 1167px 1338px #E91E63, 345px 1652px #009688, 1682px 1196px #F44336, 1995px 494px #8BC34A, 428px 798px #FF5722, 340px 1623px #F44336, 605px 349px #9C27B0, 1339px 1344px #673AB7, 1102px 1745px #3F51B5, 1592px 1676px #2196F3, 419px 1024px #FF9800, 630px 1033px #4CAF50, 1995px 1644px #00BCD4, 1092px 712px #9C27B0, 1355px 606px #F44336, 622px 1881px #CDDC39, 1481px 621px #9E9E9E, 19px 1348px #8BC34A, 864px 1780px #E91E63, 442px 1136px #2196F3, 67px 712px #FF5722, 89px 1406px #F44336, 275px 321px #009688, 592px 630px #E91E63, 1012px 1690px #9C27B0, 1749px 23px #673AB7, 94px 1542px #FFEB3B, 1201px 1657px #3F51B5, 1505px 692px #2196F3, 1799px 601px #03A9F4, 656px 811px #00BCD4, 701px 597px #00BCD4, 1202px 46px #FF5722, 890px 569px #FF5722, 1613px 813px #2196F3, 223px 252px #FF9800, 983px 1093px #F44336, 726px 1029px #FFC107, 1764px 778px #CDDC39, 622px 1643px #F44336, 174px 1559px #673AB7, 212px 517px #00BCD4, 340px 505px #FFF, 1700px 39px #FFF, 1768px 516px #F44336, 849px 391px #FF9800, 228px 1824px #FFF, 1119px 1680px #FFC107, 812px 1480px #3F51B5, 1438px 1585px #CDDC39, 137px 1397px #FFF, 1080px 456px #673AB7, 1208px 1437px #03A9F4, 857px 281px #F44336, 1254px 1306px #CDDC39, 987px 990px #4CAF50, 1655px 911px #00BCD4, 1102px 1216px #FF5722, 1807px 1044px #FFF, 660px 435px #03A9F4, 299px 678px #4CAF50, 1193px 115px #FF9800, 918px 290px #CDDC39, 1447px 1422px #FFEB3B, 91px 1273px #9C27B0, 108px 223px #FFEB3B, 146px 754px #00BCD4, 461px 1446px #FF5722, 1004px 391px #673AB7, 1529px 516px #F44336, 1206px 845px #CDDC39, 347px 583px #009688, 1102px 1332px #F44336, 709px 1756px #00BCD4, 1972px 248px #FFF, 1669px 1344px #FF5722, 1132px 406px #F44336, 320px 1076px #CDDC39, 126px 943px #FFEB3B, 263px 604px #FF5722, 1546px 692px #F44336; - animation: animStar 150s linear infinite; -} - -.starthird -{ - content: " "; + top: 0; + left: 0; + width: 100%; + height: 100%; + -webkit-transform-origin: top center; + transform-origin: top center; + z-index: 1; + } + .cat-upper .cat-leg { position: absolute; - width: 3px; - height: 3px; - background: transparent; - box-shadow: 571px 173px #00BCD4, 1732px 143px #00BCD4, 1745px 454px #FF5722, 234px 784px #00BCD4, 1793px 1123px #FF9800, 1076px 504px #03A9F4, 633px 601px #FF5722, 350px 630px #FFEB3B, 1164px 782px #00BCD4, 76px 690px #3F51B5, 1825px 701px #CDDC39, 1646px 578px #FFEB3B, 544px 293px #2196F3, 445px 1061px #673AB7, 928px 47px #00BCD4, 168px 1410px #8BC34A, 777px 782px #9C27B0, 1235px 1941px #9C27B0, 104px 1690px #8BC34A, 1167px 1338px #E91E63, 345px 1652px #009688, 1682px 1196px #F44336, 1995px 494px #8BC34A, 428px 798px #FF5722, 340px 1623px #F44336, 605px 349px #9C27B0, 1339px 1344px #673AB7, 1102px 1745px #3F51B5, 1592px 1676px #2196F3, 419px 1024px #FF9800, 630px 1033px #4CAF50, 1995px 1644px #00BCD4, 1092px 712px #9C27B0, 1355px 606px #F44336, 622px 1881px #CDDC39, 1481px 621px #9E9E9E, 19px 1348px #8BC34A, 864px 1780px #E91E63, 442px 1136px #2196F3, 67px 712px #FF5722, 89px 1406px #F44336, 275px 321px #009688, 592px 630px #E91E63, 1012px 1690px #9C27B0, 1749px 23px #673AB7, 94px 1542px #FFEB3B, 1201px 1657px #3F51B5, 1505px 692px #2196F3, 1799px 601px #03A9F4, 656px 811px #00BCD4, 701px 597px #00BCD4, 1202px 46px #FF5722, 890px 569px #FF5722, 1613px 813px #2196F3, 223px 252px #FF9800, 983px 1093px #F44336, 726px 1029px #FFC107, 1764px 778px #CDDC39, 622px 1643px #F44336, 174px 1559px #673AB7, 212px 517px #00BCD4, 340px 505px #FFF, 1700px 39px #FFF, 1768px 516px #F44336, 849px 391px #FF9800, 228px 1824px #FFF, 1119px 1680px #FFC107, 812px 1480px #3F51B5, 1438px 1585px #CDDC39, 137px 1397px #FFF, 1080px 456px #673AB7, 1208px 1437px #03A9F4, 857px 281px #F44336, 1254px 1306px #CDDC39, 987px 990px #4CAF50, 1655px 911px #00BCD4, 1102px 1216px #FF5722, 1807px 1044px #FFF, 660px 435px #03A9F4, 299px 678px #4CAF50, 1193px 115px #FF9800, 918px 290px #CDDC39, 1447px 1422px #FFEB3B, 91px 1273px #9C27B0, 108px 223px #FFEB3B, 146px 754px #00BCD4, 461px 1446px #FF5722, 1004px 391px #673AB7, 1529px 516px #F44336, 1206px 845px #CDDC39, 347px 583px #009688, 1102px 1332px #F44336, 709px 1756px #00BCD4, 1972px 248px #FFF, 1669px 1344px #FF5722, 1132px 406px #F44336, 320px 1076px #CDDC39, 126px 943px #FFEB3B, 263px 604px #FF5722, 1546px 692px #F44336; - animation: animStar 10s linear infinite; -} - -.starfourth -{ - content: " "; + width: 20px; + height: 100%; + background-color: white; + z-index: -1; + background-image: -webkit-linear-gradient(left, #D5E8F8, #D5E8F8 20%, #8B9BD9); + background-image: linear-gradient(to right, #D5E8F8, #D5E8F8 20%, #8B9BD9); + } + .cat-upper .cat-leg:nth-child(1) { + border-top-left-radius: 100px; + left: 10px; + } + .cat-upper .cat-leg:nth-child(1):after { + left: 50%; + } + .cat-upper .cat-leg:nth-child(2) { + border-top-left-radius: 0; + border-top-right-radius: 100px; + right: 17px; + } + .cat-upper .cat-leg:nth-child(2):after { + right: 50%; + } + + .cat-lower-wrap { + height: 90%; + width: 100%; position: absolute; - width: 2px; - height: 2px; - background: transparent; - box-shadow: 571px 173px #00BCD4, 1732px 143px #00BCD4, 1745px 454px #FF5722, 234px 784px #00BCD4, 1793px 1123px #FF9800, 1076px 504px #03A9F4, 633px 601px #FF5722, 350px 630px #FFEB3B, 1164px 782px #00BCD4, 76px 690px #3F51B5, 1825px 701px #CDDC39, 1646px 578px #FFEB3B, 544px 293px #2196F3, 445px 1061px #673AB7, 928px 47px #00BCD4, 168px 1410px #8BC34A, 777px 782px #9C27B0, 1235px 1941px #9C27B0, 104px 1690px #8BC34A, 1167px 1338px #E91E63, 345px 1652px #009688, 1682px 1196px #F44336, 1995px 494px #8BC34A, 428px 798px #FF5722, 340px 1623px #F44336, 605px 349px #9C27B0, 1339px 1344px #673AB7, 1102px 1745px #3F51B5, 1592px 1676px #2196F3, 419px 1024px #FF9800, 630px 1033px #4CAF50, 1995px 1644px #00BCD4, 1092px 712px #9C27B0, 1355px 606px #F44336, 622px 1881px #CDDC39, 1481px 621px #9E9E9E, 19px 1348px #8BC34A, 864px 1780px #E91E63, 442px 1136px #2196F3, 67px 712px #FF5722, 89px 1406px #F44336, 275px 321px #009688, 592px 630px #E91E63, 1012px 1690px #9C27B0, 1749px 23px #673AB7, 94px 1542px #FFEB3B, 1201px 1657px #3F51B5, 1505px 692px #2196F3, 1799px 601px #03A9F4, 656px 811px #00BCD4, 701px 597px #00BCD4, 1202px 46px #FF5722, 890px 569px #FF5722, 1613px 813px #2196F3, 223px 252px #FF9800, 983px 1093px #F44336, 726px 1029px #FFC107, 1764px 778px #CDDC39, 622px 1643px #F44336, 174px 1559px #673AB7, 212px 517px #00BCD4, 340px 505px #FFF, 1700px 39px #FFF, 1768px 516px #F44336, 849px 391px #FF9800, 228px 1824px #FFF, 1119px 1680px #FFC107, 812px 1480px #3F51B5, 1438px 1585px #CDDC39, 137px 1397px #FFF, 1080px 456px #673AB7, 1208px 1437px #03A9F4, 857px 281px #F44336, 1254px 1306px #CDDC39, 987px 990px #4CAF50, 1655px 911px #00BCD4, 1102px 1216px #FF5722, 1807px 1044px #FFF, 660px 435px #03A9F4, 299px 678px #4CAF50, 1193px 115px #FF9800, 918px 290px #CDDC39, 1447px 1422px #FFEB3B, 91px 1273px #9C27B0, 108px 223px #FFEB3B, 146px 754px #00BCD4, 461px 1446px #FF5722, 1004px 391px #673AB7, 1529px 516px #F44336, 1206px 845px #CDDC39, 347px 583px #009688, 1102px 1332px #F44336, 709px 1756px #00BCD4, 1972px 248px #FFF, 1669px 1344px #FF5722, 1132px 406px #F44336, 320px 1076px #CDDC39, 126px 943px #FFEB3B, 263px 604px #FF5722, 1546px 692px #F44336; - animation: animStar 50s linear infinite; -} - -.starfifth -{ - content: " "; + top: 100%; + width: 75px; + left: calc(50% - 37.5px); + -webkit-animation: reverse-swing 7s 0.2s infinite both; + animation: reverse-swing 7s 0.2s infinite both; + -webkit-transform-origin: top center; + transform-origin: top center; + } + + .cat-lower { position: absolute; - width: 1px; - height: 1px; - background: transparent; - box-shadow: 571px 173px #00BCD4, 1732px 143px #00BCD4, 1745px 454px #FF5722, 234px 784px #00BCD4, 1793px 1123px #FF9800, 1076px 504px #03A9F4, 633px 601px #FF5722, 350px 630px #FFEB3B, 1164px 782px #00BCD4, 76px 690px #3F51B5, 1825px 701px #CDDC39, 1646px 578px #FFEB3B, 544px 293px #2196F3, 445px 1061px #673AB7, 928px 47px #00BCD4, 168px 1410px #8BC34A, 777px 782px #9C27B0, 1235px 1941px #9C27B0, 104px 1690px #8BC34A, 1167px 1338px #E91E63, 345px 1652px #009688, 1682px 1196px #F44336, 1995px 494px #8BC34A, 428px 798px #FF5722, 340px 1623px #F44336, 605px 349px #9C27B0, 1339px 1344px #673AB7, 1102px 1745px #3F51B5, 1592px 1676px #2196F3, 419px 1024px #FF9800, 630px 1033px #4CAF50, 1995px 1644px #00BCD4, 1092px 712px #9C27B0, 1355px 606px #F44336, 622px 1881px #CDDC39, 1481px 621px #9E9E9E, 19px 1348px #8BC34A, 864px 1780px #E91E63, 442px 1136px #2196F3, 67px 712px #FF5722, 89px 1406px #F44336, 275px 321px #009688, 592px 630px #E91E63, 1012px 1690px #9C27B0, 1749px 23px #673AB7, 94px 1542px #FFEB3B, 1201px 1657px #3F51B5, 1505px 692px #2196F3, 1799px 601px #03A9F4, 656px 811px #00BCD4, 701px 597px #00BCD4, 1202px 46px #FF5722, 890px 569px #FF5722, 1613px 813px #2196F3, 223px 252px #FF9800, 983px 1093px #F44336, 726px 1029px #FFC107, 1764px 778px #CDDC39, 622px 1643px #F44336, 174px 1559px #673AB7, 212px 517px #00BCD4, 340px 505px #FFF, 1700px 39px #FFF, 1768px 516px #F44336, 849px 391px #FF9800, 228px 1824px #FFF, 1119px 1680px #FFC107, 812px 1480px #3F51B5, 1438px 1585px #CDDC39, 137px 1397px #FFF, 1080px 456px #673AB7, 1208px 1437px #03A9F4, 857px 281px #F44336, 1254px 1306px #CDDC39, 987px 990px #4CAF50, 1655px 911px #00BCD4, 1102px 1216px #FF5722, 1807px 1044px #FFF, 660px 435px #03A9F4, 299px 678px #4CAF50, 1193px 115px #FF9800, 918px 290px #CDDC39, 1447px 1422px #FFEB3B, 91px 1273px #9C27B0, 108px 223px #FFEB3B, 146px 754px #00BCD4, 461px 1446px #FF5722, 1004px 391px #673AB7, 1529px 516px #F44336, 1206px 845px #CDDC39, 347px 583px #009688, 1102px 1332px #F44336, 709px 1756px #00BCD4, 1972px 248px #FFF, 1669px 1344px #FF5722, 1132px 406px #F44336, 320px 1076px #CDDC39, 126px 943px #FFEB3B, 263px 604px #FF5722, 1546px 692px #F44336; - animation: animStar 80s linear infinite; -} - -@keyframes animStar -{ - 0% { - transform: translateY(0px); - } - 100% { - transform: translateY(-2000px); - } -} - - - -button { - border: none; - padding: 0; - font-size: 0; - line-height: 0; - background: none; - cursor: pointer; -} - -:focus { - outline: 0; -} - -.clearfix:before, .clearfix:after { - content: "\0020"; - display: block; - height: 0; - visibility: hidden; -} - -.clearfix:after { - clear: both; -} - -.clearfix { - zoom: 1; -} - -/* 1. END BODY */ -/***********************************/ - -/*********************************** - /* 2. CONTENT */ -/***********************************/ -/* 2.1. Section error */ -.error { - min-height: 100vh; - position: relative; - padding: 240px 0; - box-sizing: border-box; + top: 0; + left: 0; width: 100%; height: 100%; - text-align: center; - margin-top: 70px; -} - -.error__overlay { + -webkit-animation: swing 7s 0.5s infinite both; + animation: swing 7s 0.5s infinite both; + -webkit-transform-origin: top center; + transform-origin: top center; + } + .cat-lower:after { position: absolute; top: 0; left: 0; width: 100%; height: 100%; - overflow: hidden; -} - -.error__content { + border-radius: 100px; + background-image: -webkit-radial-gradient(10px 50px, circle, #ffffff, #ffffff 40%, #d5e8f8 65%, #8b9bd9); + background-image: radial-gradient(circle at 10px 50px, #ffffff, #ffffff 40%, #d5e8f8 65%, #8b9bd9); + z-index: 1; + } + .cat-lower .cat-leg, .cat-lower .cat-paw { + z-index: -1; position: absolute; + height: 20px; + width: 20px; + -webkit-animation: swing-leg 7s 0.3s infinite both; + animation: swing-leg 7s 0.3s infinite both; + z-index: 1; + -webkit-transform-origin: top center; + transform-origin: top center; + border-top-left-radius: 20px; + border-top-right-radius: 20px; + background-image: -webkit-linear-gradient(left, white, #D5E8F8, #8B9BD9); + background-image: linear-gradient(to right, white, #D5E8F8, #8B9BD9); + } + .cat-lower > .cat-leg { + bottom: 20px; + } + .cat-lower > .cat-leg .cat-leg { + top: 25%; + } + .cat-lower > .cat-leg + .cat-leg { + right: 0; + } + .cat-lower .cat-paw { top: 50%; - left: 50%; - width: 100%; - -webkit-transform: translate(-50%, -50%); - transform: translate(-50%, -50%); -} - -.error__message { - text-align: center; - color: #181828; -} - -.message__title { - font-family: 'Montserrat', sans-serif; - font-weight: 900; - text-transform: uppercase; - letter-spacing: 5px; - font-size: 5.6rem; - padding-bottom: 40px; - max-width: 960px; - margin: 0 auto; -} - -.message__text { - font-family: 'Montserrat', sans-serif; - line-height: 42px; - font-size: 18px; - padding: 0 60px; - max-width: 680px; - margin: auto; -} - -.error__nav { - max-width: 600px; - margin: 40px auto 0; - text-align: center; -} - -.e-nav__form { - position: relative; - height: 45px; - overflow: hidden; - width: 170px; - display: inline-block; - vertical-align: top; - border: 1px solid #212121; - padding-left: 10px; - padding-right: 46px; -} - -.e-nav__icon { + border-radius: 50%; + background-color: #fff; + } + .cat-lower .cat-tail { position: absolute; - right: 15px; + height: 15px; + width: 10px; + -webkit-animation: swing-tail 7s cubic-bezier(0.5, 0, 0.5, 1) infinite both; + animation: swing-tail 7s cubic-bezier(0.5, 0, 0.5, 1) infinite both; + -webkit-transform-origin: top center; + transform-origin: top center; + z-index: 0; + background-image: -webkit-linear-gradient(left, white, #D5E8F8, #8B9BD9); + background-image: linear-gradient(to right, white, #D5E8F8, #8B9BD9); + border-bottom-left-radius: 10px; + border-bottom-right-radius: 10px; + } + .cat-lower .cat-tail > .cat-tail { top: 50%; - -webkit-transform: translateY(-50%); - transform: translateY(-50%); - color: #212121; - -webkit-transition: color .25s ease; - transition: color .25s ease; -} - -.e-nav__link { - height: 45px; - line-height: 45px; - width: 170px; - display: inline-block; - vertical-align: top; - margin: 0 15px; - border: 1px solid #181828; - color: #181828; - text-decoration: none; - font-family: 'Montserrat', sans-serif; - text-transform: uppercase; - font-size: 11px; - letter-spacing: .1rem; - position: relative; - overflow: hidden; -} - -.e-nav__link:before { - content: ''; - height: 200px; - background: #212121; + } + .cat-lower > .cat-tail { + left: calc(50% - 5px); + top: 95%; + } + + .cat-head { + width: 90px; + height: 90px; + background-image: -webkit-radial-gradient(10px 10px, circle, #ffffff, #ffffff 40%, #d5e8f8 65%, #8b9bd9); + background-image: radial-gradient(circle at 10px 10px, #ffffff, #ffffff 40%, #d5e8f8 65%, #8b9bd9); + border-radius: 50%; + top: calc(100% - 45px); + } + + .cat-face { position: absolute; - top: 70px; - right: 70px; - width: 260px; - -webkit-transition: all .3s; - transition: all .3s; - -webkit-transform: rotate(50deg); - transform: rotate(50deg); -} - -.e-nav__link:after { - -webkit-transition: all .3s; - transition: all .3s; - z-index: 999; - position: relative; -} - -.e-nav__link:after { - content: "Retour à l'accueil"; -} - -.e-nav__link:hover:before { - top: -60px; - right: -50px; -} - -.e-nav__link:hover { - color: #fff; -} - -.e-nav__link:nth-child(2):hover:after { - color: #fff; -} -/* 2.1. END Section Error */ - -/* 2.2. Social style */ -.error__social { + top: 0; + left: 0; + height: 100%; + width: 100%; + -webkit-animation: face 7s cubic-bezier(0.5, 0, 0.5, 1) infinite both; + animation: face 7s cubic-bezier(0.5, 0, 0.5, 1) infinite both; + -webkit-transform-style: preserve-3d; + transform-style: preserve-3d; + -webkit-perspective: 100px; + perspective: 100px; + } + + .cat-ears { + position: absolute; + top: 0; + left: 0; + height: 50%; + width: 100%; + z-index: -1; + } + + .cat-ear { + width: 20px; + height: 100%; + position: absolute; + border-radius: 5px; + top: -10px; + } + .cat-ear:first-child { + left: 0; + -webkit-transform-origin: top left; + transform-origin: top left; + -webkit-transform: skewY(40deg); + transform: skewY(40deg); + background-color: white; + } + .cat-ear:first-child:before { + left: 0; + border-top-right-radius: 50%; + border-bottom-right-radius: 50%; + background-color: #D7EBFB; + } + .cat-ear:last-child { + right: 0; + -webkit-transform-origin: top right; + transform-origin: top right; + -webkit-transform: skewY(-40deg); + transform: skewY(-40deg); + background-color: #d1e6f7; + } + .cat-ear:last-child:before { + right: 0; + border-top-left-radius: 50%; + border-bottom-left-radius: 50%; + background-color: #e0f0fc; + } + .cat-ear:before { + width: 60%; + height: 100%; + top: 10px; + position: absolute; + background-color: #fff; + } + + .cat-eyes { position: absolute; top: 50%; - -webkit-transform: translateY(-50%); - transform: translateY(-50%); + width: 100%; + height: 6px; + -webkit-animation: blink 7s step-end infinite both; + animation: blink 7s step-end infinite both; + } + .cat-eyes:before, .cat-eyes:after { + position: absolute; + height: 6px; + width: 6px; + border-radius: 50%; + background-color: #4B4D75; + } + .cat-eyes:before { left: 20px; - z-index: 10; -} - -.e-social__list { - margin: 0; - padding: 0; - list-style-type: none; -} - -.e-social__icon { - padding-bottom: 30px; -} - -.e-social__icon:last-child { - padding-bottom: 0; -} - -.e-social__link { - color: #fff; - -webkit-transition: all .25s ease; - transition: all .25s ease; - display: block; -} - -.e-social__link:hover { - opacity: .7; -} -/* 2.2. END Social style */ - -/* 2.3. Lamp */ -.lamp { + } + .cat-eyes:after { + right: 20px; + } + + .cat-mouth { position: absolute; - left: 0px; - right: 0px; - top: 0px; - margin: 0px auto; - width: 300px; - display: flex; - flex-direction: column; - align-items: center; - transform-origin: center top; - animation-timing-function: cubic-bezier(0.6, 0, 0.38, 1); - animation: move 5.1s infinite; -} - -@keyframes move { + width: 12px; + height: 8px; + background-color: #4B4D75; + top: 60%; + left: calc(50% - 6px); + border-top-left-radius: 50% 30%; + border-top-right-radius: 50% 30%; + border-bottom-left-radius: 50% 70%; + border-bottom-right-radius: 50% 70%; + -webkit-transform: translateZ(10px); + transform: translateZ(10px); + } + .cat-mouth:before, .cat-mouth:after { + position: absolute; + width: 90%; + height: 100%; + border: 2px solid #9FA2CB; + top: 80%; + border-radius: 100px; + border-top-color: transparent; + z-index: -1; + } + .cat-mouth:before { + border-left-color: transparent; + right: calc(50% - 1px); + -webkit-transform-origin: top right; + transform-origin: top right; + -webkit-transform: rotate(10deg); + transform: rotate(10deg); + } + .cat-mouth:after { + border-right-color: transparent; + left: calc(50% - 1px); + -webkit-transform-origin: top left; + transform-origin: top left; + -webkit-transform: rotate(-10deg); + transform: rotate(-10deg); + } + + .cat-whiskers { + width: 50%; + height: 8px; + position: absolute; + bottom: 25%; + left: 25%; + -webkit-transform-style: preserve-3d; + transform-style: preserve-3d; + -webkit-perspective: 60px; + perspective: 60px; + } + .cat-whiskers:before, .cat-whiskers:after { + position: absolute; + height: 100%; + width: 30%; + border: 2px solid #9FA2CB; + border-left: none; + border-right: none; + } + .cat-whiskers:before { + right: 100%; + -webkit-transform-origin: right center; + transform-origin: right center; + -webkit-transform: rotateY(70deg) rotateZ(-10deg); + transform: rotateY(70deg) rotateZ(-10deg); + } + .cat-whiskers:after { + left: 100%; + -webkit-transform-origin: left center; + transform-origin: left center; + -webkit-transform: rotateY(-70deg) rotateZ(10deg); + transform: rotateY(-70deg) rotateZ(10deg); + } + + @-webkit-keyframes bob { 0% { - transform: rotate(40deg); + -webkit-transform: translateY(0.4rem); + transform: translateY(0.4rem); + } + 6.25% { + -webkit-transform: translateY(-0.4rem); + transform: translateY(-0.4rem); + } + 12.5% { + -webkit-transform: translateY(0.4rem); + transform: translateY(0.4rem); + } + 18.75% { + -webkit-transform: translateY(-0.4rem); + transform: translateY(-0.4rem); + } + 25% { + -webkit-transform: translateY(0.4rem); + transform: translateY(0.4rem); + } + 31.25% { + -webkit-transform: translateY(-0.4rem); + transform: translateY(-0.4rem); + } + 37.5% { + -webkit-transform: translateY(0.4rem); + transform: translateY(0.4rem); + } + 43.75% { + -webkit-transform: translateY(-0.4rem); + transform: translateY(-0.4rem); } 50% { - transform: rotate(-40deg); + -webkit-transform: translateY(0.4rem); + transform: translateY(0.4rem); + } + 56.25% { + -webkit-transform: translateY(-0.4rem); + transform: translateY(-0.4rem); + } + 62.5% { + -webkit-transform: translateY(0.4rem); + transform: translateY(0.4rem); + } + 68.75% { + -webkit-transform: translateY(-0.4rem); + transform: translateY(-0.4rem); + } + 75% { + -webkit-transform: translateY(0.4rem); + transform: translateY(0.4rem); + } + 81.25% { + -webkit-transform: translateY(-0.4rem); + transform: translateY(-0.4rem); + } + 87.5% { + -webkit-transform: translateY(0.4rem); + transform: translateY(0.4rem); + } + 93.75% { + -webkit-transform: translateY(-0.4rem); + transform: translateY(-0.4rem); } 100% { - transform: rotate(40deg); + -webkit-transform: translateY(0.4rem); + transform: translateY(0.4rem); } -} - -.cable { - width: 8px; - height: 150px; - background-image: linear-gradient(rgb(32 148 218 / 70%), rgb(193 65 25)), linear-gradient(rgba(0,0,0,0.7), rgba(0,0,0,0.7)), linear-gradient(rgba(0,0,0,0.7), rgba(0,0,0,0.7)); -} - -.cover { - width: 300px; - height: 100px; - background: #0bd5e8; - border-top-left-radius: 50%; - border-top-right-radius: 50%; - position: relative; - z-index: 200; -} - -.in-cover { - width: 100%; - max-width: 300px; - height: 20px; - border-radius: 100%; - background: #08ffff; - position: absolute; - left: 0px; - right: 0px; - margin: 0px auto; - bottom: -9px; - z-index: 100; -} -.in-cover .bulb { - width: 90px; - height: 90px; - background-color: #08fffa; - border-radius: 50%; - position: absolute; - left: 0px; - right: 0px; - bottom: -20px; - margin: 0px auto; - -webkit-box-shadow: 0 0 15px 7px rgba(0,255,255,0.8), 0 0 40px 25px rgba(0,255,255,0.5), -75px 0 30px 15px rgba(0,255,255,0.2); - box-shadow: 0 0 25px 7px rgb(127 255 255 / 80%), 0 0 64px 47px rgba(0,255,255,0.5), 0px 0 30px 15px rgba(0,255,255,0.2); -} - - -.light { - width: 300px; - height: 0px; - border-bottom: 1500px solid rgb(44 255 255 / 24%); - border-left: 50px solid transparent; - border-right: 50px solid transparent; - position: absolute; - left: -50px; - right: 0px; - top: 240px; - margin: 0px auto; - z-index: 1; - border-radius: 90px 90px 0px 0px; -} -/* 2.3. END Lamp */ -/*********************************** - /* 2. END CONTENT */ -/***********************************/ - -/*********************************** - /* 3. RESPONSIVE */ -/***********************************/ -.error { - overflow: hidden; - max-height: 100vh; -} -@media (max-width: 1400px) { - .lamp { - zoom: .5; + } + + @keyframes bob { + 0% { + -webkit-transform: translateY(0.4rem); + transform: translateY(0.4rem); } - .error__content { - top: 55%; + 6.25% { + -webkit-transform: translateY(-0.4rem); + transform: translateY(-0.4rem); } - .message__title { - font-size: 3.5rem; + 12.5% { + -webkit-transform: translateY(0.4rem); + transform: translateY(0.4rem); } -} -@media (max-width: 900px) { - - .message__title { - font-size: 34px; - + 18.75% { + -webkit-transform: translateY(-0.4rem); + transform: translateY(-0.4rem); } - .error__content { - top: 55%; - } -} -@media (max-width: 950px) { - .lamp__wrap { - max-height: 100vh; - overflow: hidden; - max-width: 100vw; - } - .error__social { - bottom: 30px; - top: auto; - transform: none; - width: 100%; - position: fixed; - left: 0; - } - .e-social__icon { - display: inline-block; - padding-right: 30px; - } - .e-social__icon:last-child { - padding-right: 0; - } - .e-social__icon { - padding-bottom: 0; - } -} -@media (max-width: 750px) { - body, html { - max-height: 100vh; - } - .error__content { - position: static; - margin: 0 auto; - transform: none; - padding-top: 300px; - } - .error { - padding-top: 0; - padding-bottom: 100px; - height: 100vh; - } -} -@media (max-width: 650px) { - .message__title { - font-size: 36px; - padding-bottom: 20px; - } - .message__text { - font-size: 16px; - line-height: 2; - padding-right: 20px; - padding-left: 20px; - } - .lamp { - zoom: .6; - } - .error__content { - padding-top: 180px; - } -} -@media (max-width: 480px) { - - .message__title { - font-size: 30px; + 25% { + -webkit-transform: translateY(0.4rem); + transform: translateY(0.4rem); + } + 31.25% { + -webkit-transform: translateY(-0.4rem); + transform: translateY(-0.4rem); + } + 37.5% { + -webkit-transform: translateY(0.4rem); + transform: translateY(0.4rem); + } + 43.75% { + -webkit-transform: translateY(-0.4rem); + transform: translateY(-0.4rem); + } + 50% { + -webkit-transform: translateY(0.4rem); + transform: translateY(0.4rem); + } + 56.25% { + -webkit-transform: translateY(-0.4rem); + transform: translateY(-0.4rem); + } + 62.5% { + -webkit-transform: translateY(0.4rem); + transform: translateY(0.4rem); + } + 68.75% { + -webkit-transform: translateY(-0.4rem); + transform: translateY(-0.4rem); + } + 75% { + -webkit-transform: translateY(0.4rem); + transform: translateY(0.4rem); + } + 81.25% { + -webkit-transform: translateY(-0.4rem); + transform: translateY(-0.4rem); + } + 87.5% { + -webkit-transform: translateY(0.4rem); + transform: translateY(0.4rem); + } + 93.75% { + -webkit-transform: translateY(-0.4rem); + transform: translateY(-0.4rem); + } + 100% { + -webkit-transform: translateY(0.4rem); + transform: translateY(0.4rem); + } + } + @-webkit-keyframes swing { + 0% { + -webkit-transform: rotate(5deg); + transform: rotate(5deg); + } + 12.5% { + -webkit-transform: rotate(-10deg); + transform: rotate(-10deg); + } + 25% { + -webkit-transform: rotate(10deg); + transform: rotate(10deg); + } + 37.5% { + -webkit-transform: rotate(-15deg); + transform: rotate(-15deg); + } + 50% { + -webkit-transform: rotate(23deg); + transform: rotate(23deg); + } + 62.5% { + -webkit-transform: rotate(-23deg); + transform: rotate(-23deg); + } + 75% { + -webkit-transform: rotate(15deg); + transform: rotate(15deg); + } + 87.5% { + -webkit-transform: rotate(-10deg); + transform: rotate(-10deg); + } + 100% { + -webkit-transform: rotate(5deg); + transform: rotate(5deg); + } + } + @keyframes swing { + 0% { + -webkit-transform: rotate(5deg); + transform: rotate(5deg); + } + 12.5% { + -webkit-transform: rotate(-10deg); + transform: rotate(-10deg); + } + 25% { + -webkit-transform: rotate(10deg); + transform: rotate(10deg); + } + 37.5% { + -webkit-transform: rotate(-15deg); + transform: rotate(-15deg); + } + 50% { + -webkit-transform: rotate(23deg); + transform: rotate(23deg); + } + 62.5% { + -webkit-transform: rotate(-23deg); + transform: rotate(-23deg); + } + 75% { + -webkit-transform: rotate(15deg); + transform: rotate(15deg); + } + 87.5% { + -webkit-transform: rotate(-10deg); + transform: rotate(-10deg); + } + 100% { + -webkit-transform: rotate(5deg); + transform: rotate(5deg); + } + } + @-webkit-keyframes swing-leg { + 0% { + -webkit-transform: rotate(0.5deg); + transform: rotate(0.5deg); + } + 12.5% { + -webkit-transform: rotate(-1deg); + transform: rotate(-1deg); + } + 25% { + -webkit-transform: rotate(1deg); + transform: rotate(1deg); + } + 37.5% { + -webkit-transform: rotate(-1.5deg); + transform: rotate(-1.5deg); + } + 50% { + -webkit-transform: rotate(2.3deg); + transform: rotate(2.3deg); + } + 62.5% { + -webkit-transform: rotate(-2.3deg); + transform: rotate(-2.3deg); + } + 75% { + -webkit-transform: rotate(1.5deg); + transform: rotate(1.5deg); + } + 87.5% { + -webkit-transform: rotate(-1deg); + transform: rotate(-1deg); + } + 100% { + -webkit-transform: rotate(0.5deg); + transform: rotate(0.5deg); + } + } + @keyframes swing-leg { + 0% { + -webkit-transform: rotate(0.5deg); + transform: rotate(0.5deg); + } + 12.5% { + -webkit-transform: rotate(-1deg); + transform: rotate(-1deg); + } + 25% { + -webkit-transform: rotate(1deg); + transform: rotate(1deg); + } + 37.5% { + -webkit-transform: rotate(-1.5deg); + transform: rotate(-1.5deg); + } + 50% { + -webkit-transform: rotate(2.3deg); + transform: rotate(2.3deg); + } + 62.5% { + -webkit-transform: rotate(-2.3deg); + transform: rotate(-2.3deg); + } + 75% { + -webkit-transform: rotate(1.5deg); + transform: rotate(1.5deg); + } + 87.5% { + -webkit-transform: rotate(-1deg); + transform: rotate(-1deg); + } + 100% { + -webkit-transform: rotate(0.5deg); + transform: rotate(0.5deg); + } + } + @-webkit-keyframes swing-tail { + 0% { + -webkit-transform: rotate(-2deg); + transform: rotate(-2deg); + } + 12.5% { + -webkit-transform: rotate(4deg); + transform: rotate(4deg); + } + 25% { + -webkit-transform: rotate(-4deg); + transform: rotate(-4deg); + } + 37.5% { + -webkit-transform: rotate(6deg); + transform: rotate(6deg); + } + 50% { + -webkit-transform: rotate(-9.2deg); + transform: rotate(-9.2deg); + } + 62.5% { + -webkit-transform: rotate(9.2deg); + transform: rotate(9.2deg); + } + 75% { + -webkit-transform: rotate(-6deg); + transform: rotate(-6deg); + } + 87.5% { + -webkit-transform: rotate(4deg); + transform: rotate(4deg); + } + 100% { + -webkit-transform: rotate(-2deg); + transform: rotate(-2deg); + } + } + @keyframes swing-tail { + 0% { + -webkit-transform: rotate(-2deg); + transform: rotate(-2deg); + } + 12.5% { + -webkit-transform: rotate(4deg); + transform: rotate(4deg); + } + 25% { + -webkit-transform: rotate(-4deg); + transform: rotate(-4deg); + } + 37.5% { + -webkit-transform: rotate(6deg); + transform: rotate(6deg); + } + 50% { + -webkit-transform: rotate(-9.2deg); + transform: rotate(-9.2deg); + } + 62.5% { + -webkit-transform: rotate(9.2deg); + transform: rotate(9.2deg); + } + 75% { + -webkit-transform: rotate(-6deg); + transform: rotate(-6deg); + } + 87.5% { + -webkit-transform: rotate(4deg); + transform: rotate(4deg); + } + 100% { + -webkit-transform: rotate(-2deg); + transform: rotate(-2deg); + } + } + @-webkit-keyframes reverse-swing { + 0% { + -webkit-transform: rotate(-5deg); + transform: rotate(-5deg); + } + 12.5% { + -webkit-transform: rotate(10deg); + transform: rotate(10deg); + } + 25% { + -webkit-transform: rotate(-10deg); + transform: rotate(-10deg); + } + 37.5% { + -webkit-transform: rotate(15deg); + transform: rotate(15deg); + } + 50% { + -webkit-transform: rotate(-23deg); + transform: rotate(-23deg); + } + 62.5% { + -webkit-transform: rotate(23deg); + transform: rotate(23deg); + } + 75% { + -webkit-transform: rotate(-15deg); + transform: rotate(-15deg); + } + 87.5% { + -webkit-transform: rotate(10deg); + transform: rotate(10deg); + } + 100% { + -webkit-transform: rotate(-5deg); + transform: rotate(-5deg); + } + } + @keyframes reverse-swing { + 0% { + -webkit-transform: rotate(-5deg); + transform: rotate(-5deg); + } + 12.5% { + -webkit-transform: rotate(10deg); + transform: rotate(10deg); + } + 25% { + -webkit-transform: rotate(-10deg); + transform: rotate(-10deg); + } + 37.5% { + -webkit-transform: rotate(15deg); + transform: rotate(15deg); + } + 50% { + -webkit-transform: rotate(-23deg); + transform: rotate(-23deg); + } + 62.5% { + -webkit-transform: rotate(23deg); + transform: rotate(23deg); + } + 75% { + -webkit-transform: rotate(-15deg); + transform: rotate(-15deg); + } + 87.5% { + -webkit-transform: rotate(10deg); + transform: rotate(10deg); + } + 100% { + -webkit-transform: rotate(-5deg); + transform: rotate(-5deg); + } + } + @-webkit-keyframes face { + 0% { + -webkit-transform: translateX(-2.5px); + transform: translateX(-2.5px); + } + 12.5% { + -webkit-transform: translateX(5px); + transform: translateX(5px); + } + 25% { + -webkit-transform: translateX(-5px); + transform: translateX(-5px); + } + 37.5% { + -webkit-transform: translateX(7.5px); + transform: translateX(7.5px); + } + 50% { + -webkit-transform: translateX(-11.5px); + transform: translateX(-11.5px); + } + 62.5% { + -webkit-transform: translateX(11.5px); + transform: translateX(11.5px); + } + 75% { + -webkit-transform: translateX(-7.5px); + transform: translateX(-7.5px); + } + 87.5% { + -webkit-transform: translateX(5px); + transform: translateX(5px); + } + 100% { + -webkit-transform: translateX(-2.5px); + transform: translateX(-2.5px); + } + } + @keyframes face { + 0% { + -webkit-transform: translateX(-2.5px); + transform: translateX(-2.5px); + } + 12.5% { + -webkit-transform: translateX(5px); + transform: translateX(5px); } - .message__text { - padding-left: 10px; - padding-right: 10px; - font-size: 15px; + 25% { + -webkit-transform: translateX(-5px); + transform: translateX(-5px); } - .error__nav { - margin-top: 20px; + 37.5% { + -webkit-transform: translateX(7.5px); + transform: translateX(7.5px); } -} \ No newline at end of file + 50% { + -webkit-transform: translateX(-11.5px); + transform: translateX(-11.5px); + } + 62.5% { + -webkit-transform: translateX(11.5px); + transform: translateX(11.5px); + } + 75% { + -webkit-transform: translateX(-7.5px); + transform: translateX(-7.5px); + } + 87.5% { + -webkit-transform: translateX(5px); + transform: translateX(5px); + } + 100% { + -webkit-transform: translateX(-2.5px); + transform: translateX(-2.5px); + } + } + @-webkit-keyframes fade-in { + from { + opacity: 0; + } + to { + opacity: 1; + } + } + @keyframes fade-in { + from { + opacity: 0; + } + to { + opacity: 1; + } + } + @-webkit-keyframes blink { + from, to, 10%, 25%, 80% { + -webkit-transform: scaleY(1); + transform: scaleY(1); + } + 8%, 23%, 78% { + -webkit-transform: scaleY(0.1); + transform: scaleY(0.1); + } + } + @keyframes blink { + from, to, 10%, 25%, 80% { + -webkit-transform: scaleY(1); + transform: scaleY(1); + } + 8%, 23%, 78% { + -webkit-transform: scaleY(0.1); + transform: scaleY(0.1); + } + } + + *, + *:before, + *:after { + box-sizing: border-box; + position: relative; + -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.5, 1); + animation-timing-function: cubic-bezier(0.5, 0, 0.5, 1); + -webkit-animation-fill-mode: both; + animation-fill-mode: both; + } + + *:before, + *:after { + content: ''; + display: block; + } + + *, + *::after, + *::before { + box-sizing: border-box; + } + + html, body { + width: 100%; + overflow-x: hidden; + } + + header { + position: relative; + width: 100%; + padding: 3vw; + pointer-events: none; + } + + .btn-menu, .btn-close { + position: absolute; + z-index: 13; + top: 3vw; + right: 3vw; + height: 24px; + width: 24px; + cursor: pointer; + } + .btn-menu img, + .btn-close img { + width: 100%; + } + .btn-menu img:hover, + .btn-close img:hover { + opacity: .8 + } + + .btn-menu { + pointer-events: visible; + } + + .btn-close { + z-index: 100; + } + + .revealer-animation { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + background: #000; + pointer-events: none; + opacity: 0; + } + .block-revealer { + display: none; + } + .block-revealer.menu-open { + display: block; + } + + .revealer-content { + min-height: 100%; + position: relative; + opacity: 0; + overflow: auto; + } + \ No newline at end of file From 0b6fe8cec3adf7356f0a3e5b199861c726616455 Mon Sep 17 00:00:00 2001 From: FazCodeFR <30906528+FazCodeFR@users.noreply.github.com> Date: Wed, 5 Jun 2024 10:22:36 +0200 Subject: [PATCH 2/6] Add documentation generator angular --- README.md | 4 ++++ package.json | 3 ++- tsconfig.doc.json | 4 ++++ 3 files changed, 10 insertions(+), 1 deletion(-) create mode 100644 tsconfig.doc.json diff --git a/README.md b/README.md index a52f66e..acaeb3d 100644 --- a/README.md +++ b/README.md @@ -14,6 +14,10 @@ Run `ng generate component component-name` to generate a new component. You can Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory. +## Documentation + +Run `npm run doc` to generate the documentation. The documentation will be stored in the `documentation/` directory. + ## Running unit tests Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io). diff --git a/package.json b/package.json index 217b674..d193fb8 100644 --- a/package.json +++ b/package.json @@ -7,7 +7,8 @@ "build": "ng build", "build:prod": "ng build --configuration production", "watch": "ng build --watch --configuration development", - "test": "ng test" + "test": "ng test", + "doc": "npx compodoc -p tsconfig.doc.json" }, "private": true, "dependencies": { diff --git a/tsconfig.doc.json b/tsconfig.doc.json new file mode 100644 index 0000000..a910fa1 --- /dev/null +++ b/tsconfig.doc.json @@ -0,0 +1,4 @@ +{ + "include": ["src/**/*.ts"], + "exclude": ["src/test.ts", "src/**/*.spec.ts", "src/app/file-to-exclude.ts"] +} \ No newline at end of file From 2437798511614f3b26ef3d28f19ec8b24149e286 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Wed, 5 Jun 2024 08:27:26 +0000 Subject: [PATCH 3/6] Bump vite and @angular-devkit/build-angular Bumps [vite](https://github.com/vitejs/vite/tree/HEAD/packages/vite) to 4.5.3 and updates ancestor dependency [@angular-devkit/build-angular](https://github.com/angular/angular-cli). These dependencies need to be updated together. Updates `vite` from 4.5.2 to 4.5.3 - [Release notes](https://github.com/vitejs/vite/releases) - [Changelog](https://github.com/vitejs/vite/blob/v4.5.3/packages/vite/CHANGELOG.md) - [Commits](https://github.com/vitejs/vite/commits/v4.5.3/packages/vite) Updates `@angular-devkit/build-angular` from 16.2.12 to 16.2.14 - [Release notes](https://github.com/angular/angular-cli/releases) - [Changelog](https://github.com/angular/angular-cli/blob/main/CHANGELOG.md) - [Commits](https://github.com/angular/angular-cli/compare/16.2.12...16.2.14) --- updated-dependencies: - dependency-name: vite dependency-type: indirect - dependency-name: "@angular-devkit/build-angular" dependency-type: direct:development ... Signed-off-by: dependabot[bot] --- package-lock.json | 328 ++++++++++++++++++++++++++++++++-------------- package.json | 2 +- 2 files changed, 232 insertions(+), 98 deletions(-) diff --git a/package-lock.json b/package-lock.json index 0d9a9a8..6a3b836 100644 --- a/package-lock.json +++ b/package-lock.json @@ -32,7 +32,7 @@ "zone.js": "~0.13.0" }, "devDependencies": { - "@angular-devkit/build-angular": "^16.2.5", + "@angular-devkit/build-angular": "^16.2.14", "@angular/cli": "^16.2.5", "@angular/compiler-cli": "^16.2.0", "@types/jasmine": "~4.3.0", @@ -89,15 +89,15 @@ } }, "node_modules/@angular-devkit/build-angular": { - "version": "16.2.12", - "resolved": "https://registry.npmjs.org/@angular-devkit/build-angular/-/build-angular-16.2.12.tgz", - "integrity": "sha512-VVGKZ0N3gyR0DP7VrcZl4io3ruWYT94mrlyJsJMLlrYy/EX8JCvqrJC9c+dscrtKjhZzjwdyhszkJQY4JfwACA==", + "version": "16.2.14", + "resolved": "https://registry.npmjs.org/@angular-devkit/build-angular/-/build-angular-16.2.14.tgz", + "integrity": "sha512-bXQ6i7QPhwmYHuh+DSNkBhjTIHQF0C6fqZEg2ApJA3NmnzE98oQnmJ9AnGnAkdf1Mjn3xi2gxoZWPDDxGEINMw==", "dev": true, "dependencies": { "@ampproject/remapping": "2.2.1", - "@angular-devkit/architect": "0.1602.12", - "@angular-devkit/build-webpack": "0.1602.12", - "@angular-devkit/core": "16.2.12", + "@angular-devkit/architect": "0.1602.14", + "@angular-devkit/build-webpack": "0.1602.14", + "@angular-devkit/core": "16.2.14", "@babel/core": "7.22.9", "@babel/generator": "7.22.9", "@babel/helper-annotate-as-pure": "7.22.5", @@ -109,7 +109,7 @@ "@babel/runtime": "7.22.6", "@babel/template": "7.22.5", "@discoveryjs/json-ext": "0.5.7", - "@ngtools/webpack": "16.2.12", + "@ngtools/webpack": "16.2.14", "@vitejs/plugin-basic-ssl": "1.0.1", "ansi-colors": "4.1.3", "autoprefixer": "10.4.14", @@ -152,9 +152,9 @@ "text-table": "0.2.0", "tree-kill": "1.2.2", "tslib": "2.6.1", - "vite": "4.5.2", + "vite": "4.5.3", "webpack": "5.88.2", - "webpack-dev-middleware": "6.1.1", + "webpack-dev-middleware": "6.1.2", "webpack-dev-server": "4.15.1", "webpack-merge": "5.9.0", "webpack-subresource-integrity": "5.1.0" @@ -210,6 +210,48 @@ } } }, + "node_modules/@angular-devkit/build-angular/node_modules/@angular-devkit/architect": { + "version": "0.1602.14", + "resolved": "https://registry.npmjs.org/@angular-devkit/architect/-/architect-0.1602.14.tgz", + "integrity": "sha512-eSdONEV5dbtLNiOMBy9Ue9DdJ1ct6dH9RdZfYiedq6VZn0lejePAjY36MYVXgq2jTE+v/uIiaNy7caea5pt55A==", + "dev": true, + "dependencies": { + "@angular-devkit/core": "16.2.14", + "rxjs": "7.8.1" + }, + "engines": { + "node": "^16.14.0 || >=18.10.0", + "npm": "^6.11.0 || ^7.5.6 || >=8.0.0", + "yarn": ">= 1.13.0" + } + }, + "node_modules/@angular-devkit/build-angular/node_modules/@angular-devkit/core": { + "version": "16.2.14", + "resolved": "https://registry.npmjs.org/@angular-devkit/core/-/core-16.2.14.tgz", + "integrity": "sha512-Ui14/d2+p7lnmXlK/AX2ieQEGInBV75lonNtPQgwrYgskF8ufCuN0DyVZQUy9fJDkC+xQxbJyYrby/BS0R0e7w==", + "dev": true, + "dependencies": { + "ajv": "8.12.0", + "ajv-formats": "2.1.1", + "jsonc-parser": "3.2.0", + "picomatch": "2.3.1", + "rxjs": "7.8.1", + "source-map": "0.7.4" + }, + "engines": { + "node": "^16.14.0 || >=18.10.0", + "npm": "^6.11.0 || ^7.5.6 || >=8.0.0", + "yarn": ">= 1.13.0" + }, + "peerDependencies": { + "chokidar": "^3.5.2" + }, + "peerDependenciesMeta": { + "chokidar": { + "optional": true + } + } + }, "node_modules/@angular-devkit/build-angular/node_modules/autoprefixer": { "version": "10.4.14", "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.14.tgz", @@ -278,12 +320,12 @@ "dev": true }, "node_modules/@angular-devkit/build-webpack": { - "version": "0.1602.12", - "resolved": "https://registry.npmjs.org/@angular-devkit/build-webpack/-/build-webpack-0.1602.12.tgz", - "integrity": "sha512-1lmR4jCkxPJuAFXReesEY3CB+/5jSebGE5ry6qJJvNm6kuSc9bzfTytrcwosVY+Q7kAA2ij7kAYw0loGbTjLWA==", + "version": "0.1602.14", + "resolved": "https://registry.npmjs.org/@angular-devkit/build-webpack/-/build-webpack-0.1602.14.tgz", + "integrity": "sha512-f+ZTCjOoA1SCQEaX3L/63ubqr/vlHkwDXAtKjBsQgyz6srnETcjy96Us5k/LoK7/hPc85zFneqLinfqOMVWHJQ==", "dev": true, "dependencies": { - "@angular-devkit/architect": "0.1602.12", + "@angular-devkit/architect": "0.1602.14", "rxjs": "7.8.1" }, "engines": { @@ -296,6 +338,48 @@ "webpack-dev-server": "^4.0.0" } }, + "node_modules/@angular-devkit/build-webpack/node_modules/@angular-devkit/architect": { + "version": "0.1602.14", + "resolved": "https://registry.npmjs.org/@angular-devkit/architect/-/architect-0.1602.14.tgz", + "integrity": "sha512-eSdONEV5dbtLNiOMBy9Ue9DdJ1ct6dH9RdZfYiedq6VZn0lejePAjY36MYVXgq2jTE+v/uIiaNy7caea5pt55A==", + "dev": true, + "dependencies": { + "@angular-devkit/core": "16.2.14", + "rxjs": "7.8.1" + }, + "engines": { + "node": "^16.14.0 || >=18.10.0", + "npm": "^6.11.0 || ^7.5.6 || >=8.0.0", + "yarn": ">= 1.13.0" + } + }, + "node_modules/@angular-devkit/build-webpack/node_modules/@angular-devkit/core": { + "version": "16.2.14", + "resolved": "https://registry.npmjs.org/@angular-devkit/core/-/core-16.2.14.tgz", + "integrity": "sha512-Ui14/d2+p7lnmXlK/AX2ieQEGInBV75lonNtPQgwrYgskF8ufCuN0DyVZQUy9fJDkC+xQxbJyYrby/BS0R0e7w==", + "dev": true, + "dependencies": { + "ajv": "8.12.0", + "ajv-formats": "2.1.1", + "jsonc-parser": "3.2.0", + "picomatch": "2.3.1", + "rxjs": "7.8.1", + "source-map": "0.7.4" + }, + "engines": { + "node": "^16.14.0 || >=18.10.0", + "npm": "^6.11.0 || ^7.5.6 || >=8.0.0", + "yarn": ">= 1.13.0" + }, + "peerDependencies": { + "chokidar": "^3.5.2" + }, + "peerDependenciesMeta": { + "chokidar": { + "optional": true + } + } + }, "node_modules/@angular-devkit/core": { "version": "16.2.12", "resolved": "https://registry.npmjs.org/@angular-devkit/core/-/core-16.2.12.tgz", @@ -3151,9 +3235,9 @@ } }, "node_modules/@leichtgewicht/ip-codec": { - "version": "2.0.4", - "resolved": "https://registry.npmjs.org/@leichtgewicht/ip-codec/-/ip-codec-2.0.4.tgz", - "integrity": "sha512-Hcv+nVC0kZnQ3tD9GVu5xSMR4VVYOteQIr/hwFPVEvPdlXqgGEuRjiheChHgdM+JyqdgNcmzZOX/tnl0JOiI7A==", + "version": "2.0.5", + "resolved": "https://registry.npmjs.org/@leichtgewicht/ip-codec/-/ip-codec-2.0.5.tgz", + "integrity": "sha512-Vo+PSpZG2/fmgmiNzYK9qWRh8h/CHrwD0mo1h1DzL4yzHNSfWYujGTYsWGreD000gcgmZ7K4Ys6Tx9TxtsKdDw==", "dev": true }, "node_modules/@material/animation": { @@ -3909,9 +3993,9 @@ } }, "node_modules/@ngtools/webpack": { - "version": "16.2.12", - "resolved": "https://registry.npmjs.org/@ngtools/webpack/-/webpack-16.2.12.tgz", - "integrity": "sha512-f9R9Qsk8v+ffDxryl6PQ7Wnf2JCNd4dDXOH+d/AuF06VFiwcwGDRDZpmqkAXbFxQfcWTbT1FFvfoJ+SFcJgXLA==", + "version": "16.2.14", + "resolved": "https://registry.npmjs.org/@ngtools/webpack/-/webpack-16.2.14.tgz", + "integrity": "sha512-3+zPP3Wir46qrZ3FEiTz5/emSoVHYUCH+WgBmJ57mZCx1qBOYh2VgllnPr/Yusl1sc/jUZjdwq/es/9ZNw+zDQ==", "dev": true, "engines": { "node": "^16.14.0 || >=18.10.0", @@ -4447,9 +4531,9 @@ } }, "node_modules/@types/express-serve-static-core": { - "version": "4.17.43", - "resolved": "https://registry.npmjs.org/@types/express-serve-static-core/-/express-serve-static-core-4.17.43.tgz", - "integrity": "sha512-oaYtiBirUOPQGSWNGPWnzyAFJ0BP3cwvN4oWZQY+zUBwpVIGsKUkpBpSztp74drYcjavs7SKFZ4DX1V2QeN8rg==", + "version": "4.19.3", + "resolved": "https://registry.npmjs.org/@types/express-serve-static-core/-/express-serve-static-core-4.19.3.tgz", + "integrity": "sha512-KOzM7MhcBFlmnlr/fzISFF5vGWVSvN6fTd4T+ExOt08bA/dA5kpSzY52nMsI1KDFmUREpJelPYyuslLRSjjgCg==", "dev": true, "dependencies": { "@types/node": "*", @@ -4510,9 +4594,9 @@ } }, "node_modules/@types/qs": { - "version": "6.9.11", - "resolved": "https://registry.npmjs.org/@types/qs/-/qs-6.9.11.tgz", - "integrity": "sha512-oGk0gmhnEJK4Yyk+oI7EfXsLayXatCWPHary1MtcmbAifkobT9cM9yutG/hZKIseOU0MqbIwQ/u2nn/Gb+ltuQ==", + "version": "6.9.15", + "resolved": "https://registry.npmjs.org/@types/qs/-/qs-6.9.15.tgz", + "integrity": "sha512-uXHQKES6DQKKCLh441Xv/dwxOq1TVS3JPUMlEqoEglvlhR6Mxnlew/Xq/LRVHpLyk7iK3zODe1qYHIMltO7XGg==", "dev": true }, "node_modules/@types/range-parser": { @@ -4547,14 +4631,14 @@ } }, "node_modules/@types/serve-static": { - "version": "1.15.5", - "resolved": "https://registry.npmjs.org/@types/serve-static/-/serve-static-1.15.5.tgz", - "integrity": "sha512-PDRk21MnK70hja/YF8AHfC7yIsiQHn1rcXx7ijCFBX/k+XQJhQT/gw3xekXKJvx+5SXaMMS8oqQy09Mzvz2TuQ==", + "version": "1.15.7", + "resolved": "https://registry.npmjs.org/@types/serve-static/-/serve-static-1.15.7.tgz", + "integrity": "sha512-W8Ym+h8nhuRwaKPaDw34QUkwsGi6Rc4yYqvKFo5rm2FUEhCFbzVWrxXUxuKK8TASjWsysJY0nsmNCGhCOIsrOw==", "dev": true, "dependencies": { "@types/http-errors": "*", - "@types/mime": "*", - "@types/node": "*" + "@types/node": "*", + "@types/send": "*" } }, "node_modules/@types/sockjs": { @@ -7495,9 +7579,9 @@ } }, "node_modules/fs-monkey": { - "version": "1.0.5", - "resolved": "https://registry.npmjs.org/fs-monkey/-/fs-monkey-1.0.5.tgz", - "integrity": "sha512-8uMbBjrhzW76TYgEV27Y5E//W2f/lTFmx78P2w19FZSxarhI/798APGQyuGCwmkNxgwGRhrLfvWyLBvNtuOmew==", + "version": "1.0.6", + "resolved": "https://registry.npmjs.org/fs-monkey/-/fs-monkey-1.0.6.tgz", + "integrity": "sha512-b1FMfwetIKymC0eioW7mTywihSQE4oLzQn1dB6rZB5fx/3NpNEdAWeCSMB+60/AeT0TCXsxzAlcYVEFCTAksWg==", "dev": true }, "node_modules/fs.realpath": { @@ -7864,9 +7948,9 @@ } }, "node_modules/html-entities": { - "version": "2.4.0", - "resolved": "https://registry.npmjs.org/html-entities/-/html-entities-2.4.0.tgz", - "integrity": "sha512-igBTJcNNNhvZFRtm8uA6xMY6xYleeDwn3PeBCkDz7tHttv4F2hsDI2aPgNERWzvRcNYHNT3ymRaQzllmXj4YsQ==", + "version": "2.5.2", + "resolved": "https://registry.npmjs.org/html-entities/-/html-entities-2.5.2.tgz", + "integrity": "sha512-K//PSRMQk4FZ78Kyau+mZurHn3FH0Vwr+H36eE0rPbeYkRRi9YxceYPhuN60UwWorxyKHhqoAJl2OFKa4BVtaA==", "dev": true, "funding": [ { @@ -8328,9 +8412,9 @@ "dev": true }, "node_modules/ipaddr.js": { - "version": "2.1.0", - "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-2.1.0.tgz", - "integrity": "sha512-LlbxQ7xKzfBusov6UMi4MFpEg0m+mAm9xyNGEduwXMEDuf4WfzB/RZwMVYEd7IKGvh4IUkEXYxtAVu9T3OelJQ==", + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-2.2.0.tgz", + "integrity": "sha512-Ag3wB2o37wslZS19hZqorUnrnzSkpOVy+IiiDEiTqNubEYpYuHWIf6K4psgN2ZWKExS4xhVCrRVfb/wfW8fWJA==", "dev": true, "engines": { "node": ">= 10" @@ -13666,9 +13750,9 @@ } }, "node_modules/vite": { - "version": "4.5.2", - "resolved": "https://registry.npmjs.org/vite/-/vite-4.5.2.tgz", - "integrity": "sha512-tBCZBNSBbHQkaGyhGCDUGqeo2ph8Fstyp6FMSvTtsXeZSPpSMGlviAOav2hxVTqFcx8Hj/twtWKsMJXNY0xI8w==", + "version": "4.5.3", + "resolved": "https://registry.npmjs.org/vite/-/vite-4.5.3.tgz", + "integrity": "sha512-kQL23kMeX92v3ph7IauVkXkikdDRsYMGTVl5KY2E9OY4ONLvkHf04MDTbnfo6NKxZiDLWzVpP5oTa8hQD8U3dg==", "dev": true, "dependencies": { "esbuild": "^0.18.10", @@ -13839,9 +13923,9 @@ } }, "node_modules/webpack-dev-middleware": { - "version": "6.1.1", - "resolved": "https://registry.npmjs.org/webpack-dev-middleware/-/webpack-dev-middleware-6.1.1.tgz", - "integrity": "sha512-y51HrHaFeeWir0YO4f0g+9GwZawuigzcAdRNon6jErXy/SqV/+O6eaVAzDqE6t3e3NpGeR5CS+cCDaTC+V3yEQ==", + "version": "6.1.2", + "resolved": "https://registry.npmjs.org/webpack-dev-middleware/-/webpack-dev-middleware-6.1.2.tgz", + "integrity": "sha512-Wu+EHmX326YPYUpQLKmKbTyZZJIB8/n6R09pTmB03kJmnMsVPTo9COzHZFr01txwaCAuZvfBJE4ZCHRcKs5JaQ==", "dev": true, "dependencies": { "colorette": "^2.0.10", @@ -13949,9 +14033,9 @@ } }, "node_modules/webpack-dev-server/node_modules/ws": { - "version": "8.16.0", - "resolved": "https://registry.npmjs.org/ws/-/ws-8.16.0.tgz", - "integrity": "sha512-HS0c//TP7Ina87TfiPUz1rQzMhHrl/SG2guqRcTOIUYD2q8uhUdNHZYJUaQ8aTGPzCh+c6oawMKW35nFl1dxyQ==", + "version": "8.17.0", + "resolved": "https://registry.npmjs.org/ws/-/ws-8.17.0.tgz", + "integrity": "sha512-uJq6108EgZMAl20KagGkzCKfMEjxmKvZHG7Tlq0Z6nOky7YF7aq4mOx6xK8TJ/i1LeK4Qus7INktacctDgY8Ow==", "dev": true, "engines": { "node": ">=10.0.0" @@ -14388,15 +14472,15 @@ } }, "@angular-devkit/build-angular": { - "version": "16.2.12", - "resolved": "https://registry.npmjs.org/@angular-devkit/build-angular/-/build-angular-16.2.12.tgz", - "integrity": "sha512-VVGKZ0N3gyR0DP7VrcZl4io3ruWYT94mrlyJsJMLlrYy/EX8JCvqrJC9c+dscrtKjhZzjwdyhszkJQY4JfwACA==", + "version": "16.2.14", + "resolved": "https://registry.npmjs.org/@angular-devkit/build-angular/-/build-angular-16.2.14.tgz", + "integrity": "sha512-bXQ6i7QPhwmYHuh+DSNkBhjTIHQF0C6fqZEg2ApJA3NmnzE98oQnmJ9AnGnAkdf1Mjn3xi2gxoZWPDDxGEINMw==", "dev": true, "requires": { "@ampproject/remapping": "2.2.1", - "@angular-devkit/architect": "0.1602.12", - "@angular-devkit/build-webpack": "0.1602.12", - "@angular-devkit/core": "16.2.12", + "@angular-devkit/architect": "0.1602.14", + "@angular-devkit/build-webpack": "0.1602.14", + "@angular-devkit/core": "16.2.14", "@babel/core": "7.22.9", "@babel/generator": "7.22.9", "@babel/helper-annotate-as-pure": "7.22.5", @@ -14408,7 +14492,7 @@ "@babel/runtime": "7.22.6", "@babel/template": "7.22.5", "@discoveryjs/json-ext": "0.5.7", - "@ngtools/webpack": "16.2.12", + "@ngtools/webpack": "16.2.14", "@vitejs/plugin-basic-ssl": "1.0.1", "ansi-colors": "4.1.3", "autoprefixer": "10.4.14", @@ -14452,14 +14536,38 @@ "text-table": "0.2.0", "tree-kill": "1.2.2", "tslib": "2.6.1", - "vite": "4.5.2", + "vite": "4.5.3", "webpack": "5.88.2", - "webpack-dev-middleware": "6.1.1", + "webpack-dev-middleware": "6.1.2", "webpack-dev-server": "4.15.1", "webpack-merge": "5.9.0", "webpack-subresource-integrity": "5.1.0" }, "dependencies": { + "@angular-devkit/architect": { + "version": "0.1602.14", + "resolved": "https://registry.npmjs.org/@angular-devkit/architect/-/architect-0.1602.14.tgz", + "integrity": "sha512-eSdONEV5dbtLNiOMBy9Ue9DdJ1ct6dH9RdZfYiedq6VZn0lejePAjY36MYVXgq2jTE+v/uIiaNy7caea5pt55A==", + "dev": true, + "requires": { + "@angular-devkit/core": "16.2.14", + "rxjs": "7.8.1" + } + }, + "@angular-devkit/core": { + "version": "16.2.14", + "resolved": "https://registry.npmjs.org/@angular-devkit/core/-/core-16.2.14.tgz", + "integrity": "sha512-Ui14/d2+p7lnmXlK/AX2ieQEGInBV75lonNtPQgwrYgskF8ufCuN0DyVZQUy9fJDkC+xQxbJyYrby/BS0R0e7w==", + "dev": true, + "requires": { + "ajv": "8.12.0", + "ajv-formats": "2.1.1", + "jsonc-parser": "3.2.0", + "picomatch": "2.3.1", + "rxjs": "7.8.1", + "source-map": "0.7.4" + } + }, "autoprefixer": { "version": "10.4.14", "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.14.tgz", @@ -14494,13 +14602,39 @@ } }, "@angular-devkit/build-webpack": { - "version": "0.1602.12", - "resolved": "https://registry.npmjs.org/@angular-devkit/build-webpack/-/build-webpack-0.1602.12.tgz", - "integrity": "sha512-1lmR4jCkxPJuAFXReesEY3CB+/5jSebGE5ry6qJJvNm6kuSc9bzfTytrcwosVY+Q7kAA2ij7kAYw0loGbTjLWA==", + "version": "0.1602.14", + "resolved": "https://registry.npmjs.org/@angular-devkit/build-webpack/-/build-webpack-0.1602.14.tgz", + "integrity": "sha512-f+ZTCjOoA1SCQEaX3L/63ubqr/vlHkwDXAtKjBsQgyz6srnETcjy96Us5k/LoK7/hPc85zFneqLinfqOMVWHJQ==", "dev": true, "requires": { - "@angular-devkit/architect": "0.1602.12", + "@angular-devkit/architect": "0.1602.14", "rxjs": "7.8.1" + }, + "dependencies": { + "@angular-devkit/architect": { + "version": "0.1602.14", + "resolved": "https://registry.npmjs.org/@angular-devkit/architect/-/architect-0.1602.14.tgz", + "integrity": "sha512-eSdONEV5dbtLNiOMBy9Ue9DdJ1ct6dH9RdZfYiedq6VZn0lejePAjY36MYVXgq2jTE+v/uIiaNy7caea5pt55A==", + "dev": true, + "requires": { + "@angular-devkit/core": "16.2.14", + "rxjs": "7.8.1" + } + }, + "@angular-devkit/core": { + "version": "16.2.14", + "resolved": "https://registry.npmjs.org/@angular-devkit/core/-/core-16.2.14.tgz", + "integrity": "sha512-Ui14/d2+p7lnmXlK/AX2ieQEGInBV75lonNtPQgwrYgskF8ufCuN0DyVZQUy9fJDkC+xQxbJyYrby/BS0R0e7w==", + "dev": true, + "requires": { + "ajv": "8.12.0", + "ajv-formats": "2.1.1", + "jsonc-parser": "3.2.0", + "picomatch": "2.3.1", + "rxjs": "7.8.1", + "source-map": "0.7.4" + } + } } }, "@angular-devkit/core": { @@ -16405,9 +16539,9 @@ } }, "@leichtgewicht/ip-codec": { - "version": "2.0.4", - "resolved": "https://registry.npmjs.org/@leichtgewicht/ip-codec/-/ip-codec-2.0.4.tgz", - "integrity": "sha512-Hcv+nVC0kZnQ3tD9GVu5xSMR4VVYOteQIr/hwFPVEvPdlXqgGEuRjiheChHgdM+JyqdgNcmzZOX/tnl0JOiI7A==", + "version": "2.0.5", + "resolved": "https://registry.npmjs.org/@leichtgewicht/ip-codec/-/ip-codec-2.0.5.tgz", + "integrity": "sha512-Vo+PSpZG2/fmgmiNzYK9qWRh8h/CHrwD0mo1h1DzL4yzHNSfWYujGTYsWGreD000gcgmZ7K4Ys6Tx9TxtsKdDw==", "dev": true }, "@material/animation": { @@ -17163,9 +17297,9 @@ } }, "@ngtools/webpack": { - "version": "16.2.12", - "resolved": "https://registry.npmjs.org/@ngtools/webpack/-/webpack-16.2.12.tgz", - "integrity": "sha512-f9R9Qsk8v+ffDxryl6PQ7Wnf2JCNd4dDXOH+d/AuF06VFiwcwGDRDZpmqkAXbFxQfcWTbT1FFvfoJ+SFcJgXLA==", + "version": "16.2.14", + "resolved": "https://registry.npmjs.org/@ngtools/webpack/-/webpack-16.2.14.tgz", + "integrity": "sha512-3+zPP3Wir46qrZ3FEiTz5/emSoVHYUCH+WgBmJ57mZCx1qBOYh2VgllnPr/Yusl1sc/jUZjdwq/es/9ZNw+zDQ==", "dev": true, "requires": {} }, @@ -17585,9 +17719,9 @@ } }, "@types/express-serve-static-core": { - "version": "4.17.43", - "resolved": "https://registry.npmjs.org/@types/express-serve-static-core/-/express-serve-static-core-4.17.43.tgz", - "integrity": "sha512-oaYtiBirUOPQGSWNGPWnzyAFJ0BP3cwvN4oWZQY+zUBwpVIGsKUkpBpSztp74drYcjavs7SKFZ4DX1V2QeN8rg==", + "version": "4.19.3", + "resolved": "https://registry.npmjs.org/@types/express-serve-static-core/-/express-serve-static-core-4.19.3.tgz", + "integrity": "sha512-KOzM7MhcBFlmnlr/fzISFF5vGWVSvN6fTd4T+ExOt08bA/dA5kpSzY52nMsI1KDFmUREpJelPYyuslLRSjjgCg==", "dev": true, "requires": { "@types/node": "*", @@ -17648,9 +17782,9 @@ } }, "@types/qs": { - "version": "6.9.11", - "resolved": "https://registry.npmjs.org/@types/qs/-/qs-6.9.11.tgz", - "integrity": "sha512-oGk0gmhnEJK4Yyk+oI7EfXsLayXatCWPHary1MtcmbAifkobT9cM9yutG/hZKIseOU0MqbIwQ/u2nn/Gb+ltuQ==", + "version": "6.9.15", + "resolved": "https://registry.npmjs.org/@types/qs/-/qs-6.9.15.tgz", + "integrity": "sha512-uXHQKES6DQKKCLh441Xv/dwxOq1TVS3JPUMlEqoEglvlhR6Mxnlew/Xq/LRVHpLyk7iK3zODe1qYHIMltO7XGg==", "dev": true }, "@types/range-parser": { @@ -17685,14 +17819,14 @@ } }, "@types/serve-static": { - "version": "1.15.5", - "resolved": "https://registry.npmjs.org/@types/serve-static/-/serve-static-1.15.5.tgz", - "integrity": "sha512-PDRk21MnK70hja/YF8AHfC7yIsiQHn1rcXx7ijCFBX/k+XQJhQT/gw3xekXKJvx+5SXaMMS8oqQy09Mzvz2TuQ==", + "version": "1.15.7", + "resolved": "https://registry.npmjs.org/@types/serve-static/-/serve-static-1.15.7.tgz", + "integrity": "sha512-W8Ym+h8nhuRwaKPaDw34QUkwsGi6Rc4yYqvKFo5rm2FUEhCFbzVWrxXUxuKK8TASjWsysJY0nsmNCGhCOIsrOw==", "dev": true, "requires": { "@types/http-errors": "*", - "@types/mime": "*", - "@types/node": "*" + "@types/node": "*", + "@types/send": "*" } }, "@types/sockjs": { @@ -19928,9 +20062,9 @@ } }, "fs-monkey": { - "version": "1.0.5", - "resolved": "https://registry.npmjs.org/fs-monkey/-/fs-monkey-1.0.5.tgz", - "integrity": "sha512-8uMbBjrhzW76TYgEV27Y5E//W2f/lTFmx78P2w19FZSxarhI/798APGQyuGCwmkNxgwGRhrLfvWyLBvNtuOmew==", + "version": "1.0.6", + "resolved": "https://registry.npmjs.org/fs-monkey/-/fs-monkey-1.0.6.tgz", + "integrity": "sha512-b1FMfwetIKymC0eioW7mTywihSQE4oLzQn1dB6rZB5fx/3NpNEdAWeCSMB+60/AeT0TCXsxzAlcYVEFCTAksWg==", "dev": true }, "fs.realpath": { @@ -20213,9 +20347,9 @@ } }, "html-entities": { - "version": "2.4.0", - "resolved": "https://registry.npmjs.org/html-entities/-/html-entities-2.4.0.tgz", - "integrity": "sha512-igBTJcNNNhvZFRtm8uA6xMY6xYleeDwn3PeBCkDz7tHttv4F2hsDI2aPgNERWzvRcNYHNT3ymRaQzllmXj4YsQ==", + "version": "2.5.2", + "resolved": "https://registry.npmjs.org/html-entities/-/html-entities-2.5.2.tgz", + "integrity": "sha512-K//PSRMQk4FZ78Kyau+mZurHn3FH0Vwr+H36eE0rPbeYkRRi9YxceYPhuN60UwWorxyKHhqoAJl2OFKa4BVtaA==", "dev": true }, "html-escaper": { @@ -20556,9 +20690,9 @@ } }, "ipaddr.js": { - "version": "2.1.0", - "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-2.1.0.tgz", - "integrity": "sha512-LlbxQ7xKzfBusov6UMi4MFpEg0m+mAm9xyNGEduwXMEDuf4WfzB/RZwMVYEd7IKGvh4IUkEXYxtAVu9T3OelJQ==", + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-2.2.0.tgz", + "integrity": "sha512-Ag3wB2o37wslZS19hZqorUnrnzSkpOVy+IiiDEiTqNubEYpYuHWIf6K4psgN2ZWKExS4xhVCrRVfb/wfW8fWJA==", "dev": true }, "is-arrayish": { @@ -24505,9 +24639,9 @@ "dev": true }, "vite": { - "version": "4.5.2", - "resolved": "https://registry.npmjs.org/vite/-/vite-4.5.2.tgz", - "integrity": "sha512-tBCZBNSBbHQkaGyhGCDUGqeo2ph8Fstyp6FMSvTtsXeZSPpSMGlviAOav2hxVTqFcx8Hj/twtWKsMJXNY0xI8w==", + "version": "4.5.3", + "resolved": "https://registry.npmjs.org/vite/-/vite-4.5.3.tgz", + "integrity": "sha512-kQL23kMeX92v3ph7IauVkXkikdDRsYMGTVl5KY2E9OY4ONLvkHf04MDTbnfo6NKxZiDLWzVpP5oTa8hQD8U3dg==", "dev": true, "requires": { "esbuild": "^0.18.10", @@ -24645,9 +24779,9 @@ } }, "webpack-dev-middleware": { - "version": "6.1.1", - "resolved": "https://registry.npmjs.org/webpack-dev-middleware/-/webpack-dev-middleware-6.1.1.tgz", - "integrity": "sha512-y51HrHaFeeWir0YO4f0g+9GwZawuigzcAdRNon6jErXy/SqV/+O6eaVAzDqE6t3e3NpGeR5CS+cCDaTC+V3yEQ==", + "version": "6.1.2", + "resolved": "https://registry.npmjs.org/webpack-dev-middleware/-/webpack-dev-middleware-6.1.2.tgz", + "integrity": "sha512-Wu+EHmX326YPYUpQLKmKbTyZZJIB8/n6R09pTmB03kJmnMsVPTo9COzHZFr01txwaCAuZvfBJE4ZCHRcKs5JaQ==", "dev": true, "requires": { "colorette": "^2.0.10", @@ -24709,9 +24843,9 @@ } }, "ws": { - "version": "8.16.0", - "resolved": "https://registry.npmjs.org/ws/-/ws-8.16.0.tgz", - "integrity": "sha512-HS0c//TP7Ina87TfiPUz1rQzMhHrl/SG2guqRcTOIUYD2q8uhUdNHZYJUaQ8aTGPzCh+c6oawMKW35nFl1dxyQ==", + "version": "8.17.0", + "resolved": "https://registry.npmjs.org/ws/-/ws-8.17.0.tgz", + "integrity": "sha512-uJq6108EgZMAl20KagGkzCKfMEjxmKvZHG7Tlq0Z6nOky7YF7aq4mOx6xK8TJ/i1LeK4Qus7INktacctDgY8Ow==", "dev": true, "requires": {} } diff --git a/package.json b/package.json index d193fb8..5d8684b 100644 --- a/package.json +++ b/package.json @@ -36,7 +36,7 @@ "zone.js": "~0.13.0" }, "devDependencies": { - "@angular-devkit/build-angular": "^16.2.5", + "@angular-devkit/build-angular": "^16.2.14", "@angular/cli": "^16.2.5", "@angular/compiler-cli": "^16.2.0", "@types/jasmine": "~4.3.0", From b233e99faeb8bf672e27134bd773b040ee03fc19 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Wed, 5 Jun 2024 08:27:55 +0000 Subject: [PATCH 4/6] Bump tinymce and @tinymce/tinymce-angular Bumps [tinymce](https://github.com/tinymce/tinymce/tree/HEAD/modules/tinymce) to 7.1.2 and updates ancestor dependency [@tinymce/tinymce-angular](https://github.com/tinymce/tinymce-angular). These dependencies need to be updated together. Updates `tinymce` from 6.8.3 to 7.1.2 - [Changelog](https://github.com/tinymce/tinymce/blob/7.1.2/modules/tinymce/CHANGELOG.md) - [Commits](https://github.com/tinymce/tinymce/commits/7.1.2/modules/tinymce) Updates `@tinymce/tinymce-angular` from 7.0.0 to 8.0.0 - [Changelog](https://github.com/tinymce/tinymce-angular/blob/main/CHANGELOG.md) - [Commits](https://github.com/tinymce/tinymce-angular/compare/7.0.0...8.0.0) --- updated-dependencies: - dependency-name: tinymce dependency-type: indirect - dependency-name: "@tinymce/tinymce-angular" dependency-type: direct:production ... Signed-off-by: dependabot[bot] --- package-lock.json | 24 ++++++++++++------------ package.json | 2 +- 2 files changed, 13 insertions(+), 13 deletions(-) diff --git a/package-lock.json b/package-lock.json index 0d9a9a8..5fc5c24 100644 --- a/package-lock.json +++ b/package-lock.json @@ -23,7 +23,7 @@ "@fortawesome/fontawesome-svg-core": "^6.4.0", "@fortawesome/free-regular-svg-icons": "^6.5.1", "@fortawesome/free-solid-svg-icons": "^6.4.0", - "@tinymce/tinymce-angular": "^7.0.0", + "@tinymce/tinymce-angular": "^8.0.0", "ngx-toastr": "^18.0.0", "primeng": "^16.9.1", "rxjs": "~7.8.0", @@ -4287,17 +4287,17 @@ "integrity": "sha512-+9jVqKhRSpsc591z5vX+X5Yyw+he/HCB4iQ/RYxw35CEPaY1gnsNE43nf9n9AaYjAQrTiI/mOwKUKdUs9vf7Xg==" }, "node_modules/@tinymce/tinymce-angular": { - "version": "7.0.0", - "resolved": "https://registry.npmjs.org/@tinymce/tinymce-angular/-/tinymce-angular-7.0.0.tgz", - "integrity": "sha512-IKNaG/ihlxE1XCfq6lzULbnsqZO9KNJtlpu5jo6JDJDL9zcFzj/N2A16Kk7rTj1yfmDoB1IXAk/BpMOvgDY8cg==", + "version": "8.0.0", + "resolved": "https://registry.npmjs.org/@tinymce/tinymce-angular/-/tinymce-angular-8.0.0.tgz", + "integrity": "sha512-PRY6yRrhcc1JwXJLvqZTbJ7MN6q3twwjKcLp0txjoWpVPX86Kx5aE6TxmikEzjMNQ3/yqv6z7PF7Upn/PjTK1Q==", "dependencies": { - "tinymce": "^6.0.0 || ^5.5.0", + "tinymce": "^7.0.0 || ^6.0.0 || ^5.5.0", "tslib": "^2.3.0" }, "peerDependencies": { - "@angular/common": ">=14.0.0", - "@angular/core": ">=14.0.0", - "@angular/forms": ">=14.0.0" + "@angular/common": ">=16.0.0", + "@angular/core": ">=16.0.0", + "@angular/forms": ">=16.0.0" } }, "node_modules/@tootallnate/once": { @@ -17443,11 +17443,11 @@ "integrity": "sha512-+9jVqKhRSpsc591z5vX+X5Yyw+he/HCB4iQ/RYxw35CEPaY1gnsNE43nf9n9AaYjAQrTiI/mOwKUKdUs9vf7Xg==" }, "@tinymce/tinymce-angular": { - "version": "7.0.0", - "resolved": "https://registry.npmjs.org/@tinymce/tinymce-angular/-/tinymce-angular-7.0.0.tgz", - "integrity": "sha512-IKNaG/ihlxE1XCfq6lzULbnsqZO9KNJtlpu5jo6JDJDL9zcFzj/N2A16Kk7rTj1yfmDoB1IXAk/BpMOvgDY8cg==", + "version": "8.0.0", + "resolved": "https://registry.npmjs.org/@tinymce/tinymce-angular/-/tinymce-angular-8.0.0.tgz", + "integrity": "sha512-PRY6yRrhcc1JwXJLvqZTbJ7MN6q3twwjKcLp0txjoWpVPX86Kx5aE6TxmikEzjMNQ3/yqv6z7PF7Upn/PjTK1Q==", "requires": { - "tinymce": "^6.0.0 || ^5.5.0", + "tinymce": "^7.0.0 || ^6.0.0 || ^5.5.0", "tslib": "^2.3.0" } }, diff --git a/package.json b/package.json index d193fb8..5707e81 100644 --- a/package.json +++ b/package.json @@ -27,7 +27,7 @@ "@fortawesome/fontawesome-svg-core": "^6.4.0", "@fortawesome/free-regular-svg-icons": "^6.5.1", "@fortawesome/free-solid-svg-icons": "^6.4.0", - "@tinymce/tinymce-angular": "^7.0.0", + "@tinymce/tinymce-angular": "^8.0.0", "ngx-toastr": "^18.0.0", "primeng": "^16.9.1", "rxjs": "~7.8.0", From 1d05b97fb9109bda1c9c967cfd052824a2856698 Mon Sep 17 00:00:00 2001 From: FazCodeFR <30906528+FazCodeFR@users.noreply.github.com> Date: Wed, 5 Jun 2024 11:51:43 +0200 Subject: [PATCH 5/6] Add bug report --- src/app/app-routing.module.ts | 5 +++++ src/app/app.module.ts | 3 +++ src/app/components/bug/bug.component.html | 5 +++++ src/app/components/bug/bug.component.scss | 19 ++++++++++++++++++ src/app/components/bug/bug.component.spec.ts | 21 ++++++++++++++++++++ src/app/components/bug/bug.component.ts | 18 +++++++++++++++++ 6 files changed, 71 insertions(+) create mode 100644 src/app/components/bug/bug.component.html create mode 100644 src/app/components/bug/bug.component.scss create mode 100644 src/app/components/bug/bug.component.spec.ts create mode 100644 src/app/components/bug/bug.component.ts diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts index d8ac8ba..db46b79 100644 --- a/src/app/app-routing.module.ts +++ b/src/app/app-routing.module.ts @@ -15,6 +15,7 @@ import { CguComponent } from './components/cgu/cgu.component'; import { ErreurComponent } from './components/erreur/erreur.component'; import { AuthGuard } from '@auth0/auth0-angular'; import { TchatComponent } from './components/tchat/tchat.component'; +import { BugComponent } from './components/bug/bug.component'; const routes: Routes = [ { @@ -74,6 +75,10 @@ const routes: Routes = [ path : 'callback', component : HomeComponent }, + { + path: 'bug', + component: BugComponent + }, { path: '**', redirectTo: 'erreur', diff --git a/src/app/app.module.ts b/src/app/app.module.ts index d0febcf..29e22e6 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -44,6 +44,8 @@ import { FileUploadModule } from 'primeng/fileupload'; import { AccordionModule } from 'primeng/accordion'; import { ToastModule } from 'primeng/toast'; +import { BugComponent } from './components/bug/bug.component'; + @NgModule({ declarations: [ @@ -67,6 +69,7 @@ import { ToastModule } from 'primeng/toast'; TchatComponent, TchatIconComponent, TchatMessageComponent, + BugComponent, ], imports: [ BrowserModule, diff --git a/src/app/components/bug/bug.component.html b/src/app/components/bug/bug.component.html new file mode 100644 index 0000000..f4786ef --- /dev/null +++ b/src/app/components/bug/bug.component.html @@ -0,0 +1,5 @@ + +
+ +
+ \ No newline at end of file diff --git a/src/app/components/bug/bug.component.scss b/src/app/components/bug/bug.component.scss new file mode 100644 index 0000000..66f2b17 --- /dev/null +++ b/src/app/components/bug/bug.component.scss @@ -0,0 +1,19 @@ +/* bug-report.component.css */ +.iframe-container { + position: relative; + width: 100%; + height: 100vh; /* Utilisez 100vh pour occuper toute la hauteur de la fenêtre */ + overflow: hidden; + } + + .iframe-container iframe { + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0; + width: 100%; + height: 100%; + border: none; + } + \ No newline at end of file diff --git a/src/app/components/bug/bug.component.spec.ts b/src/app/components/bug/bug.component.spec.ts new file mode 100644 index 0000000..9a541d2 --- /dev/null +++ b/src/app/components/bug/bug.component.spec.ts @@ -0,0 +1,21 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { BugComponent } from './bug.component'; + +describe('BugComponent', () => { + let component: BugComponent; + let fixture: ComponentFixture; + + beforeEach(() => { + TestBed.configureTestingModule({ + declarations: [BugComponent] + }); + fixture = TestBed.createComponent(BugComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/components/bug/bug.component.ts b/src/app/components/bug/bug.component.ts new file mode 100644 index 0000000..7d542eb --- /dev/null +++ b/src/app/components/bug/bug.component.ts @@ -0,0 +1,18 @@ +import { AfterViewInit, Component } from '@angular/core'; + +@Component({ + selector: 'app-bug', + templateUrl: './bug.component.html', + styleUrls: ['./bug.component.scss'] +}) +export class BugComponent implements AfterViewInit { + + constructor() { } + + ngAfterViewInit(): void { + const script = document.createElement('script'); + script.src = 'https://tally.so/widgets/embed.js'; + script.async = true; + document.body.appendChild(script); + } +} \ No newline at end of file From 5acaeca2120faf92be3ca1e89725239baed81db9 Mon Sep 17 00:00:00 2001 From: FazCodeFR <30906528+FazCodeFR@users.noreply.github.com> Date: Wed, 5 Jun 2024 12:33:42 +0200 Subject: [PATCH 6/6] Add bug report in footer --- src/app/components/footer/footer.component.html | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/app/components/footer/footer.component.html b/src/app/components/footer/footer.component.html index 1dab8b0..c642d90 100644 --- a/src/app/components/footer/footer.component.html +++ b/src/app/components/footer/footer.component.html @@ -15,6 +15,8 @@ routerLink="/contact">Nous contacter Mentions légales + Signaler un bug