Skip to content

Commit

Permalink
feat: element property on message object for more custom notifications (
Browse files Browse the repository at this point in the history
  • Loading branch information
finnp authored Aug 23, 2016
1 parent 5102c2b commit a1a7fdb
Show file tree
Hide file tree
Showing 4 changed files with 21 additions and 2 deletions.
4 changes: 4 additions & 0 deletions main.js
Original file line number Diff line number Diff line change
Expand Up @@ -87,6 +87,10 @@ module.exports = function (opts) {
}

function getMessageBody (notification) {
if (notification.element) {
notification.element.className = 'notification-message'
return notification.element
}
if (opts.repo && notification.type === 'error') {
return yo`
<div class="notification-message">
Expand Down
4 changes: 3 additions & 1 deletion notifications.css
Original file line number Diff line number Diff line change
Expand Up @@ -106,10 +106,11 @@
position: relative;
color: #fff;
background-color: #ba2c1d;
margin-top: 5px;
display: inline-block;
padding: 6px 8px 7px;
margin-top: 5px;
margin-bottom: 0;
margin-right: 10px;
font-size: 12px;
font-weight: 400;
line-height: 1;
Expand All @@ -119,6 +120,7 @@
cursor: pointer;
border-radius: 3px;
text-decoration: none;
border: 0px;
}

// Show keyframes
Expand Down
13 changes: 13 additions & 0 deletions readme.md
Original file line number Diff line number Diff line change
Expand Up @@ -46,6 +46,19 @@ Have a look at the options to replace them with your own icon classes.
Setting the `options.repo` to a GitHub repository will add an `Create an issue for this error`
button to the error notifications.
If you need more customization, instead of using the `message` property, you
can also specify an `element` property and set it to `DOMElement` that will be the content.
For example with [yo-yo](https://github.com/maxogden/yo-yo):
```js
notifications.add({
type: 'error',
element: yo`<div>
<strong>My super custom <em>message</em>!</strong>
</div>`
})
```
### `notifications.element()`
Expand Down
2 changes: 1 addition & 1 deletion style.js

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

0 comments on commit a1a7fdb

Please sign in to comment.