https://github.com/knownasilya/ember-highlight

Highlight a given term(s) inside the `{{highlight-terms}}` component block.
https://github.com/knownasilya/ember-highlight

ember-addon ember-fastboot highlight jquery-highlight

Last synced: 2 days ago
JSON representation

Highlight a given term(s) inside the `{{highlight-terms}}` component block.

• Host: GitHub
• URL: https://github.com/knownasilya/ember-highlight
• Owner: knownasilya
• License: mit
• Created: 2016-01-16T19:47:27.000Z (over 8 years ago)
• Default Branch: master
• Last Pushed: 2023-03-03T16:08:38.000Z (over 1 year ago)
• Last Synced: 2024-08-09T20:51:27.070Z (about 2 months ago)
• Topics: ember-addon, ember-fastboot, highlight, jquery-highlight
• Language: JavaScript
• Homepage: http://knownasilya.github.io/ember-highlight/
• Size: 1.84 MB
• Stars: 10
• Watchers: 3
• Forks: 7
• Open Issues: 5
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • License: LICENSE.md

Awesome Lists containing this project

README

        
# ember-highlight

Highlight a given term(s) inside the `{{highlight-terms}}` component block.

[![NPM][npm-badge-img]][npm-badge-link]

[![Build Status][travis-badge]][travis-badge-url]

[![Ember Observer Score][ember-observer-badge]][ember-observer-url]

![Ember Version][ember-version]

See the [demo].  

Uses [jquery-highlight] internally.

```no-highlight

ember install ember-highlight

```

## Usage

```hbs

{{#highlight-terms 'hello' list 'other'}}

  Hello my name is Johnny.

{{/highlight-terms}}

```

Default term wrapper is `span.highlight` which is styled automatically

by a single style, see `vendor/simple.css`. To override just add your own style

to `.highlight-terms .highlight`.

## Attributes

The positional params map to `term`. Each param can be an array of

terms, which are automatically flattened.

* `caseSensitive` - Defaults to `false`.

* `wordsOnly` - Defaults to `false`.

* `term` - String or Array of strings, or an Array of arrays of strings.

## Testing

```no-highlight

ember test --server

```

Visit `http://localhost:4200/ember-highlight/` to see the demo app.

### Building Demo (Github Pages)

Build by checking out the relevant branch, since the test dummy app

is actually the demo app.

Run the following command:

```no-highlight

ember github-pages:commit --message 

```

[jquery-highlight]: https://github.com/knownasilya/jquery-highlight

[npm-badge-img]: https://badge.fury.io/js/ember-highlight.svg

[npm-badge-link]: http://badge.fury.io/js/ember-highlight

[travis-badge]: https://travis-ci.org/knownasilya/ember-highlight.svg

[travis-badge-url]: https://travis-ci.org/knownasilya/ember-highlight

[ember-observer-badge]: http://emberobserver.com/badges/ember-highlight.svg

[ember-observer-url]: http://emberobserver.com/addons/ember-highlight

[ember-version]: https://embadge.io/v1/badge.svg?start=1.13.0

[demo]:  http://knownasilya.github.io/ember-highlight/