https://github.com/polydile/dile-close-icon-template
Mixin to create a close icon in a LitElement template
https://github.com/polydile/dile-close-icon-template
Last synced: 9 months ago
JSON representation
Mixin to create a close icon in a LitElement template
- Host: GitHub
- URL: https://github.com/polydile/dile-close-icon-template
- Owner: Polydile
- License: mit
- Created: 2019-09-16T10:25:47.000Z (almost 7 years ago)
- Default Branch: master
- Last Pushed: 2020-07-10T17:48:55.000Z (almost 6 years ago)
- Last Synced: 2024-12-26T05:35:06.294Z (over 1 year ago)
- Language: JavaScript
- Size: 7.81 KB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Moved
**This package has moved** and is now available at [@dile/ui](https://github.com/Polydile/dile-components). Please update your dependencies. This repository is no longer maintained. You can read the documentation at [Dile Components](https://dile-components.com/).
# dile-close-icon-template
LitElement Template to implement a close icon
```
import { closeIcon } from 'dile-close-icon-template';
```
Yo may use this icon in a LitElement template:
```
render() {
return html`
// Your component template
${ closeIcon }
`;
}
```
To easy style the icon you may use the CSS declaration provided in this package.
```
import { closeIcon, closeIconCss } from 'dile-close-icon-template';
```
You may use this style declaration like this:
static get styles() {
return [closeIconCss, css`
:host {
--dile-close-icon-template-color: #fce;
}
`];
}
As you may note, there is a custom CSS property named ```--dile-close-icon-template-color```. Use it to set the color of the icon.