diff --git a/API.md b/API.md index 6a1ab64..fab9752 100644 --- a/API.md +++ b/API.md @@ -33,7 +33,7 @@ Title of toast. Type: `String` [default: default] -Theme of toast, ax5toast themes using six colors defined by the bootstrap is provided. +Theme of toast, ax5modal themes using six colors defined by the bootstrap is provided. ### width diff --git a/README.md b/README.md index fad2e64..1451c57 100755 --- a/README.md +++ b/README.md @@ -1,6 +1,6 @@ [![axisj-contributed](https://img.shields.io/badge/AXISJ.com-Contributed-green.svg)](https://github.com/axisj) ![](https://img.shields.io/badge/Seowoo-Mondo&Thomas-red.svg) -# bootstrap-ax5toast +# bootstrap-ax5modal > *Dependencies* > * _[jQuery 1.X+](http://jquery.com/)_ @@ -10,7 +10,7 @@ ### Install by bower ```sh -bower install bootstrap-ax5toast +bower install bootstrap-ax5modal ``` [bower](http://bower.io/#install-bower) is web front-end package manager. using the `bower`, when you install the plug-in is installed to resolve the plug-in dependencies under the `bower_components` folder. @@ -20,20 +20,20 @@ If you've never used a bower is, you will be able to be used for [http://bower.i ### Download code - [ax5core Github releases](https://github.com/ax5ui/ax5core/releases) -- [bootstrap-ax5toast Github releases](https://github.com/ax5ui/bootstrap-ax5toast/releases) +- [bootstrap-ax5modal Github releases](https://github.com/ax5ui/bootstrap-ax5modal/releases) -### Insert the "ax5toast" in the HTML HEAD. +### Insert the "ax5modal" in the HTML HEAD. Location of the folder can be determined freely in your project. But be careful not to accidentally caused exactly the path. ```html - + - + .... @@ -43,14 +43,13 @@ exactly the path. ### Basic Usages ```js -var myToast = new ax5.ui.toast(); -myToast.setConfig({ - icon: '', - containerPosition: "bottom-right", - closeIcon: '' +var modal = new ax5.ui.modal(); +modal.setConfig({ + onStateChanged: function(){ + console.log(this); + } }); - -myToast.push('Toast message'); +modal.open(); ``` - - - @@ -62,7 +61,7 @@ In npm, so pile on the package manager for the front end, you need to solve the ```sh npm install jquery npm install ax5core -npm install bootstrap-ax5toast +npm install bootstrap-ax5modal ``` After you download the file in npm install, you will need to copy to the location where you want to use as a resource for the project. @@ -72,6 +71,6 @@ If the inconvenience in the process that you want to copy the file and can be ea ### Preview -- [See Demostration](http://ax5.io/bootstrap-ax5toast/demo/index.html) +- [See Demostration](http://ax5.io/bootstrap-ax5modal/demo/index.html) If you have any questions, please refer to the following [gitHub](https://github.com/ax5ui/ax5ui-kernel) \ No newline at end of file diff --git a/dist/ax5modal.css b/dist/ax5modal.css index 40e0941..8d24d17 100644 --- a/dist/ax5modal.css +++ b/dist/ax5modal.css @@ -1 +1 @@ -@-webkit-keyframes ax-modal{0%{opacity:0.0;-webkit-transform:matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}0.1%{opacity:1.0;-webkit-transform:matrix3d(0.5, 0, 0, 0, 0, 0.5, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.5, 0, 0, 0, 0, 0.5, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}5.9%{-webkit-transform:matrix3d(0.711, 0, 0, 0, 0, 0.742, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.711, 0, 0, 0, 0, 0.742, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}7.7%{-webkit-transform:matrix3d(0.768, 0, 0, 0, 0, 0.812, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.768, 0, 0, 0, 0, 0.812, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}11.5%{-webkit-transform:matrix3d(0.869, 0, 0, 0, 0, 0.935, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.869, 0, 0, 0, 0, 0.935, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}11.7%{-webkit-transform:matrix3d(0.873, 0, 0, 0, 0, 0.94, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.873, 0, 0, 0, 0, 0.94, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}15.2%{-webkit-transform:matrix3d(0.941, 0, 0, 0, 0, 1.014, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.941, 0, 0, 0, 0, 1.014, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}17.5%{-webkit-transform:matrix3d(0.973, 0, 0, 0, 0, 1.045, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.973, 0, 0, 0, 0, 1.045, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}19%{-webkit-transform:matrix3d(0.99, 0, 0, 0, 0, 1.058, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.99, 0, 0, 0, 0, 1.058, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}22.8%{-webkit-transform:matrix3d(1.019, 0, 0, 0, 0, 1.071, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.019, 0, 0, 0, 0, 1.071, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}23.2%{-webkit-transform:matrix3d(1.021, 0, 0, 0, 0, 1.071, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.021, 0, 0, 0, 0, 1.071, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}30.3%{-webkit-transform:matrix3d(1.036, 0, 0, 0, 0, 1.049, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.036, 0, 0, 0, 0, 1.049, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}30.4%{-webkit-transform:matrix3d(1.036, 0, 0, 0, 0, 1.049, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.036, 0, 0, 0, 0, 1.049, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}37.5%{-webkit-transform:matrix3d(1.028, 0, 0, 0, 0, 1.016, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.028, 0, 0, 0, 0, 1.016, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}44.6%{-webkit-transform:matrix3d(1.016, 0, 0, 0, 0, 0.997, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.016, 0, 0, 0, 0, 0.997, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}50.3%{-webkit-transform:matrix3d(1.008, 0, 0, 0, 0, 0.992, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.008, 0, 0, 0, 0, 0.992, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}51.7%{-webkit-transform:matrix3d(1.006, 0, 0, 0, 0, 0.992, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.006, 0, 0, 0, 0, 0.992, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}70.3%{-webkit-transform:matrix3d(0.998, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.998, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}80.3%{-webkit-transform:matrix3d(0.999, 0, 0, 0, 0, 1.001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.999, 0, 0, 0, 0, 1.001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}100%{-webkit-transform:matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}}@-moz-keyframes ax-modal{0%{opacity:0.0;-webkit-transform:matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}0.1%{opacity:1.0;-webkit-transform:matrix3d(0.5, 0, 0, 0, 0, 0.5, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.5, 0, 0, 0, 0, 0.5, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}5.9%{-webkit-transform:matrix3d(0.711, 0, 0, 0, 0, 0.742, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.711, 0, 0, 0, 0, 0.742, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}7.7%{-webkit-transform:matrix3d(0.768, 0, 0, 0, 0, 0.812, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.768, 0, 0, 0, 0, 0.812, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}11.5%{-webkit-transform:matrix3d(0.869, 0, 0, 0, 0, 0.935, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.869, 0, 0, 0, 0, 0.935, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}11.7%{-webkit-transform:matrix3d(0.873, 0, 0, 0, 0, 0.94, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.873, 0, 0, 0, 0, 0.94, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}15.2%{-webkit-transform:matrix3d(0.941, 0, 0, 0, 0, 1.014, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.941, 0, 0, 0, 0, 1.014, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}17.5%{-webkit-transform:matrix3d(0.973, 0, 0, 0, 0, 1.045, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.973, 0, 0, 0, 0, 1.045, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}19%{-webkit-transform:matrix3d(0.99, 0, 0, 0, 0, 1.058, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.99, 0, 0, 0, 0, 1.058, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}22.8%{-webkit-transform:matrix3d(1.019, 0, 0, 0, 0, 1.071, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.019, 0, 0, 0, 0, 1.071, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}23.2%{-webkit-transform:matrix3d(1.021, 0, 0, 0, 0, 1.071, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.021, 0, 0, 0, 0, 1.071, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}30.3%{-webkit-transform:matrix3d(1.036, 0, 0, 0, 0, 1.049, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.036, 0, 0, 0, 0, 1.049, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}30.4%{-webkit-transform:matrix3d(1.036, 0, 0, 0, 0, 1.049, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.036, 0, 0, 0, 0, 1.049, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}37.5%{-webkit-transform:matrix3d(1.028, 0, 0, 0, 0, 1.016, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.028, 0, 0, 0, 0, 1.016, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}44.6%{-webkit-transform:matrix3d(1.016, 0, 0, 0, 0, 0.997, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.016, 0, 0, 0, 0, 0.997, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}50.3%{-webkit-transform:matrix3d(1.008, 0, 0, 0, 0, 0.992, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.008, 0, 0, 0, 0, 0.992, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}51.7%{-webkit-transform:matrix3d(1.006, 0, 0, 0, 0, 0.992, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.006, 0, 0, 0, 0, 0.992, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}70.3%{-webkit-transform:matrix3d(0.998, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.998, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}80.3%{-webkit-transform:matrix3d(0.999, 0, 0, 0, 0, 1.001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.999, 0, 0, 0, 0, 1.001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}100%{-webkit-transform:matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}}@keyframes ax-modal{0%{opacity:0.0;-webkit-transform:matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}0.1%{opacity:1.0;-webkit-transform:matrix3d(0.5, 0, 0, 0, 0, 0.5, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.5, 0, 0, 0, 0, 0.5, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}5.9%{-webkit-transform:matrix3d(0.711, 0, 0, 0, 0, 0.742, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.711, 0, 0, 0, 0, 0.742, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}7.7%{-webkit-transform:matrix3d(0.768, 0, 0, 0, 0, 0.812, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.768, 0, 0, 0, 0, 0.812, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}11.5%{-webkit-transform:matrix3d(0.869, 0, 0, 0, 0, 0.935, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.869, 0, 0, 0, 0, 0.935, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}11.7%{-webkit-transform:matrix3d(0.873, 0, 0, 0, 0, 0.94, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.873, 0, 0, 0, 0, 0.94, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}15.2%{-webkit-transform:matrix3d(0.941, 0, 0, 0, 0, 1.014, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.941, 0, 0, 0, 0, 1.014, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}17.5%{-webkit-transform:matrix3d(0.973, 0, 0, 0, 0, 1.045, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.973, 0, 0, 0, 0, 1.045, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}19%{-webkit-transform:matrix3d(0.99, 0, 0, 0, 0, 1.058, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.99, 0, 0, 0, 0, 1.058, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}22.8%{-webkit-transform:matrix3d(1.019, 0, 0, 0, 0, 1.071, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.019, 0, 0, 0, 0, 1.071, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}23.2%{-webkit-transform:matrix3d(1.021, 0, 0, 0, 0, 1.071, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.021, 0, 0, 0, 0, 1.071, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}30.3%{-webkit-transform:matrix3d(1.036, 0, 0, 0, 0, 1.049, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.036, 0, 0, 0, 0, 1.049, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}30.4%{-webkit-transform:matrix3d(1.036, 0, 0, 0, 0, 1.049, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.036, 0, 0, 0, 0, 1.049, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}37.5%{-webkit-transform:matrix3d(1.028, 0, 0, 0, 0, 1.016, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.028, 0, 0, 0, 0, 1.016, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}44.6%{-webkit-transform:matrix3d(1.016, 0, 0, 0, 0, 0.997, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.016, 0, 0, 0, 0, 0.997, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}50.3%{-webkit-transform:matrix3d(1.008, 0, 0, 0, 0, 0.992, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.008, 0, 0, 0, 0, 0.992, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}51.7%{-webkit-transform:matrix3d(1.006, 0, 0, 0, 0, 0.992, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.006, 0, 0, 0, 0, 0.992, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}70.3%{-webkit-transform:matrix3d(0.998, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.998, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}80.3%{-webkit-transform:matrix3d(0.999, 0, 0, 0, 0, 1.001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.999, 0, 0, 0, 0, 1.001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}100%{-webkit-transform:matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}}@-webkit-keyframes ax-modal-destroy{from{-webkit-transform:scale(1);opacity:1.0}to{-webkit-transform:scale(0.5);opacity:0.0}}@-moz-keyframes ax-modal-destroy{from{-moz-transform:scale(1);opacity:1.0}to{-moz-transform:scale(0.5);opacity:0.0}}@keyframes ax-modal-destroy{from{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1);opacity:1.0}to{-webkit-transform:scale(0.5);-moz-transform:scale(0.5);-ms-transform:scale(0.5);-o-transform:scale(0.5);transform:scale(0.5);opacity:0.0}}.ax5-ui-modal{-webkit-animation:ax-modal 0.7s linear both;-moz-animation:ax-modal 0.7s linear both;animation:ax-modal 0.7s linear both;-webkit-transform:translateZ(0px);-moz-transform:translateZ(0px);-ms-transform:translateZ(0px);-o-transform:translateZ(0px);transform:translateZ(0px);-webkit-transition:all 0.3s cubic-bezier(0.6, -0.28, 0.735, 0.045);-moz-transition:all 0.3s cubic-bezier(0.6, -0.28, 0.735, 0.045);transition:all 0.3s cubic-bezier(0.6, -0.28, 0.735, 0.045);box-sizing:border-box;background-color:#fff;border:1px solid #ddd;border-radius:4px;box-shadow:0px 0px 5px 0px rgba(0,0,0,0.6);z-index:2000;position:fixed;left:0px;top:0px;overflow:hidden}.ax5-ui-modal .ax-modal-body{padding:0px;text-align:center;-webkit-box-flex:1;-moz-box-flex:1;box-flex:1;-webkit-flex:1;-moz-flex:1;-ms-flex:1;flex:1;position:relative}.ax5-ui-modal .ax-modal-body iframe{border:0px none}.ax5-ui-modal.destroy{-webkit-animation:ax-modal-destroy 0.3s cubic-bezier(0.6, -0.28, 0.735, 0.045) forwards;-moz-animation:ax-modal-destroy 0.3s cubic-bezier(0.6, -0.28, 0.735, 0.045) forwards;animation:ax-modal-destroy 0.3s cubic-bezier(0.6, -0.28, 0.735, 0.045) forwards} +@-webkit-keyframes ax-modal{0%{opacity:0.0;-webkit-transform:matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}0.1%{opacity:1.0;-webkit-transform:matrix3d(0.5, 0, 0, 0, 0, 0.5, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.5, 0, 0, 0, 0, 0.5, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}5.9%{-webkit-transform:matrix3d(0.711, 0, 0, 0, 0, 0.742, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.711, 0, 0, 0, 0, 0.742, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}7.7%{-webkit-transform:matrix3d(0.768, 0, 0, 0, 0, 0.812, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.768, 0, 0, 0, 0, 0.812, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}11.5%{-webkit-transform:matrix3d(0.869, 0, 0, 0, 0, 0.935, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.869, 0, 0, 0, 0, 0.935, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}11.7%{-webkit-transform:matrix3d(0.873, 0, 0, 0, 0, 0.94, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.873, 0, 0, 0, 0, 0.94, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}15.2%{-webkit-transform:matrix3d(0.941, 0, 0, 0, 0, 1.014, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.941, 0, 0, 0, 0, 1.014, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}17.5%{-webkit-transform:matrix3d(0.973, 0, 0, 0, 0, 1.045, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.973, 0, 0, 0, 0, 1.045, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}19%{-webkit-transform:matrix3d(0.99, 0, 0, 0, 0, 1.058, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.99, 0, 0, 0, 0, 1.058, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}22.8%{-webkit-transform:matrix3d(1.019, 0, 0, 0, 0, 1.071, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.019, 0, 0, 0, 0, 1.071, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}23.2%{-webkit-transform:matrix3d(1.021, 0, 0, 0, 0, 1.071, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.021, 0, 0, 0, 0, 1.071, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}30.3%{-webkit-transform:matrix3d(1.036, 0, 0, 0, 0, 1.049, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.036, 0, 0, 0, 0, 1.049, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}30.4%{-webkit-transform:matrix3d(1.036, 0, 0, 0, 0, 1.049, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.036, 0, 0, 0, 0, 1.049, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}37.5%{-webkit-transform:matrix3d(1.028, 0, 0, 0, 0, 1.016, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.028, 0, 0, 0, 0, 1.016, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}44.6%{-webkit-transform:matrix3d(1.016, 0, 0, 0, 0, 0.997, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.016, 0, 0, 0, 0, 0.997, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}50.3%{-webkit-transform:matrix3d(1.008, 0, 0, 0, 0, 0.992, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.008, 0, 0, 0, 0, 0.992, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}51.7%{-webkit-transform:matrix3d(1.006, 0, 0, 0, 0, 0.992, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.006, 0, 0, 0, 0, 0.992, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}70.3%{-webkit-transform:matrix3d(0.998, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.998, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}80.3%{-webkit-transform:matrix3d(0.999, 0, 0, 0, 0, 1.001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.999, 0, 0, 0, 0, 1.001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}100%{-webkit-transform:matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}}@-moz-keyframes ax-modal{0%{opacity:0.0;-webkit-transform:matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}0.1%{opacity:1.0;-webkit-transform:matrix3d(0.5, 0, 0, 0, 0, 0.5, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.5, 0, 0, 0, 0, 0.5, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}5.9%{-webkit-transform:matrix3d(0.711, 0, 0, 0, 0, 0.742, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.711, 0, 0, 0, 0, 0.742, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}7.7%{-webkit-transform:matrix3d(0.768, 0, 0, 0, 0, 0.812, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.768, 0, 0, 0, 0, 0.812, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}11.5%{-webkit-transform:matrix3d(0.869, 0, 0, 0, 0, 0.935, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.869, 0, 0, 0, 0, 0.935, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}11.7%{-webkit-transform:matrix3d(0.873, 0, 0, 0, 0, 0.94, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.873, 0, 0, 0, 0, 0.94, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}15.2%{-webkit-transform:matrix3d(0.941, 0, 0, 0, 0, 1.014, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.941, 0, 0, 0, 0, 1.014, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}17.5%{-webkit-transform:matrix3d(0.973, 0, 0, 0, 0, 1.045, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.973, 0, 0, 0, 0, 1.045, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}19%{-webkit-transform:matrix3d(0.99, 0, 0, 0, 0, 1.058, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.99, 0, 0, 0, 0, 1.058, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}22.8%{-webkit-transform:matrix3d(1.019, 0, 0, 0, 0, 1.071, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.019, 0, 0, 0, 0, 1.071, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}23.2%{-webkit-transform:matrix3d(1.021, 0, 0, 0, 0, 1.071, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.021, 0, 0, 0, 0, 1.071, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}30.3%{-webkit-transform:matrix3d(1.036, 0, 0, 0, 0, 1.049, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.036, 0, 0, 0, 0, 1.049, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}30.4%{-webkit-transform:matrix3d(1.036, 0, 0, 0, 0, 1.049, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.036, 0, 0, 0, 0, 1.049, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}37.5%{-webkit-transform:matrix3d(1.028, 0, 0, 0, 0, 1.016, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.028, 0, 0, 0, 0, 1.016, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}44.6%{-webkit-transform:matrix3d(1.016, 0, 0, 0, 0, 0.997, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.016, 0, 0, 0, 0, 0.997, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}50.3%{-webkit-transform:matrix3d(1.008, 0, 0, 0, 0, 0.992, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.008, 0, 0, 0, 0, 0.992, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}51.7%{-webkit-transform:matrix3d(1.006, 0, 0, 0, 0, 0.992, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.006, 0, 0, 0, 0, 0.992, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}70.3%{-webkit-transform:matrix3d(0.998, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.998, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}80.3%{-webkit-transform:matrix3d(0.999, 0, 0, 0, 0, 1.001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.999, 0, 0, 0, 0, 1.001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}100%{-webkit-transform:matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}}@keyframes ax-modal{0%{opacity:0.0;-webkit-transform:matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}0.1%{opacity:1.0;-webkit-transform:matrix3d(0.5, 0, 0, 0, 0, 0.5, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.5, 0, 0, 0, 0, 0.5, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}5.9%{-webkit-transform:matrix3d(0.711, 0, 0, 0, 0, 0.742, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.711, 0, 0, 0, 0, 0.742, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}7.7%{-webkit-transform:matrix3d(0.768, 0, 0, 0, 0, 0.812, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.768, 0, 0, 0, 0, 0.812, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}11.5%{-webkit-transform:matrix3d(0.869, 0, 0, 0, 0, 0.935, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.869, 0, 0, 0, 0, 0.935, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}11.7%{-webkit-transform:matrix3d(0.873, 0, 0, 0, 0, 0.94, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.873, 0, 0, 0, 0, 0.94, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}15.2%{-webkit-transform:matrix3d(0.941, 0, 0, 0, 0, 1.014, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.941, 0, 0, 0, 0, 1.014, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}17.5%{-webkit-transform:matrix3d(0.973, 0, 0, 0, 0, 1.045, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.973, 0, 0, 0, 0, 1.045, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}19%{-webkit-transform:matrix3d(0.99, 0, 0, 0, 0, 1.058, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.99, 0, 0, 0, 0, 1.058, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}22.8%{-webkit-transform:matrix3d(1.019, 0, 0, 0, 0, 1.071, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.019, 0, 0, 0, 0, 1.071, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}23.2%{-webkit-transform:matrix3d(1.021, 0, 0, 0, 0, 1.071, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.021, 0, 0, 0, 0, 1.071, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}30.3%{-webkit-transform:matrix3d(1.036, 0, 0, 0, 0, 1.049, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.036, 0, 0, 0, 0, 1.049, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}30.4%{-webkit-transform:matrix3d(1.036, 0, 0, 0, 0, 1.049, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.036, 0, 0, 0, 0, 1.049, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}37.5%{-webkit-transform:matrix3d(1.028, 0, 0, 0, 0, 1.016, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.028, 0, 0, 0, 0, 1.016, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}44.6%{-webkit-transform:matrix3d(1.016, 0, 0, 0, 0, 0.997, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.016, 0, 0, 0, 0, 0.997, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}50.3%{-webkit-transform:matrix3d(1.008, 0, 0, 0, 0, 0.992, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.008, 0, 0, 0, 0, 0.992, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}51.7%{-webkit-transform:matrix3d(1.006, 0, 0, 0, 0, 0.992, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1.006, 0, 0, 0, 0, 0.992, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}70.3%{-webkit-transform:matrix3d(0.998, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.998, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}80.3%{-webkit-transform:matrix3d(0.999, 0, 0, 0, 0, 1.001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(0.999, 0, 0, 0, 0, 1.001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}100%{-webkit-transform:matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);transform:matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)}}@-webkit-keyframes ax-modal-destroy{from{-webkit-transform:scale(1);opacity:1.0}to{-webkit-transform:scale(0.5);opacity:0.0}}@-moz-keyframes ax-modal-destroy{from{-moz-transform:scale(1);opacity:1.0}to{-moz-transform:scale(0.5);opacity:0.0}}@keyframes ax-modal-destroy{from{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1);opacity:1.0}to{-webkit-transform:scale(0.5);-moz-transform:scale(0.5);-ms-transform:scale(0.5);-o-transform:scale(0.5);transform:scale(0.5);opacity:0.0}}.ax5-ui-modal{-webkit-animation:ax-modal 0.7s linear both;-moz-animation:ax-modal 0.7s linear both;animation:ax-modal 0.7s linear both;-webkit-transform:translateZ(0px);-moz-transform:translateZ(0px);-ms-transform:translateZ(0px);-o-transform:translateZ(0px);transform:translateZ(0px);box-sizing:border-box;background-color:#fff;border:1px solid #ddd;border-radius:4px;box-shadow:0px 0px 5px 0px rgba(0,0,0,0.6);z-index:2000;position:fixed;left:0px;top:0px;overflow:hidden}.ax5-ui-modal .ax-modal-body{padding:0px;text-align:center;-webkit-box-flex:1;-moz-box-flex:1;box-flex:1;-webkit-flex:1;-moz-flex:1;-ms-flex:1;flex:1;position:relative}.ax5-ui-modal .ax-modal-body iframe{border:0px none}.ax5-ui-modal.destroy{-webkit-animation:ax-modal-destroy 0.3s cubic-bezier(0.6, -0.28, 0.735, 0.045) forwards;-moz-animation:ax-modal-destroy 0.3s cubic-bezier(0.6, -0.28, 0.735, 0.045) forwards;animation:ax-modal-destroy 0.3s cubic-bezier(0.6, -0.28, 0.735, 0.045) forwards} diff --git a/src/scss/_ax5modal.scss b/src/scss/_ax5modal.scss index 19261ae..d00ad63 100644 --- a/src/scss/_ax5modal.scss +++ b/src/scss/_ax5modal.scss @@ -133,7 +133,7 @@ .ax5-ui-modal { @include animation(ax-modal 0.7s linear both); @include transform(translateZ(0px)); - @include transition(all $ax5modal-easing-time-open $ease-in-back); + //@include transition(all $ax5modal-easing-time-open $ease-in-back); @include ax-modal(); @include ax-modal-section();