ngx-skeleton-loader - npm Package Compare versions

Comparing version 1.1.1 to 1.1.2

bundles/ngx-skeleton-loader.umd.js

@@ -33,3 +33,3 @@ (function (global, factory) {
                         template: "<span\n  *ngFor=\"let item of items\"\n  class=\"loader\"\n  [ngClass]=\"{ circle: appearance === 'circle' }\"\n  [ngStyle]=\"styles\"\n>\n</span>\n",
-                        styles: [".loader{-webkit-animation:2s ease-in-out infinite progress;animation:2s ease-in-out infinite progress;background-repeat:no-repeat;background-color:#eff1f6;overflow:hidden;position:relative;background-image:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.6),rgba(255,255,255,0));background-size:200px 100%;border-radius:4px;width:100%;height:20px;line-height:1;display:inline-block;margin-bottom:10px}.loader:after,.loader:before{box-sizing:border-box}.loader.circle{width:40px;height:40px;margin:5px;border-radius:50%}@-webkit-keyframes progress{0%{background-position:-200px 0}100%{background-position:calc(200px + 100%) 0}}@keyframes progress{0%{background-position:-200px 0}100%{background-position:calc(200px + 100%) 0}}"]
+                        styles: [".loader{box-sizing:border-box;-webkit-animation:2s ease-in-out infinite progress;animation:2s ease-in-out infinite progress;background:0 0/200px 100% no-repeat #eff1f6;background-image:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.6),rgba(255,255,255,0));border-radius:4px;width:100%;height:20px;display:inline-block;margin-bottom:10px}.loader:after,.loader:before{box-sizing:border-box}.loader.circle{width:40px;height:40px;margin:5px;border-radius:50%}@-webkit-keyframes progress{0%{background-position:-200px 0}100%{background-position:calc(200px + 100%) 0}}@keyframes progress{0%{background-position:-200px 0}100%{background-position:calc(200px + 100%) 0}}"]
                     }] }
@@ -36,0 +36,0 @@ ];

bundles/ngx-skeleton-loader.umd.min.js

@@ -1,2 +0,2 @@
-!function(e,o){"object"==typeof exports&&"undefined"!=typeof module?o(exports,require("@angular/core"),require("@angular/common")):"function"==typeof define&&define.amd?define("ngx-skeleton-loader",["exports","@angular/core","@angular/common"],o):o(e["ngx-skeleton-loader"]={},e.ng.core,e.ng.common)}(this,function(e,o,n){"use strict";var t=function(){function e(){this.count=1,this.appearance="",this.theme={},this.styles={},this.items=[]}return e.prototype.ngOnInit=function(){this.styles=this.theme||{},this.items.length=this.count},e.decorators=[{type:o.Component,args:[{selector:"ngx-skeleton-loader",template:'<span\n  *ngFor="let item of items"\n  class="loader"\n  [ngClass]="{ circle: appearance === \'circle\' }"\n  [ngStyle]="styles"\n>\n</span>\n',styles:[".loader{-webkit-animation:2s ease-in-out infinite progress;animation:2s ease-in-out infinite progress;background-repeat:no-repeat;background-color:#eff1f6;overflow:hidden;position:relative;background-image:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.6),rgba(255,255,255,0));background-size:200px 100%;border-radius:4px;width:100%;height:20px;line-height:1;display:inline-block;margin-bottom:10px}.loader:after,.loader:before{box-sizing:border-box}.loader.circle{width:40px;height:40px;margin:5px;border-radius:50%}@-webkit-keyframes progress{0%{background-position:-200px 0}100%{background-position:calc(200px + 100%) 0}}@keyframes progress{0%{background-position:-200px 0}100%{background-position:calc(200px + 100%) 0}}"]}]}],e.propDecorators={count:[{type:o.Input}],appearance:[{type:o.Input}],theme:[{type:o.Input}]},e}(),r=function(){function e(){}return e.decorators=[{type:o.NgModule,args:[{declarations:[t],imports:[n.CommonModule],exports:[t]}]}],e}();e.NgxSkeletonLoaderComponent=t,e.NgxSkeletonLoaderModule=r,Object.defineProperty(e,"__esModule",{value:!0})});
+!function(e,o){"object"==typeof exports&&"undefined"!=typeof module?o(exports,require("@angular/core"),require("@angular/common")):"function"==typeof define&&define.amd?define("ngx-skeleton-loader",["exports","@angular/core","@angular/common"],o):o(e["ngx-skeleton-loader"]={},e.ng.core,e.ng.common)}(this,function(e,o,n){"use strict";var t=function(){function e(){this.count=1,this.appearance="",this.theme={},this.styles={},this.items=[]}return e.prototype.ngOnInit=function(){this.styles=this.theme||{},this.items.length=this.count},e.decorators=[{type:o.Component,args:[{selector:"ngx-skeleton-loader",template:'<span\n  *ngFor="let item of items"\n  class="loader"\n  [ngClass]="{ circle: appearance === \'circle\' }"\n  [ngStyle]="styles"\n>\n</span>\n',styles:[".loader{box-sizing:border-box;-webkit-animation:2s ease-in-out infinite progress;animation:2s ease-in-out infinite progress;background:0 0/200px 100% no-repeat #eff1f6;background-image:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.6),rgba(255,255,255,0));border-radius:4px;width:100%;height:20px;display:inline-block;margin-bottom:10px}.loader:after,.loader:before{box-sizing:border-box}.loader.circle{width:40px;height:40px;margin:5px;border-radius:50%}@-webkit-keyframes progress{0%{background-position:-200px 0}100%{background-position:calc(200px + 100%) 0}}@keyframes progress{0%{background-position:-200px 0}100%{background-position:calc(200px + 100%) 0}}"]}]}],e.propDecorators={count:[{type:o.Input}],appearance:[{type:o.Input}],theme:[{type:o.Input}]},e}(),r=function(){function e(){}return e.decorators=[{type:o.NgModule,args:[{declarations:[t],imports:[n.CommonModule],exports:[t]}]}],e}();e.NgxSkeletonLoaderComponent=t,e.NgxSkeletonLoaderModule=r,Object.defineProperty(e,"__esModule",{value:!0})});
 //# sourceMappingURL=ngx-skeleton-loader.umd.min.js.map

CHANGELOG.md

@@ -10,2 +10,12 @@ # Change Log
 
+## [1.1.2][] - 2019-01-07
+
+### Added
+
+- Adding badges for stackblitz, bundlephobia and license
+
+### Updated
+
+- Removing unnecessary CSS styles for skeleton
+
 ## [1.1.1][] - 2018-12-17
@@ -69,5 +79,7 @@
 [1.1.0]: https://github.com/willmendesneto/ngx-skeleton-loader/tree/v1.1.0
+[unreleased]: https://github.com/willmendesneto/ngx-skeleton-loader/compare/v1.1.1...HEAD
+[1.1.1]: https://github.com/willmendesneto/ngx-skeleton-loader/tree/v1.1.1
 
 
-[Unreleased]: https://github.com/willmendesneto/ngx-skeleton-loader/compare/v1.1.1...HEAD
-[1.1.1]: https://github.com/willmendesneto/ngx-skeleton-loader/tree/v1.1.1
+[Unreleased]: https://github.com/willmendesneto/ngx-skeleton-loader/compare/v1.1.2...HEAD
+[1.1.2]: https://github.com/willmendesneto/ngx-skeleton-loader/tree/v1.1.2

esm2015/lib/ngx-skeleton-loader.component.js

@@ -26,3 +26,3 @@ /**
                 template: "<span\n  *ngFor=\"let item of items\"\n  class=\"loader\"\n  [ngClass]=\"{ circle: appearance === 'circle' }\"\n  [ngStyle]=\"styles\"\n>\n</span>\n",
-                styles: [".loader{-webkit-animation:2s ease-in-out infinite progress;animation:2s ease-in-out infinite progress;background-repeat:no-repeat;background-color:#eff1f6;overflow:hidden;position:relative;background-image:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.6),rgba(255,255,255,0));background-size:200px 100%;border-radius:4px;width:100%;height:20px;line-height:1;display:inline-block;margin-bottom:10px}.loader:after,.loader:before{box-sizing:border-box}.loader.circle{width:40px;height:40px;margin:5px;border-radius:50%}@-webkit-keyframes progress{0%{background-position:-200px 0}100%{background-position:calc(200px + 100%) 0}}@keyframes progress{0%{background-position:-200px 0}100%{background-position:calc(200px + 100%) 0}}"]
+                styles: [".loader{box-sizing:border-box;-webkit-animation:2s ease-in-out infinite progress;animation:2s ease-in-out infinite progress;background:0 0/200px 100% no-repeat #eff1f6;background-image:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.6),rgba(255,255,255,0));border-radius:4px;width:100%;height:20px;display:inline-block;margin-bottom:10px}.loader:after,.loader:before{box-sizing:border-box}.loader.circle{width:40px;height:40px;margin:5px;border-radius:50%}@-webkit-keyframes progress{0%{background-position:-200px 0}100%{background-position:calc(200px + 100%) 0}}@keyframes progress{0%{background-position:-200px 0}100%{background-position:calc(200px + 100%) 0}}"]
             }] }
@@ -29,0 +29,0 @@ ];

esm5/lib/ngx-skeleton-loader.component.js

@@ -28,3 +28,3 @@ /**
                     template: "<span\n  *ngFor=\"let item of items\"\n  class=\"loader\"\n  [ngClass]=\"{ circle: appearance === 'circle' }\"\n  [ngStyle]=\"styles\"\n>\n</span>\n",
-                    styles: [".loader{-webkit-animation:2s ease-in-out infinite progress;animation:2s ease-in-out infinite progress;background-repeat:no-repeat;background-color:#eff1f6;overflow:hidden;position:relative;background-image:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.6),rgba(255,255,255,0));background-size:200px 100%;border-radius:4px;width:100%;height:20px;line-height:1;display:inline-block;margin-bottom:10px}.loader:after,.loader:before{box-sizing:border-box}.loader.circle{width:40px;height:40px;margin:5px;border-radius:50%}@-webkit-keyframes progress{0%{background-position:-200px 0}100%{background-position:calc(200px + 100%) 0}}@keyframes progress{0%{background-position:-200px 0}100%{background-position:calc(200px + 100%) 0}}"]
+                    styles: [".loader{box-sizing:border-box;-webkit-animation:2s ease-in-out infinite progress;animation:2s ease-in-out infinite progress;background:0 0/200px 100% no-repeat #eff1f6;background-image:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.6),rgba(255,255,255,0));border-radius:4px;width:100%;height:20px;display:inline-block;margin-bottom:10px}.loader:after,.loader:before{box-sizing:border-box}.loader.circle{width:40px;height:40px;margin:5px;border-radius:50%}@-webkit-keyframes progress{0%{background-position:-200px 0}100%{background-position:calc(200px + 100%) 0}}@keyframes progress{0%{background-position:-200px 0}100%{background-position:calc(200px + 100%) 0}}"]
                 }] }
@@ -31,0 +31,0 @@ ];

fesm2015/ngx-skeleton-loader.js

@@ -28,3 +28,3 @@ import { Component, Input, NgModule } from '@angular/core';
                 template: "<span\n  *ngFor=\"let item of items\"\n  class=\"loader\"\n  [ngClass]=\"{ circle: appearance === 'circle' }\"\n  [ngStyle]=\"styles\"\n>\n</span>\n",
-                styles: [".loader{-webkit-animation:2s ease-in-out infinite progress;animation:2s ease-in-out infinite progress;background-repeat:no-repeat;background-color:#eff1f6;overflow:hidden;position:relative;background-image:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.6),rgba(255,255,255,0));background-size:200px 100%;border-radius:4px;width:100%;height:20px;line-height:1;display:inline-block;margin-bottom:10px}.loader:after,.loader:before{box-sizing:border-box}.loader.circle{width:40px;height:40px;margin:5px;border-radius:50%}@-webkit-keyframes progress{0%{background-position:-200px 0}100%{background-position:calc(200px + 100%) 0}}@keyframes progress{0%{background-position:-200px 0}100%{background-position:calc(200px + 100%) 0}}"]
+                styles: [".loader{box-sizing:border-box;-webkit-animation:2s ease-in-out infinite progress;animation:2s ease-in-out infinite progress;background:0 0/200px 100% no-repeat #eff1f6;background-image:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.6),rgba(255,255,255,0));border-radius:4px;width:100%;height:20px;display:inline-block;margin-bottom:10px}.loader:after,.loader:before{box-sizing:border-box}.loader.circle{width:40px;height:40px;margin:5px;border-radius:50%}@-webkit-keyframes progress{0%{background-position:-200px 0}100%{background-position:calc(200px + 100%) 0}}@keyframes progress{0%{background-position:-200px 0}100%{background-position:calc(200px + 100%) 0}}"]
             }] }
@@ -31,0 +31,0 @@ ];

fesm5/ngx-skeleton-loader.js

@@ -30,3 +30,3 @@ import { Component, Input, NgModule } from '@angular/core';
                     template: "<span\n  *ngFor=\"let item of items\"\n  class=\"loader\"\n  [ngClass]=\"{ circle: appearance === 'circle' }\"\n  [ngStyle]=\"styles\"\n>\n</span>\n",
-                    styles: [".loader{-webkit-animation:2s ease-in-out infinite progress;animation:2s ease-in-out infinite progress;background-repeat:no-repeat;background-color:#eff1f6;overflow:hidden;position:relative;background-image:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.6),rgba(255,255,255,0));background-size:200px 100%;border-radius:4px;width:100%;height:20px;line-height:1;display:inline-block;margin-bottom:10px}.loader:after,.loader:before{box-sizing:border-box}.loader.circle{width:40px;height:40px;margin:5px;border-radius:50%}@-webkit-keyframes progress{0%{background-position:-200px 0}100%{background-position:calc(200px + 100%) 0}}@keyframes progress{0%{background-position:-200px 0}100%{background-position:calc(200px + 100%) 0}}"]
+                    styles: [".loader{box-sizing:border-box;-webkit-animation:2s ease-in-out infinite progress;animation:2s ease-in-out infinite progress;background:0 0/200px 100% no-repeat #eff1f6;background-image:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.6),rgba(255,255,255,0));border-radius:4px;width:100%;height:20px;display:inline-block;margin-bottom:10px}.loader:after,.loader:before{box-sizing:border-box}.loader.circle{width:40px;height:40px;margin:5px;border-radius:50%}@-webkit-keyframes progress{0%{background-position:-200px 0}100%{background-position:calc(200px + 100%) 0}}@keyframes progress{0%{background-position:-200px 0}100%{background-position:calc(200px + 100%) 0}}"]
                 }] }
@@ -33,0 +33,0 @@ ];

ngx-skeleton-loader.metadata.json

@@ -1,1 +0,1 @@
-{"__symbolic":"module","version":4,"metadata":{"NgxSkeletonLoaderComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":2,"character":1},"arguments":[{"selector":"ngx-skeleton-loader","template":"<span\n  *ngFor=\"let item of items\"\n  class=\"loader\"\n  [ngClass]=\"{ circle: appearance === 'circle' }\"\n  [ngStyle]=\"styles\"\n>\n</span>\n","styles":[".loader{-webkit-animation:2s ease-in-out infinite progress;animation:2s ease-in-out infinite progress;background-repeat:no-repeat;background-color:#eff1f6;overflow:hidden;position:relative;background-image:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.6),rgba(255,255,255,0));background-size:200px 100%;border-radius:4px;width:100%;height:20px;line-height:1;display:inline-block;margin-bottom:10px}.loader:after,.loader:before{box-sizing:border-box}.loader.circle{width:40px;height:40px;margin:5px;border-radius:50%}@-webkit-keyframes progress{0%{background-position:-200px 0}100%{background-position:calc(200px + 100%) 0}}@keyframes progress{0%{background-position:-200px 0}100%{background-position:calc(200px + 100%) 0}}"]}]}],"members":{"count":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":8,"character":3}}]}],"appearance":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":11,"character":3}}]}],"theme":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":14,"character":3}}]}],"ngOnInit":[{"__symbolic":"method"}]}},"NgxSkeletonLoaderModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":4,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"NgxSkeletonLoaderComponent"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":6,"character":12}],"exports":[{"__symbolic":"reference","name":"NgxSkeletonLoaderComponent"}]}]}],"members":{}}},"origins":{"NgxSkeletonLoaderComponent":"./lib/ngx-skeleton-loader.component","NgxSkeletonLoaderModule":"./lib/ngx-skeleton-loader.module"},"importAs":"ngx-skeleton-loader"}
+{"__symbolic":"module","version":4,"metadata":{"NgxSkeletonLoaderComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":2,"character":1},"arguments":[{"selector":"ngx-skeleton-loader","template":"<span\n  *ngFor=\"let item of items\"\n  class=\"loader\"\n  [ngClass]=\"{ circle: appearance === 'circle' }\"\n  [ngStyle]=\"styles\"\n>\n</span>\n","styles":[".loader{box-sizing:border-box;-webkit-animation:2s ease-in-out infinite progress;animation:2s ease-in-out infinite progress;background:0 0/200px 100% no-repeat #eff1f6;background-image:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.6),rgba(255,255,255,0));border-radius:4px;width:100%;height:20px;display:inline-block;margin-bottom:10px}.loader:after,.loader:before{box-sizing:border-box}.loader.circle{width:40px;height:40px;margin:5px;border-radius:50%}@-webkit-keyframes progress{0%{background-position:-200px 0}100%{background-position:calc(200px + 100%) 0}}@keyframes progress{0%{background-position:-200px 0}100%{background-position:calc(200px + 100%) 0}}"]}]}],"members":{"count":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":8,"character":3}}]}],"appearance":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":11,"character":3}}]}],"theme":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":14,"character":3}}]}],"ngOnInit":[{"__symbolic":"method"}]}},"NgxSkeletonLoaderModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":4,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"NgxSkeletonLoaderComponent"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":6,"character":12}],"exports":[{"__symbolic":"reference","name":"NgxSkeletonLoaderComponent"}]}]}],"members":{}}},"origins":{"NgxSkeletonLoaderComponent":"./lib/ngx-skeleton-loader.component","NgxSkeletonLoaderModule":"./lib/ngx-skeleton-loader.module"},"importAs":"ngx-skeleton-loader"}

package.json

 {
   "name": "ngx-skeleton-loader",
-  "version": "1.1.1",
+  "version": "1.1.2",
   "license": "MIT",
@@ -5,0 +5,0 @@ "keywords": [

README.md

 # NGX Skeleton loader
 
 [![Dependency Status](https://david-dm.org/willmendesneto/ngx-skeleton-loader.svg)](https://david-dm.org/willmendesneto/ngx-skeleton-loader)
+[![npm](https://img.shields.io/badge/stackblitz-online-orange.svg)](https://stackblitz.com/edit/ngx-skeleton-loader-sample)
 
@@ -10,2 +11,4 @@ [![NPM](https://nodei.co/npm/ngx-skeleton-loader.png?downloads=true&downloadRank=true&stars=true)](https://npmjs.org/ngx-skeleton-loader)
 [![Coverage Status](https://coveralls.io/repos/willmendesneto/ngx-skeleton-loader/badge.svg?branch=master)](https://coveralls.io/r/willmendesneto/ngx-skeleton-loader?branch=master)
+[![npm bundle size (minified + gzip)](https://img.shields.io/bundlephobia/minzip/ngx-skeleton-loader.svg)](https://bundlephobia.com/result?p=ngx-skeleton-loader)
+[![npm](https://img.shields.io/npm/l/express.svg?maxAge=2592000)](/LICENSE)
 
@@ -12,0 +15,0 @@ ![ngx-skeleton-loader in action](https://user-images.githubusercontent.com/1252570/50053778-d4e0d900-018e-11e9-9de7-fad6f9fddd9e.gif)

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

47700

increased by0.53%

Number of lines in readme file

100

increased by3.09%

Worsened metrics

Lines of code

391

decreased by-0.26%

No dependency changes