Release 1.6.0

Add new `customSize` option to allow specifying a custom star size
hughjdavey · Jun 7, 2022 · 8231cfa · 8231cfa
1 parent ea3be5a
commit 8231cfa
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 4 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,5 +1,9 @@
 # Changelog
 
+## 1.6.0 (07/06/2022)
+
+* Add new `customSize` option to allow specifying a custom star size
+
 ## 1.5.1 (28/04/2021)
 
 * Fix table of contents links in `README.md`

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "ngx-stars",
-  "version": "1.5.1",
+  "version": "1.6.0",
   "description": "Simple stars rating component for Angular >= 2",
   "repository": {
     "type": "git",

diff --git a/src/lib/ngx-stars.component.ts b/src/lib/ngx-stars.component.ts
@@ -19,6 +19,9 @@ export class NgxStarsComponent implements OnInit, OnDestroy {
   @Input()
   size: number;
 
+  @Input()
+  customSize: string;
+
   @Input()
   color: string;
 
@@ -91,7 +94,7 @@ export class NgxStarsComponent implements OnInit, OnDestroy {
   }
 
   starPadding(): { [p: string]: string } {
-    return { 'margin-right': this.customPadding || `0.${this.safeSize()}rem` };
+    return { 'margin-right': this.customPadding || `calc(${this.starSize().width} / 10)` };
   }
 
   starColorAndSize(): { [p: string]: string } {
@@ -104,8 +107,8 @@ export class NgxStarsComponent implements OnInit, OnDestroy {
 
   starSize(): { [p: string]: string } {
     return {
-      height: `${15 * this.safeSize()}px`,
-      width: `${16 * this.safeSize()}px`,
+      height: this.customSize || `${15 * this.safeSize()}px`,
+      width: this.customSize || `${16 * this.safeSize()}px`,
     };
   }