Skip to content

Commit 78199d4

Browse files
committed
Include usage in readme
1 parent 9ba1a87 commit 78199d4

File tree

1 file changed

+79
-0
lines changed

1 file changed

+79
-0
lines changed

readme.md

Lines changed: 79 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,82 @@
11
# SimpleToast
22

33
Small (but powerful) toast library.
4+
5+
## Usage
6+
7+
Text (required):
8+
9+
```javascript
10+
SimpleToast('Text');
11+
SimpleToast({text: 'Text'});
12+
```
13+
14+
Title with text:
15+
16+
```javascript
17+
SimpleToast({title: 'Title', text: 'Text'});
18+
```
19+
20+
### CSS
21+
22+
Targets:
23+
24+
* css (or) css.toast: Applies to toast
25+
* css.title: Applies to title
26+
* css.button: Applies to buttons
27+
28+
```javascript
29+
// Apply a red-ish background
30+
SimpleToast({text: 'Text', css: {background: '#c8354e'}});
31+
32+
SimpleToast({
33+
css: {
34+
// Applies to toast (unless toast is present)
35+
toast: {
36+
// Applies to toast
37+
},
38+
title: {
39+
// Applies to title
40+
},
41+
button: {
42+
// Applies to buttons
43+
mouseOver: {
44+
// Applies to buttons when moused over
45+
}
46+
},
47+
},
48+
});
49+
```
50+
51+
### Buttons
52+
53+
You can provide a single button within an object, or an array of buttons.
54+
55+
```javascript
56+
// Single button
57+
SimpleToast({
58+
buttons: {
59+
text: 'Text', // Required
60+
onclick: () => {
61+
// Runs on click
62+
},
63+
css: {
64+
// Applies to button
65+
mouseOver: {
66+
// Applies to button when moused over
67+
},
68+
},
69+
},
70+
});
71+
// Multiple Buttons
72+
SimpleToast({
73+
buttons: [
74+
{
75+
// Button data goes here
76+
},
77+
{
78+
// Button data goes here
79+
},
80+
],
81+
});
82+
```

0 commit comments

Comments
 (0)