From: nael Date: Tue, 8 Jan 2019 13:46:10 +0000 (+0100) Subject: wait #2478 @0.20 X-Git-Url: http://git.cubedesigners.com/?a=commitdiff_plain;h=7181aea254d6a2a195c7caa1a4851e23ecff163b;p=Animations.git wait #2478 @0.20 --- diff --git a/Fluidbook-presentation-reveal/Fluidbook-presentation-reveal-p12/Montserrat-Regular.woff b/Fluidbook-presentation-reveal/Fluidbook-presentation-reveal-p12/Montserrat-Regular.woff new file mode 100644 index 0000000..af3b5ec Binary files /dev/null and b/Fluidbook-presentation-reveal/Fluidbook-presentation-reveal-p12/Montserrat-Regular.woff differ diff --git a/Fluidbook-presentation-reveal/Fluidbook-presentation-reveal-p12/index.html b/Fluidbook-presentation-reveal/Fluidbook-presentation-reveal-p12/index.html new file mode 100644 index 0000000..3b98469 --- /dev/null +++ b/Fluidbook-presentation-reveal/Fluidbook-presentation-reveal-p12/index.html @@ -0,0 +1,25 @@ + + + + + Title + + + + +
+ +

+ avec fluidbook, tout est possible, nous pouvons ajouter +

+

+ diaporamas, vidéos, animations ou tout autre contenu +

+

+ interactif à votre publication +

+ +
+ + + \ No newline at end of file diff --git a/Fluidbook-presentation-reveal/Fluidbook-presentation-reveal-p12/style.css b/Fluidbook-presentation-reveal/Fluidbook-presentation-reveal-p12/style.css new file mode 100644 index 0000000..98a3163 --- /dev/null +++ b/Fluidbook-presentation-reveal/Fluidbook-presentation-reveal-p12/style.css @@ -0,0 +1,85 @@ +* { + margin: 0; + padding: 0; } + +@font-face { + font-family: Montserrat-Regular; + src: url("Montserrat-Regular.woff"); } +#canva { + display: none; + position: absolute; } + +.container { + width: 602px; + height: 779px; } + +.line { + position: absolute; + font-size: 12px; + letter-spacing: -0.1px; + color: white; + text-transform: uppercase; + padding: 0.6em 1em 0.6em 1em; + font-family: Montserrat-Regular; + font-weight: 500; + overflow: hidden; + left: 84px; + z-index: 4; + top: 332px; + width: 400px; } + .line::before { + content: ""; + top: 0; + left: 0; + position: absolute; + width: 0; + height: 100%; + background: #F9867E; } + .line span { + opacity: 0; + animation: appear-text 0.5s ease-out forwards; + position: relative; } + .line::before { + animation: rev-block 0.5s ease-out forwards; + animation-delay: 1s; } + .line span { + animation-delay: 1.25s; } + +.secondblock { + letter-spacing: -0.15px; + z-index: 3; + top: 354px; + width: 386px; } + .secondblock::before { + animation: rev-block 0.5s ease-out forwards; + animation-delay: 1.3s; } + .secondblock span { + animation-delay: 1.55s; } + +.thirdblock { + letter-spacing: -0.15px; + z-index: 2; + top: 375px; + width: 217px; } + .thirdblock::before { + animation: rev-block 0.5s ease-out forwards; + animation-delay: 1.6s; } + .thirdblock span { + animation-delay: 1.85s; } + +@keyframes rev-block { + 0% { + left: 0; + width: 0; } + 100% { + left: 0; + width: 100%; } } +@keyframes appear-text { + 0% { + opacity: 0; + left: -30px; } + 100% { + opacity: 1; + left: 0; } } + +/*# sourceMappingURL=style.css.map */ diff --git a/Fluidbook-presentation-reveal/Fluidbook-presentation-reveal-p12/style.css.map b/Fluidbook-presentation-reveal/Fluidbook-presentation-reveal-p12/style.css.map new file mode 100644 index 0000000..a059475 --- /dev/null +++ b/Fluidbook-presentation-reveal/Fluidbook-presentation-reveal-p12/style.css.map @@ -0,0 +1,7 @@ +{ +"version": 3, +"mappings": "AAKA,CAAC;EACC,MAAM,EAAE,CAAC;EACT,OAAO,EAAE,CAAC;;;EAGV,WAAW,EAAE,kBAAkB;EAC/B,GAAG,EAAE,8BAA8B;AAErC,MAAM;EACJ,OAAO,EAAE,IAAI;EACb,QAAQ,EAAE,QAAQ;;AAEpB,UAAU;EACR,KAAK,EAAE,KAAK;EACZ,MAAM,EAAE,KAAK;;AAWf,KAAK;EACH,QAAQ,EAAE,QAAQ;EAClB,SAAS,EAAE,IAAI;EACf,cAAc,EAAE,MAAM;EACtB,KAAK,EAAE,KAAK;EACZ,cAAc,EAAE,SAAS;EACzB,OAAO,EAAE,mBAAmB;EAC5B,WAAW,EAAE,kBAAkB;EAC/B,WAAW,EAAE,GAAG;EAChB,QAAQ,EAAE,MAAM;EAChB,IAAI,EAvCC,IAAI;EAwCT,OAAO,EAAE,CAAC;EAnBV,GAAG,EAgCgB,KAAK;EA/BxB,KAAK,EA+B4B,KAAK;EAZtC,aAAS;IACP,OAAO,EAAE,EAAE;IACX,GAAG,EAAE,CAAC;IACN,IAAI,EAAE,CAAC;IACP,QAAQ,EAAE,QAAQ;IAClB,KAAK,EAAE,CAAC;IACR,MAAM,EAAE,IAAI;IACZ,UAAU,EAjDT,OAAO;EAkDV,UAAI;IACF,OAAO,EAAE,CAAC;IACV,SAAS,EAAE,kCAAkC;IAC7C,QAAQ,EAAE,QAAQ;EA7BpB,aAAS;IACP,SAAS,EAAE,gCAAgC;IAC3C,eAAe,EAAG,EAAoB;EACxC,UAAI;IACF,eAAe,EAAE,KAAmC;;AA4BxD,YAAY;EACV,cAAc,EAAE,OAAO;EACvB,OAAO,EAAE,CAAC;EApCV,GAAG,EAqCiB,KAAK;EApCzB,KAAK,EAoC8B,KAAK;EAnCxC,oBAAS;IACP,SAAS,EAAE,gCAAgC;IAC3C,eAAe,EAAG,IAAoB;EACxC,iBAAI;IACF,eAAe,EAAE,KAAmC;;AAgCxD,WAAW;EACT,cAAc,EAAE,OAAO;EACvB,OAAO,EAAE,CAAC;EAxCV,GAAG,EAyCiB,KAAK;EAxCzB,KAAK,EAwC8B,KAAK;EAvCxC,mBAAS;IACP,SAAS,EAAE,gCAAgC;IAC3C,eAAe,EAAG,IAAoB;EACxC,gBAAI;IACF,eAAe,EAAE,KAAmC;;;;IAuCpD,IAAI,EAAE,CAAC;IACP,KAAK,EAAE,CAAC;;IAER,IAAI,EAAE,CAAC;IACP,KAAK,EAAE,IAAI;;;IAIX,OAAO,EAAE,CAAC;IACV,IAAI,EAAE,KAAK;;IAEX,OAAO,EAAE,CAAC;IACV,IAAI,EAAE,CAAC", +"sources": ["style.sass"], +"names": [], +"file": "style.css" +} \ No newline at end of file diff --git a/Fluidbook-presentation-reveal/Fluidbook-presentation-reveal-p12/style.sass b/Fluidbook-presentation-reveal/Fluidbook-presentation-reveal-p12/style.sass new file mode 100644 index 0000000..34c6e2f --- /dev/null +++ b/Fluidbook-presentation-reveal/Fluidbook-presentation-reveal-p12/style.sass @@ -0,0 +1,80 @@ +$bg: #F9867E +$left: 84px +$delay: 1s +$delay_text:0.25s + +* + margin: 0 + padding: 0 + +@font-face + font-family: Montserrat-Regular + src: url("Montserrat-Regular.woff") + +#canva + display: none + position: absolute + +.container + width: 602px + height: 779px + +@mixin line($top,$width, $line_delay) + top: $top + width: $width + &::before + animation: rev-block 0.5s ease-out forwards + animation-delay: $delay + $line_delay + span + animation-delay: ($delay + $line_delay + $delay_text) + +.line + position: absolute + font-size: 12px + letter-spacing: -0.1px + color: white + text-transform: uppercase + padding: 0.6em 1em 0.6em 1em + font-family: Montserrat-Regular + font-weight: 500 + overflow: hidden + left: $left + z-index: 4 + &::before + content: '' + top: 0 + left: 0 + position: absolute + width: 0 + height: 100% + background: $bg + span + opacity: 0 + animation: appear-text 0.5s ease-out forwards + position: relative + @include line($top:332px,$width: 400px, $line_delay:0s) + +.secondblock + letter-spacing: -0.15px + z-index: 3 + @include line($top: 354px, $width: 386px,$line_delay:0.3s) +.thirdblock + letter-spacing: -0.15px + z-index: 2 + @include line($top: 375px, $width: 217px,$line_delay:0.6s) + +@keyframes rev-block + 0% + left: 0 + width: 0 + 100% + left: 0 + width: 100% + +@keyframes appear-text + 0% + opacity: 0 + left: -30px + 100% + opacity: 1 + left: 0 \ No newline at end of file