ng-vertical-timeline/bundles/ng-vertical-timeline.umd.min.js

This is a Angular library that generates a vertical timeline.

!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("@angular/platform-browser")):"function"==typeof define&&define.amd?define("ng-vertical-timeline",["exports","@angular/core","@angular/platform-browser"],t):t(e["ng-vertical-timeline"]={},e.ng.core,e.ng.platformBrowser)}(this,function(e,t,n){"use strict";var r=(i.decorators=[{type:t.Injectable,args:[{providedIn:"root"}]}],i.ctorParameters=function(){return[]},i.ngInjectableDef=t.defineInjectable({factory:function(){return new i},token:i,providedIn:"root"}),i);function i(){}var o=(a.prototype.ngOnInit=function(){},a.prototype.isPair=function(e){return!(e%2)},a.decorators=[{type:t.Component,args:[{selector:"ng-vertical-timeline",template:'<div class="timeline">\r\n\r\n  <div *ngFor="let item of data">\r\n\r\n    <div class="container left" [ngClass]="isPair(item.id)?\'left\':\'right\'">\r\n      <div class="inner">\r\n        <div class="head" [style.backgroundColor]="primaryColor">\r\n          <div class="icon">\r\n            <img class="ui tiny image" [src]="item.icon">\r\n          </div>\r\n\r\n          <div class="title">\r\n            <span>{{item.date}}</span>\r\n            {{item.title }}\r\n          </div>\r\n\r\n        </div>\r\n        <div class="body">\r\n          <p [innerHTML]="item.content"></p>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>\r\n',styles:['.timeline{position:relative;max-width:1200px;margin:0 auto}.timeline:after{content:"";position:absolute;width:6px;background-color:#222;top:0;bottom:0;left:50%;margin-left:-3px}.timeline .container{position:relative;width:50%;margin:initial;padding:10px 40px;background-color:initial;box-sizing:border-box}.timeline .container:after{content:"";position:absolute;width:25px;height:25px;right:-16px;background-color:#000428;border:4px solid #004e92;top:15px;border-radius:50%;z-index:1}.timeline .container .inner{background-color:#fff;color:#222;box-shadow:0 3px 6px rgba(0,0,0,.16),0 3px 6px rgba(0,0,0,.23)}.timeline .container .inner .head{display:flex;align-items:center;color:#fff;background-color:#222}.timeline .container .inner .head .icon{margin:20px;max-width:50px}.timeline .container .inner .head .icon img{width:100%;height:100%}.timeline .container .inner .head .title{font-size:24px;text-transform:uppercase}.timeline .container .inner .head .title span{display:block;font-size:14px}.timeline .container .inner .body{background-color:#fff;padding:20px}.left{left:0}.left:before{content:" ";height:0;position:absolute;top:22px;width:0;z-index:1;right:30px;border:solid #222;border-width:10px 0 10px 10px;border-color:transparent transparent transparent #222}.right{left:50%}.right:before{content:" ";height:0;position:absolute;top:22px;width:0;z-index:1;left:30px;border:solid #222;border-width:10px 10px 10px 0;border-color:transparent #222 transparent transparent}.right:after{left:-16px}@media screen and (max-width:600px){.timeline:after{left:31px}.timeline .container{width:100%;padding-left:70px;padding-right:25px}.timeline .container:before{left:60px;border:solid #222;border-width:10px 10px 10px 0;border-color:transparent #222 transparent transparent}.left::after,.right::after{left:12px}.right{left:0}#timeline--1,#timeline--2,#timeline--3{top:initial}}']}]}],a.ctorParameters=function(){return[]},a.propDecorators={data:[{type:t.Input}],primaryColor:[{type:t.Input}]},a);function a(){}var l=(p.decorators=[{type:t.NgModule,args:[{imports:[n.BrowserModule],declarations:[o],exports:[o]}]}],p);function p(){}e.NgVerticalTimelineService=r,e.NgVerticalTimelineComponent=o,e.NgVerticalTimelineModule=l,Object.defineProperty(e,"__esModule",{value:!0})});
//# sourceMappingURL=ng-vertical-timeline.umd.min.js.map