Skip to content

Commit 136a784

Browse files
chore(CHANGELOG.md): updating doc before publishing package
1 parent c175089 commit 136a784

File tree

2 files changed

+43
-2
lines changed

2 files changed

+43
-2
lines changed

CHANGELOG.md

Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,9 +9,50 @@ and this project adheres to [Semantic Versioning](http://semver.org/).
99

1010
### Added
1111

12+
- Adding support for extending global theme added via `NgxSkeletonLoaderModule.forRoot({ theme: /* ...list of CSS atributes */} })`
13+
14+
By default when using `NgxSkeletonLoaderModule.forRoot({ theme: /* ...list of CSS atributes */} })` the application is using this value as source of truth, overriding any local theming passed to `<ngx-skeleton-loader>` component via `[theme]` input.
15+
16+
By using `NgxSkeletonLoaderModule.forRoot({ theme: { extendsFromRoot: true, /* ...list of CSS atributes */} })` in your application, you should also be aware that:
17+
18+
- By default, every `<ngx-skeleton-loader>` component will use `theme` coming from `NgxSkeletonLoaderModule.forRoot()` as the source of truth
19+
- If there's any CSS attribute on the component locally which overrides the CSS spec, it combines both themes, but overriding global CSS attributes in favor of local ones.
20+
21+
```html
22+
<!--
23+
// ... E.G: App is using this configuration below
24+
25+
NgxSkeletonLoaderModule.forRoot({
26+
theme: {
27+
// Enabliong theme combination
28+
extendsFromRoot: true,
29+
// ... list of CSS theme attributes
30+
height: '30px',
31+
},
32+
}),
33+
-->
34+
35+
<div class="item">
36+
<ngx-skeleton-loader></ngx-skeleton-loader>
37+
<!-- above line will produce a skeleton component using `height: 30px;`" -->
38+
<ngx-skeleton-loader [theme]="{background: 'blue'}"></ngx-skeleton-loader>
39+
<!-- above line will produce a skeleton component using `height: 30px; background: blue;`" -->
40+
<ngx-skeleton-loader [theme]="{height: '50px', background: 'red'}"></ngx-skeleton-loader>
41+
<!-- above line will produce a skeleton component using `height: 50px; background: red;`" -->
42+
</div>
43+
```
44+
1245
- Adding new `custom-content` appearance. From now on, consumers can now add their own content inside `<ng-skeleton-loader></ng-skeleton-loader>` component. So that, they can add some custom content, such as SVG, as an example
1346
- Adding examples for `custom-content` usage
1447

48+
### Updated
49+
50+
- Updagrading module to Angular v15
51+
52+
### Fixed
53+
54+
- Removing build warnings
55+
1556
## [6.0.0][] - 2022-08-18
1657

1758
### Updated

README.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -124,7 +124,7 @@ export class YourAppComponent {}
124124
125125
This method is also accepting the option of having a global theme and local theme inputs. You can enable it by passing `NgxSkeletonLoaderModule.forRoot({ theme: { extendsFromRoot: true, /* ...list of CSS atributes */} })` in your module. Quite simple, right? 😄
126126

127-
By using that configuration in yuor application, you should also be aware that:
127+
By using that configuration in your application, you should also be aware that:
128128

129129
- By default, every `<ngx-skeleton-loader>` component will use `theme` coming from `NgxSkeletonLoaderModule.forRoot()` as the source of truth
130130
- If there's any CSS attribute on the component locally which overrides the CSS spec, it combines both themes, but overriding global CSS attributes in favor of local ones.
@@ -149,7 +149,7 @@ import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader';
149149
// ... list of CSS theme attributes
150150
height: '30px',
151151
},
152-
}),,
152+
}),
153153
...
154154
],
155155
providers: [],

0 commit comments

Comments
 (0)