@@ -31,7 +31,7 @@ yarn add @mathieustan/vue-notification
3131import VueNotification from ' @mathieustan/vue-notification' ;
3232Vue .use (VueNotification);
3333
34- // breakpoint example
34+ // Or with options (like breakpoints)
3535Vue .use (VueNotification, {
3636 breakpoints: {
3737 0 : {
@@ -105,15 +105,15 @@ Theme object looks like this :point_down:
105105}
106106```
107107
108- There are two way to update theme.
109- 1\. Options when init VueNotification
108+ ** Examples : There are two ways to update theme.**
109+
110+ 1 . Options when init VueNotification
110111
111112``` javascript
112113import VueNotification from ' @mathieustan/vue-notification' ;
113- Vue .use (VueNotification);
114-
115114Vue .use (VueNotification, {
116115 theme: {
116+ // darken colors are used for background on icon
117117 colors: {
118118 success: ' #54d861' ,
119119 darkenSuccess: ' #2d8e36' ,
@@ -134,22 +134,31 @@ Vue.use(VueNotification, {
1341342 . Theme properties when calling $notify
135135
136136``` javascript
137- this .$notify ({
138- message: ' Hello Wolrd' ,
139- theme: {
140- colors: {
141- success: ' #54d861' ,
142- darkenSuccess: ' #2d8e36' ,
143- info: ' #5d6a89' ,
144- darkenInfo: ' #535f7b' ,
145- warning: ' #f8a623' ,
146- darkenWarning: ' #f69a07' ,
147- error: ' #ff4577' ,
148- darkenError: ' #ff245f' ,
149- offline: ' #ff4577' ,
150- darkenOffline: ' #ff245f' ,
137+ < script>
138+ export default {
139+ // ...
140+ methods: {
141+ showNotification () {
142+ this .$notify ({
143+ message: ' Hello Wolrd' ,
144+ theme: {
145+ colors: {
146+ success: ' #54d861' ,
147+ darkenSuccess: ' #2d8e36' ,
148+ info: ' #5d6a89' ,
149+ darkenInfo: ' #535f7b' ,
150+ warning: ' #f8a623' ,
151+ darkenWarning: ' #f69a07' ,
152+ error: ' #ff4577' ,
153+ darkenError: ' #ff245f' ,
154+ offline: ' #ff4577' ,
155+ darkenOffline: ' #ff245f' ,
156+ },
157+ boxShadow: ' 10px 5px 5px red' ,
158+ },
159+ });
151160 },
152- boxShadow: ' 10px 5px 5px red' ,
153161 },
154- });
162+ // ...
163+ };
155164```
0 commit comments