wrgem 0.0.43 → 0.0.44

Sign up to get free protection for your applications and to get access to all the features.
Files changed (41) hide show
  1. checksums.yaml +4 -4
  2. data/lib/generators/wradmin/template/carrierwave.rb +15 -0
  3. data/lib/generators/wradmin/template/migrate/20140715192304_create_user.rb +5 -3
  4. data/lib/generators/wradmin/template/public/images/spritemap.png +0 -0
  5. data/lib/generators/wradmin/template/public/images/spritemap@2x.png +0 -0
  6. data/lib/generators/wradmin/template/views/layouts/admin.html.slim +1 -1
  7. data/lib/generators/wradmin/wradmin_generator.rb +3 -0
  8. data/lib/generators/wrstart/template/index.html.slim +1 -1
  9. data/lib/generators/wrstart/template/javascripts/requirements.js.coffee +5 -0
  10. data/lib/generators/wrstart/template/shared/_head.slim +1 -1
  11. data/lib/generators/wrstart/template/stylesheets/_requirements.sass +6 -0
  12. data/lib/generators/wrstart/template/vendor/assets/components/sweetalert/.bower.json +32 -0
  13. data/lib/generators/wrstart/template/vendor/assets/components/sweetalert/.editorconfig +11 -0
  14. data/lib/generators/wrstart/template/vendor/assets/components/sweetalert/.gitignore +5 -0
  15. data/lib/generators/wrstart/template/vendor/assets/components/sweetalert/LICENSE +22 -0
  16. data/lib/generators/wrstart/template/vendor/assets/components/sweetalert/README.md +94 -0
  17. data/lib/generators/wrstart/template/vendor/assets/components/sweetalert/bower.json +18 -0
  18. data/lib/generators/wrstart/template/vendor/assets/components/sweetalert/example/example.css +322 -0
  19. data/lib/generators/wrstart/template/vendor/assets/components/sweetalert/example/example.scss +412 -0
  20. data/lib/generators/wrstart/template/vendor/assets/components/sweetalert/example/images/logo_big.png +0 -0
  21. data/lib/generators/wrstart/template/vendor/assets/components/sweetalert/example/images/logo_big@2x.png +0 -0
  22. data/lib/generators/wrstart/template/vendor/assets/components/sweetalert/example/images/logo_small.png +0 -0
  23. data/lib/generators/wrstart/template/vendor/assets/components/sweetalert/example/images/logo_small@2x.png +0 -0
  24. data/lib/generators/wrstart/template/vendor/assets/components/sweetalert/example/images/te-logo-small.svg +12 -0
  25. data/lib/generators/wrstart/template/vendor/assets/components/sweetalert/example/images/thumbs-up.jpg +0 -0
  26. data/lib/generators/wrstart/template/vendor/assets/components/sweetalert/example/images/vs_icon.png +0 -0
  27. data/lib/generators/wrstart/template/vendor/assets/components/sweetalert/example/images/vs_icon@2x.png +0 -0
  28. data/lib/generators/wrstart/template/vendor/assets/components/sweetalert/example/index.html +433 -0
  29. data/lib/generators/wrstart/template/vendor/assets/components/sweetalert/gulpfile.js +48 -0
  30. data/lib/generators/wrstart/template/vendor/assets/components/sweetalert/lib/ie9.css +23 -0
  31. data/lib/generators/wrstart/template/vendor/assets/components/sweetalert/lib/sweet-alert.css +1 -0
  32. data/lib/generators/wrstart/template/vendor/assets/components/sweetalert/lib/sweet-alert.html +37 -0
  33. data/lib/generators/wrstart/template/vendor/assets/components/sweetalert/lib/sweet-alert.js +818 -0
  34. data/lib/generators/wrstart/template/vendor/assets/components/sweetalert/lib/sweet-alert.min.js +1 -0
  35. data/lib/generators/wrstart/template/vendor/assets/components/sweetalert/lib/sweet-alert.scss +444 -0
  36. data/lib/generators/wrstart/template/vendor/assets/components/sweetalert/package.json +37 -0
  37. data/lib/generators/wrstart/template/vendor/assets/components/sweetalert/sweetalert.gif +0 -0
  38. data/lib/generators/wrstart/wrstart_generator.rb +2 -0
  39. data/lib/wrgem/version.rb +1 -1
  40. data/wrgem.gemspec +2 -2
  41. metadata +39 -12
@@ -0,0 +1,433 @@
1
+ <!doctype html>
2
+
3
+ <html>
4
+
5
+ <head>
6
+ <meta charset="utf-8">
7
+ <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0" />
8
+ <title>SweetAlert</title>
9
+
10
+ <link rel="stylesheet" href="./example.css">
11
+
12
+ <!-- This is what you need -->
13
+ <script src="../lib/sweet-alert.min.js"></script>
14
+ <link rel="stylesheet" href="../lib/sweet-alert.css">
15
+ <!--.......................-->
16
+
17
+ </head>
18
+
19
+ <body>
20
+
21
+ <h1>Sweet Alert</h1>
22
+ <h2>A beautiful replacement for Javascript's "Alert"</h2>
23
+ <button class="download">Download</button>
24
+
25
+ <!-- What does it do? -->
26
+ <h3>So... What does it do?</h3>
27
+ <p>Here’s a comparison of a standard error message. The first one uses the built-in <strong>alert</strong>-function, while the second is using <strong>sweetAlert</strong>.</p>
28
+
29
+ <div class="showcase normal">
30
+ <h4>Normal alert</h4>
31
+ <button>Show error message</button>
32
+
33
+ <h5>Code:</h5>
34
+ <pre><span class="func">alert</span>(<span class="str">"Oops... Something went wrong!"</span>);
35
+
36
+ </pre>
37
+
38
+ <div class="vs-icon"></div>
39
+ </div>
40
+
41
+ <div class="showcase sweet">
42
+ <h4>Sweet Alert</h4>
43
+ <button>Show error message</button>
44
+
45
+ <h5>Code:</h5>
46
+ <pre>sweetAlert(<span class="str">"Oops..."</span>, <span class="str">"Something went wrong!"</span>, <span class="str">"error"</span>);</pre>
47
+ </div>
48
+
49
+ <p>Pretty cool huh? SweetAlert automatically centers itself on the page and looks great no matter if you're using a desktop computer, mobile or tablet. It's even highly customizeable, as you can see below!</p>
50
+
51
+
52
+ <!-- Examples -->
53
+ <h3>More examples</h3>
54
+
55
+ <p class="center">In these examples, we're using the shorthand function <strong>swal</strong> to call sweetAlert.</p>
56
+
57
+ <ul class="examples">
58
+
59
+ <li class="message">
60
+ <div class="ui">
61
+ <p>A basic message</p>
62
+ <button>Try me!</button>
63
+ </div>
64
+ <pre>swal(<span class="str">"Here's a message!"</span>)</pre>
65
+ </li>
66
+
67
+ <li class="title-text">
68
+ <div class="ui">
69
+ <p>A title with a text under</p>
70
+ <button>Try me!</button>
71
+ </div>
72
+ <pre>swal(<span class="str">"Here's a message!"</span>, <span class="str">"It's pretty, isn't it?"</span>)</pre>
73
+ </li>
74
+
75
+ <li class="success">
76
+ <div class="ui">
77
+ <p>A success message!</p>
78
+ <button>Try me!</button>
79
+ </div>
80
+ <pre>swal(<span class="str">"Good job!"</span>, <span class="str">"You clicked the button!"</span>, <span class="str">"success"</span>)</pre>
81
+ </li>
82
+
83
+ <li class="timer">
84
+ <div class="ui">
85
+ <p>A message with auto close timer</p>
86
+ <button>Try me!</button>
87
+ </div>
88
+ <pre>swal({
89
+ &nbsp;&nbsp;title: <span class="str">"Auto close alert!"</span>,
90
+ &nbsp;&nbsp;text: <span class="str">"I will close in 2 seconds."</span>,
91
+ &nbsp;&nbsp;timer: <span class="str">2000</span>
92
+ });</pre>
93
+ </li>
94
+
95
+ <li class="warning confirm">
96
+ <div class="ui">
97
+ <p>A warning message, with a function attached to the "Confirm"-button...</p>
98
+ <button>Try me!</button>
99
+ </div>
100
+ <pre>swal({
101
+ &nbsp;&nbsp;title: <span class="str">"Are you sure?"</span>,
102
+ &nbsp;&nbsp;text: <span class="str">"You will not be able to recover this imaginary file!"</span>,
103
+ &nbsp;&nbsp;type: <span class="str">"warning"</span>,
104
+ &nbsp;&nbsp;showCancelButton: <span class="val">true</span>,
105
+ &nbsp;&nbsp;confirmButtonColor: <span class="str">"#DD6B55"</span>,
106
+ &nbsp;&nbsp;confirmButtonText: <span class="str">"Yes, delete it!"</span>,
107
+ &nbsp;&nbsp;closeOnConfirm: <span class="val">false</span>
108
+ },
109
+ <span class="func"><i>function</i></span>(){
110
+ &nbsp;&nbsp;<span class="func">swal</span>(<span class="str">"Deleted!"</span>, <span class="str">"Your imaginary file has been deleted."</span>, <span class="str">"success"</span>);
111
+ });</pre>
112
+ </li>
113
+
114
+ <li class="warning cancel">
115
+ <div class="ui">
116
+ <p>... and by passing a parameter, you can execute something else for "Cancel".</p>
117
+ <button>Try me!</button>
118
+ </div>
119
+ <pre>swal({
120
+ &nbsp;&nbsp;title: <span class="str">"Are you sure?"</span>,
121
+ &nbsp;&nbsp;text: <span class="str">"You will not be able to recover this imaginary file!"</span>,
122
+ &nbsp;&nbsp;type: <span class="str">"warning"</span>,
123
+ &nbsp;&nbsp;showCancelButton: <span class="val">true</span>,
124
+ &nbsp;&nbsp;confirmButtonColor: <span class="str">"#DD6B55"</span>,
125
+ &nbsp;&nbsp;confirmButtonText: <span class="str">"Yes, delete it!"</span>,
126
+ &nbsp;&nbsp;cancelButtonText: <span class="str">"No, cancel plx!"</span>,
127
+ &nbsp;&nbsp;closeOnConfirm: <span class="val">false</span>,
128
+ &nbsp;&nbsp;closeOnCancel: <span class="val">false</span>
129
+ },
130
+ <span class="func"><i>function</i></span>(isConfirm){
131
+ &nbsp;&nbsp;<span class="tag">if</span> (isConfirm) {
132
+ &nbsp;&nbsp;&nbsp;&nbsp;<span class="func">swal</span>(<span class="str">"Deleted!"</span>, <span class="str">"Your imaginary file has been deleted."</span>, <span class="str">"success"</span>);
133
+ &nbsp;&nbsp;} <span class="tag">else</span> {
134
+ &nbsp;&nbsp;&nbsp;&nbsp;<span class="func">swal</span>(<span class="str">"Cancelled"</span>, <span class="str">"Your imaginary file is safe :)"</span>, <span class="str">"error"</span>);
135
+ &nbsp;&nbsp;}
136
+ });</pre>
137
+ </li>
138
+
139
+ <li class="custom-icon">
140
+ <div class="ui">
141
+ <p>A message with a custom icon</p>
142
+ <button>Try me!</button>
143
+ </div>
144
+ <pre>swal({
145
+ &nbsp;&nbsp;title: <span class="str">"Sweet!"</span>,
146
+ &nbsp;&nbsp;text: <span class="str">"Here's a custom image."</span>,
147
+ &nbsp;&nbsp;imageUrl: <span class="str">"images/thumbs-up.jpg"</span>
148
+ });</pre>
149
+ </li>
150
+
151
+ <li class="message-html">
152
+ <div class="ui">
153
+ <p>An HTML message</p>
154
+ <button>Try me!</button>
155
+ </div>
156
+ <pre>swal({
157
+ &nbsp;&nbsp;title: <span class="str">"HTML &lt;small&gt;Title&lt;/small&gt;!"</span>,
158
+ &nbsp;&nbsp;text: <span class="str">"A custom &lt;span style="color:#F8BB86"&gt;html&lt;span&gt; message."</span>,
159
+ &nbsp;&nbsp;html: <span class="str">true</span>
160
+ });</pre>
161
+ </li>
162
+
163
+ </ul>
164
+
165
+
166
+ <!-- Download & Install -->
167
+ <h3 id="download-section">Download & install</h3>
168
+
169
+ <div class="center-container">
170
+ <p class="center"><b>Method 1:</b> Install through bower:</p>
171
+ <pre class="center">$ bower install sweetalert</pre>
172
+ </div>
173
+
174
+ <p class="center"><b>Method 2:</b> Download the sweetAlert <strong>CSS</strong> and <strong>JavaScript</strong> files.</p>
175
+
176
+ <a class="button" href="https://github.com/t4t5/sweetalert/archive/master.zip" download>Download files</a>
177
+
178
+ <ol>
179
+ <li>
180
+ <p>Initialize the plugin by referencing the necessary files:</p>
181
+ <pre>&lt;<span class="tag">script</span> <span class="attr">src</span>=<span class="str">"lib/sweet-alert.min.js"</span>&gt;&lt;/<span class="tag">script</span>&gt;
182
+ &lt;<span class="tag">link</span> <span class="attr">rel</span>=<span class="str">"stylesheet"</span> <span class="tag">type</span>=<span class="str">"text/css"</span> <span class="tag">href</span>=<span class="str">"lib/sweet-alert.css"</span>&gt;</pre>
183
+ </li>
184
+
185
+ <li>
186
+ <p>Call the sweetAlert-function after the page has loaded</p>
187
+ <pre>swal({
188
+ &nbsp;&nbsp;title: <span class="str">"Error!"</span>,
189
+ &nbsp;&nbsp;text: <span class="str">"Here's my error message!"</span>,
190
+ &nbsp;&nbsp;type: <span class="str">"error"</span>,
191
+ &nbsp;&nbsp;confirmButtonText: <span class="str">"Cool"</span>
192
+ });
193
+ </pre>
194
+ </li>
195
+ </ol>
196
+
197
+
198
+
199
+ <!-- Configuration -->
200
+ <h3>Configuration</h3>
201
+
202
+ <p class="center">Here are the keys that you can use if you pass an object into sweetAlert:</p>
203
+
204
+ <table>
205
+ <tr class="titles">
206
+ <th>
207
+ <div class="border-left"></div>
208
+ Argument
209
+ </th>
210
+ <th>Default value</th>
211
+ <th>
212
+ <div class="border-right"></div>
213
+ Description
214
+ </th>
215
+ </tr>
216
+ <tr>
217
+ <td><b>title</b></td>
218
+ <td><i>null (required)</i></td>
219
+ <td>The title of the modal. It can either be added to the object under the key "title" or passed as the first parameter of the function.</td>
220
+ </tr>
221
+ <tr>
222
+ <td><b>text</b></td>
223
+ <td><i>null</i></td>
224
+ <td>A description for the modal. It can either be added to the object under the key "text" or passed as the second parameter of the function.</td>
225
+ </tr>
226
+ <tr>
227
+ <td><b>type</b></td>
228
+ <td><i>null</i></td>
229
+ <td>The type of the modal. SweetAlert comes with 4 built-in types which will show a corresponding icon animation: "<strong>warning</strong>", "<strong>error</strong>", "<strong>success</strong>" and "<strong>info"</strong>. It can either be put in the array under the key "type" or passed as the third parameter of the function.</td>
230
+ </tr>
231
+ <tr>
232
+ <td><b>allowEscapeKey</b></td>
233
+ <td><i>true</i></td>
234
+ <td>If set to <strong>true</strong>, the user can dismiss the modal by pressing the Escape key.</td>
235
+ </tr>
236
+ <tr>
237
+ <td><b>customClass</b></td>
238
+ <td><i>null</i></td>
239
+ <td>A custom CSS class for the modal. It can be added to the object under the key "customClass".</td>
240
+ </tr>
241
+ <tr>
242
+ <td><b>allowOutsideClick</b></td>
243
+ <td><i>false</i></td>
244
+ <td>If set to <strong>true</strong>, the user can dismiss the modal by clicking outside it.</td>
245
+ </tr>
246
+ <tr>
247
+ <td><b>showCancelButton</b></td>
248
+ <td><i>false</i></td>
249
+ <td>If set to <strong>true</strong>, a "Cancel"-button will be shown, which the user can click on to dismiss the modal.</td>
250
+ </tr>
251
+ <tr>
252
+ <td><b>confirmButtonText</b></td>
253
+ <td><i>"OK"</i></td>
254
+ <td>Use this to change the text on the "Confirm"-button. If showCancelButton is set as true, the confirm button will automatically show "Confirm" instead of "OK".</td>
255
+ </tr>
256
+ <tr>
257
+ <td><b>confirmButtonColor</b></td>
258
+ <td><i>"#AEDEF4"</i></td>
259
+ <td>Use this to change the background color of the "Confirm"-button (must be a HEX value).</td>
260
+ </tr>
261
+ <tr>
262
+ <td><b>cancelButtonText</b></td>
263
+ <td><i>"Cancel"</i></td>
264
+ <td>Use this to change the text on the "Cancel"-button.</td>
265
+ </tr>
266
+ <tr>
267
+ <td><b>closeOnConfirm</b></td>
268
+ <td><i>true</i></td>
269
+ <td>Set to <i>false</i> if you want the modal to stay open even if the user presses the "Confirm"-button. This is especially useful if the function attached to the "Confirm"-button is another SweetAlert.</td>
270
+ </tr>
271
+ <tr>
272
+ <td><b>imageUrl</b></td>
273
+ <td><i>null</i></td>
274
+ <td>Add a customized icon for the modal. Should contain a string with the path to the image.</td>
275
+ </tr>
276
+ <tr>
277
+ <td><b>imageSize</b></td>
278
+ <td><i>"80x80"</i></td>
279
+ <td>If imageUrl is set, you can specify imageSize to describes how big you want the icon to be in px. Pass in a string with two values separated by an "x". The first value is the width, the second is the height.</td>
280
+ </tr>
281
+ <tr>
282
+ <td><b>timer</b></td>
283
+ <td><i>null</i></td>
284
+ <td>Auto close timer of the modal. Set in ms (milliseconds).</td>
285
+ </tr>
286
+ <tr>
287
+ <td><b>html</b></td>
288
+ <td><i>false</i></td>
289
+ <td>If set to true, will not escape title and text parameters. (Set to false if you're worried about XSS attacks.)</td>
290
+ </tr>
291
+ <tr>
292
+ <td><b>animation</b></td>
293
+ <td><i>true</i></td>
294
+ <td>If set to <strong>false</strong>, the modal's animation will be disabled.</td>
295
+ </tr>
296
+ </table>
297
+
298
+
299
+ <!-- Methods -->
300
+ <h3>Methods</h3>
301
+
302
+ <p class="center">SweetAlert also comes with some simple methods that you can call:</p>
303
+
304
+ <table>
305
+ <tr class="titles">
306
+ <th>
307
+ <div class="border-left"></div>
308
+ Function
309
+ </th>
310
+ <th>Example</th>
311
+ <th>
312
+ <div class="border-right"></div>
313
+ Description
314
+ </th>
315
+ </tr>
316
+ <tr>
317
+ <td>setDefaults</td>
318
+ <td><i>swal.setDefaults({ confirmButtonColor: '#0000' });</i></td>
319
+ <td>If you end up using a lot of the same settings when calling SweetAlert, you can use setDefaults at the start of your program to set them once and for all!</td>
320
+ </tr>
321
+ <tr>
322
+ <td>close</td>
323
+ <td><i>swal.close();</i></td>
324
+ <td>Close the currently open SweetAlert programatically.</td>
325
+ </tr>
326
+ </table>
327
+
328
+
329
+
330
+ <!-- Contribute -->
331
+ <h3>Contribute</h3>
332
+ <p>SweetAlert was created by <a href="http://tristanedwards.me" target="_blank">Tristan Edwards</a>, you can follow him on <a href="https://twitter.com/t4t5" target="_blank" class="twitter">Twitter</a> or <a href="https://dribbble.com/tristanedwards" target="_blank" class="dribbble">Dribbble</a> for updates and other cool projects!</p>
333
+ <p>Feel free to fork sweetAlert on <a href="https://github.com/t4t5/sweetalert" class="github">GitHub</a> if you have any features that you want to add!</p>
334
+
335
+
336
+ <footer>
337
+ <span class="te-logo">TE</span> • <script>document.write(new Date().getFullYear())</script>
338
+ </footer>
339
+
340
+
341
+ <script>
342
+
343
+ document.querySelector('button.download').onclick = function(){
344
+ $("html, body").animate({ scrollTop: $("#download-section").offset().top }, 1000);
345
+ };
346
+
347
+ document.querySelector('.showcase.normal button').onclick = function(){
348
+ alert("Oops... Something went wrong!");
349
+ };
350
+
351
+ document.querySelector('.showcase.sweet button').onclick = function(){
352
+ swal("Oops...", "Something went wrong!", "error");
353
+ };
354
+
355
+ document.querySelector('ul.examples li.message button').onclick = function(){
356
+ swal("Here's a message!");
357
+ };
358
+
359
+ document.querySelector('ul.examples li.timer button').onclick = function(){
360
+ swal({
361
+ title: "Auto close alert!",
362
+ text: "I will close in 2 seconds.",
363
+ timer: 2000
364
+ });
365
+ };
366
+
367
+ document.querySelector('ul.examples li.title-text button').onclick = function(){
368
+ swal("Here's a message!", "It's pretty, isn't it?");
369
+ };
370
+
371
+ document.querySelector('ul.examples li.success button').onclick = function(){
372
+ swal("Good job!", "You clicked the button!", "success");
373
+ };
374
+
375
+ document.querySelector('ul.examples li.warning.confirm button').onclick = function(){
376
+ swal({
377
+ title: "Are you sure?",
378
+ text: "You will not be able to recover this imaginary file!",
379
+ type: "warning",
380
+ showCancelButton: true,
381
+ confirmButtonColor: '#DD6B55',
382
+ confirmButtonText: 'Yes, delete it!',
383
+ closeOnConfirm: false
384
+ },
385
+ function(){
386
+ swal("Deleted!", "Your imaginary file has been deleted!", "success");
387
+ });
388
+ };
389
+
390
+ document.querySelector('ul.examples li.warning.cancel button').onclick = function(){
391
+ swal({
392
+ title: "Are you sure?",
393
+ text: "You will not be able to recover this imaginary file!",
394
+ type: "warning",
395
+ showCancelButton: true,
396
+ confirmButtonColor: '#DD6B55',
397
+ confirmButtonText: 'Yes, delete it!',
398
+ cancelButtonText: "No, cancel plx!",
399
+ closeOnConfirm: false,
400
+ closeOnCancel: false
401
+ },
402
+ function(isConfirm){
403
+ if (isConfirm){
404
+ swal("Deleted!", "Your imaginary file has been deleted!", "success");
405
+ } else {
406
+ swal("Cancelled", "Your imaginary file is safe :)", "error");
407
+ }
408
+ });
409
+ };
410
+
411
+ document.querySelector('ul.examples li.custom-icon button').onclick = function(){
412
+ swal({
413
+ title: "Sweet!",
414
+ text: "Here's a custom image.",
415
+ imageUrl: 'images/thumbs-up.jpg'
416
+ });
417
+ };
418
+
419
+ document.querySelector('ul.examples li.message-html button').onclick = function(){
420
+ swal({
421
+ title: "HTML <small>Title</small>!",
422
+ text: 'A custom <span style="color:#F8BB86">html<span> message.',
423
+ html: true
424
+ });
425
+ };
426
+
427
+ </script>
428
+
429
+
430
+
431
+ </body>
432
+
433
+ </html>
@@ -0,0 +1,48 @@
1
+ var gulp = require('gulp');
2
+
3
+ var jshint = require('gulp-jshint');
4
+ var sass = require('gulp-sass');
5
+ var concat = require('gulp-concat');
6
+ var uglify = require('gulp-uglify');
7
+ var rename = require('gulp-rename');
8
+ var minifyCSS = require('gulp-minify-css');
9
+
10
+ // Lint Task
11
+ gulp.task('lint', function() {
12
+ return gulp.src('lib/sweet-alert.js')
13
+ .pipe(jshint())
14
+ .pipe(jshint.reporter('default'));
15
+ });
16
+
17
+ // Compile Our Sass
18
+ gulp.task('sass', function() {
19
+
20
+ gulp.src('example/example.scss')
21
+ .pipe(sass())
22
+ .pipe(rename('example.css'))
23
+ .pipe(gulp.dest('example'));
24
+
25
+ return gulp.src(['lib/sweet-alert.scss', 'lib/ie9.css'])
26
+ .pipe(sass())
27
+ .pipe(concat('sweet-alert.css'))
28
+ .pipe(minifyCSS())
29
+ .pipe(gulp.dest('lib'));
30
+ });
31
+
32
+ // Concatenate & Minify JS
33
+ gulp.task('scripts', function() {
34
+ return gulp.src('lib/sweet-alert.js')
35
+ .pipe(gulp.dest('lib'))
36
+ .pipe(rename('sweet-alert.min.js'))
37
+ .pipe(uglify())
38
+ .pipe(gulp.dest('lib'));
39
+ });
40
+
41
+ // Watch Files For Changes
42
+ gulp.task('watch', function() {
43
+ gulp.watch('lib/*.js', ['lint', 'scripts']);
44
+ gulp.watch(['lib/*.scss', 'lib/*.css'], ['sass']);
45
+ });
46
+
47
+ // Default Task
48
+ gulp.task('default', ['lint', 'sass', 'scripts', 'watch']);
@@ -0,0 +1,23 @@
1
+ /* Internet Explorer 9 has some special quirks that are fixed here */
2
+ /* The icons are not animated. */
3
+ /* This file is automatically merged into sweet-alert.min.js through Gulp */
4
+
5
+ /* Error icon */
6
+ .sweet-alert .icon.error .line.left {
7
+ -ms-transform: rotate(45deg)\9;
8
+ }
9
+ .sweet-alert .icon.error .line.right {
10
+ -ms-transform: rotate(-45deg)\9;
11
+ }
12
+
13
+
14
+ /* Success icon */
15
+ .sweet-alert .icon.success {
16
+ border-color: transparent\9;
17
+ }
18
+ .sweet-alert .icon.success .line.tip {
19
+ -ms-transform: rotate(45deg)\9;
20
+ }
21
+ .sweet-alert .icon.success .line.long {
22
+ -ms-transform: rotate(-45deg)\9;
23
+ }
@@ -0,0 +1 @@
1
+ .sweet-overlay{background-color:#000;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";background-color:rgba(0,0,0,.4);position:fixed;left:0;right:0;top:0;bottom:0;display:none;z-index:10000}.sweet-alert{background-color:#fff;font-family:'Open Sans','Helvetica Neue',Helvetica,Arial,sans-serif;width:478px;padding:17px;border-radius:5px;text-align:center;position:fixed;left:50%;top:50%;margin-left:-256px;margin-top:-200px;overflow:hidden;display:none;z-index:99999}@media all and (max-width:540px){.sweet-alert{width:auto;margin-left:0;margin-right:0;left:15px;right:15px}}.sweet-alert h2{color:#575757;font-size:30px;text-align:center;font-weight:600;text-transform:none;position:relative;margin:25px 0;padding:0;line-height:40px;display:block}.sweet-alert p{color:#797979;font-size:16px;font-weight:300;position:relative;text-align:inherit;float:none;margin:0;padding:0;line-height:normal}.sweet-alert button{background-color:#AEDEF4;color:#fff;border:none;box-shadow:none;font-size:17px;font-weight:500;-webkit-border-radius:4px;border-radius:5px;padding:10px 32px;margin:26px 5px 0;cursor:pointer}.sweet-alert button:focus{outline:0;box-shadow:0 0 2px rgba(128,179,235,.5),inset 0 0 0 1px rgba(0,0,0,.05)}.sweet-alert button:hover{background-color:#a1d9f2}.sweet-alert button:active{background-color:#81ccee}.sweet-alert button.cancel{background-color:#D0D0D0}.sweet-alert button.cancel:hover{background-color:#c8c8c8}.sweet-alert button.cancel:active{background-color:#b6b6b6}.sweet-alert button.cancel:focus{box-shadow:rgba(197,205,211,.8) 0 0 2px,rgba(0,0,0,.0470588) 0 0 0 1px inset!important}.sweet-alert button::-moz-focus-inner{border:0}.sweet-alert[data-has-cancel-button=false] button{box-shadow:none!important}.sweet-alert .icon{width:80px;height:80px;border:4px solid gray;-webkit-border-radius:40px;border-radius:50%;margin:20px auto;padding:0;position:relative;box-sizing:content-box}.sweet-alert .icon.error{border-color:#F27474}.sweet-alert .icon.error .x-mark{position:relative;display:block}.sweet-alert .icon.error .line{position:absolute;height:5px;width:47px;background-color:#F27474;display:block;top:37px;border-radius:2px}.sweet-alert .icon.error .line.left{-webkit-transform:rotate(45deg);transform:rotate(45deg);left:17px}.sweet-alert .icon.error .line.right{-webkit-transform:rotate(-45deg);transform:rotate(-45deg);right:16px}.sweet-alert .icon.warning{border-color:#F8BB86}.sweet-alert .icon.warning .body{position:absolute;width:5px;height:47px;left:50%;top:10px;-webkit-border-radius:2px;border-radius:2px;margin-left:-2px;background-color:#F8BB86}.sweet-alert .icon.warning .dot{position:absolute;width:7px;height:7px;-webkit-border-radius:50%;border-radius:50%;margin-left:-3px;left:50%;bottom:10px;background-color:#F8BB86}.sweet-alert .icon.info{border-color:#C9DAE1}.sweet-alert .icon.info::before{content:"";position:absolute;width:5px;height:29px;left:50%;bottom:17px;border-radius:2px;margin-left:-2px;background-color:#C9DAE1}.sweet-alert .icon.info::after{content:"";position:absolute;width:7px;height:7px;border-radius:50%;margin-left:-3px;top:19px;background-color:#C9DAE1}.sweet-alert .icon.success{border-color:#A5DC86}.sweet-alert .icon.success::after,.sweet-alert .icon.success::before{content:'';position:absolute;width:60px;height:120px;background:#fff;-webkit-transform:rotate(45deg);transform:rotate(45deg)}.sweet-alert .icon.success::before{-webkit-border-radius:120px 0 0 120px;border-radius:120px 0 0 120px;top:-7px;left:-33px;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);-webkit-transform-origin:60px 60px;transform-origin:60px 60px}.sweet-alert .icon.success::after{-webkit-border-radius:0 120px 120px 0;border-radius:0 120px 120px 0;top:-11px;left:30px;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);-webkit-transform-origin:0 60px;transform-origin:0 60px}.sweet-alert .icon.success .placeholder{width:80px;height:80px;border:4px solid rgba(165,220,134,.2);-webkit-border-radius:40px;border-radius:50%;box-sizing:content-box;position:absolute;left:-4px;top:-4px;z-index:2}.sweet-alert .icon.success .fix{width:5px;height:90px;background-color:#fff;position:absolute;left:28px;top:8px;z-index:1;-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.sweet-alert .icon.success .line{height:5px;background-color:#A5DC86;display:block;border-radius:2px;position:absolute;z-index:2}.sweet-alert .icon.success .line.tip{width:25px;left:14px;top:46px;-webkit-transform:rotate(45deg);transform:rotate(45deg)}.sweet-alert .icon.success .line.long{width:47px;right:8px;top:38px;-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.sweet-alert .icon.custom{background-size:contain;border-radius:0;border:none;background-position:center center;background-repeat:no-repeat}@-webkit-keyframes showSweetAlert{0%{transform:scale(.7);-webkit-transform:scale(.7)}45%{transform:scale(1.05);-webkit-transform:scale(1.05)}80%{transform:scale(.95);-webkit-tranform:scale(.95)}100%{transform:scale(1);-webkit-transform:scale(1)}}@keyframes showSweetAlert{0%{transform:scale(.7);-webkit-transform:scale(.7)}45%{transform:scale(1.05);-webkit-transform:scale(1.05)}80%{transform:scale(.95);-webkit-tranform:scale(.95)}100%{transform:scale(1);-webkit-transform:scale(1)}}@-webkit-keyframes hideSweetAlert{0%{transform:scale(1);-webkit-transform:scale(1)}100%{transform:scale(.5);-webkit-transform:scale(.5)}}@keyframes hideSweetAlert{0%{transform:scale(1);-webkit-transform:scale(1)}100%{transform:scale(.5);-webkit-transform:scale(.5)}}.showSweetAlert{-webkit-animation:showSweetAlert .3s;animation:showSweetAlert .3s}.showSweetAlert[data-animation=none]{-webkit-animation:none;animation:none}.hideSweetAlert{-webkit-animation:hideSweetAlert .2s;animation:hideSweetAlert .2s}.hideSweetAlert[data-animation=none]{-webkit-animation:none;animation:none}@-webkit-keyframes animateSuccessTip{0%,54%{width:0;left:1px;top:19px}70%{width:50px;left:-8px;top:37px}84%{width:17px;left:21px;top:48px}100%{width:25px;left:14px;top:45px}}@keyframes animateSuccessTip{0%,54%{width:0;left:1px;top:19px}70%{width:50px;left:-8px;top:37px}84%{width:17px;left:21px;top:48px}100%{width:25px;left:14px;top:45px}}@-webkit-keyframes animateSuccessLong{0%,65%{width:0;right:46px;top:54px}84%{width:55px;right:0;top:35px}100%{width:47px;right:8px;top:38px}}@keyframes animateSuccessLong{0%,65%{width:0;right:46px;top:54px}84%{width:55px;right:0;top:35px}100%{width:47px;right:8px;top:38px}}@-webkit-keyframes rotatePlaceholder{0%,5%{transform:rotate(-45deg);-webkit-transform:rotate(-45deg)}100%,12%{transform:rotate(-405deg);-webkit-transform:rotate(-405deg)}}@keyframes rotatePlaceholder{0%,5%{transform:rotate(-45deg);-webkit-transform:rotate(-45deg)}100%,12%{transform:rotate(-405deg);-webkit-transform:rotate(-405deg)}}.animateSuccessTip{-webkit-animation:animateSuccessTip .75s;animation:animateSuccessTip .75s}.animateSuccessLong{-webkit-animation:animateSuccessLong .75s;animation:animateSuccessLong .75s}.icon.success.animate::after{-webkit-animation:rotatePlaceholder 4.25s ease-in;animation:rotatePlaceholder 4.25s ease-in}@-webkit-keyframes animateErrorIcon{0%{transform:rotateX(100deg);-webkit-transform:rotateX(100deg);opacity:0}100%{transform:rotateX(0deg);-webkit-transform:rotateX(0deg);opacity:1}}@keyframes animateErrorIcon{0%{transform:rotateX(100deg);-webkit-transform:rotateX(100deg);opacity:0}100%{transform:rotateX(0deg);-webkit-transform:rotateX(0deg);opacity:1}}.animateErrorIcon{-webkit-animation:animateErrorIcon .5s;animation:animateErrorIcon .5s}@-webkit-keyframes animateXMark{0%,50%{transform:scale(.4);-webkit-transform:scale(.4);margin-top:26px;opacity:0}80%{transform:scale(1.15);-webkit-transform:scale(1.15);margin-top:-6px}100%{transform:scale(1);-webkit-transform:scale(1);margin-top:0;opacity:1}}@keyframes animateXMark{0%,50%{transform:scale(.4);-webkit-transform:scale(.4);margin-top:26px;opacity:0}80%{transform:scale(1.15);-webkit-transform:scale(1.15);margin-top:-6px}100%{transform:scale(1);-webkit-transform:scale(1);margin-top:0;opacity:1}}.animateXMark{-webkit-animation:animateXMark .5s;animation:animateXMark .5s}@-webkit-keyframes pulseWarning{0%{border-color:#F8D486}100%{border-color:#F8BB86}}@keyframes pulseWarning{0%{border-color:#F8D486}100%{border-color:#F8BB86}}.pulseWarning{-webkit-animation:pulseWarning .75s infinite alternate;animation:pulseWarning .75s infinite alternate}@-webkit-keyframes pulseWarningIns{0%{background-color:#F8D486}100%{background-color:#F8BB86}}@keyframes pulseWarningIns{0%{background-color:#F8D486}100%{background-color:#F8BB86}}.pulseWarningIns{-webkit-animation:pulseWarningIns .75s infinite alternate;animation:pulseWarningIns .75s infinite alternate}
@@ -0,0 +1,37 @@
1
+ <!-- Note: this file is only intended for development use! -->
2
+
3
+ <div class="sweet-overlay"></div>
4
+
5
+
6
+ <!-- SweetAlert box -->
7
+ <div class="sweet-alert">
8
+
9
+ <div class="icon error">
10
+ <span class="x-mark">
11
+ <span class="line left"></span>
12
+ <span class="line right"></span>
13
+ </span>
14
+ </div>
15
+
16
+ <div class="icon warning">
17
+ <span class="body"></span>
18
+ <span class="dot"></span>
19
+ </div>
20
+
21
+ <div class="icon info"></div>
22
+
23
+ <div class="icon success">
24
+ <span class="line tip"></span>
25
+ <span class="line long"></span>
26
+ <div class="placeholder"></div>
27
+ <div class="fix"></div>
28
+ </div>
29
+
30
+ <div class="icon custom"></div>
31
+
32
+
33
+ <h2>Title</h2>
34
+ <p>Text</p>
35
+ <button class="cancel">Cancel</button>
36
+ <button class="confirm">OK</button>
37
+ </div>