├── .gitattributes ├── .gitignore ├── LICENSE ├── README.md ├── angular-confirm.png ├── animations.html ├── app.js ├── bower.json ├── callback.html ├── css ├── angular-confirm.css └── angular-confirm.less ├── demo ├── demo.css ├── demo.js ├── libs │ ├── bundled.css │ ├── bundled.js │ └── fonts │ │ ├── FontAwesome.otf │ │ ├── fontawesome-webfont.eot │ │ ├── fontawesome-webfont.svg │ │ ├── fontawesome-webfont.ttf │ │ ├── fontawesome-webfont.woff │ │ └── fontawesome-webfont.woff2 └── logo-name.svg ├── dist ├── angular-confirm.min.css └── angular-confirm.min.js ├── form.html ├── index.html ├── js └── angular-confirm.js ├── package.json ├── table.html ├── text.txt ├── themelayout.png ├── themelayout.psd ├── themes.html └── themes_popup.html /.gitattributes: -------------------------------------------------------------------------------- 1 | * linguist-vendored 2 | *.js linguist-vendored=false 3 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | /nbproject/private/ 2 | /nbproject 3 | /.idea 4 | /themelayout.psd -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | 3 | Copyright (c) 2015 Boniface Pereira 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | ### ![jquery-confirm](https://raw.githubusercontent.com/craftpip/angular-confirm/master/angular-confirm.png "jquery-confirm") 2 | *alerts, confirms and dialogs in* ***one.*** 3 | 4 | v1.1.0 5 | 6 | Angular-confirm targets to make it really easy to use confirm dialogs with angular. 7 | With angular-confirm you can harness the angular two-way data binding to update the content as well as make changes to the model in runtime. 8 | 9 | A re-write of the jquery-confirm v3 plugin with all features. 10 | 11 | * Define multiple buttons 12 | * Trigger buttons on key up events 13 | * Beautiful themes and animations 14 | * All modal properties are two-way binded. 15 | * Do things the angular way 16 | 17 | View detailed features here [Documentation & Examples](http://craftpip.github.io/angular-confirm) 18 | 19 | ## Installation 20 | 21 | Download the latest release [here](https://github.com/craftpip/jquery-confirm/archive/master.zip) and use the files within the `dist` directory 22 | 23 | via Bower: 24 | `$ bower install angular-confirm1` 25 | 26 | via NPM: 27 | `$ npm install angular-confirm1` 28 | 29 | ##Basic usage 30 | 31 | The snippet below shows the most commonly used properties, there are more to find in the docs. 32 | ```js 33 | angular.module('myApp', ['cp.ngConfirm']) 34 | .controller('myController', function($scope, $ngConfirm){ 35 | $scope.hey = 'Hello there!'; 36 | $ngConfirm({ 37 | title: 'What is up?', 38 | content: 'Here goes a little content, {{hey}}', 39 | contentUrl: 'template.html', // if contentUrl is provided, 'content' is ignored. 40 | scope: $scope, 41 | buttons: { 42 | // long hand button definition 43 | ok: { 44 | text: "ok!", 45 | btnClass: 'btn-primary', 46 | keys: ['enter'], // will trigger when enter is pressed 47 | action: function(scope){ 48 | $ngConfirm('the user clicked ok'); 49 | } 50 | }, 51 | // short hand button definition 52 | close: function(scope){ 53 | $ngConfirm('the user clicked close'); 54 | } 55 | }, 56 | }); 57 | }); 58 | ``` 59 | 60 | ## Demo and Documentation 61 | 62 | See Detailed Docs + Example [here](http://craftpip.github.io/angular-confirm). 63 | 64 | ## Issues 65 | 66 | Please post issues and feature request here [Github issues](https://github.com/craftpip/angular-confirm/issues) 67 | 68 | ## Version changes 69 | 70 | (coming in 1.11.0) 71 | * remove jquery as dependency 72 | 73 | (new in 1.1.0) 74 | * Major performance fixes 75 | * Fix memory leaks 76 | * Removed ngAnimate and ngSanitize as dependencies 77 | * added set methods to modal 78 | * watchInterval property removed, content watch is now done with $digest 79 | * button functions added 80 | * theme fixes 81 | * onScopeReady callback added 82 | 83 | (new in 1.0.1) 84 | * Added project to bower 85 | 86 | 87 | ## Copyright and license 88 | 89 | Copyright (C) 2016 angular-confirm 90 | 91 | Licensed under [the MIT license](LICENSE). 92 | 93 | -------------------------------------------------------------------------------- /angular-confirm.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/craftpip/angular-confirm/0283ef1ce55b263f7db71d3d1ced357b9b3ef3c7/angular-confirm.png -------------------------------------------------------------------------------- /animations.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | angular-confirm.js | The multipurpose alert & confirm 7 | 9 | 12 | 14 | 16 | 19 | 21 | 23 | 25 | 27 | 30 | 33 | 36 | 39 | 41 | 43 | 45 | 47 | 49 | 51 | 53 | 54 | 56 | 57 | 58 | 60 | 61 | 62 | 63 | 66 | 67 | 68 | 69 | 72 | 74 | 75 | 76 | 77 | 79 |
80 |
81 |
82 | 89 | 92 |
93 | 134 |
135 |
136 |
139 |
140 |

142 | ANGULAR-CONFIRM 144 |

145 | 146 |

147 | Animations - Use one, or define your own. 148 |

149 |
150 |
151 |
153 | 154 |
155 |
156 |
157 |
158 |
159 |

160 | angular-confirm v docs
161 | 162 | view on Github 163 | 164 |

165 |
166 |
167 | 193 |
194 |
195 |
196 | 197 |
198 |

199 | back to 200 | Main Docs 201 |

202 | 203 | 204 | 209 | 212 | 213 |
214 |

Open/Close Animations

215 | 216 |

217 | Impression lies in what we see.
218 | Different animations can be set for open and close events. 219 |

220 |
221 |

2D animations:

222 | 223 | 224 | 225 | 226 | 227 | 228 | 229 |
230 |

3D animations:

231 | 232 | 233 | 234 | 235 | 236 | 237 | 238 | 239 |
240 |

241 | You can also create/define your own animations 242 |

243 | 
$ngConfirm({
244 |     animation: 'zoom',
245 |     closeAnimation: 'scale'
246 | });
247 | // Available animations:
248 | // right, left, bottom, top, rotate, none, opacity, scale, zoom,
249 | // scaleY, scaleX, rotateY, rotateYR (reverse), rotateX, rotateXR (reverse)
250 |
251 | 252 |

Animation bounce

253 | 254 |
255 |

Some eye candy thats in fashion.

256 | 257 | 258 | 259 | 260 |
261 | 
$ngConfirm({
262 |     animationBounce: 1.5, // default is 1.2 whereas 1 is no bounce.
263 | });
264 |
265 | 266 |

Animation speed

267 | 268 |
269 |

Adjust the duration of animation.

270 | 271 | 272 |
273 | 
$.confirm({
274 |     animationSpeed: 2000 // 2 seconds
275 | });
276 | $.confirm({
277 |     animationSpeed: 200 // 0.2 seconds
278 | });
279 |
280 |
281 | 282 |
283 |

Define your custom animations

284 |

285 | Defining your custom animations lets you match your existing user interface. 286 |

287 |
288 |

Example for a newsflash animation.
These animations are define the starting point of the 289 | openAnimation and ending point of the closeAnimation

290 | 291 |
292 | 297 |
298 |
299 |
300 | 
.ng-confirm .ng-confirm-box.ng-confirm-animation-news{
301 |     transform: rotate(400deg) scale(0);
302 | }
303 |
304 |
305 | 
$ngConfirm({
306 |     animation: 'news',
307 |     closeAnimation: 'news',
308 | });
309 |
310 |
311 |

312 | The animation name should be lowercase, or they wont work. 313 |

314 |
    315 |
  • 316 | .ng-confirm-animation-animation-name translates to 'animation-name' 317 |
    • 318 |
  • 319 | .ng-confirm-animation-animationhere translates to 'animationhere' 320 |
    • 321 |
322 |
323 | 324 |
325 |

Background dismiss animation

326 |

327 | This animation takes place when backgroundDismiss is false, or returns a falsy value. 328 |

329 |
330 |

Example for a newsflash animation.
These animations are define the starting point of the 331 | openAnimation and ending point of the closeAnimation

332 | 333 |
334 | 356 |
357 |
358 |
359 | 
.ng-confirm .ng-confirm-box.ng-confirm-hilight.ng-confirm-hilight-random {
360 |     /*the animation name is bob*/
361 |     transform: translate3d(0, 0, 0);
362 |     animation: random 1s;
363 | }
364 | 
365 | @keyframes random {
366 |     10%, 90% {
367 |         transform: rotate(-2deg);
368 |     }
369 |     20%, 80% {
370 |         transform: rotate(4deg);
371 |     }
372 |     30%, 50%, 70% {
373 |         transform: rotate(-8deg);
374 |     }
375 |     40%, 60% {
376 |         transform: rotate(8deg);
377 |     }
378 | }
379 |
380 |
381 | 
$ngConfirm({
382 |     backgroundDismissAnimation: 'random',
383 | });
384 |
385 |
386 |

387 | The animation name should be lowercase, or they wont work. 388 |

389 |
390 | 391 |
392 |
393 |

394 | Thanks for making it to the end of the document.
395 | Your support and suggestions matter the most! 396 |

397 | Please post your
Questions / Suggestions / Issues. 400 |

Made by @craftpip

401 | 402 |
403 |
404 |
405 |
406 |
407 | 408 | 410 | 411 | 413 | 414 | 430 | 431 | 435 | 450 | 451 | -------------------------------------------------------------------------------- /bower.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "angular-confirm1", 3 | "version": "1.1.0", 4 | "homepage": "https://github.com/craftpip/angular-confirm", 5 | "authors": [ 6 | "boniface pereira " 7 | ], 8 | "description": "A multipurpose alert and confirm plugin", 9 | "main": [ 10 | "css/angular-confirm.css", 11 | "js/angular-confirm.js" 12 | ], 13 | "keywords": [ 14 | "angular-plugin", 15 | "javascript", 16 | "confirm", 17 | "alert", 18 | "dialog", 19 | "angular" 20 | ], 21 | "license": "MIT", 22 | "ignore": [ 23 | "**/.*", 24 | "node_modules", 25 | "bower_components", 26 | "test", 27 | "tests" 28 | ], 29 | "dependencies": { 30 | "bootstrap": "3.*", 31 | "jquery": ">=1.6" 32 | } 33 | } -------------------------------------------------------------------------------- /callback.html: -------------------------------------------------------------------------------- 1 |
2 |
3 | 4 | 5 |
6 | 7 |

8 | Click on the above button to enable the "ok" button 9 |

10 |
11 | -------------------------------------------------------------------------------- /css/angular-confirm.css: -------------------------------------------------------------------------------- 1 | /*! 2 | * angular-confirm v1.1.0 (http://craftpip.github.io/angular-confirm/) 3 | * Author: boniface pereira 4 | * Website: www.craftpip.com 5 | * Contact: hey@craftpip.com 6 | * 7 | * Copyright 2016-2017 angular-confirm 8 | * Licensed under MIT (https://github.com/craftpip/angular-confirm/blob/master/LICENSE) 9 | */ 10 | @-webkit-keyframes ng-confirm-spin { 11 | from { 12 | -webkit-transform: rotate(0deg); 13 | transform: rotate(0deg); 14 | } 15 | to { 16 | -webkit-transform: rotate(360deg); 17 | transform: rotate(360deg); 18 | } 19 | } 20 | @keyframes ng-confirm-spin { 21 | from { 22 | -webkit-transform: rotate(0deg); 23 | transform: rotate(0deg); 24 | } 25 | to { 26 | -webkit-transform: rotate(360deg); 27 | transform: rotate(360deg); 28 | } 29 | } 30 | body[class*=ng-confirm-no-scroll-] { 31 | overflow: hidden !important; 32 | } 33 | .ng-confirm { 34 | position: fixed; 35 | top: 0; 36 | left: 0; 37 | right: 0; 38 | bottom: 0; 39 | z-index: 99999999; 40 | font-family: inherit; 41 | overflow: hidden; 42 | } 43 | .ng-confirm .ng-confirm-bg { 44 | position: fixed; 45 | top: 0; 46 | left: 0; 47 | right: 0; 48 | bottom: 0; 49 | -webkit-transition: opacity .4s, background .4s; 50 | transition: opacity .4s, background .4s; 51 | } 52 | .ng-confirm .ng-confirm-bg.ng-confirm-bg-h { 53 | opacity: 0 !important; 54 | } 55 | .ng-confirm .ng-confirm-scrollpane { 56 | position: fixed; 57 | top: 0; 58 | left: 0; 59 | right: 0; 60 | bottom: 0; 61 | overflow-y: auto; 62 | -webkit-perspective: 500px; 63 | perspective: 500px; 64 | -webkit-perspective-origin: center; 65 | perspective-origin: center; 66 | -webkit-user-select: none; 67 | -moz-user-select: none; 68 | -ms-user-select: none; 69 | user-select: none; 70 | } 71 | .ng-confirm .ng-confirm-box { 72 | background: white; 73 | border-radius: 4px; 74 | position: relative; 75 | outline: none; 76 | padding: 15px 15px 0; 77 | overflow: hidden; 78 | margin-left: auto; 79 | margin-right: auto; 80 | } 81 | .ng-confirm .ng-confirm-box.ng-confirm-loading { 82 | min-height: 120px; 83 | } 84 | .ng-confirm .ng-confirm-box.ng-confirm-loading:before { 85 | content: ''; 86 | position: absolute; 87 | left: 0; 88 | background: white; 89 | right: 0; 90 | top: 0; 91 | bottom: 0; 92 | border-radius: 10px; 93 | z-index: 1; 94 | } 95 | .ng-confirm .ng-confirm-box.ng-confirm-loading:after { 96 | opacity: 0.6; 97 | content: ''; 98 | height: 30px; 99 | width: 30px; 100 | border: solid 3px transparent; 101 | position: absolute; 102 | left: 50%; 103 | margin-left: -15px; 104 | border-radius: 50%; 105 | -webkit-animation: ng-confirm-spin 1s infinite linear; 106 | animation: ng-confirm-spin 1s infinite linear; 107 | border-bottom-color: dodgerblue; 108 | top: 50%; 109 | margin-top: -15px; 110 | z-index: 2; 111 | } 112 | .ng-confirm .ng-confirm-box div.ng-confirm-closeIcon { 113 | height: 20px; 114 | width: 20px; 115 | position: absolute; 116 | top: 5px; 117 | right: 5px; 118 | cursor: pointer; 119 | opacity: .6; 120 | text-align: center; 121 | -webkit-transition: opacity 0.3s ease-in; 122 | transition: opacity 0.3s ease-in; 123 | font-size: 27px !important; 124 | line-height: 14px; 125 | font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; 126 | } 127 | .ng-confirm .ng-confirm-box div.ng-confirm-closeIcon:empty { 128 | display: none; 129 | } 130 | .ng-confirm .ng-confirm-box div.ng-confirm-closeIcon .fa, 131 | .ng-confirm .ng-confirm-box div.ng-confirm-closeIcon .glyphicon, 132 | .ng-confirm .ng-confirm-box div.ng-confirm-closeIcon .zmdi { 133 | font-size: 16px; 134 | line-height: 25px; 135 | vertical-align: bottom; 136 | } 137 | .ng-confirm .ng-confirm-box div.ng-confirm-closeIcon:hover { 138 | opacity: 1; 139 | } 140 | .ng-confirm .ng-confirm-box div.ng-confirm-title-c { 141 | display: block; 142 | font-size: 22px; 143 | line-height: 20px; 144 | padding-bottom: 15px; 145 | } 146 | .ng-confirm .ng-confirm-box div.ng-confirm-title-c .ng-confirm-icon-c { 147 | font-size: inherit; 148 | display: inline-block; 149 | vertical-align: top; 150 | } 151 | .ng-confirm .ng-confirm-box div.ng-confirm-title-c .ng-confirm-icon-c i { 152 | vertical-align: middle; 153 | } 154 | .ng-confirm .ng-confirm-box div.ng-confirm-title-c .ng-confirm-icon-c:empty { 155 | display: none; 156 | } 157 | .ng-confirm .ng-confirm-box div.ng-confirm-title-c .ng-confirm-title { 158 | font-size: inherit; 159 | font-family: inherit; 160 | display: inline-block; 161 | vertical-align: middle; 162 | -webkit-user-select: initial; 163 | -moz-user-select: initial; 164 | -ms-user-select: initial; 165 | user-select: initial; 166 | } 167 | .ng-confirm .ng-confirm-box div.ng-confirm-title-c .ng-confirm-title:empty { 168 | display: none; 169 | } 170 | .ng-confirm .ng-confirm-box div.ng-confirm-content-pane { 171 | margin-bottom: 15px; 172 | height: 0px; 173 | display: inline-block; 174 | width: 100%; 175 | position: relative; 176 | overflow: hidden; 177 | } 178 | .ng-confirm .ng-confirm-box div.ng-confirm-content-pane .ng-confirm-content { 179 | width: 100%; 180 | height: auto; 181 | -webkit-user-select: initial; 182 | -moz-user-select: initial; 183 | -ms-user-select: initial; 184 | user-select: initial; 185 | } 186 | .ng-confirm .ng-confirm-box div.ng-confirm-content-pane .ng-confirm-content img { 187 | width: 100%; 188 | height: auto; 189 | } 190 | .ng-confirm .ng-confirm-box div.ng-confirm-content-pane .ng-confirm-content:empty { 191 | display: none; 192 | } 193 | .ng-confirm .ng-confirm-box .ng-confirm-buttons { 194 | padding-bottom: 11px; 195 | } 196 | .ng-confirm .ng-confirm-box .ng-confirm-buttons > button { 197 | margin-bottom: 4px; 198 | margin-left: 2px; 199 | margin-right: 2px; 200 | } 201 | .ng-confirm .ng-confirm-box .ng-confirm-buttons button { 202 | display: inline-block; 203 | padding: 6px 12px; 204 | font-size: 14px; 205 | font-weight: 400; 206 | line-height: 1.42857143; 207 | text-align: center; 208 | white-space: nowrap; 209 | vertical-align: middle; 210 | -ms-touch-action: manipulation; 211 | touch-action: manipulation; 212 | cursor: pointer; 213 | -webkit-user-select: none; 214 | -moz-user-select: none; 215 | -ms-user-select: none; 216 | user-select: none; 217 | border-radius: 4px; 218 | min-height: 1em; 219 | outline: 0; 220 | -webkit-transition: opacity 0.1s ease, background-color 0.1s ease, color 0.1s ease, box-shadow 0.1s ease, background 0.1s ease; 221 | transition: opacity 0.1s ease, background-color 0.1s ease, color 0.1s ease, box-shadow 0.1s ease, background 0.1s ease; 222 | -webkit-tap-highlight-color: transparent; 223 | border: none; 224 | background-image: none; 225 | } 226 | .ng-confirm .ng-confirm-box .ng-confirm-buttons button.btn-blue { 227 | background-color: #3498db; 228 | color: #FFF; 229 | text-shadow: none; 230 | -webkit-transition: background .2s; 231 | transition: background .2s; 232 | } 233 | .ng-confirm .ng-confirm-box .ng-confirm-buttons button.btn-blue:hover { 234 | background-color: #2980b9; 235 | color: #FFF; 236 | } 237 | .ng-confirm .ng-confirm-box .ng-confirm-buttons button.btn-green { 238 | background-color: #2ecc71; 239 | color: #FFF; 240 | text-shadow: none; 241 | -webkit-transition: background .2s; 242 | transition: background .2s; 243 | } 244 | .ng-confirm .ng-confirm-box .ng-confirm-buttons button.btn-green:hover { 245 | background-color: #27ae60; 246 | color: #FFF; 247 | } 248 | .ng-confirm .ng-confirm-box .ng-confirm-buttons button.btn-red { 249 | background-color: #e74c3c; 250 | color: #FFF; 251 | text-shadow: none; 252 | -webkit-transition: background .2s; 253 | transition: background .2s; 254 | } 255 | .ng-confirm .ng-confirm-box .ng-confirm-buttons button.btn-red:hover { 256 | background-color: #c0392b; 257 | color: #FFF; 258 | } 259 | .ng-confirm .ng-confirm-box .ng-confirm-buttons button.btn-orange { 260 | background-color: #f1c40f; 261 | color: #FFF; 262 | text-shadow: none; 263 | -webkit-transition: background .2s; 264 | transition: background .2s; 265 | } 266 | .ng-confirm .ng-confirm-box .ng-confirm-buttons button.btn-orange:hover { 267 | background-color: #f39c12; 268 | color: #FFF; 269 | } 270 | .ng-confirm .ng-confirm-box .ng-confirm-buttons button.btn-default { 271 | background-color: #ecf0f1; 272 | color: #000; 273 | text-shadow: none; 274 | -webkit-transition: background .2s; 275 | transition: background .2s; 276 | } 277 | .ng-confirm .ng-confirm-box .ng-confirm-buttons button.btn-default:hover { 278 | background-color: #bdc3c7; 279 | color: #000; 280 | } 281 | .ng-confirm .ng-confirm-box .ng-confirm-buttons button.btn-purple { 282 | background-color: #9b59b6; 283 | color: #FFF; 284 | text-shadow: none; 285 | -webkit-transition: background .2s; 286 | transition: background .2s; 287 | } 288 | .ng-confirm .ng-confirm-box .ng-confirm-buttons button.btn-purple:hover { 289 | background-color: #8e44ad; 290 | color: #FFF; 291 | } 292 | .ng-confirm .ng-confirm-box .ng-confirm-buttons button.btn-dark { 293 | background-color: #34495e; 294 | color: #FFF; 295 | text-shadow: none; 296 | -webkit-transition: background .2s; 297 | transition: background .2s; 298 | } 299 | .ng-confirm .ng-confirm-box .ng-confirm-buttons button.btn-dark:hover { 300 | background-color: #2c3e50; 301 | color: #FFF; 302 | } 303 | @-webkit-keyframes type-blue { 304 | 1%, 305 | 100% { 306 | border-color: #3498db; 307 | } 308 | 50% { 309 | border-color: #5faee3; 310 | } 311 | } 312 | @keyframes type-blue { 313 | 1%, 314 | 100% { 315 | border-color: #3498db; 316 | } 317 | 50% { 318 | border-color: #5faee3; 319 | } 320 | } 321 | @-webkit-keyframes type-green { 322 | 1%, 323 | 100% { 324 | border-color: #2ecc71; 325 | } 326 | 50% { 327 | border-color: #54d98c; 328 | } 329 | } 330 | @keyframes type-green { 331 | 1%, 332 | 100% { 333 | border-color: #2ecc71; 334 | } 335 | 50% { 336 | border-color: #54d98c; 337 | } 338 | } 339 | @-webkit-keyframes type-red { 340 | 1%, 341 | 100% { 342 | border-color: #e74c3c; 343 | } 344 | 50% { 345 | border-color: #ed7669; 346 | } 347 | } 348 | @keyframes type-red { 349 | 1%, 350 | 100% { 351 | border-color: #e74c3c; 352 | } 353 | 50% { 354 | border-color: #ed7669; 355 | } 356 | } 357 | @-webkit-keyframes type-orange { 358 | 1%, 359 | 100% { 360 | border-color: #f1c40f; 361 | } 362 | 50% { 363 | border-color: #f4d03f; 364 | } 365 | } 366 | @keyframes type-orange { 367 | 1%, 368 | 100% { 369 | border-color: #f1c40f; 370 | } 371 | 50% { 372 | border-color: #f4d03f; 373 | } 374 | } 375 | @-webkit-keyframes type-purple { 376 | 1%, 377 | 100% { 378 | border-color: #9b59b6; 379 | } 380 | 50% { 381 | border-color: #b07cc6; 382 | } 383 | } 384 | @keyframes type-purple { 385 | 1%, 386 | 100% { 387 | border-color: #9b59b6; 388 | } 389 | 50% { 390 | border-color: #b07cc6; 391 | } 392 | } 393 | @-webkit-keyframes type-dark { 394 | 1%, 395 | 100% { 396 | border-color: #34495e; 397 | } 398 | 50% { 399 | border-color: #46627f; 400 | } 401 | } 402 | @keyframes type-dark { 403 | 1%, 404 | 100% { 405 | border-color: #34495e; 406 | } 407 | 50% { 408 | border-color: #46627f; 409 | } 410 | } 411 | .ng-confirm.ng-confirm-type-animated .ng-confirm-box { 412 | -webkit-animation-duration: 2s; 413 | animation-duration: 2s; 414 | -webkit-animation-iteration-count: infinite; 415 | animation-iteration-count: infinite; 416 | } 417 | .ng-confirm.ng-confirm-type-blue .ng-confirm-box { 418 | border-top: solid 7px #3498db; 419 | -webkit-animation-name: type-blue; 420 | animation-name: type-blue; 421 | } 422 | .ng-confirm.ng-confirm-type-green .ng-confirm-box { 423 | border-top: solid 7px #2ecc71; 424 | -webkit-animation-name: type-green; 425 | animation-name: type-green; 426 | } 427 | .ng-confirm.ng-confirm-type-red .ng-confirm-box { 428 | border-top: solid 7px #e74c3c; 429 | -webkit-animation-name: type-red; 430 | animation-name: type-red; 431 | } 432 | .ng-confirm.ng-confirm-type-orange .ng-confirm-box { 433 | border-top: solid 7px #f1c40f; 434 | -webkit-animation-name: type-orange; 435 | animation-name: type-orange; 436 | } 437 | .ng-confirm.ng-confirm-type-purple .ng-confirm-box { 438 | border-top: solid 7px #9b59b6; 439 | -webkit-animation-name: type-purple; 440 | animation-name: type-purple; 441 | } 442 | .ng-confirm.ng-confirm-type-dark .ng-confirm-box { 443 | border-top: solid 7px #34495e; 444 | -webkit-animation-name: type-dark; 445 | animation-name: type-dark; 446 | } 447 | .ng-confirm .ng-confirm-clear { 448 | clear: both; 449 | } 450 | .ng-confirm.ng-confirm-rtl { 451 | direction: rtl; 452 | } 453 | .ng-confirm .ng-confirm-box.ng-confirm-hilight.ng-confirm-hilight-shake { 454 | -webkit-animation: shake 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both; 455 | animation: shake 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both; 456 | -webkit-transform: translate3d(0, 0, 0); 457 | transform: translate3d(0, 0, 0); 458 | } 459 | .ng-confirm .ng-confirm-box.ng-confirm-hilight.ng-confirm-hilight-glow { 460 | -webkit-animation: glow 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both; 461 | animation: glow 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both; 462 | -webkit-transform: translate3d(0, 0, 0); 463 | transform: translate3d(0, 0, 0); 464 | } 465 | @-webkit-keyframes shake { 466 | 10%, 467 | 90% { 468 | -webkit-transform: translate3d(-2px, 0, 0); 469 | transform: translate3d(-2px, 0, 0); 470 | } 471 | 20%, 472 | 80% { 473 | -webkit-transform: translate3d(4px, 0, 0); 474 | transform: translate3d(4px, 0, 0); 475 | } 476 | 30%, 477 | 50%, 478 | 70% { 479 | -webkit-transform: translate3d(-8px, 0, 0); 480 | transform: translate3d(-8px, 0, 0); 481 | } 482 | 40%, 483 | 60% { 484 | -webkit-transform: translate3d(8px, 0, 0); 485 | transform: translate3d(8px, 0, 0); 486 | } 487 | } 488 | @keyframes shake { 489 | 10%, 490 | 90% { 491 | -webkit-transform: translate3d(-2px, 0, 0); 492 | transform: translate3d(-2px, 0, 0); 493 | } 494 | 20%, 495 | 80% { 496 | -webkit-transform: translate3d(4px, 0, 0); 497 | transform: translate3d(4px, 0, 0); 498 | } 499 | 30%, 500 | 50%, 501 | 70% { 502 | -webkit-transform: translate3d(-8px, 0, 0); 503 | transform: translate3d(-8px, 0, 0); 504 | } 505 | 40%, 506 | 60% { 507 | -webkit-transform: translate3d(8px, 0, 0); 508 | transform: translate3d(8px, 0, 0); 509 | } 510 | } 511 | @-webkit-keyframes glow { 512 | 0%, 513 | 100% { 514 | box-shadow: 0 0 3px red; 515 | } 516 | 50% { 517 | box-shadow: 0 0 30px red; 518 | } 519 | } 520 | @keyframes glow { 521 | 0%, 522 | 100% { 523 | box-shadow: 0 0 3px red; 524 | } 525 | 50% { 526 | box-shadow: 0 0 30px red; 527 | } 528 | } 529 | /*Transition rules*/ 530 | .ng-confirm { 531 | -webkit-perspective: 400px; 532 | perspective: 400px; 533 | } 534 | .ng-confirm .ng-confirm-box { 535 | opacity: 1; 536 | } 537 | .ng-confirm .ng-confirm-box.ng-confirm-animation-top, 538 | .ng-confirm .ng-confirm-box.ng-confirm-animation-left, 539 | .ng-confirm .ng-confirm-box.ng-confirm-animation-right, 540 | .ng-confirm .ng-confirm-box.ng-confirm-animation-bottom, 541 | .ng-confirm .ng-confirm-box.ng-confirm-animation-opacity, 542 | .ng-confirm .ng-confirm-box.ng-confirm-animation-zoom, 543 | .ng-confirm .ng-confirm-box.ng-confirm-animation-scale, 544 | .ng-confirm .ng-confirm-box.ng-confirm-animation-none, 545 | .ng-confirm .ng-confirm-box.ng-confirm-animation-rotate, 546 | .ng-confirm .ng-confirm-box.ng-confirm-animation-rotatex, 547 | .ng-confirm .ng-confirm-box.ng-confirm-animation-rotatey, 548 | .ng-confirm .ng-confirm-box.ng-confirm-animation-scaley, 549 | .ng-confirm .ng-confirm-box.ng-confirm-animation-scalex { 550 | opacity: 0; 551 | } 552 | .ng-confirm .ng-confirm-box.ng-confirm-animation-rotate { 553 | -webkit-transform: rotate(90deg); 554 | -ms-transform: rotate(90deg); 555 | transform: rotate(90deg); 556 | } 557 | .ng-confirm .ng-confirm-box.ng-confirm-animation-rotatex { 558 | -webkit-transform: rotateX(90deg); 559 | transform: rotateX(90deg); 560 | -webkit-transform-origin: center; 561 | -ms-transform-origin: center; 562 | transform-origin: center; 563 | } 564 | .ng-confirm .ng-confirm-box.ng-confirm-animation-rotatexr { 565 | -webkit-transform: rotateX(-90deg); 566 | transform: rotateX(-90deg); 567 | -webkit-transform-origin: center; 568 | -ms-transform-origin: center; 569 | transform-origin: center; 570 | } 571 | .ng-confirm .ng-confirm-box.ng-confirm-animation-rotatey { 572 | -webkit-transform: rotatey(90deg); 573 | -ms-transform: rotatey(90deg); 574 | transform: rotatey(90deg); 575 | -webkit-transform-origin: center; 576 | -ms-transform-origin: center; 577 | transform-origin: center; 578 | } 579 | .ng-confirm .ng-confirm-box.ng-confirm-animation-rotateyr { 580 | -webkit-transform: rotatey(-90deg); 581 | -ms-transform: rotatey(-90deg); 582 | transform: rotatey(-90deg); 583 | -webkit-transform-origin: center; 584 | -ms-transform-origin: center; 585 | transform-origin: center; 586 | } 587 | .ng-confirm .ng-confirm-box.ng-confirm-animation-scaley { 588 | -webkit-transform: scaley(1.5); 589 | -ms-transform: scaley(1.5); 590 | transform: scaley(1.5); 591 | -webkit-transform-origin: center; 592 | -ms-transform-origin: center; 593 | transform-origin: center; 594 | } 595 | .ng-confirm .ng-confirm-box.ng-confirm-animation-scalex { 596 | -webkit-transform: scalex(1.5); 597 | -ms-transform: scalex(1.5); 598 | transform: scalex(1.5); 599 | -webkit-transform-origin: center; 600 | -ms-transform-origin: center; 601 | transform-origin: center; 602 | } 603 | .ng-confirm .ng-confirm-box.ng-confirm-animation-top { 604 | -webkit-transform: translate(0px, -100px); 605 | -ms-transform: translate(0px, -100px); 606 | transform: translate(0px, -100px); 607 | } 608 | .ng-confirm .ng-confirm-box.ng-confirm-animation-left { 609 | -webkit-transform: translate(-100px, 0px); 610 | -ms-transform: translate(-100px, 0px); 611 | transform: translate(-100px, 0px); 612 | } 613 | .ng-confirm .ng-confirm-box.ng-confirm-animation-right { 614 | -webkit-transform: translate(100px, 0px); 615 | -ms-transform: translate(100px, 0px); 616 | transform: translate(100px, 0px); 617 | } 618 | .ng-confirm .ng-confirm-box.ng-confirm-animation-bottom { 619 | -webkit-transform: translate(0px, 100px); 620 | -ms-transform: translate(0px, 100px); 621 | transform: translate(0px, 100px); 622 | } 623 | .ng-confirm .ng-confirm-box.ng-confirm-animation-zoom { 624 | -webkit-transform: scale(1.2); 625 | -ms-transform: scale(1.2); 626 | transform: scale(1.2); 627 | } 628 | .ng-confirm .ng-confirm-box.ng-confirm-animation-scale { 629 | -webkit-transform: scale(0.5); 630 | -ms-transform: scale(0.5); 631 | transform: scale(0.5); 632 | } 633 | .ng-confirm .ng-confirm-box.ng-confirm-animation-none { 634 | visibility: hidden; 635 | } 636 | .ng-confirm.ng-confirm-light .ng-confirm-bg, 637 | .ng-confirm.ng-confirm-white .ng-confirm-bg { 638 | background-color: #444; 639 | opacity: .2; 640 | } 641 | .ng-confirm.ng-confirm-light .ng-confirm-icon-c, 642 | .ng-confirm.ng-confirm-white .ng-confirm-icon-c { 643 | margin-right: 8px; 644 | } 645 | .ng-confirm.ng-confirm-light.ng-confirm-rtl .ng-confirm-closeIcon, 646 | .ng-confirm.ng-confirm-white.ng-confirm-rtl .ng-confirm-closeIcon { 647 | left: 5px !important; 648 | right: auto !important; 649 | } 650 | .ng-confirm.ng-confirm-light.ng-confirm-rtl .ng-confirm-icon-c, 651 | .ng-confirm.ng-confirm-white.ng-confirm-rtl .ng-confirm-icon-c { 652 | margin-right: 0; 653 | margin-left: 8px; 654 | } 655 | .ng-confirm.ng-confirm-light .ng-confirm-box, 656 | .ng-confirm.ng-confirm-white .ng-confirm-box { 657 | box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2); 658 | border-radius: 5px; 659 | } 660 | .ng-confirm.ng-confirm-light .ng-confirm-box .ng-confirm-closeIcon, 661 | .ng-confirm.ng-confirm-white .ng-confirm-box .ng-confirm-closeIcon { 662 | line-height: 20px; 663 | } 664 | .ng-confirm.ng-confirm-light .ng-confirm-box .ng-confirm-buttons, 665 | .ng-confirm.ng-confirm-white .ng-confirm-box .ng-confirm-buttons { 666 | float: right; 667 | } 668 | .ng-confirm.ng-confirm-light .ng-confirm-box .ng-confirm-buttons button, 669 | .ng-confirm.ng-confirm-white .ng-confirm-box .ng-confirm-buttons button { 670 | border: none; 671 | background-image: none; 672 | text-transform: uppercase; 673 | font-size: 14px; 674 | font-weight: bold; 675 | text-shadow: none; 676 | -webkit-transition: background .1s; 677 | transition: background .1s; 678 | color: white; 679 | } 680 | .ng-confirm.ng-confirm-light .ng-confirm-box .ng-confirm-buttons button.btn-default, 681 | .ng-confirm.ng-confirm-white .ng-confirm-box .ng-confirm-buttons button.btn-default { 682 | box-shadow: none; 683 | color: #333; 684 | } 685 | .ng-confirm.ng-confirm-light .ng-confirm-box .ng-confirm-buttons button.btn-default:hover, 686 | .ng-confirm.ng-confirm-white .ng-confirm-box .ng-confirm-buttons button.btn-default:hover { 687 | background: #ddd; 688 | } 689 | .ng-confirm.ng-confirm-dark .ng-confirm-bg, 690 | .ng-confirm.ng-confirm-black .ng-confirm-bg { 691 | background-color: darkslategray; 692 | opacity: .4; 693 | } 694 | .ng-confirm.ng-confirm-dark .ng-confirm-icon-c, 695 | .ng-confirm.ng-confirm-black .ng-confirm-icon-c { 696 | margin-right: 8px; 697 | } 698 | .ng-confirm.ng-confirm-dark.ng-confirm-rtl .ng-confirm-closeIcon, 699 | .ng-confirm.ng-confirm-black.ng-confirm-rtl .ng-confirm-closeIcon { 700 | left: 5px !important; 701 | right: auto !important; 702 | } 703 | .ng-confirm.ng-confirm-dark.ng-confirm-rtl .ng-confirm-icon-c, 704 | .ng-confirm.ng-confirm-black.ng-confirm-rtl .ng-confirm-icon-c { 705 | margin-right: 0; 706 | margin-left: 8px; 707 | } 708 | .ng-confirm.ng-confirm-dark .ng-confirm-box, 709 | .ng-confirm.ng-confirm-black .ng-confirm-box { 710 | box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2); 711 | background: #444; 712 | border-radius: 5px; 713 | } 714 | .ng-confirm.ng-confirm-dark .ng-confirm-box .ng-confirm-closeIcon, 715 | .ng-confirm.ng-confirm-black .ng-confirm-box .ng-confirm-closeIcon { 716 | line-height: 20px; 717 | } 718 | .ng-confirm.ng-confirm-dark .ng-confirm-box.ng-confirm-loading:before, 719 | .ng-confirm.ng-confirm-black .ng-confirm-box.ng-confirm-loading:before { 720 | background: #444; 721 | } 722 | .ng-confirm.ng-confirm-dark .ng-confirm-box.ng-confirm-loading:after, 723 | .ng-confirm.ng-confirm-black .ng-confirm-box.ng-confirm-loading:after { 724 | border-bottom-color: deepskyblue; 725 | } 726 | .ng-confirm.ng-confirm-dark .ng-confirm-box *:not(input):not(textarea):not(select):not(option), 727 | .ng-confirm.ng-confirm-black .ng-confirm-box *:not(input):not(textarea):not(select):not(option) { 728 | color: white; 729 | } 730 | .ng-confirm.ng-confirm-dark .ng-confirm-box input, 731 | .ng-confirm.ng-confirm-black .ng-confirm-box input, 732 | .ng-confirm.ng-confirm-dark .ng-confirm-box textarea, 733 | .ng-confirm.ng-confirm-black .ng-confirm-box textarea, 734 | .ng-confirm.ng-confirm-dark .ng-confirm-box select, 735 | .ng-confirm.ng-confirm-black .ng-confirm-box select, 736 | .ng-confirm.ng-confirm-dark .ng-confirm-box option, 737 | .ng-confirm.ng-confirm-black .ng-confirm-box option { 738 | color: initial; 739 | } 740 | .ng-confirm.ng-confirm-dark .ng-confirm-box .ng-confirm-buttons, 741 | .ng-confirm.ng-confirm-black .ng-confirm-box .ng-confirm-buttons { 742 | float: right; 743 | } 744 | .ng-confirm.ng-confirm-dark .ng-confirm-box .ng-confirm-buttons button, 745 | .ng-confirm.ng-confirm-black .ng-confirm-box .ng-confirm-buttons button { 746 | border: none; 747 | background-image: none; 748 | text-transform: uppercase; 749 | font-size: 14px; 750 | font-weight: bold; 751 | text-shadow: none; 752 | -webkit-transition: background .1s; 753 | transition: background .1s; 754 | color: white; 755 | } 756 | .ng-confirm.ng-confirm-dark .ng-confirm-box .ng-confirm-buttons button.btn-default, 757 | .ng-confirm.ng-confirm-black .ng-confirm-box .ng-confirm-buttons button.btn-default { 758 | box-shadow: none; 759 | color: #fff; 760 | background: none; 761 | } 762 | .ng-confirm.ng-confirm-dark .ng-confirm-box .ng-confirm-buttons button.btn-default:hover, 763 | .ng-confirm.ng-confirm-black .ng-confirm-box .ng-confirm-buttons button.btn-default:hover { 764 | background: #666; 765 | } 766 | .ng-confirm.ng-confirm-supervan .ng-confirm-bg { 767 | background: #36465D; 768 | opacity: 0.99; 769 | } 770 | .ng-confirm.ng-confirm-supervan.ng-confirm-type-blue .ng-confirm-box { 771 | border: none; 772 | } 773 | .ng-confirm.ng-confirm-supervan.ng-confirm-type-blue .ng-confirm-bg { 774 | background: #217dbb; 775 | } 776 | .ng-confirm.ng-confirm-supervan.ng-confirm-type-green .ng-confirm-box { 777 | border: none; 778 | } 779 | .ng-confirm.ng-confirm-supervan.ng-confirm-type-green .ng-confirm-bg { 780 | background: #25a25a; 781 | } 782 | .ng-confirm.ng-confirm-supervan.ng-confirm-type-red .ng-confirm-box { 783 | border: none; 784 | } 785 | .ng-confirm.ng-confirm-supervan.ng-confirm-type-red .ng-confirm-bg { 786 | background: #d62c1a; 787 | } 788 | .ng-confirm.ng-confirm-supervan.ng-confirm-type-orange .ng-confirm-box { 789 | border: none; 790 | } 791 | .ng-confirm.ng-confirm-supervan.ng-confirm-type-orange .ng-confirm-bg { 792 | background: #c29d0b; 793 | } 794 | .ng-confirm.ng-confirm-supervan.ng-confirm-type-purple .ng-confirm-box { 795 | border: none; 796 | } 797 | .ng-confirm.ng-confirm-supervan.ng-confirm-type-purple .ng-confirm-bg { 798 | background: #804399; 799 | } 800 | .ng-confirm.ng-confirm-supervan.ng-confirm-type-dark .ng-confirm-box { 801 | border: none; 802 | } 803 | .ng-confirm.ng-confirm-supervan.ng-confirm-type-dark .ng-confirm-bg { 804 | background: #222f3d; 805 | } 806 | .ng-confirm.ng-confirm-supervan .ng-confirm-box { 807 | background-color: transparent; 808 | } 809 | .ng-confirm.ng-confirm-supervan .ng-confirm-box.ng-confirm-loading:before { 810 | background: transparent; 811 | } 812 | .ng-confirm.ng-confirm-supervan .ng-confirm-box.ng-confirm-loading:after { 813 | border-bottom-color: transparent; 814 | } 815 | .ng-confirm.ng-confirm-supervan .ng-confirm-box div.ng-confirm-closeIcon { 816 | color: white; 817 | border-radius: 50px; 818 | height: 26px; 819 | width: 26px; 820 | line-height: 26px; 821 | top: 2px; 822 | right: 2px; 823 | box-shadow: 0 0 0 2px #ddd; 824 | } 825 | .ng-confirm.ng-confirm-supervan .ng-confirm-box *:not(input):not(textarea):not(select):not(option) { 826 | color: white; 827 | } 828 | .ng-confirm.ng-confirm-supervan .ng-confirm-box input, 829 | .ng-confirm.ng-confirm-supervan .ng-confirm-box textarea, 830 | .ng-confirm.ng-confirm-supervan .ng-confirm-box select, 831 | .ng-confirm.ng-confirm-supervan .ng-confirm-box option { 832 | color: initial; 833 | } 834 | .ng-confirm.ng-confirm-supervan .ng-confirm-box div.ng-confirm-closeIcon { 835 | color: white; 836 | } 837 | .ng-confirm.ng-confirm-supervan .ng-confirm-box div.ng-confirm-title-c { 838 | text-align: center; 839 | font-size: 28px; 840 | font-weight: normal; 841 | padding-bottom: 25px; 842 | } 843 | .ng-confirm.ng-confirm-supervan .ng-confirm-box div.ng-confirm-title-c > * { 844 | display: block; 845 | } 846 | .ng-confirm.ng-confirm-supervan .ng-confirm-box div.ng-confirm-title-c .ng-confirm-icon-c { 847 | margin: 0 0 20px; 848 | font-size: 50px; 849 | } 850 | .ng-confirm.ng-confirm-supervan .ng-confirm-box div.ng-confirm-content-pane { 851 | margin-bottom: 25px; 852 | } 853 | .ng-confirm.ng-confirm-supervan .ng-confirm-box div.ng-confirm-content { 854 | text-align: center; 855 | } 856 | .ng-confirm.ng-confirm-supervan .ng-confirm-box .ng-confirm-buttons { 857 | text-align: center; 858 | } 859 | .ng-confirm.ng-confirm-supervan .ng-confirm-box .ng-confirm-buttons button { 860 | font-size: 16px; 861 | border-radius: 2px; 862 | text-shadow: none; 863 | border: none; 864 | color: white; 865 | padding: 10px; 866 | min-width: 100px; 867 | } 868 | .ng-confirm.ng-confirm-supervan .ng-confirm-box .ng-confirm-buttons button.btn-default { 869 | background: #303f53; 870 | } 871 | .ng-confirm.ng-confirm-supervan .ng-confirm-box .ng-confirm-buttons button.btn-default:hover { 872 | background: #2f3c50; 873 | color: white; 874 | } 875 | .ng-confirm.ng-confirm-material .ng-confirm-bg { 876 | background: dimgray; 877 | opacity: .6; 878 | } 879 | .ng-confirm.ng-confirm-material .ng-confirm-icon-c { 880 | margin-right: 8px; 881 | } 882 | .ng-confirm.ng-confirm-material .ng-confirm-box { 883 | background-color: white; 884 | box-shadow: 0 7px 8px -4px rgba(0, 0, 0, 0.2), 0 13px 19px 2px rgba(0, 0, 0, 0.14), 0 5px 24px 4px rgba(0, 0, 0, 0.12); 885 | padding: 30px 25px 10px 25px; 886 | } 887 | .ng-confirm.ng-confirm-material .ng-confirm-box div.ng-confirm-closeIcon { 888 | color: rgba(0, 0, 0, 0.87); 889 | line-height: 20px; 890 | top: 15px; 891 | right: 15px; 892 | } 893 | .ng-confirm.ng-confirm-material .ng-confirm-box div.ng-confirm-title-c { 894 | color: rgba(0, 0, 0, 0.87); 895 | font-size: 22px; 896 | font-weight: bold; 897 | } 898 | .ng-confirm.ng-confirm-material .ng-confirm-box div.ng-confirm-content { 899 | text-align: left; 900 | color: rgba(0, 0, 0, 0.87); 901 | } 902 | .ng-confirm.ng-confirm-material .ng-confirm-box .ng-confirm-buttons { 903 | text-align: right; 904 | } 905 | .ng-confirm.ng-confirm-material .ng-confirm-box .ng-confirm-buttons button { 906 | text-transform: uppercase; 907 | font-weight: 500; 908 | } 909 | .ng-confirm.ng-confirm-material.ng-confirm-rtl .ng-confirm-closeIcon { 910 | left: 15px !important; 911 | right: auto !important; 912 | } 913 | .ng-confirm.ng-confirm-material.ng-confirm-rtl .ng-confirm-icon-c { 914 | margin-right: 0; 915 | margin-left: 8px; 916 | } 917 | .ng-confirm.ng-confirm-bootstrap .ng-confirm-bg { 918 | background-color: rgba(0, 0, 0, 0.21); 919 | } 920 | .ng-confirm.ng-confirm-bootstrap .ng-confirm-icon-c { 921 | margin-right: 8px; 922 | } 923 | .ng-confirm.ng-confirm-bootstrap .ng-confirm-box { 924 | background-color: white; 925 | box-shadow: 0 3px 8px 0px rgba(0, 0, 0, 0.2); 926 | border: solid 1px rgba(0, 0, 0, 0.4); 927 | padding: 15px 0 0; 928 | border-radius: 6px; 929 | } 930 | .ng-confirm.ng-confirm-bootstrap .ng-confirm-box div.ng-confirm-closeIcon { 931 | color: rgba(0, 0, 0, 0.87); 932 | line-height: 20px; 933 | } 934 | .ng-confirm.ng-confirm-bootstrap .ng-confirm-box div.ng-confirm-title-c { 935 | color: rgba(0, 0, 0, 0.87); 936 | font-size: 22px; 937 | font-weight: bold; 938 | padding-left: 15px; 939 | padding-right: 15px; 940 | } 941 | .ng-confirm.ng-confirm-bootstrap .ng-confirm-box div.ng-confirm-content { 942 | text-align: left; 943 | color: rgba(0, 0, 0, 0.87); 944 | padding: 0px 15px; 945 | } 946 | .ng-confirm.ng-confirm-bootstrap .ng-confirm-box .ng-confirm-buttons { 947 | text-align: right; 948 | padding: 15px; 949 | margin: -5px 0 0px; 950 | border-top: solid 1px #ddd; 951 | overflow: hidden; 952 | border-radius: 0 0 4px 4px; 953 | } 954 | .ng-confirm.ng-confirm-bootstrap .ng-confirm-box .ng-confirm-buttons button { 955 | font-weight: 500; 956 | border-radius: 0px; 957 | margin: 0; 958 | } 959 | .ng-confirm.ng-confirm-bootstrap .ng-confirm-box .ng-confirm-buttons button:first-child { 960 | border-radius: 4px 0 0 4px; 961 | } 962 | .ng-confirm.ng-confirm-bootstrap .ng-confirm-box .ng-confirm-buttons button:last-child { 963 | border-radius: 0 4px 4px 0; 964 | } 965 | .ng-confirm.ng-confirm-bootstrap.ng-confirm-rtl .ng-confirm-closeIcon { 966 | left: 5px !important; 967 | right: auto !important; 968 | } 969 | .ng-confirm.ng-confirm-bootstrap.ng-confirm-rtl .ng-confirm-icon-c { 970 | margin-right: 0; 971 | margin-left: 8px; 972 | } 973 | .ng-confirm.ng-confirm-modern .ng-confirm-bg { 974 | background-color: slategray; 975 | opacity: .6; 976 | } 977 | .ng-confirm.ng-confirm-modern .ng-confirm-icon-c { 978 | margin-right: 8px; 979 | } 980 | .ng-confirm.ng-confirm-modern .ng-confirm-box { 981 | background-color: white; 982 | box-shadow: 0 7px 8px -4px rgba(0, 0, 0, 0.2), 0 13px 19px 2px rgba(0, 0, 0, 0.14), 0 5px 24px 4px rgba(0, 0, 0, 0.12); 983 | padding: 25px 25px 10px 25px; 984 | } 985 | .ng-confirm.ng-confirm-modern .ng-confirm-box div.ng-confirm-closeIcon { 986 | color: rgba(0, 0, 0, 0.87); 987 | border-radius: 50px; 988 | height: 25px; 989 | width: 25px; 990 | line-height: 25px !important; 991 | top: 10px; 992 | right: 10px; 993 | box-shadow: 0 0 0 2px #ddd; 994 | } 995 | .ng-confirm.ng-confirm-modern .ng-confirm-box div.ng-confirm-title-c { 996 | color: rgba(0, 0, 0, 0.87); 997 | font-size: 24px; 998 | font-weight: bold; 999 | text-align: center; 1000 | margin-bottom: 10px; 1001 | } 1002 | .ng-confirm.ng-confirm-modern .ng-confirm-box div.ng-confirm-title-c .ng-confirm-icon-c { 1003 | display: block; 1004 | margin-right: 0px; 1005 | margin-left: 0px; 1006 | margin-bottom: 10px; 1007 | font-size: 69px; 1008 | color: #aaa; 1009 | } 1010 | .ng-confirm.ng-confirm-modern .ng-confirm-box div.ng-confirm-content { 1011 | font-size: 15px; 1012 | color: #777; 1013 | margin-bottom: 25px; 1014 | } 1015 | .ng-confirm.ng-confirm-modern .ng-confirm-box .ng-confirm-buttons { 1016 | text-align: center; 1017 | } 1018 | .ng-confirm.ng-confirm-modern .ng-confirm-box .ng-confirm-buttons button { 1019 | font-weight: bold; 1020 | text-transform: uppercase; 1021 | -webkit-transition: background .1s; 1022 | transition: background .1s; 1023 | } 1024 | .ng-confirm.ng-confirm-modern .ng-confirm-box .ng-confirm-buttons button + button { 1025 | margin-left: 4px; 1026 | } 1027 | .ng-confirm.ng-confirm-seamless .ng-confirm-bg { 1028 | background-color: rgba(255, 255, 255, 0.5); 1029 | } 1030 | .ng-confirm.ng-confirm-seamless .ng-confirm-bg:before { 1031 | border-bottom-color: dodgerblue; 1032 | } 1033 | .ng-confirm.ng-confirm-seamless .ng-confirm-icon-c { 1034 | margin-right: 8px; 1035 | } 1036 | .ng-confirm.ng-confirm-seamless .ng-confirm-box { 1037 | background-color: white; 1038 | box-shadow: 0 7px 8px -4px rgba(0, 0, 0, 0.2), 0 13px 19px 2px rgba(0, 0, 0, 0.14), 0 5px 24px 4px rgba(0, 0, 0, 0.12); 1039 | padding: 20px 0 10px 0; 1040 | } 1041 | .ng-confirm.ng-confirm-seamless .ng-confirm-box div.ng-confirm-closeIcon { 1042 | color: rgba(0, 0, 0, 0.87); 1043 | border-radius: 50px; 1044 | height: 25px; 1045 | width: 25px; 1046 | line-height: 25px !important; 1047 | top: 10px; 1048 | right: 10px; 1049 | box-shadow: 0 0 0 2px #ddd; 1050 | } 1051 | .ng-confirm.ng-confirm-seamless .ng-confirm-box div.ng-confirm-title-c { 1052 | color: rgba(0, 0, 0, 0.87); 1053 | font-size: 24px; 1054 | text-align: center; 1055 | } 1056 | .ng-confirm.ng-confirm-seamless .ng-confirm-box div.ng-confirm-title-c .ng-confirm-icon-c { 1057 | color: #aaa; 1058 | } 1059 | .ng-confirm.ng-confirm-seamless .ng-confirm-box div.ng-confirm-title-c .ng-confirm-title { 1060 | font-weight: bold; 1061 | } 1062 | .ng-confirm.ng-confirm-seamless .ng-confirm-box div.ng-confirm-content { 1063 | text-align: center; 1064 | font-size: 15px; 1065 | color: #464646; 1066 | margin-bottom: 25px; 1067 | } 1068 | .ng-confirm.ng-confirm-seamless .ng-confirm-box .ng-confirm-buttons { 1069 | text-align: center; 1070 | } 1071 | .ng-confirm.ng-confirm-seamless .ng-confirm-box .ng-confirm-buttons button { 1072 | font-size: 16px; 1073 | font-weight: bold; 1074 | } 1075 | .ng-confirm.ng-confirm-seamless .ng-confirm-box .ng-confirm-buttons button + button { 1076 | margin-left: 4px; 1077 | } 1078 | .ng-confirm-el-hide { 1079 | display: none !important; 1080 | } 1081 | -------------------------------------------------------------------------------- /css/angular-confirm.less: -------------------------------------------------------------------------------- 1 | /*! 2 | * angular-confirm v1.1.0 (http://craftpip.github.io/angular-confirm/) 3 | * Author: boniface pereira 4 | * Website: www.craftpip.com 5 | * Contact: hey@craftpip.com 6 | * 7 | * Copyright 2016-2017 angular-confirm 8 | * Licensed under MIT (https://github.com/craftpip/angular-confirm/blob/master/LICENSE) 9 | */ 10 | @blue: #3498db; 11 | @blueHover: #2980b9; 12 | @green: #2ecc71; 13 | @greenHover: #27ae60; 14 | @red: #e74c3c; 15 | @redHover: #c0392b; 16 | @orange: #f1c40f; 17 | @orangeHover: #f39c12; 18 | @purple: #9b59b6; 19 | @purpleHover: #8e44ad; 20 | @default: #ecf0f1; 21 | @defaultHover: #bdc3c7; 22 | @dark: #34495e; 23 | @darkHover: #2c3e50; 24 | 25 | @keyframes ng-confirm-spin { 26 | from { 27 | transform: rotate(0deg); 28 | } 29 | to { 30 | transform: rotate(360deg); 31 | } 32 | } 33 | 34 | body[class*=ng-confirm-no-scroll-] { 35 | overflow: hidden !important; 36 | } 37 | 38 | .ng-confirm { 39 | position: fixed; 40 | top: 0; 41 | left: 0; 42 | right: 0; 43 | bottom: 0; 44 | z-index: 99999999; 45 | font-family: inherit; 46 | overflow: hidden; 47 | 48 | .ng-confirm-bg { 49 | position: fixed; 50 | top: 0; 51 | left: 0; 52 | right: 0; 53 | bottom: 0; 54 | transition: opacity .4s, background .4s; 55 | 56 | &.ng-confirm-bg-h { 57 | opacity: 0 !important; 58 | } 59 | } 60 | .ng-confirm-scrollpane { 61 | position: fixed; 62 | top: 0; 63 | left: 0; 64 | right: 0; 65 | bottom: 0; 66 | overflow-y: auto; 67 | perspective: 500px; 68 | perspective-origin: center; 69 | user-select: none; 70 | } 71 | .ng-confirm-box { 72 | background: white; 73 | border-radius: 4px; 74 | position: relative; 75 | outline: none; 76 | padding: 15px 15px 0; 77 | overflow: hidden; 78 | margin-left: auto; 79 | margin-right: auto; 80 | 81 | &.ng-confirm-loading { 82 | min-height: 120px; 83 | 84 | &:before { 85 | content: ''; 86 | position: absolute; 87 | left: 0; 88 | background: white; 89 | right: 0; 90 | top: 0; 91 | bottom: 0; 92 | border-radius: 10px; 93 | z-index: 1; 94 | } 95 | &:after { 96 | opacity: 0.6; 97 | content: ''; 98 | height: 30px; 99 | width: 30px; 100 | border: solid 3px transparent; 101 | position: absolute; 102 | left: 50%; 103 | margin-left: -15px; 104 | border-radius: 50%; 105 | animation: ng-confirm-spin 1s infinite linear; 106 | border-bottom-color: dodgerblue; 107 | top: 50%; 108 | margin-top: -15px; 109 | z-index: 2; 110 | } 111 | } 112 | 113 | div.ng-confirm-closeIcon { 114 | height: 20px; 115 | width: 20px; 116 | position: absolute; 117 | top: 5px; 118 | right: 5px; 119 | cursor: pointer; 120 | opacity: .6; 121 | text-align: center; 122 | transition: opacity .3s ease-in; 123 | font-size: 27px !important; 124 | line-height: 14px; 125 | font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; 126 | 127 | &:empty { 128 | display: none; 129 | } 130 | 131 | .fa, .glyphicon, .zmdi { 132 | font-size: 16px; 133 | line-height: 25px; 134 | vertical-align: bottom; 135 | } 136 | 137 | &:hover { 138 | opacity: 1; 139 | } 140 | } 141 | div.ng-confirm-title-c { 142 | display: block; 143 | font-size: 22px; 144 | line-height: 20px; 145 | padding-bottom: 15px; 146 | 147 | .ng-confirm-icon-c { 148 | font-size: inherit; 149 | display: inline-block; 150 | vertical-align: top; 151 | 152 | i { 153 | vertical-align: middle; 154 | } 155 | &:empty { 156 | display: none; 157 | } 158 | } 159 | .ng-confirm-title { 160 | font-size: inherit; 161 | font-family: inherit; 162 | display: inline-block; 163 | vertical-align: middle; 164 | user-select: initial; 165 | 166 | &:empty { 167 | display: none; 168 | } 169 | } 170 | } 171 | div.ng-confirm-content-pane { 172 | margin-bottom: 15px; 173 | height: 0px; 174 | display: inline-block; 175 | width: 100%; 176 | position: relative; 177 | overflow: hidden; 178 | 179 | .ng-confirm-content { 180 | width: 100%; 181 | height: auto; 182 | user-select: initial; 183 | 184 | img { 185 | width: 100%; 186 | height: auto; 187 | } 188 | &:empty { 189 | display: none; 190 | } 191 | } 192 | } 193 | .ng-confirm-buttons { 194 | padding-bottom: 11px; 195 | > button { 196 | margin-bottom: 4px; 197 | margin-left: 2px; 198 | margin-right: 2px; 199 | } 200 | 201 | button { 202 | display: inline-block; 203 | padding: 6px 12px; 204 | font-size: 14px; 205 | font-weight: 400; 206 | line-height: 1.42857143; 207 | text-align: center; 208 | white-space: nowrap; 209 | vertical-align: middle; 210 | -ms-touch-action: manipulation; 211 | touch-action: manipulation; 212 | cursor: pointer; 213 | -webkit-user-select: none; 214 | -moz-user-select: none; 215 | -ms-user-select: none; 216 | user-select: none; 217 | border-radius: 4px; 218 | min-height: 1em; 219 | outline: 0; 220 | transition: opacity .1s ease, background-color .1s ease, color .1s ease, box-shadow .1s ease, background .1s ease; 221 | -webkit-tap-highlight-color: transparent; 222 | border: none; 223 | background-image: none; 224 | 225 | &.btn-blue { 226 | background-color: @blue; 227 | color: #FFF; 228 | text-shadow: none; 229 | transition: background .2s; 230 | &:hover { 231 | background-color: @blueHover; 232 | color: #FFF; 233 | } 234 | } 235 | 236 | &.btn-green { 237 | background-color: @green; 238 | color: #FFF; 239 | text-shadow: none; 240 | transition: background .2s; 241 | &:hover { 242 | background-color: @greenHover; 243 | color: #FFF; 244 | } 245 | } 246 | 247 | &.btn-red { 248 | background-color: @red; 249 | color: #FFF; 250 | text-shadow: none; 251 | transition: background .2s; 252 | &:hover { 253 | background-color: @redHover; 254 | color: #FFF; 255 | } 256 | } 257 | 258 | &.btn-orange { 259 | background-color: @orange; 260 | color: #FFF; 261 | text-shadow: none; 262 | transition: background .2s; 263 | &:hover { 264 | background-color: @orangeHover; 265 | color: #FFF; 266 | } 267 | } 268 | 269 | &.btn-default { 270 | background-color: @default; 271 | color: #000; 272 | text-shadow: none; 273 | transition: background .2s; 274 | &:hover { 275 | background-color: @defaultHover; 276 | color: #000; 277 | } 278 | } 279 | 280 | &.btn-purple { 281 | background-color: @purple; 282 | color: #FFF; 283 | text-shadow: none; 284 | transition: background .2s; 285 | &:hover { 286 | background-color: @purpleHover; 287 | color: #FFF; 288 | } 289 | } 290 | 291 | &.btn-dark { 292 | background-color: @dark; 293 | color: #FFF; 294 | text-shadow: none; 295 | transition: background .2s; 296 | &:hover { 297 | background-color: @darkHover; 298 | color: #FFF; 299 | } 300 | } 301 | } 302 | } 303 | } 304 | 305 | @keyframes type-blue { 306 | 1%, 100% { 307 | border-color: @blue; 308 | } 309 | 50% { 310 | border-color: lighten(@blue, 10%); 311 | } 312 | } 313 | @keyframes type-green { 314 | 1%, 100% { 315 | border-color: @green; 316 | } 317 | 50% { 318 | border-color: lighten(@green, 10%); 319 | } 320 | } 321 | @keyframes type-red { 322 | 1%, 100% { 323 | border-color: @red; 324 | } 325 | 50% { 326 | border-color: lighten(@red, 10%); 327 | } 328 | } 329 | @keyframes type-orange { 330 | 1%, 100% { 331 | border-color: @orange; 332 | } 333 | 50% { 334 | border-color: lighten(@orange, 10%); 335 | } 336 | } 337 | @keyframes type-purple { 338 | 1%, 100% { 339 | border-color: @purple; 340 | } 341 | 50% { 342 | border-color: lighten(@purple, 10%); 343 | } 344 | } 345 | @keyframes type-dark { 346 | 1%, 100% { 347 | border-color: @dark; 348 | } 349 | 50% { 350 | border-color: lighten(@dark, 10%); 351 | } 352 | } 353 | &.ng-confirm-type-animated .ng-confirm-box { 354 | animation-duration: 2s; 355 | animation-iteration-count: infinite; 356 | } 357 | &.ng-confirm-type-blue .ng-confirm-box { 358 | border-top: solid 7px @blue; 359 | animation-name: type-blue; 360 | } 361 | &.ng-confirm-type-green .ng-confirm-box { 362 | border-top: solid 7px @green; 363 | animation-name: type-green; 364 | } 365 | &.ng-confirm-type-red .ng-confirm-box { 366 | border-top: solid 7px @red; 367 | animation-name: type-red; 368 | } 369 | &.ng-confirm-type-orange .ng-confirm-box { 370 | border-top: solid 7px @orange; 371 | animation-name: type-orange; 372 | } 373 | &.ng-confirm-type-purple .ng-confirm-box { 374 | border-top: solid 7px @purple; 375 | animation-name: type-purple; 376 | } 377 | &.ng-confirm-type-dark .ng-confirm-box { 378 | border-top: solid 7px @dark; 379 | animation-name: type-dark; 380 | } 381 | 382 | .ng-confirm-clear { 383 | clear: both; 384 | } 385 | 386 | &.ng-confirm-rtl { 387 | direction: rtl; 388 | } 389 | 390 | .ng-confirm-box.ng-confirm-hilight { 391 | &.ng-confirm-hilight-shake { 392 | animation: shake 0.82s cubic-bezier(.36, .07, .19, .97) both; 393 | transform: translate3d(0, 0, 0); 394 | } 395 | &.ng-confirm-hilight-glow { 396 | animation: glow 0.82s cubic-bezier(.36, .07, .19, .97) both; 397 | transform: translate3d(0, 0, 0); 398 | } 399 | } 400 | } 401 | 402 | @keyframes shake { 403 | 10%, 90% { 404 | transform: translate3d(-2px, 0, 0); 405 | } 406 | 20%, 80% { 407 | transform: translate3d(4px, 0, 0); 408 | } 409 | 30%, 50%, 70% { 410 | transform: translate3d(-8px, 0, 0); 411 | } 412 | 40%, 60% { 413 | transform: translate3d(8px, 0, 0); 414 | } 415 | } 416 | 417 | @keyframes glow { 418 | 0%, 100% { 419 | box-shadow: 0 0 3px red; 420 | } 421 | 50% { 422 | box-shadow: 0 0 30px red; 423 | } 424 | } 425 | 426 | /*Transition rules*/ 427 | .ng-confirm { 428 | perspective: 400px; 429 | 430 | .ng-confirm-box { 431 | opacity: 1; 432 | //transition-property: all; 433 | 434 | &.ng-confirm-animation-top, &.ng-confirm-animation-left, &.ng-confirm-animation-right, &.ng-confirm-animation-bottom, &.ng-confirm-animation-opacity, &.ng-confirm-animation-zoom, &.ng-confirm-animation-scale, &.ng-confirm-animation-none, &.ng-confirm-animation-rotate, &.ng-confirm-animation-rotatex, &.ng-confirm-animation-rotatey, &.ng-confirm-animation-scaley, &.ng-confirm-animation-scalex { 435 | opacity: 0; 436 | } 437 | &.ng-confirm-animation-rotate { 438 | transform: rotate(90deg); 439 | } 440 | &.ng-confirm-animation-rotatex { 441 | transform: rotateX(90deg); 442 | transform-origin: center; 443 | } 444 | &.ng-confirm-animation-rotatexr { 445 | transform: rotateX(-90deg); 446 | transform-origin: center; 447 | } 448 | &.ng-confirm-animation-rotatey { 449 | transform: rotatey(90deg); 450 | transform-origin: center; 451 | } 452 | &.ng-confirm-animation-rotateyr { 453 | transform: rotatey(-90deg); 454 | transform-origin: center; 455 | } 456 | &.ng-confirm-animation-scaley { 457 | transform: scaley(1.5); 458 | transform-origin: center; 459 | } 460 | &.ng-confirm-animation-scalex { 461 | transform: scalex(1.5); 462 | transform-origin: center; 463 | } 464 | &.ng-confirm-animation-top { 465 | transform: translate(0px, -100px); 466 | } 467 | &.ng-confirm-animation-left { 468 | transform: translate(-100px, 0px); 469 | } 470 | &.ng-confirm-animation-right { 471 | transform: translate(100px, 0px); 472 | } 473 | &.ng-confirm-animation-bottom { 474 | transform: translate(0px, 100px); 475 | } 476 | &.ng-confirm-animation-opacity { 477 | 478 | } 479 | &.ng-confirm-animation-zoom { 480 | transform: scale(1.2); 481 | } 482 | &.ng-confirm-animation-scale { 483 | transform: scale(0.5); 484 | } 485 | &.ng-confirm-animation-none { 486 | visibility: hidden; 487 | } 488 | } 489 | } 490 | 491 | // themes 492 | .ng-confirm { 493 | 494 | &.ng-confirm-light, &.ng-confirm-white { 495 | .ng-confirm-bg { 496 | background-color: #444; 497 | opacity: .2; 498 | } 499 | .ng-confirm-icon-c { 500 | margin-right: 8px; 501 | } 502 | &.ng-confirm-rtl { 503 | .ng-confirm-closeIcon { 504 | left: 5px !important; 505 | right: auto !important; 506 | } 507 | .ng-confirm-icon-c { 508 | margin-right: 0; 509 | margin-left: 8px; 510 | } 511 | } 512 | .ng-confirm-box { 513 | box-shadow: 0 2px 6px rgba(0, 0, 0, .2); 514 | border-radius: 5px; 515 | 516 | .ng-confirm-closeIcon { 517 | line-height: 20px; 518 | } 519 | 520 | .ng-confirm-buttons { 521 | float: right; 522 | 523 | button { 524 | border: none; 525 | background-image: none; 526 | text-transform: uppercase; 527 | font-size: 14px; 528 | font-weight: bold; 529 | text-shadow: none; 530 | transition: background .1s; 531 | color: white; 532 | } 533 | button.btn-default { 534 | box-shadow: none; 535 | color: #333; 536 | 537 | &:hover { 538 | background: #ddd; 539 | } 540 | } 541 | } 542 | } 543 | } 544 | 545 | &.ng-confirm-dark, &.ng-confirm-black { 546 | .ng-confirm-bg { 547 | background-color: darkslategray; 548 | opacity: .4; 549 | } 550 | .ng-confirm-icon-c { 551 | margin-right: 8px; 552 | } 553 | &.ng-confirm-rtl { 554 | .ng-confirm-closeIcon { 555 | left: 5px !important; 556 | right: auto !important; 557 | } 558 | .ng-confirm-icon-c { 559 | margin-right: 0; 560 | margin-left: 8px; 561 | } 562 | } 563 | .ng-confirm-box { 564 | box-shadow: 0 2px 6px rgba(0, 0, 0, .2); 565 | background: #444; 566 | border-radius: 5px; 567 | 568 | .ng-confirm-closeIcon { 569 | line-height: 20px; 570 | } 571 | 572 | &.ng-confirm-loading { 573 | &:before { 574 | background: #444; 575 | } 576 | &:after { 577 | border-bottom-color: deepskyblue; 578 | } 579 | } 580 | 581 | *:not(input):not(textarea):not(select):not(option) { 582 | color: white; 583 | } 584 | input, textarea, select, option { 585 | color: initial; 586 | } 587 | 588 | .ng-confirm-buttons { 589 | float: right; 590 | 591 | button { 592 | border: none; 593 | background-image: none; 594 | text-transform: uppercase; 595 | font-size: 14px; 596 | font-weight: bold; 597 | text-shadow: none; 598 | transition: background .1s; 599 | color: white; 600 | } 601 | button.btn-default { 602 | box-shadow: none; 603 | color: #fff; 604 | background: none; 605 | 606 | &:hover { 607 | background: #666; 608 | } 609 | } 610 | } 611 | } 612 | } 613 | } 614 | 615 | .ng-confirm.ng-confirm-supervan { 616 | .ng-confirm-bg { 617 | background: #36465D; 618 | opacity: 0.99; 619 | } 620 | 621 | &.ng-confirm-type-blue .ng-confirm-box { 622 | border: none; 623 | } 624 | &.ng-confirm-type-blue .ng-confirm-bg { 625 | background: darken(@blue, 10%); 626 | } 627 | &.ng-confirm-type-green .ng-confirm-box { 628 | border: none; 629 | } 630 | &.ng-confirm-type-green .ng-confirm-bg { 631 | background: darken(@green, 10%); 632 | } 633 | &.ng-confirm-type-red .ng-confirm-box { 634 | border: none; 635 | } 636 | &.ng-confirm-type-red .ng-confirm-bg { 637 | background: darken(@red, 10%); 638 | } 639 | &.ng-confirm-type-orange .ng-confirm-box { 640 | border: none; 641 | } 642 | &.ng-confirm-type-orange .ng-confirm-bg { 643 | background: darken(@orange, 10%); 644 | } 645 | &.ng-confirm-type-purple .ng-confirm-box { 646 | border: none; 647 | } 648 | &.ng-confirm-type-purple .ng-confirm-bg { 649 | background: darken(@purple, 10%); 650 | } 651 | &.ng-confirm-type-dark .ng-confirm-box { 652 | border: none; 653 | } 654 | &.ng-confirm-type-dark .ng-confirm-bg { 655 | background: darken(@dark, 10%); 656 | } 657 | 658 | .ng-confirm-box { 659 | background-color: transparent; 660 | 661 | &.ng-confirm-loading { 662 | &:before { 663 | background: transparent; 664 | } 665 | &:after { 666 | border-bottom-color: transparent; 667 | } 668 | } 669 | 670 | div.ng-confirm-closeIcon { 671 | color: white; 672 | border-radius: 50px; 673 | height: 26px; 674 | width: 26px; 675 | line-height: 26px; 676 | top: 2px; 677 | right: 2px; 678 | box-shadow: 0 0 0 2px #ddd; 679 | } 680 | 681 | *:not(input):not(textarea):not(select):not(option) { 682 | color: white; 683 | } 684 | 685 | input, textarea, select, option { 686 | color: initial; 687 | } 688 | 689 | div.ng-confirm-closeIcon { 690 | color: white; 691 | } 692 | 693 | div.ng-confirm-title-c { 694 | text-align: center; 695 | font-size: 28px; 696 | font-weight: normal; 697 | padding-bottom: 25px; 698 | > * { 699 | display: block; 700 | } 701 | .ng-confirm-icon-c { 702 | margin: 0 0 20px; 703 | font-size: 50px; 704 | } 705 | } 706 | div.ng-confirm-content-pane { 707 | margin-bottom: 25px; 708 | } 709 | div.ng-confirm-content { 710 | text-align: center; 711 | 712 | &:empty { 713 | &:before { 714 | 715 | } 716 | &:after { 717 | 718 | } 719 | } 720 | } 721 | .ng-confirm-buttons { 722 | text-align: center; 723 | 724 | button { 725 | font-size: 16px; 726 | border-radius: 2px; 727 | text-shadow: none; 728 | border: none; 729 | color: white; 730 | padding: 10px; 731 | min-width: 100px; 732 | } 733 | button.btn-default { 734 | background: darken(#36465D, 3%); 735 | } 736 | button.btn-default:hover { 737 | background: darken(#36465D, 4%); 738 | color: white; 739 | } 740 | } 741 | } 742 | } 743 | 744 | .ng-confirm.ng-confirm-material { 745 | .ng-confirm-bg { 746 | background: dimgray; 747 | opacity: .6; 748 | } 749 | .ng-confirm-icon-c { 750 | margin-right: 8px; 751 | } 752 | .ng-confirm-box { 753 | background-color: white; 754 | box-shadow: 0 7px 8px -4px rgba(0, 0, 0, .2), 0 13px 19px 2px rgba(0, 0, 0, .14), 0 5px 24px 4px rgba(0, 0, 0, .12); 755 | padding: 30px 25px 10px 25px; 756 | 757 | div.ng-confirm-closeIcon { 758 | color: rgba(0, 0, 0, .87); 759 | line-height: 20px; 760 | top: 15px; 761 | right: 15px; 762 | } 763 | 764 | div.ng-confirm-title-c { 765 | color: rgba(0, 0, 0, .87); 766 | font-size: 22px; 767 | font-weight: bold; 768 | } 769 | div.ng-confirm-content { 770 | text-align: left; 771 | color: rgba(0, 0, 0, .87); 772 | 773 | &:empty { 774 | &:before { 775 | 776 | } 777 | &:after { 778 | 779 | } 780 | } 781 | } 782 | .ng-confirm-buttons { 783 | text-align: right; 784 | 785 | button { 786 | text-transform: uppercase; 787 | font-weight: 500; 788 | } 789 | button + button { 790 | 791 | } 792 | } 793 | } 794 | 795 | &.ng-confirm-rtl { 796 | .ng-confirm-closeIcon { 797 | left: 15px !important; 798 | right: auto !important; 799 | } 800 | .ng-confirm-icon-c { 801 | margin-right: 0; 802 | margin-left: 8px; 803 | } 804 | } 805 | } 806 | 807 | .ng-confirm.ng-confirm-bootstrap { 808 | .ng-confirm-bg { 809 | background-color: rgba(0, 0, 0, .21); 810 | } 811 | 812 | .ng-confirm-icon-c { 813 | margin-right: 8px; 814 | } 815 | 816 | .ng-confirm-box { 817 | background-color: white; 818 | box-shadow: 0 3px 8px 0px rgba(0, 0, 0, 0.2); 819 | border: solid 1px rgba(0, 0, 0, 0.4); 820 | padding: 15px 0 0; 821 | border-radius: 6px; 822 | 823 | div.ng-confirm-closeIcon { 824 | color: rgba(0, 0, 0, 0.87); 825 | line-height: 20px; 826 | } 827 | 828 | div.ng-confirm-title-c { 829 | color: rgba(0, 0, 0, 0.87); 830 | font-size: 22px; 831 | font-weight: bold; 832 | padding-left: 15px; 833 | padding-right: 15px; 834 | } 835 | div.ng-confirm-content-pane { 836 | 837 | } 838 | div.ng-confirm-content { 839 | text-align: left; 840 | color: rgba(0, 0, 0, 0.87); 841 | padding: 0px 15px; 842 | 843 | &:empty { 844 | &:before { 845 | 846 | } 847 | &:after { 848 | 849 | } 850 | } 851 | } 852 | 853 | .ng-confirm-buttons { 854 | text-align: right; 855 | padding: 15px; 856 | margin: -5px 0 0px; 857 | border-top: solid 1px #ddd; 858 | overflow: hidden; 859 | border-radius: 0 0 4px 4px; 860 | 861 | button { 862 | font-weight: 500; 863 | border-radius: 0px; 864 | margin: 0; 865 | } 866 | button:first-child { 867 | border-radius: 4px 0 0 4px; 868 | } 869 | button:last-child { 870 | border-radius: 0 4px 4px 0; 871 | } 872 | } 873 | } 874 | 875 | &.ng-confirm-rtl { 876 | .ng-confirm-closeIcon { 877 | left: 5px !important; 878 | right: auto !important; 879 | } 880 | .ng-confirm-icon-c { 881 | margin-right: 0; 882 | margin-left: 8px; 883 | } 884 | } 885 | } 886 | 887 | .ng-confirm.ng-confirm-modern { 888 | .ng-confirm-bg { 889 | background-color: slategray; 890 | opacity: .6; 891 | } 892 | 893 | .ng-confirm-icon-c { 894 | margin-right: 8px; 895 | } 896 | 897 | .ng-confirm-box { 898 | background-color: white; 899 | box-shadow: 0 7px 8px -4px rgba(0, 0, 0, .2), 0 13px 19px 2px rgba(0, 0, 0, .14), 0 5px 24px 4px rgba(0, 0, 0, .12); 900 | padding: 25px 25px 10px 25px; 901 | 902 | div.ng-confirm-closeIcon { 903 | color: rgba(0, 0, 0, 0.87); 904 | border-radius: 50px; 905 | height: 25px; 906 | width: 25px; 907 | line-height: 25px !important; 908 | top: 10px; 909 | right: 10px; 910 | box-shadow: 0 0 0 2px #ddd; 911 | } 912 | 913 | div.ng-confirm-title-c { 914 | color: rgba(0, 0, 0, .87); 915 | font-size: 24px; 916 | font-weight: bold; 917 | text-align: center; 918 | margin-bottom: 10px; 919 | 920 | .ng-confirm-icon-c { 921 | display: block; 922 | margin-right: 0px; 923 | margin-left: 0px; 924 | margin-bottom: 10px; 925 | font-size: 69px; 926 | color: #aaa; 927 | } 928 | } 929 | 930 | div.ng-confirm-content { 931 | //text-align: center; 932 | font-size: 15px; 933 | color: #777; 934 | margin-bottom: 25px; 935 | 936 | &:empty { 937 | &:before { 938 | 939 | } 940 | &:after { 941 | 942 | } 943 | } 944 | } 945 | .ng-confirm-buttons { 946 | text-align: center; 947 | 948 | button { 949 | font-weight: bold; 950 | text-transform: uppercase; 951 | transition: background .1s; 952 | 953 | &.btn-success { 954 | 955 | } 956 | } 957 | button + button { 958 | margin-left: 4px; 959 | } 960 | } 961 | } 962 | } 963 | 964 | .ng-confirm.ng-confirm-seamless { 965 | .ng-confirm-bg { 966 | background-color: rgba(255, 255, 255, .5); 967 | &:before { 968 | border-bottom-color: dodgerblue; 969 | } 970 | } 971 | 972 | .ng-confirm-icon-c { 973 | margin-right: 8px; 974 | } 975 | 976 | .ng-confirm-box { 977 | background-color: white; 978 | box-shadow: 0 7px 8px -4px rgba(0, 0, 0, .2), 0 13px 19px 2px rgba(0, 0, 0, .14), 0 5px 24px 4px rgba(0, 0, 0, .12); 979 | padding: 20px 0 10px 0; 980 | 981 | div.ng-confirm-closeIcon { 982 | color: rgba(0, 0, 0, 0.87); 983 | border-radius: 50px; 984 | height: 25px; 985 | width: 25px; 986 | line-height: 25px !important; 987 | top: 10px; 988 | right: 10px; 989 | box-shadow: 0 0 0 2px #ddd; 990 | } 991 | 992 | div.ng-confirm-title-c { 993 | color: rgba(0, 0, 0, .87); 994 | font-size: 24px; 995 | text-align: center; 996 | 997 | .ng-confirm-icon-c { 998 | color: #aaa; 999 | } 1000 | .ng-confirm-title { 1001 | font-weight: bold; 1002 | } 1003 | } 1004 | 1005 | div.ng-confirm-content { 1006 | text-align: center; 1007 | font-size: 15px; 1008 | color: #464646; 1009 | margin-bottom: 25px; 1010 | 1011 | &:empty { 1012 | &:before { 1013 | 1014 | } 1015 | &:after { 1016 | 1017 | } 1018 | } 1019 | } 1020 | .ng-confirm-buttons { 1021 | text-align: center; 1022 | 1023 | button { 1024 | font-size: 16px; 1025 | font-weight: bold; 1026 | &.btn-success { 1027 | 1028 | } 1029 | } 1030 | button + button { 1031 | margin-left: 4px; 1032 | } 1033 | } 1034 | } 1035 | } 1036 | 1037 | .ng-confirm-el-hide { 1038 | display: none !important; 1039 | } -------------------------------------------------------------------------------- /demo/demo.css: -------------------------------------------------------------------------------- 1 | body { 2 | background: #fff; 3 | } 4 | 5 | .navbar-right iframe { 6 | margin: 11px 10px 0 10px; 7 | } 8 | 9 | .affix { 10 | position: fixed; 11 | top: 0; 12 | width: 100% 13 | } 14 | 15 | .aconfirm-logo { 16 | background-image: url('../angular-confirm.png'); 17 | background-size: contain; 18 | background-position: center; 19 | background-repeat: no-repeat; 20 | width: 152px; 21 | } 22 | 23 | .download-btns .btn{ 24 | background: white; 25 | color: crimson; 26 | border-radius: 4px; 27 | } 28 | 29 | kbd.blue { 30 | background-color: #2980b9; 31 | font-family: inherit; 32 | padding-left: 10px; 33 | padding-right: 10px 34 | } 35 | 36 | .section { 37 | border-left: solid 1px #ddd; 38 | padding-left: 15px; 39 | } 40 | 41 | .spacer15 { 42 | height: 15px 43 | } 44 | 45 | pre ol { 46 | margin: 0 !important 47 | } 48 | 49 | .btn { 50 | /*background-image: none;*/ 51 | /*border: 0*/ 52 | outline: none; 53 | } 54 | 55 | .com { 56 | color: #93a1a1 57 | } 58 | 59 | .lit { 60 | color: #195f91 61 | } 62 | 63 | .clo, .opn, .pun { 64 | color: #93a1a1 65 | } 66 | 67 | .fun { 68 | color: #dc322f 69 | } 70 | 71 | .atv, .str { 72 | color: #D14 73 | } 74 | 75 | .kwd, .prettyprint .tag { 76 | color: #1e347b 77 | } 78 | 79 | .atn, .dec, .typ, .var { 80 | color: teal 81 | } 82 | 83 | .pln { 84 | color: #48484c 85 | } 86 | 87 | .prettyprint { 88 | padding: 8px; 89 | background-color: #FBFBFC; 90 | border: 1px solid #e1e1e8 91 | } 92 | 93 | .prettyprint.linenums { 94 | -webkit-box-shadow: inset 40px 0 0 #fbfbfc, inset 41px 0 0 #ececf0; 95 | box-shadow: inset 48px 0 0 #fbfbfc, inset 48px 0 0 #FFFFFF; 96 | } 97 | 98 | ol.linenums { 99 | margin: 0 0 0 33px 100 | } 101 | 102 | ol.linenums li { 103 | padding-left: 12px; 104 | color: #bebec5; 105 | line-height: 20px; 106 | text-shadow: 0 1px 0 #fff 107 | } 108 | 109 | .special { 110 | font-style: italic; 111 | font-weight: 700 !important; 112 | color: #bc0000 !important; 113 | background: #000 114 | } 115 | 116 | ul.nav.nav-list li a { 117 | text-align: left; 118 | } 119 | ul.nav.nav-list li > a { 120 | color: #444; 121 | padding: 5px 10px; 122 | box-shadow: -1px 0px 0 -0px #ddd; 123 | } 124 | ul.nav.nav-list li > a:hover { 125 | box-shadow: -7px 0px 0 -5px black; 126 | background: transparent; 127 | } 128 | ul.nav.nav-list li li a { 129 | color: #444; 130 | padding: 0px 20px; 131 | box-shadow: -1px 0px 0 -0px #ddd; 132 | } 133 | ul.nav.nav-list li li:last-child a { 134 | margin-bottom: 5px; 135 | } 136 | ul.nav.nav-list li.active > a { 137 | color: #3498DB; 138 | font-weight: bold; 139 | box-shadow: -7px 0px 0 -5px #3498DB; 140 | } 141 | ul.nav.nav-list li ul { 142 | display: none; 143 | } 144 | ul.nav.nav-list li.active ul { 145 | display: block; 146 | } 147 | ul.nav.nav-list li.no-b-l a{ 148 | box-shadow: none; 149 | } 150 | .navheader{ 151 | margin-bottom: 0px; 152 | background: white; 153 | } 154 | .header{ 155 | position: relative; 156 | padding: 30px 0; 157 | color: #cdbfe3; 158 | text-align: center; 159 | text-shadow: 0 1px 0 rgba(0,0,0,.1); 160 | background-color: #E23337; 161 | background-image: -webkit-gradient(linear,left top,left bottom,from(#B63032),to(#E23337)); 162 | background-image: -webkit-linear-gradient(top,#B63032 0,#E23337 100%); 163 | background-image: -o-linear-gradient(top,#B63032 0,#E23337 100%); 164 | background-image: linear-gradient(to bottom,#B63032 0,#E23337 100%); 165 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#B63032', endColorstr='#E23337', GradientType=0); 166 | background-repeat: repeat-x; 167 | color: white; 168 | } 169 | .header p{ 170 | color: #f8f8f8; 171 | font-size: 24px; 172 | } 173 | .header img{ 174 | max-width: 400px; 175 | } 176 | @media all and (max-width: 500px){ 177 | .header img{ 178 | max-width: none; 179 | width: 100%; 180 | } 181 | .header .btn{ 182 | display: block; 183 | } 184 | .header .btn + .btn{ 185 | margin-top: 5px; 186 | } 187 | } 188 | .v{ 189 | vertical-align: text-top; 190 | } 191 | 192 | .space10 { 193 | height: 10px; 194 | } 195 | body { 196 | font-family: Segoe UI, Frutiger, Frutiger Linotype, Dejavu Sans, Helvetica Neue, Arial, sans-serif; 197 | position: relative; 198 | } 199 | 200 | @media all and (max-width: 992px) { 201 | #my-nav-sticky-wrapper{ 202 | display: none; 203 | } 204 | } -------------------------------------------------------------------------------- /demo/demo.js: -------------------------------------------------------------------------------- 1 | if (typeof jQuery == "undefined") {throw new Error("Documentation needs the jQuery library to function.")}; 2 | $('body').scrollspy({ 3 | target: '#my-nav', 4 | offset: 100 5 | }); 6 | var bs = $('.footer').outerHeight()+10; 7 | $("#my-nav").sticky({topSpacing:20, bottomSpacing: bs}); 8 | $("span.version").html(version || ""); 9 | 10 | $(document).ready(function () { 11 | prettyPrint(); 12 | $("span.version").html(version || ""); 13 | }); 14 | function rs(){ 15 | 16 | } 17 | $(window).resize(function(){ 18 | rs(); 19 | }) 20 | rs(); -------------------------------------------------------------------------------- /demo/libs/fonts/FontAwesome.otf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/craftpip/angular-confirm/0283ef1ce55b263f7db71d3d1ced357b9b3ef3c7/demo/libs/fonts/FontAwesome.otf -------------------------------------------------------------------------------- /demo/libs/fonts/fontawesome-webfont.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/craftpip/angular-confirm/0283ef1ce55b263f7db71d3d1ced357b9b3ef3c7/demo/libs/fonts/fontawesome-webfont.eot -------------------------------------------------------------------------------- /demo/libs/fonts/fontawesome-webfont.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/craftpip/angular-confirm/0283ef1ce55b263f7db71d3d1ced357b9b3ef3c7/demo/libs/fonts/fontawesome-webfont.ttf -------------------------------------------------------------------------------- /demo/libs/fonts/fontawesome-webfont.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/craftpip/angular-confirm/0283ef1ce55b263f7db71d3d1ced357b9b3ef3c7/demo/libs/fonts/fontawesome-webfont.woff -------------------------------------------------------------------------------- /demo/libs/fonts/fontawesome-webfont.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/craftpip/angular-confirm/0283ef1ce55b263f7db71d3d1ced357b9b3ef3c7/demo/libs/fonts/fontawesome-webfont.woff2 -------------------------------------------------------------------------------- /demo/logo-name.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 7 | 8 | 14 | 16 | 26 | 37 | 48 | 49 | 50 | -------------------------------------------------------------------------------- /dist/angular-confirm.min.css: -------------------------------------------------------------------------------- 1 | /*! 2 | * angular-confirm v1.1.0 (http://craftpip.github.io/angular-confirm/) 3 | * Author: boniface pereira 4 | * Website: www.craftpip.com 5 | * Contact: hey@craftpip.com 6 | * 7 | * Copyright 2016-2017 angular-confirm 8 | * Licensed under MIT (https://github.com/craftpip/angular-confirm/blob/master/LICENSE) 9 | */@-webkit-keyframes ng-confirm-spin{from{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes ng-confirm-spin{from{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}body[class*=ng-confirm-no-scroll-]{overflow:hidden!important}.ng-confirm{position:fixed;top:0;left:0;right:0;bottom:0;z-index:99999999;font-family:inherit;overflow:hidden}.ng-confirm .ng-confirm-bg{position:fixed;top:0;left:0;right:0;bottom:0;-webkit-transition:opacity .4s,background .4s;transition:opacity .4s,background .4s}.ng-confirm .ng-confirm-bg.ng-confirm-bg-h{opacity:0!important}.ng-confirm .ng-confirm-scrollpane{position:fixed;top:0;left:0;right:0;bottom:0;overflow-y:auto;-webkit-perspective:500px;perspective:500px;-webkit-perspective-origin:center;perspective-origin:center;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.ng-confirm .ng-confirm-box{background:white;border-radius:4px;position:relative;outline:0;padding:15px 15px 0;overflow:hidden;margin-left:auto;margin-right:auto}.ng-confirm .ng-confirm-box.ng-confirm-loading{min-height:120px}.ng-confirm .ng-confirm-box.ng-confirm-loading:before{content:'';position:absolute;left:0;background:white;right:0;top:0;bottom:0;border-radius:10px;z-index:1}.ng-confirm .ng-confirm-box.ng-confirm-loading:after{opacity:.6;content:'';height:30px;width:30px;border:solid 3px transparent;position:absolute;left:50%;margin-left:-15px;border-radius:50%;-webkit-animation:ng-confirm-spin 1s infinite linear;animation:ng-confirm-spin 1s infinite linear;border-bottom-color:dodgerblue;top:50%;margin-top:-15px;z-index:2}.ng-confirm .ng-confirm-box div.ng-confirm-closeIcon{height:20px;width:20px;position:absolute;top:5px;right:5px;cursor:pointer;opacity:.6;text-align:center;-webkit-transition:opacity .3s ease-in;transition:opacity .3s ease-in;font-size:27px!important;line-height:14px;font-family:Arial,"Helvetica Neue",Helvetica,sans-serif}.ng-confirm .ng-confirm-box div.ng-confirm-closeIcon:empty{display:none}.ng-confirm .ng-confirm-box div.ng-confirm-closeIcon .fa,.ng-confirm .ng-confirm-box div.ng-confirm-closeIcon .glyphicon,.ng-confirm .ng-confirm-box div.ng-confirm-closeIcon .zmdi{font-size:16px;line-height:25px;vertical-align:bottom}.ng-confirm .ng-confirm-box div.ng-confirm-closeIcon:hover{opacity:1}.ng-confirm .ng-confirm-box div.ng-confirm-title-c{display:block;font-size:22px;line-height:20px;padding-bottom:15px}.ng-confirm .ng-confirm-box div.ng-confirm-title-c .ng-confirm-icon-c{font-size:inherit;display:inline-block;vertical-align:top}.ng-confirm .ng-confirm-box div.ng-confirm-title-c .ng-confirm-icon-c i{vertical-align:middle}.ng-confirm .ng-confirm-box div.ng-confirm-title-c .ng-confirm-icon-c:empty{display:none}.ng-confirm .ng-confirm-box div.ng-confirm-title-c .ng-confirm-title{font-size:inherit;font-family:inherit;display:inline-block;vertical-align:middle;-webkit-user-select:initial;-moz-user-select:initial;-ms-user-select:initial;user-select:initial}.ng-confirm .ng-confirm-box div.ng-confirm-title-c .ng-confirm-title:empty{display:none}.ng-confirm .ng-confirm-box div.ng-confirm-content-pane{margin-bottom:15px;height:0;display:inline-block;width:100%;position:relative;overflow:hidden}.ng-confirm .ng-confirm-box div.ng-confirm-content-pane .ng-confirm-content{width:100%;height:auto;-webkit-user-select:initial;-moz-user-select:initial;-ms-user-select:initial;user-select:initial}.ng-confirm .ng-confirm-box div.ng-confirm-content-pane .ng-confirm-content img{width:100%;height:auto}.ng-confirm .ng-confirm-box div.ng-confirm-content-pane .ng-confirm-content:empty{display:none}.ng-confirm .ng-confirm-box .ng-confirm-buttons{padding-bottom:11px}.ng-confirm .ng-confirm-box .ng-confirm-buttons>button{margin-bottom:4px;margin-left:2px;margin-right:2px}.ng-confirm .ng-confirm-box .ng-confirm-buttons button{display:inline-block;padding:6px 12px;font-size:14px;font-weight:400;line-height:1.42857143;text-align:center;white-space:nowrap;vertical-align:middle;-ms-touch-action:manipulation;touch-action:manipulation;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;border-radius:4px;min-height:1em;outline:0;-webkit-transition:opacity .1s ease,background-color .1s ease,color .1s ease,box-shadow .1s ease,background .1s ease;transition:opacity .1s ease,background-color .1s ease,color .1s ease,box-shadow .1s ease,background .1s ease;-webkit-tap-highlight-color:transparent;border:0;background-image:none}.ng-confirm .ng-confirm-box .ng-confirm-buttons button.btn-blue{background-color:#3498db;color:#FFF;text-shadow:none;-webkit-transition:background .2s;transition:background .2s}.ng-confirm .ng-confirm-box .ng-confirm-buttons button.btn-blue:hover{background-color:#2980b9;color:#FFF}.ng-confirm .ng-confirm-box .ng-confirm-buttons button.btn-green{background-color:#2ecc71;color:#FFF;text-shadow:none;-webkit-transition:background .2s;transition:background .2s}.ng-confirm .ng-confirm-box .ng-confirm-buttons button.btn-green:hover{background-color:#27ae60;color:#FFF}.ng-confirm .ng-confirm-box .ng-confirm-buttons button.btn-red{background-color:#e74c3c;color:#FFF;text-shadow:none;-webkit-transition:background .2s;transition:background .2s}.ng-confirm .ng-confirm-box .ng-confirm-buttons button.btn-red:hover{background-color:#c0392b;color:#FFF}.ng-confirm .ng-confirm-box .ng-confirm-buttons button.btn-orange{background-color:#f1c40f;color:#FFF;text-shadow:none;-webkit-transition:background .2s;transition:background .2s}.ng-confirm .ng-confirm-box .ng-confirm-buttons button.btn-orange:hover{background-color:#f39c12;color:#FFF}.ng-confirm .ng-confirm-box .ng-confirm-buttons button.btn-default{background-color:#ecf0f1;color:#000;text-shadow:none;-webkit-transition:background .2s;transition:background .2s}.ng-confirm .ng-confirm-box .ng-confirm-buttons button.btn-default:hover{background-color:#bdc3c7;color:#000}.ng-confirm .ng-confirm-box .ng-confirm-buttons button.btn-purple{background-color:#9b59b6;color:#FFF;text-shadow:none;-webkit-transition:background .2s;transition:background .2s}.ng-confirm .ng-confirm-box .ng-confirm-buttons button.btn-purple:hover{background-color:#8e44ad;color:#FFF}.ng-confirm .ng-confirm-box .ng-confirm-buttons button.btn-dark{background-color:#34495e;color:#FFF;text-shadow:none;-webkit-transition:background .2s;transition:background .2s}.ng-confirm .ng-confirm-box .ng-confirm-buttons button.btn-dark:hover{background-color:#2c3e50;color:#FFF}@-webkit-keyframes type-blue{1%,100%{border-color:#3498db}50%{border-color:#5faee3}}@keyframes type-blue{1%,100%{border-color:#3498db}50%{border-color:#5faee3}}@-webkit-keyframes type-green{1%,100%{border-color:#2ecc71}50%{border-color:#54d98c}}@keyframes type-green{1%,100%{border-color:#2ecc71}50%{border-color:#54d98c}}@-webkit-keyframes type-red{1%,100%{border-color:#e74c3c}50%{border-color:#ed7669}}@keyframes type-red{1%,100%{border-color:#e74c3c}50%{border-color:#ed7669}}@-webkit-keyframes type-orange{1%,100%{border-color:#f1c40f}50%{border-color:#f4d03f}}@keyframes type-orange{1%,100%{border-color:#f1c40f}50%{border-color:#f4d03f}}@-webkit-keyframes type-purple{1%,100%{border-color:#9b59b6}50%{border-color:#b07cc6}}@keyframes type-purple{1%,100%{border-color:#9b59b6}50%{border-color:#b07cc6}}@-webkit-keyframes type-dark{1%,100%{border-color:#34495e}50%{border-color:#46627f}}@keyframes type-dark{1%,100%{border-color:#34495e}50%{border-color:#46627f}}.ng-confirm.ng-confirm-type-animated .ng-confirm-box{-webkit-animation-duration:2s;animation-duration:2s;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}.ng-confirm.ng-confirm-type-blue .ng-confirm-box{border-top:solid 7px #3498db;-webkit-animation-name:type-blue;animation-name:type-blue}.ng-confirm.ng-confirm-type-green .ng-confirm-box{border-top:solid 7px #2ecc71;-webkit-animation-name:type-green;animation-name:type-green}.ng-confirm.ng-confirm-type-red .ng-confirm-box{border-top:solid 7px #e74c3c;-webkit-animation-name:type-red;animation-name:type-red}.ng-confirm.ng-confirm-type-orange .ng-confirm-box{border-top:solid 7px #f1c40f;-webkit-animation-name:type-orange;animation-name:type-orange}.ng-confirm.ng-confirm-type-purple .ng-confirm-box{border-top:solid 7px #9b59b6;-webkit-animation-name:type-purple;animation-name:type-purple}.ng-confirm.ng-confirm-type-dark .ng-confirm-box{border-top:solid 7px #34495e;-webkit-animation-name:type-dark;animation-name:type-dark}.ng-confirm .ng-confirm-clear{clear:both}.ng-confirm.ng-confirm-rtl{direction:rtl}.ng-confirm .ng-confirm-box.ng-confirm-hilight.ng-confirm-hilight-shake{-webkit-animation:shake .82s cubic-bezier(0.36,0.07,0.19,0.97) both;animation:shake .82s cubic-bezier(0.36,0.07,0.19,0.97) both;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.ng-confirm .ng-confirm-box.ng-confirm-hilight.ng-confirm-hilight-glow{-webkit-animation:glow .82s cubic-bezier(0.36,0.07,0.19,0.97) both;animation:glow .82s cubic-bezier(0.36,0.07,0.19,0.97) both;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}@-webkit-keyframes shake{10%,90%{-webkit-transform:translate3d(-2px,0,0);transform:translate3d(-2px,0,0)}20%,80%{-webkit-transform:translate3d(4px,0,0);transform:translate3d(4px,0,0)}30%,50%,70%{-webkit-transform:translate3d(-8px,0,0);transform:translate3d(-8px,0,0)}40%,60%{-webkit-transform:translate3d(8px,0,0);transform:translate3d(8px,0,0)}}@keyframes shake{10%,90%{-webkit-transform:translate3d(-2px,0,0);transform:translate3d(-2px,0,0)}20%,80%{-webkit-transform:translate3d(4px,0,0);transform:translate3d(4px,0,0)}30%,50%,70%{-webkit-transform:translate3d(-8px,0,0);transform:translate3d(-8px,0,0)}40%,60%{-webkit-transform:translate3d(8px,0,0);transform:translate3d(8px,0,0)}}@-webkit-keyframes glow{0%,100%{box-shadow:0 0 3px red}50%{box-shadow:0 0 30px red}}@keyframes glow{0%,100%{box-shadow:0 0 3px red}50%{box-shadow:0 0 30px red}}.ng-confirm{-webkit-perspective:400px;perspective:400px}.ng-confirm .ng-confirm-box{opacity:1}.ng-confirm .ng-confirm-box.ng-confirm-animation-top,.ng-confirm .ng-confirm-box.ng-confirm-animation-left,.ng-confirm .ng-confirm-box.ng-confirm-animation-right,.ng-confirm .ng-confirm-box.ng-confirm-animation-bottom,.ng-confirm .ng-confirm-box.ng-confirm-animation-opacity,.ng-confirm .ng-confirm-box.ng-confirm-animation-zoom,.ng-confirm .ng-confirm-box.ng-confirm-animation-scale,.ng-confirm .ng-confirm-box.ng-confirm-animation-none,.ng-confirm .ng-confirm-box.ng-confirm-animation-rotate,.ng-confirm .ng-confirm-box.ng-confirm-animation-rotatex,.ng-confirm .ng-confirm-box.ng-confirm-animation-rotatey,.ng-confirm .ng-confirm-box.ng-confirm-animation-scaley,.ng-confirm .ng-confirm-box.ng-confirm-animation-scalex{opacity:0}.ng-confirm .ng-confirm-box.ng-confirm-animation-rotate{-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg)}.ng-confirm .ng-confirm-box.ng-confirm-animation-rotatex{-webkit-transform:rotateX(90deg);transform:rotateX(90deg);-webkit-transform-origin:center;-ms-transform-origin:center;transform-origin:center}.ng-confirm .ng-confirm-box.ng-confirm-animation-rotatexr{-webkit-transform:rotateX(-90deg);transform:rotateX(-90deg);-webkit-transform-origin:center;-ms-transform-origin:center;transform-origin:center}.ng-confirm .ng-confirm-box.ng-confirm-animation-rotatey{-webkit-transform:rotatey(90deg);-ms-transform:rotatey(90deg);transform:rotatey(90deg);-webkit-transform-origin:center;-ms-transform-origin:center;transform-origin:center}.ng-confirm .ng-confirm-box.ng-confirm-animation-rotateyr{-webkit-transform:rotatey(-90deg);-ms-transform:rotatey(-90deg);transform:rotatey(-90deg);-webkit-transform-origin:center;-ms-transform-origin:center;transform-origin:center}.ng-confirm .ng-confirm-box.ng-confirm-animation-scaley{-webkit-transform:scaley(1.5);-ms-transform:scaley(1.5);transform:scaley(1.5);-webkit-transform-origin:center;-ms-transform-origin:center;transform-origin:center}.ng-confirm .ng-confirm-box.ng-confirm-animation-scalex{-webkit-transform:scalex(1.5);-ms-transform:scalex(1.5);transform:scalex(1.5);-webkit-transform-origin:center;-ms-transform-origin:center;transform-origin:center}.ng-confirm .ng-confirm-box.ng-confirm-animation-top{-webkit-transform:translate(0px,-100px);-ms-transform:translate(0px,-100px);transform:translate(0px,-100px)}.ng-confirm .ng-confirm-box.ng-confirm-animation-left{-webkit-transform:translate(-100px,0px);-ms-transform:translate(-100px,0px);transform:translate(-100px,0px)}.ng-confirm .ng-confirm-box.ng-confirm-animation-right{-webkit-transform:translate(100px,0px);-ms-transform:translate(100px,0px);transform:translate(100px,0px)}.ng-confirm .ng-confirm-box.ng-confirm-animation-bottom{-webkit-transform:translate(0px,100px);-ms-transform:translate(0px,100px);transform:translate(0px,100px)}.ng-confirm .ng-confirm-box.ng-confirm-animation-zoom{-webkit-transform:scale(1.2);-ms-transform:scale(1.2);transform:scale(1.2)}.ng-confirm .ng-confirm-box.ng-confirm-animation-scale{-webkit-transform:scale(0.5);-ms-transform:scale(0.5);transform:scale(0.5)}.ng-confirm .ng-confirm-box.ng-confirm-animation-none{visibility:hidden}.ng-confirm.ng-confirm-light .ng-confirm-bg,.ng-confirm.ng-confirm-white .ng-confirm-bg{background-color:#444;opacity:.2}.ng-confirm.ng-confirm-light .ng-confirm-icon-c,.ng-confirm.ng-confirm-white .ng-confirm-icon-c{margin-right:8px}.ng-confirm.ng-confirm-light.ng-confirm-rtl .ng-confirm-closeIcon,.ng-confirm.ng-confirm-white.ng-confirm-rtl .ng-confirm-closeIcon{left:5px!important;right:auto!important}.ng-confirm.ng-confirm-light.ng-confirm-rtl .ng-confirm-icon-c,.ng-confirm.ng-confirm-white.ng-confirm-rtl .ng-confirm-icon-c{margin-right:0;margin-left:8px}.ng-confirm.ng-confirm-light .ng-confirm-box,.ng-confirm.ng-confirm-white .ng-confirm-box{box-shadow:0 2px 6px rgba(0,0,0,0.2);border-radius:5px}.ng-confirm.ng-confirm-light .ng-confirm-box .ng-confirm-closeIcon,.ng-confirm.ng-confirm-white .ng-confirm-box .ng-confirm-closeIcon{line-height:20px}.ng-confirm.ng-confirm-light .ng-confirm-box .ng-confirm-buttons,.ng-confirm.ng-confirm-white .ng-confirm-box .ng-confirm-buttons{float:right}.ng-confirm.ng-confirm-light .ng-confirm-box .ng-confirm-buttons button,.ng-confirm.ng-confirm-white .ng-confirm-box .ng-confirm-buttons button{border:0;background-image:none;text-transform:uppercase;font-size:14px;font-weight:bold;text-shadow:none;-webkit-transition:background .1s;transition:background .1s;color:white}.ng-confirm.ng-confirm-light .ng-confirm-box .ng-confirm-buttons button.btn-default,.ng-confirm.ng-confirm-white .ng-confirm-box .ng-confirm-buttons button.btn-default{box-shadow:none;color:#333}.ng-confirm.ng-confirm-light .ng-confirm-box .ng-confirm-buttons button.btn-default:hover,.ng-confirm.ng-confirm-white .ng-confirm-box .ng-confirm-buttons button.btn-default:hover{background:#ddd}.ng-confirm.ng-confirm-dark .ng-confirm-bg,.ng-confirm.ng-confirm-black .ng-confirm-bg{background-color:darkslategray;opacity:.4}.ng-confirm.ng-confirm-dark .ng-confirm-icon-c,.ng-confirm.ng-confirm-black .ng-confirm-icon-c{margin-right:8px}.ng-confirm.ng-confirm-dark.ng-confirm-rtl .ng-confirm-closeIcon,.ng-confirm.ng-confirm-black.ng-confirm-rtl .ng-confirm-closeIcon{left:5px!important;right:auto!important}.ng-confirm.ng-confirm-dark.ng-confirm-rtl .ng-confirm-icon-c,.ng-confirm.ng-confirm-black.ng-confirm-rtl .ng-confirm-icon-c{margin-right:0;margin-left:8px}.ng-confirm.ng-confirm-dark .ng-confirm-box,.ng-confirm.ng-confirm-black .ng-confirm-box{box-shadow:0 2px 6px rgba(0,0,0,0.2);background:#444;border-radius:5px}.ng-confirm.ng-confirm-dark .ng-confirm-box .ng-confirm-closeIcon,.ng-confirm.ng-confirm-black .ng-confirm-box .ng-confirm-closeIcon{line-height:20px}.ng-confirm.ng-confirm-dark .ng-confirm-box.ng-confirm-loading:before,.ng-confirm.ng-confirm-black .ng-confirm-box.ng-confirm-loading:before{background:#444}.ng-confirm.ng-confirm-dark .ng-confirm-box.ng-confirm-loading:after,.ng-confirm.ng-confirm-black .ng-confirm-box.ng-confirm-loading:after{border-bottom-color:deepskyblue}.ng-confirm.ng-confirm-dark .ng-confirm-box *:not(input):not(textarea):not(select):not(option),.ng-confirm.ng-confirm-black .ng-confirm-box *:not(input):not(textarea):not(select):not(option){color:white}.ng-confirm.ng-confirm-dark .ng-confirm-box input,.ng-confirm.ng-confirm-black .ng-confirm-box input,.ng-confirm.ng-confirm-dark .ng-confirm-box textarea,.ng-confirm.ng-confirm-black .ng-confirm-box textarea,.ng-confirm.ng-confirm-dark .ng-confirm-box select,.ng-confirm.ng-confirm-black .ng-confirm-box select,.ng-confirm.ng-confirm-dark .ng-confirm-box option,.ng-confirm.ng-confirm-black .ng-confirm-box option{color:initial}.ng-confirm.ng-confirm-dark .ng-confirm-box .ng-confirm-buttons,.ng-confirm.ng-confirm-black .ng-confirm-box .ng-confirm-buttons{float:right}.ng-confirm.ng-confirm-dark .ng-confirm-box .ng-confirm-buttons button,.ng-confirm.ng-confirm-black .ng-confirm-box .ng-confirm-buttons button{border:0;background-image:none;text-transform:uppercase;font-size:14px;font-weight:bold;text-shadow:none;-webkit-transition:background .1s;transition:background .1s;color:white}.ng-confirm.ng-confirm-dark .ng-confirm-box .ng-confirm-buttons button.btn-default,.ng-confirm.ng-confirm-black .ng-confirm-box .ng-confirm-buttons button.btn-default{box-shadow:none;color:#fff;background:0}.ng-confirm.ng-confirm-dark .ng-confirm-box .ng-confirm-buttons button.btn-default:hover,.ng-confirm.ng-confirm-black .ng-confirm-box .ng-confirm-buttons button.btn-default:hover{background:#666}.ng-confirm.ng-confirm-supervan .ng-confirm-bg{background:#36465d;opacity:.99}.ng-confirm.ng-confirm-supervan.ng-confirm-type-blue .ng-confirm-box{border:0}.ng-confirm.ng-confirm-supervan.ng-confirm-type-blue .ng-confirm-bg{background:#217dbb}.ng-confirm.ng-confirm-supervan.ng-confirm-type-green .ng-confirm-box{border:0}.ng-confirm.ng-confirm-supervan.ng-confirm-type-green .ng-confirm-bg{background:#25a25a}.ng-confirm.ng-confirm-supervan.ng-confirm-type-red .ng-confirm-box{border:0}.ng-confirm.ng-confirm-supervan.ng-confirm-type-red .ng-confirm-bg{background:#d62c1a}.ng-confirm.ng-confirm-supervan.ng-confirm-type-orange .ng-confirm-box{border:0}.ng-confirm.ng-confirm-supervan.ng-confirm-type-orange .ng-confirm-bg{background:#c29d0b}.ng-confirm.ng-confirm-supervan.ng-confirm-type-purple .ng-confirm-box{border:0}.ng-confirm.ng-confirm-supervan.ng-confirm-type-purple .ng-confirm-bg{background:#804399}.ng-confirm.ng-confirm-supervan.ng-confirm-type-dark .ng-confirm-box{border:0}.ng-confirm.ng-confirm-supervan.ng-confirm-type-dark .ng-confirm-bg{background:#222f3d}.ng-confirm.ng-confirm-supervan .ng-confirm-box{background-color:transparent}.ng-confirm.ng-confirm-supervan .ng-confirm-box.ng-confirm-loading:before{background:transparent}.ng-confirm.ng-confirm-supervan .ng-confirm-box.ng-confirm-loading:after{border-bottom-color:transparent}.ng-confirm.ng-confirm-supervan .ng-confirm-box div.ng-confirm-closeIcon{color:white;border-radius:50px;height:26px;width:26px;line-height:26px;top:2px;right:2px;box-shadow:0 0 0 2px #ddd}.ng-confirm.ng-confirm-supervan .ng-confirm-box *:not(input):not(textarea):not(select):not(option){color:white}.ng-confirm.ng-confirm-supervan .ng-confirm-box input,.ng-confirm.ng-confirm-supervan .ng-confirm-box textarea,.ng-confirm.ng-confirm-supervan .ng-confirm-box select,.ng-confirm.ng-confirm-supervan .ng-confirm-box option{color:initial}.ng-confirm.ng-confirm-supervan .ng-confirm-box div.ng-confirm-closeIcon{color:white}.ng-confirm.ng-confirm-supervan .ng-confirm-box div.ng-confirm-title-c{text-align:center;font-size:28px;font-weight:normal;padding-bottom:25px}.ng-confirm.ng-confirm-supervan .ng-confirm-box div.ng-confirm-title-c>*{display:block}.ng-confirm.ng-confirm-supervan .ng-confirm-box div.ng-confirm-title-c .ng-confirm-icon-c{margin:0 0 20px;font-size:50px}.ng-confirm.ng-confirm-supervan .ng-confirm-box div.ng-confirm-content-pane{margin-bottom:25px}.ng-confirm.ng-confirm-supervan .ng-confirm-box div.ng-confirm-content{text-align:center}.ng-confirm.ng-confirm-supervan .ng-confirm-box .ng-confirm-buttons{text-align:center}.ng-confirm.ng-confirm-supervan .ng-confirm-box .ng-confirm-buttons button{font-size:16px;border-radius:2px;text-shadow:none;border:0;color:white;padding:10px;min-width:100px}.ng-confirm.ng-confirm-supervan .ng-confirm-box .ng-confirm-buttons button.btn-default{background:#303f53}.ng-confirm.ng-confirm-supervan .ng-confirm-box .ng-confirm-buttons button.btn-default:hover{background:#2f3c50;color:white}.ng-confirm.ng-confirm-material .ng-confirm-bg{background:dimgray;opacity:.6}.ng-confirm.ng-confirm-material .ng-confirm-icon-c{margin-right:8px}.ng-confirm.ng-confirm-material .ng-confirm-box{background-color:white;box-shadow:0 7px 8px -4px rgba(0,0,0,0.2),0 13px 19px 2px rgba(0,0,0,0.14),0 5px 24px 4px rgba(0,0,0,0.12);padding:30px 25px 10px 25px}.ng-confirm.ng-confirm-material .ng-confirm-box div.ng-confirm-closeIcon{color:rgba(0,0,0,0.87);line-height:20px;top:15px;right:15px}.ng-confirm.ng-confirm-material .ng-confirm-box div.ng-confirm-title-c{color:rgba(0,0,0,0.87);font-size:22px;font-weight:bold}.ng-confirm.ng-confirm-material .ng-confirm-box div.ng-confirm-content{text-align:left;color:rgba(0,0,0,0.87)}.ng-confirm.ng-confirm-material .ng-confirm-box .ng-confirm-buttons{text-align:right}.ng-confirm.ng-confirm-material .ng-confirm-box .ng-confirm-buttons button{text-transform:uppercase;font-weight:500}.ng-confirm.ng-confirm-material.ng-confirm-rtl .ng-confirm-closeIcon{left:15px!important;right:auto!important}.ng-confirm.ng-confirm-material.ng-confirm-rtl .ng-confirm-icon-c{margin-right:0;margin-left:8px}.ng-confirm.ng-confirm-bootstrap .ng-confirm-bg{background-color:rgba(0,0,0,0.21)}.ng-confirm.ng-confirm-bootstrap .ng-confirm-icon-c{margin-right:8px}.ng-confirm.ng-confirm-bootstrap .ng-confirm-box{background-color:white;box-shadow:0 3px 8px 0 rgba(0,0,0,0.2);border:solid 1px rgba(0,0,0,0.4);padding:15px 0 0;border-radius:6px}.ng-confirm.ng-confirm-bootstrap .ng-confirm-box div.ng-confirm-closeIcon{color:rgba(0,0,0,0.87);line-height:20px}.ng-confirm.ng-confirm-bootstrap .ng-confirm-box div.ng-confirm-title-c{color:rgba(0,0,0,0.87);font-size:22px;font-weight:bold;padding-left:15px;padding-right:15px}.ng-confirm.ng-confirm-bootstrap .ng-confirm-box div.ng-confirm-content{text-align:left;color:rgba(0,0,0,0.87);padding:0 15px}.ng-confirm.ng-confirm-bootstrap .ng-confirm-box .ng-confirm-buttons{text-align:right;padding:15px;margin:-5px 0 0;border-top:solid 1px #ddd;overflow:hidden;border-radius:0 0 4px 4px}.ng-confirm.ng-confirm-bootstrap .ng-confirm-box .ng-confirm-buttons button{font-weight:500;border-radius:0;margin:0}.ng-confirm.ng-confirm-bootstrap .ng-confirm-box .ng-confirm-buttons button:first-child{border-radius:4px 0 0 4px}.ng-confirm.ng-confirm-bootstrap .ng-confirm-box .ng-confirm-buttons button:last-child{border-radius:0 4px 4px 0}.ng-confirm.ng-confirm-bootstrap.ng-confirm-rtl .ng-confirm-closeIcon{left:5px!important;right:auto!important}.ng-confirm.ng-confirm-bootstrap.ng-confirm-rtl .ng-confirm-icon-c{margin-right:0;margin-left:8px}.ng-confirm.ng-confirm-modern .ng-confirm-bg{background-color:slategray;opacity:.6}.ng-confirm.ng-confirm-modern .ng-confirm-icon-c{margin-right:8px}.ng-confirm.ng-confirm-modern .ng-confirm-box{background-color:white;box-shadow:0 7px 8px -4px rgba(0,0,0,0.2),0 13px 19px 2px rgba(0,0,0,0.14),0 5px 24px 4px rgba(0,0,0,0.12);padding:25px 25px 10px 25px}.ng-confirm.ng-confirm-modern .ng-confirm-box div.ng-confirm-closeIcon{color:rgba(0,0,0,0.87);border-radius:50px;height:25px;width:25px;line-height:25px!important;top:10px;right:10px;box-shadow:0 0 0 2px #ddd}.ng-confirm.ng-confirm-modern .ng-confirm-box div.ng-confirm-title-c{color:rgba(0,0,0,0.87);font-size:24px;font-weight:bold;text-align:center;margin-bottom:10px}.ng-confirm.ng-confirm-modern .ng-confirm-box div.ng-confirm-title-c .ng-confirm-icon-c{display:block;margin-right:0;margin-left:0;margin-bottom:10px;font-size:69px;color:#aaa}.ng-confirm.ng-confirm-modern .ng-confirm-box div.ng-confirm-content{font-size:15px;color:#777;margin-bottom:25px}.ng-confirm.ng-confirm-modern .ng-confirm-box .ng-confirm-buttons{text-align:center}.ng-confirm.ng-confirm-modern .ng-confirm-box .ng-confirm-buttons button{font-weight:bold;text-transform:uppercase;-webkit-transition:background .1s;transition:background .1s}.ng-confirm.ng-confirm-modern .ng-confirm-box .ng-confirm-buttons button+button{margin-left:4px}.ng-confirm.ng-confirm-seamless .ng-confirm-bg{background-color:rgba(255,255,255,0.5)}.ng-confirm.ng-confirm-seamless .ng-confirm-bg:before{border-bottom-color:dodgerblue}.ng-confirm.ng-confirm-seamless .ng-confirm-icon-c{margin-right:8px}.ng-confirm.ng-confirm-seamless .ng-confirm-box{background-color:white;box-shadow:0 7px 8px -4px rgba(0,0,0,0.2),0 13px 19px 2px rgba(0,0,0,0.14),0 5px 24px 4px rgba(0,0,0,0.12);padding:20px 0 10px 0}.ng-confirm.ng-confirm-seamless .ng-confirm-box div.ng-confirm-closeIcon{color:rgba(0,0,0,0.87);border-radius:50px;height:25px;width:25px;line-height:25px!important;top:10px;right:10px;box-shadow:0 0 0 2px #ddd}.ng-confirm.ng-confirm-seamless .ng-confirm-box div.ng-confirm-title-c{color:rgba(0,0,0,0.87);font-size:24px;text-align:center}.ng-confirm.ng-confirm-seamless .ng-confirm-box div.ng-confirm-title-c .ng-confirm-icon-c{color:#aaa}.ng-confirm.ng-confirm-seamless .ng-confirm-box div.ng-confirm-title-c .ng-confirm-title{font-weight:bold}.ng-confirm.ng-confirm-seamless .ng-confirm-box div.ng-confirm-content{text-align:center;font-size:15px;color:#464646;margin-bottom:25px}.ng-confirm.ng-confirm-seamless .ng-confirm-box .ng-confirm-buttons{text-align:center}.ng-confirm.ng-confirm-seamless .ng-confirm-box .ng-confirm-buttons button{font-size:16px;font-weight:bold}.ng-confirm.ng-confirm-seamless .ng-confirm-box .ng-confirm-buttons button+button{margin-left:4px}.ng-confirm-el-hide{display:none!important} -------------------------------------------------------------------------------- /dist/angular-confirm.min.js: -------------------------------------------------------------------------------- 1 | /*! 2 | * angular-confirm v1.1.0 (http://craftpip.github.io/angular-confirm/) 3 | * Author: Boniface Pereira 4 | * Website: www.craftpip.com 5 | * Contact: hey@craftpip.com 6 | * 7 | * Copyright 2016-2017 angular-confirm 8 | * Licensed under MIT (https://github.com/craftpip/angular-confirm/blob/master/LICENSE) 9 | */"use strict";if("undefined"==typeof jQuery)throw new Error("angular-confirm requires jQuery");if("undefined"==typeof angular)throw new Error("angular-confirm requires Angular");angular.module("cp.ngConfirm",[]).service("$ngConfirmTemplate",function(){this.default='
'}).service("$ngConfirmDefaults",function(){return{title:"Hello",titleClass:"",type:"default",typeAnimated:!0,content:"Are you sure to continue?",contentUrl:!1,defaultButtons:{ok:function(){}},icon:"",theme:"white",bgOpacity:null,animation:"zoom",closeAnimation:"scale",animationSpeed:400,animationBounce:1.2,scope:!1,escapeKey:!1,rtl:!1,buttons:{},container:"body",containerFluid:!1,backgroundDismiss:!1,backgroundDismissAnimation:"shake",alignMiddle:!0,offsetTop:50,offsetBottom:50,autoClose:!1,closeIcon:null,closeIconClass:!1,columnClass:"small",boxWidth:"50%",useBootstrap:!0,bootstrapClasses:{container:"container",containerFluid:"container-fluid",row:"row"},onScopeReady:function(){},onReady:function(){},onOpenBefore:function(){},onOpen:function(){},onClose:function(){},onDestroy:function(){},onAction:function(){}}}).service("$ngConfirm",["$rootScope","$ngConfirmDefaults","$ngConfirmBase",function(a,b,c){return function(a,d,e){return"string"==typeof a&&(a={content:a,buttons:b.defaultButtons},"string"==typeof d?a.title=d||!1:a.title=!1,"object"==typeof d&&(a.scope=d),"object"==typeof e&&(a.scope=e)),"undefined"==typeof a&&(a={}),a=angular.extend({},b,a),new c(a)}}]).factory("$ngConfirmBase",["$rootScope","$ngConfirmDefaults","$timeout","$compile","$ngConfirmTemplate","$interval","$templateRequest","$log","$q",function(a,b,c,d,e,f,g,h,i){var j=function(a){angular.extend(this,a),this._init()};return j.prototype={_init:function(){this._lastFocused=angular.element("body").find(":focus"),this._id=Math.round(999999*Math.random()),this.open()},_providedScope:!1,_prepare:function(){var b=this;this.$el=angular.element(e.default),b.scope?this._providedScope=!0:(this._providedScope=!1,b.scope=a.$new()),"function"==typeof this.onScopeReady&&this.onScopeReady.apply(this,[this.scope]),this.$confirmBox=this.$el.find(".ng-confirm-box"),this.$confirmBoxParent=this.$el.find(".ng-confirm-box-p"),this.$titleContainer=this.$el.find(".ng-confirm-title-c"),this.$title=this.$el.find(".ng-confirm-title"),this.$icon=this.$el.find(".ng-confirm-icon-c"),this.$content=this.$el.find(".ng-confirm-content"),this.$confirmBg=this.$el.find(".ng-confirm-bg"),this.$contentPane=this.$el.find(".ng-confirm-content-pane"),this.$closeIcon=this.$el.find(".ng-confirm-closeIcon"),this.$bs3Container=this.$el.find(".ng-bs3-container"),this.$buttonContainer=this.$el.find(".ng-confirm-buttons"),this.$scrollPane=this.$el.find(".ng-confirm-scrollpane");var c="ng-confirm-box"+this._id;if(this.$confirmBox.attr("aria-labelledby",c),this.$content.attr("id",c),this._setAnimationClass(this.animation),this.setDismissAnimation(this.backgroundDismissAnimation),this.setTheme(this.theme),this.setType(this.type),this._setButtons(this.buttons),this.setCloseIcon(this.closeIcon),this.setCloseIconClass(this.closeIconClass),this.setTypeAnimated(this.typeAnimated),this.useBootstrap?(this.setColumnClass(this.columnClass),this.$el.find(".ng-bs3-row").addClass(this.bootstrapClasses.row).addClass("justify-content-md-center justify-content-sm-center justify-content-xs-center justify-content-lg-center"),this.setContainerFluid(this.containerFluid)):this.setBoxWidth(this.boxWidth),this.setTitleClass(this.titleClass),this.setTitle(this.title),this.setIcon(this.icon),this.setBgOpacity(this.bgOpacity),this.setRtl(this.rtl),this._contentReady=i.defer(),this._modalReady=i.defer(),i.all([this._contentReady.promise,this._modalReady.promise]).then(function(){b.isAjax&&(b.setContent(b.content),b.loading(!1)),"function"==typeof b.onReady&&b.onReady.apply(b,[b.scope])}),this.contentUrl){this.loading(!0),this.isAjax=!0;var d=this.contentUrl;"function"==typeof this.contentUrl&&(d=this.contentUrl()),this.isAjaxLoading=!0,g(d).then(function(a){b.content=a,b._contentReady.resolve(),b.isAjaxLoading=!1},function(){b.content="",b._contentReady.resolve(),b.isAjaxLoading=!1})}else{var f=this.content;"function"==typeof this.content&&(f=this.content()),this.content=f,this.setContent(this.content),this._contentReady.resolve()}"none"==this.animation&&(this.animationSpeed=1,this.animationBounce=1),this.$confirmBg.css(this._getCSS(this.animationSpeed,1))},isAjax:!1,isAjaxLoading:!1,isLoading:!1,_hideClass:"ng-confirm-el-hide",_loadingClass:"ng-confirm-loading",loading:function(a){this.isLoading=a,a?this.$confirmBox.addClass(this._loadingClass):this.$confirmBox.removeClass(this._loadingClass)},setContent:function(a){if(!this.$content)return void h.error("Attempted to set content before $content is defined");a="
"+a+"
";var b=d(a)(this.scope);this.$content.append(b)},_typeList:["default","blue","green","red","orange","purple","dark"],_typePrefix:"ng-confirm-type-",_pSetType:"",setType:function(a){if(this._typeList.indexOf(a.toLowerCase())==-1)return h.warn("Invalid dialog type: "+a),!1;var b=this._typePrefix+a;this.$el.removeClass(this._pSetType).addClass(b),this._pSetType=b},_setTypeAnimatedClass:"ng-confirm-type-animated",setTypeAnimated:function(a){a?this.$confirmBox.addClass(this._setTypeAnimatedClass):this.$confirmBox.removeClass(this._setTypeAnimatedClass)},_pTitleClass:"",setTitleClass:function(a){this.$titleContainer.removeClass(this._pTitleClass).addClass(a),this._pTitleClass=a},setBoxWidth:function(a){return this.useBootstrap?void h.warn("Cannot set boxWidth as useBootstrap is set to true. use columnClass instead."):void this.$confirmBox.css("width",a)},setContainerFluid:function(a){return this.useBootstrap?(a?this.$bs3Container.removeClass(this.bootstrapClasses.container).addClass(this.bootstrapClasses.containerFluid):this.$bs3Container.removeClass(this.bootstrapClasses.containerFluid).addClass(this.bootstrapClasses.container),void(this.containerFluid=a)):void h.warn("Cannot set containerFluid as useBootstrap is set to false.")},_pSetColumnClass:"",setColumnClass:function(a){if(!this.useBootstrap)return void h.warn("Cannot set columnClass as useBootstrap is set to false, use bixWidth instead");a=a.toLowerCase();var b;switch(a){case"xl":case"xlarge":b="col-md-12";break;case"l":case"large":b="col-md-8 col-md-offset-2";break;case"m":case"medium":b="col-md-6 col-md-offset-3";break;case"s":case"small":b="col-md-4 col-md-offset-4 col-sm-6 col-sm-offset-3 col-xs-10 col-xs-offset-1";break;case"xs":case"xsmall":b="col-md-2 col-md-offset-5";break;default:b=a}this.$confirmBoxParent.removeClass(this._pSetColumnClass).addClass(b),this._pSetColumnClass=b},setIcon:function(a){"function"==typeof a&&(a=a()),a?(this.$icon.html(angular.element("").addClass(a)),this.$icon.removeClass(this._hideClass)):this.$icon.addClass(this._hideClass),this.icon||this.title?this.$titleContainer.removeClass(this._hideClass):this.$titleContainer.addClass(this._hideClass),this.icon=a},setTitle:function(a){"function"==typeof a&&(a=a()),a?(this.$title.html(a),this.$title.removeClass(this._hideClass)):this.$title.addClass(this._hideClass),this.icon||this.title?this.$titleContainer.removeClass(this._hideClass):this.$titleContainer.addClass(this._hideClass),this.title=a},setCloseIcon:function(a){0==this._buttonCount&&null==a&&(a=!0),a?this.$closeIcon.removeClass(this._hideClass):this.$closeIcon.addClass(this._hideClass),this.closeIcon=a},setCloseIconClass:function(a){var b;b=a?angular.element("").addClass(this.closeIconClass):angular.element("×").addClass(this.closeIconClass),this.$closeIcon.html(b),this.closeIconClass=a},_animationPrefix:"ng-confirm-animation-",_pSetAnimation:"",_setAnimationClass:function(a){var b=this._prefixThis(a,this._animationPrefix);this.$confirmBox.removeClass(this._pSetAnimation).addClass(b),this._pSetAnimation=b},_removeAnimationClass:function(){this.$confirmBox.removeClass(this._pSetAnimation),this._pSetAnimation=""},_bgDismissPrefix:"ng-confirm-hilight-",_pSetDismissAnimation:"",setDismissAnimation:function(a){var b=this._prefixThis(a,this._bgDismissPrefix);this.$confirmBox.removeClass(this._pSetDismissAnimation).addClass(b),this._pSetDismissAnimation=b},_prefixThis:function(a,b){return a=a.split(","),angular.forEach(a,function(c,d){c.indexOf(b)==-1&&(a[d]=b+c.trim())}),a.join(" ").toLowerCase()},_setButtons:function(a){var b=this;"object"!=typeof a&&(a={}),angular.forEach(a,function(c,d){"function"==typeof c&&(a[d]=c={action:c}),a[d].text=c.text||d,a[d].btnClass=c.btnClass||"btn-default",a[d].action=c.action||angular.noop,a[d].keys=c.keys||[],a[d].disabled=c.disabled||!1,"undefined"==typeof c.show&&(c.show=!0),a[d].show=c.show,angular.forEach(a[d].keys,function(b,c){a[d].keys[c]=b.toLowerCase()});var e=angular.element('');a[d].setText=function(a){e.find(".ng-confirm-btn-text").html(a)},a[d].setBtnClass=function(b){e.removeClass(a[d].btnClass).addClass(b),a[d].btnClass=b},a[d].setDisabled=function(b){b?e.attr("disabled","disabled"):e.removeAttr("disabled"),a[d].disabled=b},a[d].setShow=function(c){c?e.removeClass(b._hideClass):e.addClass(b._hideClass),a[d].show=c},a[d].setText(a[d].text),a[d].setBtnClass(a[d].btnClass),a[d].setDisabled(a[d].disabled),a[d].setShow(a[d].show),e.click(function(a){a.preventDefault(),b.triggerButton(d)}),a[d].el=e,b.$buttonContainer.append(e)}),this.buttons=a,this._buttonCount=Object.keys(a).length},_buttonCount:0,_themePrefix:"ng-confirm-",_pSetTheme:"",setTheme:function(a){var b=this._prefixThis(a,this._themePrefix);this.$el.removeClass(this._pSetTheme).addClass(b),this._pSetTheme=b},_rtlClass:"ng-confirm-rtl",setRtl:function(a){a?this.$el.addClass(this._rtlClass):this.$el.removeClass(this._rtlClass),this.rtl=a},setBgOpacity:function(a){this.$confirmBg.css("opacity",a),this.bgOpacity=a},_cubic_bezier:"0.36, 0.55, 0.19",_getCSS:function(a,b){return{"-webkit-transition-duration":a/1e3+"s","transition-duration":a/1e3+"s","-webkit-transition-timing-function":"cubic-bezier("+this._cubic_bezier+", "+b+")","transition-timing-function":"cubic-bezier("+this._cubic_bezier+", "+b+")"}},_hash:function(a){var b=a.toString(),c=0;if(0==b.length)return c;for(var d=0;dg-j||!this.alignMiddle?(k={"margin-top":this.offsetTop,"margin-bottom":this.offsetBottom},angular.element("body").addClass("ng-confirm-no-scroll-"+this._id)):(k={"margin-top":(g-i)/2,"margin-bottom":0},angular.element("body").removeClass("ng-confirm-no-scroll-"+this._id)),this.$contentPane.css({height:c}).scrollTop(0),this.$confirmBox.css(k)}},_getKey:function(a){switch(a){case 192:return"tilde";case 13:return"enter";case 16:return"shift";case 9:return"tab";case 20:return"capslock";case 17:return"ctrl";case 91:return"win";case 18:return"alt";case 27:return"esc"}var b=String.fromCharCode(a);return!!/^[A-z0-9]+$/.test(b)&&b.toLowerCase()},open:function(){var a=this;return this._prepare(),c(function(){a._open()},100),!0},_open:function(){var a=this;"function"==typeof this.onOpenBefore&&this.onOpenBefore.apply(this,[this.scope]),angular.element(this.container).append(this.$el),a.setDialogCenter("_open"),setTimeout(function(){a.$contentPane.css(a._getCSS(a.animationSpeed,1)),a.$confirmBox.css(a._getCSS(a.animationSpeed,a.animationBounce)),a._removeAnimationClass(),a.$confirmBg.removeClass("ng-confirm-bg-h"),a.$confirmBox.focus(),setTimeout(function(){a._bindEvents(),a.$confirmBox.css(a._getCSS(a.animationSpeed,1)),a._modalReady.resolve(),"function"==typeof a.onOpen&&a.onOpen.apply(a,[a.scope]),a._startCountDown()},a.animationSpeed)},100)},_autoCloseKey:!1,_autoCloseInterval:0,_startCountDown:function(){var a=this;if("string"==typeof this.autoClose){var b=this.autoClose.split("|");if(2!=b.length)return void h.error("Invalid option for autoClose. example 'close|10000'");this._autoCloseKey=b[0];var c=b[1],d=c/1e3;if(!angular.isDefined(this.buttons[this._autoCloseKey]))return void h.error('Auto close button "'+a._autoCloseKey+'" not defined.');var e=angular.element('');this.buttons[this._autoCloseKey].el.append(e),this._autoCloseInterval=setInterval(function(){var b=d?" ("+--d+")":"";e.html(b),d<1&&(a._stopCountDown(),a._buttonClick(a._autoCloseKey))},1e3)}},_stopCountDown:function(){this._autoCloseInterval&&clearInterval(this._autoCloseInterval)},closed:!1,isClosed:function(){return this.closed},isOpen:function(){return!this.closed},close:function(){var a=this;"function"==typeof this.onClose&&this.onClose.apply(this,[this.scope]),this._unBindEvents(),this._stopCountDown(),this._setAnimationClass(this.closeAnimation),this.$confirmBg.addClass("ng-confirm-bg-h");var b=.4*this.animationSpeed;return setTimeout(function(){a.$el.remove(),a.closed=!0,a._providedScope||a.scope.$destroy(),"function"==typeof a.onDestroy&&a.onDestroy.apply(a,[a.scope]),angular.element("body").removeClass("ng-confirm-no-scroll-"+a._id),a._lastFocused.focus(),a=void 0},b),!0}},j}]); -------------------------------------------------------------------------------- /form.html: -------------------------------------------------------------------------------- 1 |
2 |
3 | 4 | 5 |
6 | 7 | This form form.html was called $templateRequest. 8 | 9 |
-------------------------------------------------------------------------------- /js/angular-confirm.js: -------------------------------------------------------------------------------- 1 | /*! 2 | * angular-confirm v1.1.0 (http://craftpip.github.io/angular-confirm/) 3 | * Author: Boniface Pereira 4 | * Website: www.craftpip.com 5 | * Contact: hey@craftpip.com 6 | * 7 | * Copyright 2016-2017 angular-confirm 8 | * Licensed under MIT (https://github.com/craftpip/angular-confirm/blob/master/LICENSE) 9 | */ 10 | 11 | "use strict"; 12 | 13 | if (typeof jQuery === 'undefined') 14 | throw new Error('angular-confirm requires jQuery'); 15 | if (typeof angular === 'undefined') 16 | throw new Error('angular-confirm requires Angular'); 17 | 18 | angular.module('cp.ngConfirm', []) 19 | .service('$ngConfirmTemplate', function () { 20 | this.default = '
' + 21 | '
' + 22 | '
' + 23 | '
' + 24 | '
' + 25 | '
' + 26 | '' + 40 | '
' + 41 | '
' + 42 | '
' + 43 | '
' + 44 | '
' + 45 | ''; 46 | }) 47 | .service('$ngConfirmDefaults', function () { 48 | return { 49 | title: 'Hello', 50 | titleClass: '', 51 | type: 'default', 52 | typeAnimated: true, 53 | content: 'Are you sure to continue?', 54 | contentUrl: false, 55 | defaultButtons: { 56 | ok: function () { 57 | 58 | }, 59 | }, 60 | icon: '', 61 | theme: 'white', 62 | bgOpacity: null, 63 | animation: 'zoom', 64 | closeAnimation: 'scale', 65 | animationSpeed: 400, 66 | animationBounce: 1.2, 67 | scope: false, 68 | escapeKey: false, 69 | rtl: false, 70 | buttons: {}, 71 | container: 'body', 72 | containerFluid: false, 73 | backgroundDismiss: false, 74 | backgroundDismissAnimation: 'shake', 75 | alignMiddle: true, 76 | offsetTop: 50, 77 | offsetBottom: 50, 78 | autoClose: false, 79 | closeIcon: null, 80 | closeIconClass: false, 81 | columnClass: 'small', 82 | boxWidth: '50%', 83 | useBootstrap: true, 84 | bootstrapClasses: { 85 | container: 'container', 86 | containerFluid: 'container-fluid', 87 | row: 'row', 88 | }, 89 | onScopeReady: function () { 90 | 91 | }, 92 | onReady: function () { 93 | 94 | }, 95 | onOpenBefore: function () { 96 | 97 | }, 98 | onOpen: function () { 99 | 100 | }, 101 | onClose: function () { 102 | 103 | }, 104 | onDestroy: function () { 105 | 106 | }, 107 | onAction: function () { 108 | 109 | } 110 | 111 | }; 112 | }) 113 | .service('$ngConfirm', [ 114 | '$rootScope', 115 | '$ngConfirmDefaults', 116 | '$ngConfirmBase', 117 | function ($rootScope, $ngConfirmDefaults, $ngConfirmBase) { 118 | return function (options, options2, option3) { 119 | if (typeof options == 'string') { 120 | options = { 121 | content: options, 122 | buttons: $ngConfirmDefaults.defaultButtons 123 | }; 124 | if (typeof options2 == 'string') 125 | options['title'] = options2 || false; 126 | else 127 | options['title'] = false; 128 | if (typeof options2 == 'object') 129 | options['scope'] = options2; 130 | if (typeof option3 == 'object') 131 | options['scope'] = option3; 132 | } 133 | 134 | if (typeof options === 'undefined') options = {}; 135 | 136 | /* 137 | * merge options with plugin defaults. 138 | */ 139 | options = angular.extend({}, $ngConfirmDefaults, options); 140 | 141 | return new $ngConfirmBase(options); 142 | }; 143 | } 144 | ]) 145 | .factory('$ngConfirmBase', [ 146 | '$rootScope', 147 | '$ngConfirmDefaults', 148 | '$timeout', 149 | '$compile', 150 | '$ngConfirmTemplate', 151 | '$interval', 152 | '$templateRequest', 153 | '$log', 154 | '$q', 155 | function ($rootScope, $ngConfirmDefaults, $timeout, $compile, $ngConfirmTemplate, $interval, $templateRequest, $log, $q) { 156 | var ngConfirmBase = function (options) { 157 | angular.extend(this, options); 158 | this._init(); 159 | }; 160 | 161 | ngConfirmBase.prototype = { 162 | _init: function () { 163 | this._lastFocused = angular.element('body').find(':focus'); 164 | this._id = Math.round(Math.random() * 999999); 165 | this.open(); 166 | }, 167 | _providedScope: false, // has the user provided a scope. 168 | _prepare: function () { 169 | var that = this; 170 | 171 | this.$el = angular.element($ngConfirmTemplate['default']); 172 | 173 | // Has the user provided us with the scope. 174 | if (that.scope) { 175 | this._providedScope = true; 176 | } else { 177 | this._providedScope = false; 178 | that.scope = $rootScope.$new(); 179 | } 180 | 181 | // scope is ready. 182 | if (typeof this.onScopeReady == 'function') 183 | this.onScopeReady.apply(this, [this.scope]); 184 | 185 | // Dom elements 186 | this.$confirmBox = this.$el.find('.ng-confirm-box'); 187 | this.$confirmBoxParent = this.$el.find('.ng-confirm-box-p'); 188 | this.$titleContainer = this.$el.find('.ng-confirm-title-c'); 189 | this.$title = this.$el.find('.ng-confirm-title'); 190 | this.$icon = this.$el.find('.ng-confirm-icon-c'); 191 | this.$content = this.$el.find('.ng-confirm-content'); 192 | this.$confirmBg = this.$el.find('.ng-confirm-bg'); 193 | this.$contentPane = this.$el.find('.ng-confirm-content-pane'); 194 | this.$closeIcon = this.$el.find('.ng-confirm-closeIcon'); 195 | this.$bs3Container = this.$el.find('.ng-bs3-container'); 196 | this.$buttonContainer = this.$el.find('.ng-confirm-buttons'); 197 | this.$scrollPane = this.$el.find('.ng-confirm-scrollpane'); 198 | 199 | var ariaLabel = 'ng-confirm-box' + this._id; 200 | this.$confirmBox.attr('aria-labelledby', ariaLabel); 201 | this.$content.attr('id', ariaLabel); 202 | 203 | this._setAnimationClass(this.animation); 204 | this.setDismissAnimation(this.backgroundDismissAnimation); 205 | this.setTheme(this.theme); 206 | this.setType(this.type); 207 | this._setButtons(this.buttons); 208 | this.setCloseIcon(this.closeIcon); 209 | this.setCloseIconClass(this.closeIconClass); 210 | 211 | this.setTypeAnimated(this.typeAnimated); 212 | if (this.useBootstrap) { 213 | this.setColumnClass(this.columnClass); 214 | this.$el.find('.ng-bs3-row').addClass(this.bootstrapClasses.row) 215 | .addClass('justify-content-md-center justify-content-sm-center justify-content-xs-center justify-content-lg-center'); 216 | 217 | this.setContainerFluid(this.containerFluid); 218 | } else { 219 | this.setBoxWidth(this.boxWidth); 220 | } 221 | this.setTitleClass(this.titleClass); 222 | this.setTitle(this.title); 223 | this.setIcon(this.icon); 224 | this.setBgOpacity(this.bgOpacity); 225 | this.setRtl(this.rtl); 226 | 227 | this._contentReady = $q.defer(); 228 | this._modalReady = $q.defer(); 229 | 230 | $q.all([this._contentReady.promise, this._modalReady.promise]).then(function () { 231 | if (that.isAjax) { 232 | that.setContent(that.content); 233 | that.loading(false); 234 | } 235 | if (typeof that.onReady == 'function') { 236 | that.onReady.apply(that, [that.scope]); 237 | } 238 | }); 239 | 240 | if (this.contentUrl) { 241 | this.loading(true); 242 | this.isAjax = true; 243 | var contentUrl = this.contentUrl; 244 | if (typeof this.contentUrl == 'function') 245 | contentUrl = this.contentUrl(); 246 | 247 | this.isAjaxLoading = true; 248 | $templateRequest(contentUrl).then(function (html) { 249 | that.content = html; 250 | that._contentReady.resolve(); 251 | that.isAjaxLoading = false; 252 | }, function () { 253 | that.content = ''; 254 | that._contentReady.resolve(); 255 | that.isAjaxLoading = false; 256 | }); 257 | } else { 258 | var content = this.content; 259 | if (typeof this.content == 'function') 260 | content = this.content(); 261 | 262 | this.content = content; 263 | this.setContent(this.content); 264 | this._contentReady.resolve(); 265 | } 266 | 267 | // this._watchContent(); 268 | 269 | if (this.animation == 'none') { 270 | this.animationSpeed = 1; 271 | this.animationBounce = 1; 272 | } 273 | 274 | this.$confirmBg.css(this._getCSS(this.animationSpeed, 1)); 275 | }, 276 | isAjax: false, 277 | isAjaxLoading: false, 278 | isLoading: false, 279 | _hideClass: 'ng-confirm-el-hide', 280 | _loadingClass: 'ng-confirm-loading', 281 | /** 282 | * Shows the loading spinner 283 | * @param show 284 | */ 285 | loading: function (show) { 286 | this.isLoading = show; 287 | if (show) 288 | this.$confirmBox.addClass(this._loadingClass); 289 | else 290 | this.$confirmBox.removeClass(this._loadingClass); 291 | }, 292 | /** 293 | * Set content to DOM. 294 | * @param contentHtml 295 | * @private 296 | */ 297 | setContent: function (contentHtml) { 298 | if (!this.$content) { 299 | $log.error('Attempted to set content before $content is defined'); 300 | return; 301 | } 302 | contentHtml = "
" + contentHtml + "
"; 303 | var compiledHtml = $compile(contentHtml)(this.scope); 304 | this.$content.append(compiledHtml); 305 | }, 306 | _typeList: ['default', 'blue', 'green', 'red', 'orange', 'purple', 'dark'], 307 | _typePrefix: 'ng-confirm-type-', 308 | _pSetType: '', 309 | /** 310 | * Set the type class 311 | * @param type 312 | * @returns {boolean} 313 | */ 314 | setType: function (type) { 315 | if (this._typeList.indexOf(type.toLowerCase()) == -1) { 316 | $log.warn('Invalid dialog type: ' + type); 317 | return false; 318 | } else { 319 | var c = this._typePrefix + type; 320 | this.$el.removeClass(this._pSetType).addClass(c); 321 | this._pSetType = c; 322 | } 323 | }, 324 | _setTypeAnimatedClass: 'ng-confirm-type-animated', 325 | /** 326 | * Adds or removes the type animated class 327 | * @param state 328 | */ 329 | setTypeAnimated: function (state) { 330 | if (state) 331 | this.$confirmBox.addClass(this._setTypeAnimatedClass); 332 | else 333 | this.$confirmBox.removeClass(this._setTypeAnimatedClass); 334 | }, 335 | _pTitleClass: '', 336 | /** 337 | * Sets the title class or classes 338 | * @param str 339 | */ 340 | setTitleClass: function (str) { 341 | this.$titleContainer.removeClass(this._pTitleClass).addClass(str); 342 | this._pTitleClass = str; 343 | }, 344 | /** 345 | * Sets box width, 346 | * requires useBootstrap to be false. 347 | * @param units 348 | */ 349 | setBoxWidth: function (units) { 350 | if (this.useBootstrap) { 351 | $log.warn('Cannot set boxWidth as useBootstrap is set to true. use columnClass instead.'); 352 | return; 353 | } 354 | 355 | this.$confirmBox.css('width', units); 356 | }, 357 | /** 358 | * Set the container class as fluid or not. 359 | * requires useBootstrap to be true 360 | * @param state 361 | */ 362 | setContainerFluid: function (state) { 363 | if (!this.useBootstrap) { 364 | $log.warn('Cannot set containerFluid as useBootstrap is set to false.'); 365 | return; 366 | } 367 | 368 | if (state) { 369 | this.$bs3Container.removeClass(this.bootstrapClasses.container) 370 | .addClass(this.bootstrapClasses.containerFluid); 371 | } else { 372 | this.$bs3Container.removeClass(this.bootstrapClasses.containerFluid) 373 | .addClass(this.bootstrapClasses.container); 374 | } 375 | 376 | this.containerFluid = state; 377 | }, 378 | _pSetColumnClass: '', 379 | /** 380 | * Sets the columnClass class 381 | * requires useBootstrap to be true 382 | * @param colClass 383 | */ 384 | setColumnClass: function (colClass) { 385 | if (!this.useBootstrap) { 386 | $log.warn('Cannot set columnClass as useBootstrap is set to false, use bixWidth instead'); 387 | return; 388 | } 389 | 390 | colClass = colClass.toLowerCase(); 391 | var p; 392 | switch (colClass) { 393 | case 'xl': 394 | case 'xlarge': 395 | p = 'col-md-12'; 396 | break; 397 | case 'l': 398 | case 'large': 399 | p = 'col-md-8 col-md-offset-2'; 400 | break; 401 | case 'm': 402 | case 'medium': 403 | p = 'col-md-6 col-md-offset-3'; 404 | break; 405 | case 's': 406 | case 'small': 407 | p = 'col-md-4 col-md-offset-4 col-sm-6 col-sm-offset-3 col-xs-10 col-xs-offset-1'; 408 | break; 409 | case 'xs': 410 | case 'xsmall': 411 | p = 'col-md-2 col-md-offset-5'; 412 | break; 413 | default: 414 | p = colClass; 415 | } 416 | 417 | this.$confirmBoxParent.removeClass(this._pSetColumnClass).addClass(p); 418 | this._pSetColumnClass = p; 419 | }, 420 | /** 421 | * Set icon for the modal. 422 | * @param iconClass 423 | */ 424 | setIcon: function (iconClass) { 425 | if (typeof iconClass == 'function') 426 | iconClass = iconClass(); 427 | 428 | if (iconClass) { 429 | this.$icon.html(angular.element('').addClass(iconClass)); 430 | this.$icon.removeClass(this._hideClass); 431 | } else { 432 | this.$icon.addClass(this._hideClass); 433 | } 434 | 435 | if (this.icon || this.title) { 436 | this.$titleContainer.removeClass(this._hideClass); 437 | } else { 438 | this.$titleContainer.addClass(this._hideClass); 439 | } 440 | 441 | this.icon = iconClass; 442 | }, 443 | /** 444 | * set the title of the modal 445 | * @param str 446 | */ 447 | setTitle: function (str) { 448 | if (typeof str == 'function') 449 | str = str(); 450 | 451 | if (str) { 452 | this.$title.html(str); 453 | this.$title.removeClass(this._hideClass); 454 | } else { 455 | this.$title.addClass(this._hideClass); 456 | } 457 | 458 | if (this.icon || this.title) { 459 | this.$titleContainer.removeClass(this._hideClass); 460 | } else { 461 | this.$titleContainer.addClass(this._hideClass); 462 | } 463 | 464 | this.title = str; 465 | }, 466 | /** 467 | * Set the visibility of the close icon 468 | * Will be visible if button count is 0 and closeIcon is null 469 | * @param strFunc 470 | */ 471 | setCloseIcon: function (strFunc) { 472 | if (this._buttonCount == 0 && strFunc == null) 473 | strFunc = true; 474 | 475 | if (!!strFunc) 476 | this.$closeIcon.removeClass(this._hideClass); 477 | else 478 | this.$closeIcon.addClass(this._hideClass); 479 | 480 | this.closeIcon = strFunc; 481 | }, 482 | setCloseIconClass: function (iconClass) { 483 | var iconEl; 484 | if (iconClass) { 485 | iconEl = angular.element('').addClass(this.closeIconClass); 486 | } else { 487 | iconEl = angular.element('×').addClass(this.closeIconClass); 488 | } 489 | this.$closeIcon.html(iconEl); 490 | this.closeIconClass = iconClass; 491 | }, 492 | _animationPrefix: 'ng-confirm-animation-', 493 | _pSetAnimation: '', 494 | /** 495 | * Set the start and end animations 496 | * @param animation 497 | * @private 498 | */ 499 | _setAnimationClass: function (animation) { 500 | var c = this._prefixThis(animation, this._animationPrefix); 501 | // remove the previously set animation and add the new one. 502 | this.$confirmBox.removeClass(this._pSetAnimation).addClass(c); 503 | this._pSetAnimation = c; 504 | }, 505 | _removeAnimationClass: function () { 506 | this.$confirmBox.removeClass(this._pSetAnimation); 507 | this._pSetAnimation = ''; 508 | }, 509 | _bgDismissPrefix: 'ng-confirm-hilight-', 510 | _pSetDismissAnimation: '', 511 | /** 512 | * Set the dismiss animations class 513 | * @param animation 514 | */ 515 | setDismissAnimation: function (animation) { 516 | var c = this._prefixThis(animation, this._bgDismissPrefix); 517 | this.$confirmBox.removeClass(this._pSetDismissAnimation) 518 | .addClass(c); 519 | this._pSetDismissAnimation = c; 520 | }, 521 | /** 522 | * Prefix the strings with the given prefix, 523 | * make no changes if its already prefixed. 524 | * @param str 525 | * @param pr 526 | * @returns {string} 527 | * @private 528 | */ 529 | _prefixThis: function (str, pr) { 530 | str = str.split(','); 531 | angular.forEach(str, function (a, k) { 532 | if (a.indexOf(pr) == -1) 533 | str[k] = pr + a.trim(); 534 | }); 535 | return str.join(' ').toLowerCase(); 536 | }, 537 | /** 538 | * Parses the buttons and sets in the ngConfirm _scope. 539 | * PLACED IN NG CONFIRM SCOPE. 540 | * 541 | * Setting buttons 542 | * The user cannot add or remove buttons in run time. 543 | * The user can however change the buttons properties. 544 | * 545 | * @param buttons 546 | * @private 547 | */ 548 | _setButtons: function (buttons) { 549 | var self = this; 550 | if (typeof buttons != 'object') 551 | buttons = {}; 552 | 553 | angular.forEach(buttons, function (button, key) { 554 | if (typeof button === 'function') { 555 | buttons[key] = button = { 556 | action: button 557 | }; 558 | } 559 | 560 | buttons[key].text = button.text || key; 561 | buttons[key].btnClass = button.btnClass || 'btn-default'; 562 | buttons[key].action = button.action || angular.noop; 563 | buttons[key].keys = button.keys || []; 564 | buttons[key].disabled = button.disabled || false; 565 | if (typeof button.show == 'undefined') 566 | button.show = true; 567 | buttons[key].show = button.show; 568 | 569 | angular.forEach(buttons[key].keys, function (a, i) { 570 | buttons[key].keys[i] = a.toLowerCase(); 571 | }); 572 | 573 | var button_el = angular.element(''); 574 | 575 | 576 | buttons[key].setText = function (text) { 577 | button_el.find('.ng-confirm-btn-text').html(text); 578 | }; 579 | buttons[key].setBtnClass = function (btnClass) { 580 | button_el.removeClass(buttons[key].btnClass).addClass(btnClass); 581 | buttons[key].btnClass = btnClass; 582 | }; 583 | buttons[key].setDisabled = function (state) { 584 | if (state) 585 | button_el.attr('disabled', 'disabled'); 586 | else 587 | button_el.removeAttr('disabled'); 588 | buttons[key].disabled = state; 589 | }; 590 | buttons[key].setShow = function (state) { 591 | if (state) 592 | button_el.removeClass(self._hideClass); 593 | else 594 | button_el.addClass(self._hideClass); 595 | 596 | buttons[key].show = state; 597 | }; 598 | 599 | buttons[key].setText(buttons[key].text); 600 | buttons[key].setBtnClass(buttons[key].btnClass); 601 | buttons[key].setDisabled(buttons[key].disabled); 602 | buttons[key].setShow(buttons[key].show); 603 | 604 | button_el.click(function (e) { 605 | e.preventDefault(); 606 | self.triggerButton(key); 607 | }); 608 | 609 | buttons[key].el = button_el; 610 | 611 | self.$buttonContainer.append(button_el); 612 | }); 613 | 614 | this.buttons = buttons; 615 | this._buttonCount = Object.keys(buttons).length; 616 | }, 617 | /** 618 | * Buttons in the model. 619 | */ 620 | _buttonCount: 0, 621 | _themePrefix: 'ng-confirm-', 622 | _pSetTheme: '', 623 | /** 624 | * sets the theme class 625 | * @param theme 626 | * @returns {string} 627 | */ 628 | setTheme: function (theme) { 629 | var c = this._prefixThis(theme, this._themePrefix); 630 | this.$el.removeClass(this._pSetTheme).addClass(c); 631 | this._pSetTheme = c; 632 | }, 633 | _rtlClass: 'ng-confirm-rtl', 634 | /** 635 | * sets and removes the Right to left class 636 | * @param state 637 | */ 638 | setRtl: function (state) { 639 | if (state) 640 | this.$el.addClass(this._rtlClass); 641 | else 642 | this.$el.removeClass(this._rtlClass); 643 | 644 | this.rtl = state; 645 | }, 646 | /** 647 | * Sets the background opacity. 648 | * @param opacity 649 | */ 650 | setBgOpacity: function (opacity) { 651 | this.$confirmBg.css('opacity', opacity); 652 | this.bgOpacity = opacity; 653 | }, 654 | _cubic_bezier: '0.36, 0.55, 0.19', 655 | _getCSS: function (speed, bounce) { 656 | return { 657 | '-webkit-transition-duration': speed / 1000 + 's', 658 | 'transition-duration': speed / 1000 + 's', 659 | '-webkit-transition-timing-function': 'cubic-bezier(' + this._cubic_bezier + ', ' + bounce + ')', 660 | 'transition-timing-function': 'cubic-bezier(' + this._cubic_bezier + ', ' + bounce + ')' 661 | } 662 | }, 663 | _hash: function (str) { 664 | var string = str.toString(); 665 | var hash = 0; 666 | if (string.length == 0) return hash; 667 | for (var i = 0; i < string.length; i++) { 668 | var char = string.toString().charCodeAt(i); 669 | hash = ((hash << 5) - hash) + char; 670 | hash = hash & hash; // Convert to 32bit integer 671 | } 672 | return hash; 673 | }, 674 | _digestWatchUnRegister: false, 675 | /** 676 | * Bind all events. 677 | * 678 | * @returns {boolean} 679 | * @private 680 | */ 681 | _bindEvents: function () { 682 | var self = this; 683 | // bind to scope digest 684 | this._digestWatchUnRegister = this.scope.$watch(function () { 685 | self.setDialogCenter('Digest watcher'); 686 | }); 687 | this.$closeIcon.on('click.' + self._id, function () { 688 | self._closeClick(); 689 | }); 690 | angular.element(window).on('resize.' + self._id, function () { 691 | self.setDialogCenter('Window Resize'); 692 | }); 693 | angular.element(window).on('keyup.' + self._id, function (e) { 694 | self._reactOnKey(e); 695 | }); 696 | this.$scrollPane.on('click', function () { 697 | self._scrollPaneClick(); 698 | }); 699 | this.$confirmBox.on('click', function () { 700 | self.boxClicked = true; 701 | }); 702 | }, 703 | _unBindEvents: function () { 704 | angular.element(window).off('resize.' + this._id); 705 | angular.element(window).off('keyup.' + this._id); 706 | this.$closeIcon.off('click.' + this._id); 707 | if (this._digestWatchUnRegister) 708 | this._digestWatchUnRegister(); 709 | }, 710 | _reactOnKey: function (e) { 711 | var that = this; 712 | 713 | var openedModals = angular.element('.ng-confirm'); 714 | if (openedModals.eq(openedModals.length - 1)[0] !== this.$el[0]) { 715 | // if the event is called, and this modal is not the top most one, abort 716 | return false; 717 | } 718 | 719 | var key = e.which; 720 | 721 | if ($(this.$el).find(':input').is(':focus') && /13|32/.test(key)) { 722 | return; 723 | } 724 | 725 | var keyChar = this._getKey(key); 726 | 727 | if (keyChar === 'esc' && this.escapeKey) { 728 | if (this.escapeKey == true) { 729 | this._scrollPaneClick(); 730 | } 731 | else if (typeof this.escapeKey == 'string' || typeof this.escapeKey == 'function') { 732 | var buttonName = false; 733 | if (typeof this.escapeKey == 'function') { 734 | buttonName = this.escapeKey(); 735 | } else { 736 | buttonName = this.escapeKey; 737 | } 738 | 739 | if (buttonName) { 740 | if (!angular.isDefined(this.buttons[buttonName])) { 741 | $log.warn('Invalid escapeKey, no buttons found with name ' + buttonName); 742 | } else { 743 | this._buttonClick(buttonName); 744 | } 745 | } 746 | } 747 | } 748 | 749 | angular.forEach(this.buttons, function (button, key) { 750 | if (button.keys.indexOf(keyChar) != -1) 751 | that._buttonClick(key); 752 | }); 753 | }, 754 | _scrollPaneClick: function () { 755 | if (this.boxClicked) { 756 | this.boxClicked = false; 757 | return false; 758 | } 759 | 760 | var buttonName = false; 761 | var shouldClose = false; 762 | var str; 763 | 764 | if (typeof this.backgroundDismiss == 'function') 765 | str = this.backgroundDismiss(); 766 | else 767 | str = this.backgroundDismiss; 768 | 769 | if (typeof str == 'string' && angular.isDefined(this.buttons[str])) { 770 | buttonName = str; 771 | shouldClose = false; 772 | } else if (typeof str == 'undefined' || !!(str) == true) { 773 | shouldClose = true; 774 | } else { 775 | shouldClose = false; 776 | } 777 | 778 | if (buttonName) { 779 | var btnResponse = this.buttons[buttonName].action.apply(this, [this.scope, this.buttons[buttonName]]); 780 | shouldClose = (typeof btnResponse == 'undefined') || !!(btnResponse); 781 | } 782 | 783 | if (shouldClose) 784 | this.close(); 785 | else 786 | this.hiLightModal(); 787 | }, 788 | /** 789 | * Called when close button is clicked. 790 | * @private 791 | */ 792 | _closeClick: function () { 793 | var buttonName = false; 794 | var shouldClose = false; 795 | var str; 796 | 797 | if (typeof this.closeIcon == 'function') { 798 | str = this.closeIcon(); 799 | } else { 800 | str = this.closeIcon; 801 | } 802 | 803 | if (typeof str == 'string' && angular.isDefined(this.buttons[str])) { 804 | buttonName = str; 805 | shouldClose = false; 806 | } else if (typeof str == 'undefined' || !!(str) == true) { 807 | shouldClose = true; 808 | } else { 809 | shouldClose = false; 810 | } 811 | 812 | if (buttonName) { 813 | var btnResponse = this.buttons[buttonName].action.apply(this, [this.scope, this.buttons[buttonName]]); 814 | shouldClose = (typeof btnResponse == 'undefined' || !!(btnResponse) == true); 815 | } 816 | if (shouldClose) { 817 | this.close(); 818 | } 819 | }, 820 | _hilightAnimating: false, 821 | _hilightClass: 'ng-confirm-hilight', 822 | /** 823 | * Hilight the modal. 824 | * Whatever animation that is given to it. 825 | */ 826 | hiLightModal: function () { 827 | var self = this; 828 | if (this._hilightAnimating) 829 | return; 830 | 831 | this._hilightAnimating = true; 832 | this.$confirmBox.addClass(this._hilightClass); 833 | setTimeout(function () { 834 | self._hilightAnimating = false; 835 | self.$confirmBox.removeClass(self._hilightClass); 836 | }, this.animationSpeed); 837 | }, 838 | /** 839 | * Button click function 840 | * 841 | * @param buttonKey 842 | * @returns {*} 843 | * @private 844 | */ 845 | _buttonClick: function (buttonKey) { 846 | var res = this.buttons[buttonKey].action.apply(this, [this.scope, this.buttons[buttonKey]]); 847 | if (typeof this.onAction === 'function') 848 | this.onAction.apply(this, [this.scope, buttonKey]); 849 | 850 | if (typeof res === 'undefined' || res) 851 | this.close(); 852 | else 853 | this.scope.$apply(); // if there are changes in the scope. apply it 854 | 855 | 856 | return res; 857 | }, 858 | /** 859 | * Alias for _buttonClick 860 | * Available for triggering buttons. 861 | * 862 | * @param buttonKey 863 | * @returns {*} 864 | */ 865 | triggerButton: function (buttonKey) { 866 | return this._buttonClick(buttonKey); 867 | }, 868 | setDialogCenter: function (where) { 869 | where = where || 'n/a'; // for debug 870 | var $content = this.$content; 871 | var contentHeight = $content.outerHeight(); 872 | var contentPaneHeight = this.$contentPane.outerHeight(); 873 | 874 | var children = $content.children(); 875 | if (children.length != 0) { 876 | // angular jq css will only return inline css. 877 | var marginTopChild = parseInt(children.eq(0).css('margin-top')); 878 | if (marginTopChild) 879 | contentHeight += marginTopChild; 880 | } 881 | 882 | var windowHeight = angular.element(window).height(); 883 | 884 | var confirmBoxHeight = this.$confirmBox.outerHeight(); 885 | if (confirmBoxHeight == 0) { 886 | // console.log(where, confirmBoxHeight); 887 | return; 888 | } 889 | var boxHeight = (confirmBoxHeight - contentPaneHeight) + contentHeight; 890 | var totalOffset = (this.offsetTop) + this.offsetBottom; 891 | var style; 892 | if (boxHeight > (windowHeight - totalOffset) || !this.alignMiddle) { 893 | style = { 894 | 'margin-top': this.offsetTop, 895 | 'margin-bottom': this.offsetBottom, 896 | }; 897 | angular.element('body').addClass('ng-confirm-no-scroll-' + this._id); 898 | } else { 899 | style = { 900 | 'margin-top': (windowHeight - boxHeight) / 2, 901 | 'margin-bottom': 0, 902 | }; 903 | angular.element('body').removeClass('ng-confirm-no-scroll-' + this._id); 904 | } 905 | 906 | this.$contentPane.css({ 907 | 'height': contentHeight, 908 | }).scrollTop(0); 909 | this.$confirmBox.css(style); 910 | }, 911 | _getKey: function (key) { 912 | // special keys. 913 | switch (key) { 914 | case 192: 915 | return 'tilde'; 916 | case 13: 917 | return 'enter'; 918 | case 16: 919 | return 'shift'; 920 | case 9: 921 | return 'tab'; 922 | case 20: 923 | return 'capslock'; 924 | case 17: 925 | return 'ctrl'; 926 | case 91: 927 | return 'win'; 928 | case 18: 929 | return 'alt'; 930 | case 27: 931 | return 'esc'; 932 | } 933 | 934 | // only trust alphabets with this. 935 | var initial = String.fromCharCode(key); 936 | if (/^[A-z0-9]+$/.test(initial)) 937 | return initial.toLowerCase(); 938 | else 939 | return false; 940 | }, 941 | open: function () { 942 | var that = this; 943 | this._prepare(); 944 | $timeout(function () { 945 | that._open(); 946 | }, 100); 947 | 948 | return true; 949 | }, 950 | _open: function () { 951 | var self = this; 952 | 953 | if (typeof this.onOpenBefore == 'function') 954 | this.onOpenBefore.apply(this, [this.scope]); 955 | 956 | angular.element(this.container).append(this.$el); 957 | self.setDialogCenter('_open'); 958 | 959 | setTimeout(function () { 960 | // console.log(self.$el.html()); 961 | self.$contentPane.css(self._getCSS(self.animationSpeed, 1)); 962 | self.$confirmBox.css(self._getCSS(self.animationSpeed, self.animationBounce)); 963 | self._removeAnimationClass(); 964 | self.$confirmBg.removeClass('ng-confirm-bg-h'); 965 | self.$confirmBox.focus(); 966 | 967 | setTimeout(function () { 968 | self._bindEvents(); 969 | self.$confirmBox.css(self._getCSS(self.animationSpeed, 1)); 970 | self._modalReady.resolve(); 971 | 972 | if (typeof self.onOpen === 'function') 973 | self.onOpen.apply(self, [self.scope]); 974 | 975 | self._startCountDown(); 976 | }, self.animationSpeed); 977 | }, 100); 978 | }, 979 | _autoCloseKey: false, 980 | _autoCloseInterval: 0, 981 | _startCountDown: function () { 982 | var self = this; 983 | if (typeof this.autoClose != 'string') return; 984 | var opt = this.autoClose.split('|'); 985 | if (opt.length != 2) { 986 | $log.error("Invalid option for autoClose. example 'close|10000'"); 987 | return; 988 | } 989 | 990 | this._autoCloseKey = opt[0]; 991 | var time = opt[1]; 992 | var sec = time / 1000; 993 | 994 | if (!angular.isDefined(this.buttons[this._autoCloseKey])) { 995 | $log.error('Auto close button "' + self._autoCloseKey + '" not defined.'); 996 | return; 997 | } 998 | 999 | var timer_el = angular.element(''); 1000 | this.buttons[this._autoCloseKey].el.append(timer_el); 1001 | 1002 | this._autoCloseInterval = setInterval(function () { 1003 | var s = sec ? " (" + (--sec) + ")" : ""; 1004 | timer_el.html(s); 1005 | if (sec < 1) { 1006 | self._stopCountDown(); 1007 | self._buttonClick(self._autoCloseKey); 1008 | } 1009 | }, 1000); 1010 | }, 1011 | _stopCountDown: function () { 1012 | if (this._autoCloseInterval) { 1013 | clearInterval(this._autoCloseInterval); 1014 | } 1015 | }, 1016 | closed: false, 1017 | isClosed: function () { 1018 | return this.closed; 1019 | }, 1020 | isOpen: function () { 1021 | return !this.closed; 1022 | }, 1023 | close: function () { 1024 | var self = this; 1025 | if (typeof this.onClose === 'function') 1026 | this.onClose.apply(this, [this.scope]); 1027 | 1028 | this._unBindEvents(); 1029 | this._stopCountDown(); 1030 | 1031 | this._setAnimationClass(this.closeAnimation); 1032 | this.$confirmBg.addClass('ng-confirm-bg-h'); 1033 | var closeTimer = this.animationSpeed * .4; 1034 | 1035 | setTimeout(function () { 1036 | self.$el.remove(); 1037 | self.closed = true; 1038 | if (!self._providedScope) 1039 | self.scope.$destroy(); 1040 | 1041 | if (typeof self.onDestroy == 'function') 1042 | self.onDestroy.apply(self, [self.scope]); 1043 | 1044 | angular.element('body').removeClass('ng-confirm-no-scroll-' + self._id); 1045 | self._lastFocused.focus(); 1046 | self = undefined; 1047 | }, closeTimer); 1048 | 1049 | return true; 1050 | } 1051 | }; 1052 | 1053 | return ngConfirmBase; 1054 | } 1055 | ]); -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "angular-confirm1", 3 | "version": "1.1.0", 4 | "title": "angular-confirm.js | A multipurpose alert and confirm plugin", 5 | "description": "A angular plugin that provides great set of features like, Auto-close, Ajax-loading, background-dismiss, themes and more.", 6 | "homepage": "http://craftpip.github.io/angular-confirm/", 7 | "author": "Boniface Periera (http://github.com/craftpip/)", 8 | "licenses": [ 9 | { 10 | "type": "MIT", 11 | "url": "https://github.com/craftpip/angular-confirm/blob/master/LICENSE" 12 | } 13 | ], 14 | "repository": { 15 | "type": "git", 16 | "url": "https://github.com/craftpip/angular-confirm.git" 17 | }, 18 | "main": "dist/angular-confirm.min.js", 19 | "dependencies": {}, 20 | "bugs": { 21 | "url": "https://github.com/craftpip/angular-confirm/issues" 22 | }, 23 | "scripts": { 24 | "test": "echo \"Error: no test specified\" && exit 1" 25 | }, 26 | "keywords": [ 27 | "angular-plugin", 28 | "angular", 29 | "confirm", 30 | "alert", 31 | "dialog" 32 | ], 33 | "license": "MIT" 34 | } 35 | 36 | -------------------------------------------------------------------------------- /table.html: -------------------------------------------------------------------------------- 1 |

2 | Loading content asynchronously! (Lazy loading content)
3 | You can preview this file table.html 4 |

5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | 76 | 77 | 78 | 79 | 80 | 81 | 82 | 83 | 84 | 85 | 86 | 87 | 88 | 89 | 90 | 91 | 92 | 93 | 94 | 95 | 96 | 97 | 98 | 99 | 100 | 101 | 102 | 103 | 104 | 105 | 106 | 107 | 108 | 109 | 110 | 111 | 112 | 113 | 114 | 115 | 116 | 117 | 118 | 119 | 120 | 121 | 122 | 123 | 124 | 125 | 126 | 127 | 128 | 129 | 130 | 131 | 132 | 133 | 134 | 135 | 136 | 137 | 138 | 139 | 140 | 141 | 142 | 143 | 144 | 145 | 146 | 147 | 148 | 149 | 150 | 151 | 152 | 153 | 154 | 155 | 156 | 157 | 158 | 159 | 160 | 161 | 162 | 163 | 164 | 165 | 166 | 167 | 168 | 169 | 170 | 171 | 172 | 173 | 174 | 175 | 176 | 177 | 178 | 179 | 180 | 181 | 182 | 183 | 184 | 185 | 186 | 187 | 188 | 189 | 190 | 191 | 192 | 193 | 194 | 195 | 196 | 197 | 198 | 199 | 200 | 201 | 202 | 203 | 204 | 205 | 206 | 207 | 208 | 209 | 210 | 211 | 212 | 213 | 214 | 215 | 216 | 217 | 218 | 219 | 220 | 221 | 222 | 223 | 224 | 225 | 226 | 227 | 228 | 229 | 230 | 231 | 232 | 233 | 234 | 235 | 236 | 237 | 238 | 239 | 240 | 241 | 242 | 243 | 244 | 245 | 246 | 247 | 248 | 249 | 250 | 251 | 252 | 253 | 254 | 255 | 256 | 257 | 258 | 259 | 260 | 261 | 262 | 263 | 264 | 265 | 266 | 267 | 268 | 269 | 270 | 271 | 272 | 273 | 274 | 275 | 276 | 277 | 278 | 279 | 280 | 281 | 282 | 283 | 284 | 285 | 286 | 287 | 288 | 289 | 290 | 291 | 292 | 293 | 294 | 295 | 296 | 297 | 298 | 299 | 300 | 301 | 302 | 303 | 304 | 305 | 306 | 307 | 308 | 309 | 310 | 311 | 312 | 313 | 314 | 315 | 316 | 317 | 318 | 319 | 320 | 321 | 322 | 323 | 324 | 325 | 326 | 327 | 328 | 329 | 330 | 331 | 332 | 333 | 334 | 335 | 336 |
NameCityCompany
AdaraArquata del TrontoAt Nisi Cum LLP
HeatherSpringfieldLorem Ipsum Dolor Associates
JennaMilton KeynesPharetra Nam Ac Institute
IrisBelgaumUltrices Vivamus LLC
KarleighPelagoPurus Maecenas Libero LLC
CharlesNizipSit Amet Corp.
BrodyDworpAc Mattis Limited
RalphZevekoteFaucibus Orci Associates
KaitlinRoveredo in PianoMassa Suspendisse Incorporated
BarryMontroseMolestie PC
HarperBorgomaroNibh Company
JessamineAydınMolestie In Tempus LLP
FionaWeeldeDonec Non Limited
JasperTrogn�eNascetur Ridiculus LLC
YettaKukatpalleMontes Nascetur Ridiculus Inc.
MalikBuggenhoutEu Eros Nam Foundation
SierraBilaspurNascetur LLP
SolomonTorgnyEu Incorporated
HaleeOostkampErat Vel Inc.
CathleenBeaumarisTempor Arcu Vestibulum Company
OrliSökeLorem Ipsum Consulting
ImaniThuinIn Nec Limited
EvanOudenakenFames LLP
QuamarNew WestminsterCongue Turpis In Company
DakotaBrucargoTempus Corp.
ChandaBelvedere OstrenseNeque Morbi Corp.
MaraSalice SalentinoAdipiscing Lacus Ut Incorporated
HadassahRoxboroSuspendisse Tristique Neque LLC
MoanaElblągRutrum Lorem Ac Foundation
MacyPangnirtungEuismod Ac LLC
CelestePeterheadNulla Facilisis Foundation
RebeccaSelkirkEnim Consequat Inc.
PalomaGondiyaNunc Inc.
ArsenioPontarlierPede LLC
NicholasHerentalsDuis Institute
LionelBrisbaneSagittis Duis Gravida Incorporated
IfeomaGulfportEt Magna PC
LewisNorderstedtAccumsan Laoreet Associates
HallMonteleone di SpoletoVitae Posuere Associates
QuentinPictonNon Leo Ltd
HedwigIngraj BazarAt Libero Ltd
ClarkeUkkelIn Faucibus Morbi Industries
OliverSaharanpurOrnare LLC
NolanMysoreMollis Incorporated
ImaniBeverloLorem Institute
BarryGunaEleifend Vitae Limited
CiaraStratford-upon-AvonPellentesque LLC
MufutauSint-Kruis-WinkelUrna Inc.
KiboDubuissonBibendum Fermentum Metus Company
EmmaNeum�nsterUltrices Corporation
EthanMattersburgConsequat Nec Incorporated
FrederickaPenrithAnte Nunc Mauris LLC
SylviaBrusselDonec Egestas Duis LLC
JulianMei�enVel Consulting
NicholasMandasorSuscipit Est Company
DeirdreKirklandNon Inc.
JonahHenley-on-ThamesOdio Foundation
FallonDabgramNascetur Ridiculus Ltd
UrsaFranekerRutrum Institute
AquilaMalbaieNostra Company
DevinBevilacquaPlacerat Industries
ShanaImphalLorem Eget LLC
AmandaRoux-MiroirIaculis Nec Eleifend Company
BritanneyBihar SharifRutrum Ltd
AustinCarlisleAmet PC
-------------------------------------------------------------------------------- /text.txt: -------------------------------------------------------------------------------- 1 | Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod 2 | tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, 3 | quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo 4 | consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse 5 | cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non 6 | proident, sunt in culpa qui officia deserunt mollit anim id est laborum.Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod 7 | tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, 8 | quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo aliqua. Ut enim ad minim veniam, -------------------------------------------------------------------------------- /themelayout.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/craftpip/angular-confirm/0283ef1ce55b263f7db71d3d1ced357b9b3ef3c7/themelayout.png -------------------------------------------------------------------------------- /themelayout.psd: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/craftpip/angular-confirm/0283ef1ce55b263f7db71d3d1ced357b9b3ef3c7/themelayout.psd -------------------------------------------------------------------------------- /themes.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | angular-confirm.js | The multipurpose alert & confirm 7 | 9 | 12 | 14 | 16 | 19 | 21 | 23 | 25 | 27 | 30 | 33 | 36 | 39 | 41 | 43 | 45 | 47 | 49 | 51 | 53 | 54 | 56 | 57 | 58 | 60 | 61 | 62 | 63 | 66 | 67 | 68 | 69 | 72 | 74 | 75 | 76 | 77 | 79 |
80 |
81 |
82 | 89 | 92 |
93 | 134 |
135 |
136 |
139 |
140 |

142 | ANGULAR-CONFIRM 144 |

145 | 146 |

147 | Themes - Use one, or make your own. 148 |

149 |
150 |
151 |
153 | 154 |
155 |
156 |
157 |
158 |
159 |

160 | angular-confirm v docs
161 | 162 | view on Github 163 | 164 |

165 |
166 |
167 | 179 |
180 |
181 |
182 |
183 |

184 | back to 185 | Main Docs 186 |

187 | 188 | 189 | 194 | 197 | 198 |
199 |

Themes

200 | 201 |

202 | The Light & Dark themes that suit any website design,
203 |

204 | 205 |
206 | 207 | 208 | 209 | 210 | 211 | 212 | 213 | 214 |
215 | 
$ngConfirm({
216 |     theme: 'light'
217 | });
218 | $.confirm({
219 |     theme: 'dark'
220 | });
221 | $.confirm({
222 |     theme: 'supervan' // 'material', 'bootstrap'
223 | });
224 |
225 |
226 | 227 |
228 |

Make your own themes

229 | 230 |

231 | Why not? A unique design must have a unique confirm box
232 |

233 | 234 |
235 |
236 |
237 |

238 | This is a CSS boilerplate for defining a theme. 239 |

240 |
241 | 242 | 243 |
244 |
245 | 
.ng-confirm.ng-confirm-my-theme {
246 |   .ng-confirm-bg {
247 |     &.ng-confirm-bg-h {
248 |     }
249 |   }
250 |   .ng-confirm-scrollpane {
251 |   }
252 |   .ng-confirm-box {
253 |     &.ng-confirm-loading {
254 |       &:before {
255 |       }
256 |       &:after {
257 |       }
258 |     }
259 |     div.ng-confirm-closeIcon {
260 |       &:empty {
261 |       }
262 |       .fa, .glyphicon, .zmdi {
263 |       }
264 |       &:hover {
265 |       }
266 |     }
267 |     div.ng-confirm-title-c {
268 |       .ng-confirm-icon-c {
269 |         i {
270 |         }
271 |         &:empty {
272 |         }
273 |       }
274 |       .ng-confirm-title {
275 |         &:empty {
276 |         }
277 |       }
278 |     }
279 |     div.ng-confirm-content-pane {
280 |       .ng-confirm-content {
281 |         img {
282 |         }
283 |         &:empty {
284 |         }
285 |       }
286 |     }
287 |     .ng-confirm-buttons {
288 |       button{
289 |       }
290 |     }
291 |   }
292 |   .ng-confirm-clear {
293 |   }
294 |   &.ng-confirm-rtl {
295 |     .ng-confirm-closeIcon {
296 |     }
297 |   }
298 | }
299 | 
.ng-confirm.ng-confirm-my-theme {
300 | }
301 | .ng-confirm.ng-confirm-my-theme .ng-confirm-bg {
302 | }
303 | .ng-confirm.ng-confirm-my-theme .ng-confirm-bg.ng-confirm-bg-h {
304 | }
305 | .ng-confirm.ng-confirm-my-theme .ng-confirm-scrollpane {
306 | }
307 | .ng-confirm.ng-confirm-my-theme .ng-confirm-box {
308 | }
309 | .ng-confirm.ng-confirm-my-theme .ng-confirm-box.ng-confirm-loading {
310 | }
311 | .ng-confirm.ng-confirm-my-theme .ng-confirm-box.ng-confirm-loading:before {
312 | }
313 | .ng-confirm.ng-confirm-my-theme .ng-confirm-box.ng-confirm-loading:after {
314 | }
315 | .ng-confirm.ng-confirm-my-theme .ng-confirm-box div.ng-confirm-closeIcon {
316 | }
317 | .ng-confirm.ng-confirm-my-theme .ng-confirm-box div.ng-confirm-closeIcon:empty {
318 | }
319 | .ng-confirm.ng-confirm-my-theme .ng-confirm-box div.ng-confirm-closeIcon .fa,
320 | .ng-confirm.ng-confirm-my-theme .ng-confirm-box div.ng-confirm-closeIcon .glyphicon,
321 | .ng-confirm.ng-confirm-my-theme .ng-confirm-box div.ng-confirm-closeIcon .zmdi {
322 | }
323 | .ng-confirm.ng-confirm-my-theme .ng-confirm-box div.ng-confirm-closeIcon:hover {
324 | }
325 | .ng-confirm.ng-confirm-my-theme .ng-confirm-box div.ng-confirm-title-c {
326 | }
327 | .ng-confirm.ng-confirm-my-theme .ng-confirm-box div.ng-confirm-title-c .ng-confirm-icon-c {
328 | }
329 | .ng-confirm.ng-confirm-my-theme .ng-confirm-box div.ng-confirm-title-c .ng-confirm-icon-c i {
330 | }
331 | .ng-confirm.ng-confirm-my-theme .ng-confirm-box div.ng-confirm-title-c .ng-confirm-icon-c:empty {
332 | }
333 | .ng-confirm.ng-confirm-my-theme .ng-confirm-box div.ng-confirm-title-c .ng-confirm-title {
334 | }
335 | .ng-confirm.ng-confirm-my-theme .ng-confirm-box div.ng-confirm-title-c .ng-confirm-title:empty {
336 | }
337 | .ng-confirm.ng-confirm-my-theme .ng-confirm-box div.ng-confirm-content-pane {
338 | }
339 | .ng-confirm.ng-confirm-my-theme .ng-confirm-box div.ng-confirm-content-pane .ng-confirm-content {
340 | }
341 | .ng-confirm.ng-confirm-my-theme .ng-confirm-box div.ng-confirm-content-pane .ng-confirm-content img {
342 | }
343 | .ng-confirm.ng-confirm-my-theme .ng-confirm-box div.ng-confirm-content-pane .ng-confirm-content:empty {
344 | }
345 | .ng-confirm.ng-confirm-my-theme .ng-confirm-box .ng-confirm-buttons {
346 | }
347 | .ng-confirm.ng-confirm-my-theme .ng-confirm-box .ng-confirm-buttons button {
348 | }
349 | .ng-confirm.ng-confirm-my-theme .ng-confirm-clear {
350 | }
351 | .ng-confirm.ng-confirm-my-theme.ng-confirm-rtl {
352 | }
353 | .ng-confirm.ng-confirm-my-theme.ng-confirm-rtl .ng-confirm-closeIcon {
354 | }
355 |
356 |
357 |

358 | JS part of it 359 |

360 | 
$ngConfirm({
361 |     theme: 'my-theme'
362 | });
363 |
364 |
365 |
366 |
367 | 368 | 375 | 376 |
377 |
378 |

379 | Thanks for making it to the end of the document.
380 | Your support and suggestions matter the most! 381 |

382 | Please post your
Questions / Suggestions / Issues. 385 |

Made by @craftpip

386 | 387 |
388 |
389 |
390 |
391 |
392 | 393 | 395 | 396 | 398 | 399 | 415 | 416 | 420 | 435 | 436 | -------------------------------------------------------------------------------- /themes_popup.html: -------------------------------------------------------------------------------- 1 |
2 |
3 |

Change the below fields to see the changes.

4 |
5 |
6 |
7 | 8 |
18 |
19 |
20 |
21 | 22 |
33 |
34 |
35 |
36 | 37 | 38 |
39 |
40 |
41 |
42 | 43 | 44 |
45 |
46 |
47 |
48 | 52 |
53 |
54 |
55 |
56 | 60 |
61 |
62 |
63 |
64 | 65 | 66 |
67 |
68 |
--------------------------------------------------------------------------------