Skip to content

Commit 512ba0d

Browse files
committed
Added travis confid and prettier to the project
1 parent e7218a2 commit 512ba0d

10 files changed

+445
-403
lines changed

.prettierrc

+9
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
{
2+
"useTabs": false,
3+
"printWidth": 80,
4+
"tabWidth": 2,
5+
"singleQuote": false,
6+
"trailingComma": "es5",
7+
"parser": "babylon",
8+
"noSemi": false
9+
}

.travis.yml

+4
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
deploy:
2+
skip_cleanup: true
3+
on:
4+
branch: production

CHANGELOG.md

+29-15
Original file line numberDiff line numberDiff line change
@@ -1,35 +1,49 @@
11
# Changelog
2+
23
All the changes made to toastify-js library.
34

5+
## [1.2.1] - 2018-05-31
6+
7+
* Added support for Classes. Now custom classes can be added to the toast while creating it.
8+
49
## [1.2.0] - 2018-03-05
5-
- Fix issue when `destination` and `close` options is used at the same time
10+
11+
* Fix issue when `destination` and `close` options is used at the same time
612

713
## [1.1.0] - 2018-02-18
8-
- Browser support extended to IE10+ without any polyfills
14+
15+
* Browser support extended to IE10+ without any polyfills
916

1017
## [1.0.0] - 2018-02-17
11-
- Support for modules
18+
19+
* Support for modules
1220

1321
## [0.0.6] - 2017-09-09
14-
- Support for changing background [Options]
15-
- Optimized toast positioning logic
16-
- Added changelog for library update tracking
22+
23+
* Support for changing background [Options]
24+
* Optimized toast positioning logic
25+
* Added changelog for library update tracking
1726

1827
## [0.0.5] - 2017-09-06
19-
- Support for toast messages on mobile screens
20-
- Tweaked close icon
28+
29+
* Support for toast messages on mobile screens
30+
* Tweaked close icon
2131

2232
## [0.0.4] - 2017-09-05
23-
- Support for positioning of toasts on the page
33+
34+
* Support for positioning of toasts on the page
2435

2536
## [0.0.3] - 2017-09-05
26-
- Close buton for toasts [Options]
37+
38+
* Close buton for toasts [Options]
2739

2840
## [0.0.2] - 2017-09-04
29-
- Option to add on-click link for toasts
30-
- Updated comments for code readability
41+
42+
* Option to add on-click link for toasts
43+
* Updated comments for code readability
3144

3245
## [0.0.1] - 2017-09-02
33-
- Initial Release
34-
- Added Preview page
35-
- Optimized function structure
46+
47+
* Initial Release
48+
* Added Preview page
49+
* Optimized function structure

README.md

+50-28
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
![forthebadge](https://forthebadge.com/images/badges/made-with-javascript.svg)
44
![forthebadge](https://forthebadge.com/images/badges/built-with-love.svg)
55

6-
[![toastify-js](https://img.shields.io/badge/toastify--js-1.2.0-brightgreen.svg)](https://www.npmjs.com/package/toastify-js)
6+
[![toastify-js](https://img.shields.io/badge/toastify--js-1.2.2-brightgreen.svg)](https://www.npmjs.com/package/toastify-js)
77

88
Toastify is a lightweight, vanilla JS toast notification library.
99

@@ -13,32 +13,36 @@ Toastify is a lightweight, vanilla JS toast notification library.
1313

1414
## Features
1515

16-
- Multiple stacked notifications
17-
- Customizable
18-
- No blocking of execution thread
16+
* Multiple stacked notifications
17+
* Customizable
18+
* No blocking of execution thread
1919

2020
### Customization options
2121

22-
- Notification Text
23-
- Duration
24-
- Toast background color
25-
- Close icon display
26-
- Display position
22+
* Notification Text
23+
* Duration
24+
* Toast background color
25+
* Close icon display
26+
* Display position
2727

2828
## Installation
2929

3030
#### Toastify now supports installation via NPM
3131

32-
- Run the below command to add toastify-js to your exisitng or new project.
32+
* Run the below command to add toastify-js to your exisitng or new project.
33+
3334
```
3435
npm install --save toastify-js
3536
```
37+
3638
or
39+
3740
```
3841
yarn add toastify-js -S
3942
```
4043

41-
- Import toastify-js into your module to start using it.
44+
* Import toastify-js into your module to start using it.
45+
4246
```
4347
import Toastify from 'toastify-js'
4448
```
@@ -56,47 +60,65 @@ And the script at the bottom of the page
5660
```html
5761
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/toastify-js"></script>
5862
```
63+
5964
> Files are delivered via the CDN service provided by [jsdeliver](https://www.jsdelivr.com/)
6065
6166
## Documentation
6267

6368
```javascript
6469
Toastify({
65-
text: "This is a toast",
66-
duration: 3000,
67-
destination: 'https://github.com/apvarun/toastify-js',
68-
newWindow: true,
69-
close: true,
70-
gravity: "top", // `top` or `bottom`
71-
positionLeft: true, // `true` or `false`
72-
   backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)"
70+
text: "This is a toast",
71+
duration: 3000,
72+
destination: "https://github.com/apvarun/toastify-js",
73+
newWindow: true,
74+
close: true,
75+
gravity: "top", // `top` or `bottom`
76+
positionLeft: true, // `true` or `false`
77+
backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
7378
}).showToast();
7479
```
7580

7681
> Toast messages will be centered on devices with screen width less than 360px.
7782
78-
+ See the [changelog](https://github.com/apvarun/toastify-js/blob/master/CHANGELOG.md)
83+
* See the [changelog](https://github.com/apvarun/toastify-js/blob/master/CHANGELOG.md)
7984

8085
### Add own custom classes
8186

82-
If you want to use custom classes (like info or warning for example) you can do that via
87+
If you want to use custom classes on the toast for customizing (like info or warning for example), you can do that as follows:
8388

8489
```javascript
8590
Toastify({
86-
text: "This is a toast",
87-
   backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
88-
classes: "info"
91+
text: "This is a toast",
92+
backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
93+
classes: "info",
8994
}).showToast();
90-
9195
```
9296

97+
Multiple classes also can be assigned as a string, with spaces between class names.
9398

9499
## Browsers support
95100

96-
| [<img src="https://raw.githubusercontent.com/godban/browsers-support-badges/master/src/images/edge.png" alt="IE / Edge" width="16px" height="16px" />](http://godban.github.io/browsers-support-badges/)<br />IE / Edge | [<img src="https://raw.githubusercontent.com/godban/browsers-support-badges/master/src/images/firefox.png" alt="Firefox" width="16px" height="16px" />](http://godban.github.io/browsers-support-badges/)<br />Firefox | [<img src="https://raw.githubusercontent.com/godban/browsers-support-badges/master/src/images/chrome.png" alt="Chrome" width="16px" height="16px" />](http://godban.github.io/browsers-support-badges/)<br />Chrome | [<img src="https://raw.githubusercontent.com/godban/browsers-support-badges/master/src/images/safari.png" alt="Safari" width="16px" height="16px" />](http://godban.github.io/browsers-support-badges/)<br />Safari | [<img src="https://raw.githubusercontent.com/godban/browsers-support-badges/master/src/images/opera.png" alt="Opera" width="16px" height="16px" />](http://godban.github.io/browsers-support-badges/)<br />Opera |
97-
| --------- | --------- | --------- | --------- | --------- |
98-
| IE10, IE11, Edge| last 10 versions| last 10 versions| last 10 versions| last 10 versions
101+
| ![][ie]<br />IE / Edge | ![][firefox]<br />Firefox | ![][chrome]<br />Chrome | ![][safari]<br />Safari | ![][opera]<br />Opera |
102+
| ---------------------- | ------------------------- | ----------------------- | ----------------------- | --------------------- |
103+
| IE10, IE11, Edge | last 10 versions | last 10 versions | last 10 versions | last 10 versions |
104+
105+
## Contributors
106+
107+
<!-- ALL-CONTRIBUTORS-LIST:START - Do not remove or modify this section -->
108+
109+
<!-- prettier-ignore -->
110+
| [![rndevfx](https://avatars2.githubusercontent.com/u/5052076?v=3&s=80)](https://github.com/rndevfx) | [![Wachiwi](https://avatars1.githubusercontent.com/u/4199845?v=3&s=80)](https://github.com/Wachiwi) |
111+
| :--:|:--: |
112+
| [rndevfx](https://github.com/rndevfx) | [Wachiwi](https://github.com/Wachiwi) |
113+
114+
<!-- ALL-CONTRIBUTORS-LIST:END -->
99115

100116
## License
101117

102118
MIT © [Varun A P](https://github.com/apvarun)
119+
120+
[ie]: https://raw.githubusercontent.com/godban/browsers-support-badges/master/src/images/edge.png
121+
[firefox]: https://raw.githubusercontent.com/godban/browsers-support-badges/master/src/images/firefox.png
122+
[chrome]: https://raw.githubusercontent.com/godban/browsers-support-badges/master/src/images/chrome.png
123+
[safari]: https://raw.githubusercontent.com/godban/browsers-support-badges/master/src/images/safari.png
124+
[opera]: https://raw.githubusercontent.com/godban/browsers-support-badges/master/src/images/opera.png

example/script.css

+23-12
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,19 @@
11
* {
22
box-sizing: border-box;
33
}
4-
html,
5-
body {
4+
5+
html, body {
66
height: 100%;
77
}
8+
89
body {
910
font-family: Helvetica, Arial, sans-serif;
1011
background-size: 100%;
1112
margin: 0;
1213
padding: 0;
1314
color: #424242;
1415
}
16+
1517
.container {
1618
overflow: hidden;
1719
display: flex;
@@ -22,10 +24,12 @@ body {
2224
background-color: whitesmoke;
2325
background-image: url("./pattern.png");
2426
}
25-
.hidden{
27+
28+
.hidden {
2629
display: none;
2730
}
28-
.docs{
31+
32+
.docs {
2933
display: flex;
3034
justify-content: center;
3135
flex-direction: column;
@@ -36,22 +40,27 @@ body {
3640
width: 60%;
3741
border-radius: 4px;
3842
}
39-
.docs h2{
43+
44+
.docs h2 {
4045
margin-top: 0px;
4146
}
42-
code p{
47+
48+
code p {
4349
margin: 2px;
4450
}
45-
.pad-left{
51+
52+
.pad-left {
4653
padding-left: 20px;
4754
}
48-
.buttons{
55+
56+
.buttons {
4957
margin: 20px;
5058
display: flex;
5159
flex-wrap: wrap;
5260
justify-content: center;
5361
}
54-
.button{
62+
63+
.button {
5564
overflow: hidden;
5665
margin: 10px;
5766
padding: 12px 12px;
@@ -74,11 +83,13 @@ code p{
7483
background-color: Snow;
7584
border: 1px solid #5477f5;
7685
}
77-
.button:hover{
86+
87+
.button:hover {
7888
color: #FFFFFF;
7989
background: linear-gradient(135deg, #73a5ff, #5477f5);
8090
border: 1px solid transparent;
8191
}
82-
.repo{
92+
93+
.repo {
8394
margin: 10px;
84-
}
95+
}

0 commit comments

Comments
 (0)