wumbox-landing
Version:
49 lines • 7.39 kB
JavaScript
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
import { Component } from '@angular/core';
import { MatDialog, MatDialogConfig } from '@angular/material';
import { PopupComponent } from './popup/popup.component';
export class ResumeComponent {
/**
* @param {?} dialog
*/
constructor(dialog) {
this.dialog = dialog;
}
/**
* @return {?}
*/
openDialog() {
/** @type {?} */
const dialogConfig = new MatDialogConfig();
this.dialog.open(PopupComponent, dialogConfig);
}
/**
* @param {?} id
* @return {?}
*/
scrollTo(id) {
document.getElementById(`feature-${id}`).scrollIntoView();
}
}
ResumeComponent.decorators = [
{ type: Component, args: [{
selector: 'app-resume',
template: "<article class=\"resume\" id=\"about\" ngsRevealSet [ngsSelector]=\"'.rv'\">\n <div class=\"bg-s\"\n #bgS\n inViewport (inViewportAction)=\"bgS.style.backgroundImage = 'url(https://firebasestorage.googleapis.com/v0/b/wumbox-landing.appspot.com/o/bg1.svg?alt=media&token=5b58160a-e16a-4001-90a7-c3393dab59ce)'\"\n\n ></div>\n <h2 class=\"rv\">\u00BFQu\u00E9 es?</h2>\n <p class=\"rv\">\u00A1Wumbox es una plataforma de aprendizaje adaptativo que contiene miles de recursos y juegos educativos con los que pod\u00E9s aprender jugando!</p>\n <div class=\"video rv\" #videoContainer\n inViewport (inViewportAction)=\"videoContainer.style.backgroundImage = 'url(https://firebasestorage.googleapis.com/v0/b/wumbox-landing.appspot.com/o/video-p.svg?alt=media&token=23b9fdf1-668d-427b-be59-bd0b1b11ef97)'\"\n\n (click)=\"openDialog()\"\n angulartics2On=\"click\"\n angularticsCategory=\"Main video\"\n angularticsAction=\"Clicked\"\n angularticsLabel=\"Play\"\n >\n <img inViewport src=\"\" (inViewportAction)=\"img.src = 'https://firebasestorage.googleapis.com/v0/b/wumbox-landing.appspot.com/o/bg%2Fvideo-c.svg?alt=media&token=c4ef8811-d969-4dd4-8927-e8f2c425ea94'\" #img alt=\"Wumbox\" draggable=\"false\" />\n </div>\n <div class=\"call-to-action\" fxLayout=\"row\" fxLayoutAlign=\"space-around center\" fxLayoutAlign.gt-xs=\"center center\">\n <a class=\"push-btn\" (click)=\"scrollTo('explore')\">Explor\u00E1</a>\n <a class=\"push-btn\" (click)=\"scrollTo('size')\">Med\u00ED</a>\n <a class=\"push-btn\" (click)=\"scrollTo('create')\">Cre\u00E1</a>\n </div>\n</article>\n",
styles: ["html{touch-action:none;scroll-behavior:smooth}body{font-family:Roboto,sans-serif;font-weight:400;line-height:1.6;-webkit-overflow-scrolling:touch;background:#181818;min-height:100vh}img{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}a{cursor:pointer}[type=button],[type=reset],[type=submit],button{-webkit-appearance:none}.push-btn{position:relative;top:0;text-align:center;display:inline;background-color:#ff3f84;color:#fff;padding:.75em 1.5em;text-decoration:none;border-radius:.5em;border-bottom:.25em solid #8c2c4e;transition:.1s;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.push-btn:first-child{margin-right:10px}.push-btn:active,.push-btn:hover{background-color:#ff659d;opacity:1}.push-btn:active{top:.2em;border-bottom-width:0}.bg-s{position:absolute;height:100%;width:100vw;background-position:center;background-size:contain;background-repeat:no-repeat;left:-5vw;display:none}@media all and (min-width:960px){.bg-s{left:-10vw;display:inherit}}@media all and (min-width:1600px){.bg-s{left:-15vw}}@-webkit-keyframes floating{from,to{transform:translate(0,0)}65%{transform:translate(0,20px)}}@keyframes floating{from,to{transform:translate(0,0)}65%{transform:translate(0,20px)}}@-webkit-keyframes floating2{from,to{transform:translate(0,0)}65%{transform:translate(0,10px)}}@keyframes floating2{from,to{transform:translate(0,0)}65%{transform:translate(0,10px)}}@-webkit-keyframes fadeIn{from{opacity:0}to{opacity:1}}@keyframes fadeIn{from{opacity:0}to{opacity:1}}@-webkit-keyframes fadeInLeft{from{margin-left:-60px;opacity:0}to{margin-left:0;opacity:1}}@keyframes fadeInLeft{from{margin-left:-60px;opacity:0}to{margin-left:0;opacity:1}}@-webkit-keyframes fadeInRight{from{margin-right:-60px;opacity:0}to{margin-right:0;opacity:1}}@keyframes fadeInRight{from{margin-right:-60px;opacity:0}to{margin-right:0;opacity:1}}*{outline:0}.resume{position:relative;z-index:6;text-align:center}.resume h2{text-transform:uppercase;font-size:2rem}.resume .video{position:relative;background-size:contain;background-position:center;background-repeat:no-repeat;height:10em;width:18em;cursor:pointer;margin:4em auto 8em}.resume .video img{position:absolute;width:80%;left:10%;bottom:-3em}.resume .push-btn{margin:.5em;width:100px}@media all and (min-width:960px){.resume{padding:4em 0;min-height:100vh}.resume h2{font-size:3rem}.resume .video{height:18em;width:40em}.resume .video img{bottom:-7.5em}.resume p{margin:0 auto;width:60%;font-size:1.25rem}.resume .push-btn{padding:1em 2em;margin:2em 1em 0}}.mat-dialog-content .video-container{position:relative;width:50vw;height:0;padding-bottom:56.25%}.mat-dialog-content .video-container .video-iframe{position:absolute;top:0;left:0;width:100%;height:100%}"]
}] }
];
/** @nocollapse */
ResumeComponent.ctorParameters = () => [
{ type: MatDialog }
];
if (false) {
/**
* @type {?}
* @private
*/
ResumeComponent.prototype.dialog;
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicmVzdW1lLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiJuZzovL3d1bWJveC1sYW5kaW5nLyIsInNvdXJjZXMiOlsibGliL21haW4vcmVzdW1lL3Jlc3VtZS5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7OztBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDMUMsT0FBTyxFQUFDLFNBQVMsRUFBRSxlQUFlLEVBQUMsTUFBTSxtQkFBbUIsQ0FBQztBQUM3RCxPQUFPLEVBQUUsY0FBYyxFQUFFLE1BQU0seUJBQXlCLENBQUM7QUFPekQsTUFBTSxPQUFPLGVBQWU7Ozs7SUFFMUIsWUFBb0IsTUFBaUI7UUFBakIsV0FBTSxHQUFOLE1BQU0sQ0FBVztJQUFHLENBQUM7Ozs7SUFFekMsVUFBVTs7Y0FDRixZQUFZLEdBQUcsSUFBSSxlQUFlLEVBQUU7UUFDMUMsSUFBSSxDQUFDLE1BQU0sQ0FBQyxJQUFJLENBQUMsY0FBYyxFQUFFLFlBQVksQ0FBQyxDQUFDO0lBQ2pELENBQUM7Ozs7O0lBRUQsUUFBUSxDQUFDLEVBQVU7UUFDakIsUUFBUSxDQUFDLGNBQWMsQ0FBQyxXQUFXLEVBQUUsRUFBRSxDQUFDLENBQUMsY0FBYyxFQUFFLENBQUM7SUFDNUQsQ0FBQzs7O1lBaEJGLFNBQVMsU0FBQztnQkFDVCxRQUFRLEVBQUUsWUFBWTtnQkFDdEIsb25EQUFzQzs7YUFFdkM7Ozs7WUFQTyxTQUFTOzs7Ozs7O0lBVUgsaUNBQXlCIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQge01hdERpYWxvZywgTWF0RGlhbG9nQ29uZmlnfSBmcm9tICdAYW5ndWxhci9tYXRlcmlhbCc7XG5pbXBvcnQgeyBQb3B1cENvbXBvbmVudCB9IGZyb20gJy4vcG9wdXAvcG9wdXAuY29tcG9uZW50JztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnYXBwLXJlc3VtZScsXG4gIHRlbXBsYXRlVXJsOiAnLi9yZXN1bWUuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi9yZXN1bWUuY29tcG9uZW50LnNjc3MnXVxufSlcbmV4cG9ydCBjbGFzcyBSZXN1bWVDb21wb25lbnQge1xuXG4gIGNvbnN0cnVjdG9yKHByaXZhdGUgZGlhbG9nOiBNYXREaWFsb2cpIHt9XG5cbiAgb3BlbkRpYWxvZygpIHtcbiAgICBjb25zdCBkaWFsb2dDb25maWcgPSBuZXcgTWF0RGlhbG9nQ29uZmlnKCk7XG4gICAgdGhpcy5kaWFsb2cub3BlbihQb3B1cENvbXBvbmVudCwgZGlhbG9nQ29uZmlnKTtcbiAgfVxuXG4gIHNjcm9sbFRvKGlkOiBzdHJpbmcpIHtcbiAgICBkb2N1bWVudC5nZXRFbGVtZW50QnlJZChgZmVhdHVyZS0ke2lkfWApLnNjcm9sbEludG9WaWV3KCk7XG4gIH1cblxufVxuIl19