From: nael Date: Tue, 8 Jan 2019 11:05:14 +0000 (+0100) Subject: wait #2474 @0.30 X-Git-Url: http://git.cubedesigners.com/?a=commitdiff_plain;h=6442135f4e61d6018057410c8aa9d866288a9d66;p=Animations.git wait #2474 @0.30 --- diff --git a/Fluidbook-presentation-reveal/Fluidbook-presentation-reveal-p8/Montserrat-Regular.woff b/Fluidbook-presentation-reveal/Fluidbook-presentation-reveal-p8/Montserrat-Regular.woff new file mode 100644 index 0000000..af3b5ec Binary files /dev/null and b/Fluidbook-presentation-reveal/Fluidbook-presentation-reveal-p8/Montserrat-Regular.woff differ diff --git a/Fluidbook-presentation-reveal/Fluidbook-presentation-reveal-p8/bg.png b/Fluidbook-presentation-reveal/Fluidbook-presentation-reveal-p8/bg.png new file mode 100644 index 0000000..db690fc Binary files /dev/null and b/Fluidbook-presentation-reveal/Fluidbook-presentation-reveal-p8/bg.png differ diff --git a/Fluidbook-presentation-reveal/Fluidbook-presentation-reveal-p8/index.html b/Fluidbook-presentation-reveal/Fluidbook-presentation-reveal-p8/index.html new file mode 100644 index 0000000..26099e0 --- /dev/null +++ b/Fluidbook-presentation-reveal/Fluidbook-presentation-reveal-p8/index.html @@ -0,0 +1,25 @@ + + + + + Title + + + + +
+ +

+ votre lectorat et vos clients potentiels utilisent une +

+

+ multitude de dispositifs, plates-formes et technologies +

+ +

+ pour accéder à leurs centres d'intérêts +

+
+ + + \ No newline at end of file diff --git a/Fluidbook-presentation-reveal/Fluidbook-presentation-reveal-p8/style.css b/Fluidbook-presentation-reveal/Fluidbook-presentation-reveal-p8/style.css new file mode 100644 index 0000000..8abf5f6 --- /dev/null +++ b/Fluidbook-presentation-reveal/Fluidbook-presentation-reveal-p8/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: 428px; + width: 378px; } + .line::before { + content: ""; + top: 0; + left: 0; + position: absolute; + width: 0; + height: 100%; + background: #7CBE79; } + .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: 447px; + width: 392px; } + .secondblock::before { + animation: rev-block 0.5s ease-out forwards; + animation-delay: 1.3s; } + .secondblock span { + animation-delay: 1.55s; } + +.thirdblock { + letter-spacing: -0.25px; + z-index: 2; + top: 467px; + width: 286px; } + .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-p8/style.css.map b/Fluidbook-presentation-reveal/Fluidbook-presentation-reveal-p8/style.css.map new file mode 100644 index 0000000..3b8cb20 --- /dev/null +++ b/Fluidbook-presentation-reveal/Fluidbook-presentation-reveal-p8/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;;AAYf,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,EAxCC,IAAI;EAyCT,OAAO,EAAE,CAAC;EApBV,GAAG,EAkCgB,KAAK;EAjCxB,KAAK,EAiC4B,KAAK;EAbtC,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,EAlDT,OAAO;EAmDV,UAAI;IACF,OAAO,EAAE,CAAC;IACV,SAAS,EAAE,kCAAkC;IAC7C,QAAQ,EAAE,QAAQ;EA9BpB,aAAS;IACP,SAAS,EAAE,gCAAgC;IAC3C,eAAe,EAAG,EAAoB;EACxC,UAAI;IACF,eAAe,EAAE,KAAmC;;AA8BxD,YAAY;EACV,cAAc,EAAE,OAAO;EACvB,OAAO,EAAE,CAAC;EAtCV,GAAG,EAuCiB,KAAK;EAtCzB,KAAK,EAsC8B,KAAK;EArCxC,oBAAS;IACP,SAAS,EAAE,gCAAgC;IAC3C,eAAe,EAAG,IAAoB;EACxC,iBAAI;IACF,eAAe,EAAE,KAAmC;;AAmCxD,WAAW;EACT,cAAc,EAAE,OAAO;EACvB,OAAO,EAAE,CAAC;EA3CV,GAAG,EA4CiB,KAAK;EA3CzB,KAAK,EA2C8B,KAAK;EA1CxC,mBAAS;IACP,SAAS,EAAE,gCAAgC;IAC3C,eAAe,EAAG,IAAoB;EACxC,gBAAI;IACF,eAAe,EAAE,KAAmC;;;;IA0CpD,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-p8/style.sass b/Fluidbook-presentation-reveal/Fluidbook-presentation-reveal-p8/style.sass new file mode 100644 index 0000000..316c571 --- /dev/null +++ b/Fluidbook-presentation-reveal/Fluidbook-presentation-reveal-p8/style.sass @@ -0,0 +1,83 @@ +$bg: #7CBE79 +$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:428px,$width: 378px, $line_delay:0s) + +.secondblock + letter-spacing: -0.15px + z-index: 3 + @include line($top: 447px, $width: 392px,$line_delay:0.3s) + +.thirdblock + letter-spacing: -0.25px + z-index: 2 + @include line($top: 467px, $width: 286px,$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