https://github.com/matsuuu/emphasize-text
Emphasize Text is a Web component to emphasize parts of text easily
https://github.com/matsuuu/emphasize-text
javascript webcomponent
Last synced: 2 months ago
JSON representation
Emphasize Text is a Web component to emphasize parts of text easily
- Host: GitHub
- URL: https://github.com/matsuuu/emphasize-text
- Owner: Matsuuu
- Created: 2020-06-10T09:59:12.000Z (almost 5 years ago)
- Default Branch: master
- Last Pushed: 2023-01-06T08:30:25.000Z (over 2 years ago)
- Last Synced: 2025-02-12T21:18:10.491Z (4 months ago)
- Topics: javascript, webcomponent
- Language: HTML
- Homepage:
- Size: 505 KB
- Stars: 2
- Watchers: 3
- Forks: 0
- Open Issues: 4
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Emphasize Text
[](https://badge.fury.io/js/emphasize-text)
Emphasize text is used for easy emphasizing of text content on web pages.
Emphasize text analyzes the text inside it, and finds the provided keywords / regex given and surrounds them with spans for
simple styling
Due to Emphasize Text using comma (,) as the seperator of the strings, comma itself cannot be highlighted.
### Install
```bash
npm install emphasize-text
```
### Usage
```js
import 'emphasize-text';
```
```html
.orange-text {
color: #ff6d00;
}
.emphasize {
font-weight: bold;
}
With Emphasize Text, you can easily add attention the the parts of the text content you want.
Emphasize Text allows you to easily create templates, which draw the user's attention and ephasize's the
point you want to make.
Easy Emphasizing of content
Price: 0€, not 5€, nor 9.90€
```
Would result to
### Properties
| Name | Usage | Examples |
| ---------------- | ------------------------------------------------------------- | ------------------------------------- |
| `emphasize` | Comma seperated list of words/regexes you want to emphasize | `emphasize="me,you"` |
| `emphasizeClass` | Set custom class to emphasized elements for more unique usage | `emphasizeClass="my-emphasize-class"` |