diff --git a/themes/grav/css/jquery.remodal.css b/themes/grav/css/jquery.remodal.css new file mode 100644 index 00000000..57b07a2c --- /dev/null +++ b/themes/grav/css/jquery.remodal.css @@ -0,0 +1,249 @@ +/* + * Remodal - v0.2.0 + * Flat, responsive, lightweight, easy customizable modal window plugin with declarative state notation and hash tracking. + * http://vodkabears.github.io/remodal/ + * + * Made by Ilya Makarov + * Under MIT License + */ + +/* ========================================================================== + Remodal necessary styles + ========================================================================== */ + +/* Hide scroll bar */ + +html.remodal_lock, body.remodal_lock { + overflow: hidden; +} + +/* Anti FOUC */ + +.remodal, [data-remodal-id] { + visibility: hidden; +} + +/* Overlay necessary styles */ + +.remodal-overlay { + position: fixed; + top: 0; + left: 0; + right: 0; + bottom: 0; + z-index: 10000; + + display: none; + overflow: auto; + -webkit-overflow-scrolling: touch; + + text-align: center; +} + +.remodal-overlay:after { + display: inline-block; + height: 100%; + margin-left: -0.05em; + + content: ''; +} + +/* Fix iPad, iPhone glitches */ + +.remodal-overlay > * { + -webkit-transform: translateZ(0px); +} + +/* Modal dialog necessary styles */ + +.remodal { + position: relative; + + display: inline-block; +} + +/* ========================================================================== + Remodal default theme + ========================================================================== */ + +/* Default theme font */ + +@import url(http://fonts.googleapis.com/css?family=Exo+2:700,400&subset=latin,cyrillic); + +.remodal, .remodal * { + font-family: 'Exo 2', sans-serif; +} + +/* Background for effects */ + +.remodal-bg { + -webkit-transition: -webkit-filter 0.2s linear; + -moz-transition: -moz-filter 0.2s linear; + -o-transition: -o-filter 0.2s linear; + transition: filter 0.2s linear; +} + +body.remodal_active .remodal-bg { + -webkit-filter: blur(3px); + -moz-filter: blur(3px); + -o-filter: blur(3px); + -ms-filter: blur(3px); + filter: blur(3px); +} + +/* Overlay default theme styles */ + +.remodal-overlay { + opacity: 0; + background: rgba(33, 36, 46, 0.95); + -webkit-transition: opacity 0.2s linear; + -moz-transition: opacity 0.2s linear; + -o-transition: opacity 0.2s linear; + transition: opacity 0.2s linear; +} + +body.remodal_active .remodal-overlay { + opacity: 1; +} + +/* Modal dialog default theme styles */ + +.remodal { + width: 100%; + min-height: 100%; + padding: 35px; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; + + font-size: 16px; + background: #f4f4f4; + background-clip: padding-box; + color: #182a3c; + -webkit-box-shadow: 0px 0px 8px #171a24; + box-shadow: 0px 0px 8px #171a24; + -webkit-transform: scale(0.95); + -moz-transform: scale(0.95); + -ms-transform: scale(0.95); + -o-transform: scale(0.95); + transform: scale(0.95); + -webkit-transition: -webkit-transform 0.2s linear; + -moz-transition: -moz-transform 0.2s linear; + -o-transition: -o-transform 0.2s linear; + transition: transform 0.2s linear; +} + +body.remodal_active .remodal { + -webkit-transform: scale(1); + -moz-transform: scale(1); + -ms-transform: scale(1); + -o-transform: scale(1); + transform: scale(1); +} + +/* Modal dialog vertical align */ + +.remodal, .remodal-overlay:after { + vertical-align: middle; +} + +/* Close button */ + +.remodal-close { + position: absolute; + top: 5px; + left: 5px; + + width: 28px; + height: 28px; + + text-decoration: none; + -webkit-border-radius: 50%; + border-radius: 50%; + border: 2px solid #3e5368; + -webkit-transition: background 0.2s linear; + -moz-transition: background 0.2s linear; + -o-transition: background 0.2s linear; + transition: background 0.2s linear; +} + +.remodal-close:after { + display: block; + + font-size: 28px; + font-family: Arial, 'Helvetica CY', 'Nimbus Sans L', sans-serif !important; + content: "×"; + line-height: 28px; + cursor: pointer; + text-decoration: none; + color: #3e5368; + -webkit-transition: all 0.2s linear; + -moz-transition: all 0.2s linear; + -o-transition: all 0.2s linear; + transition: all 0.2s linear; +} + +.remodal-close:hover, .remodal-close:active { + background: #3e5368; +} + +.remodal-close:hover.remodal-close:after, .remodal-close:active.remodal-close:after { + color: #f4f4f4; +} + +/* Dialog buttons */ + +.remodal-confirm, .remodal-cancel { + display: inline-block; + width: 120px; + padding: 9px 0; + margin: 0 0 5px 0; + + font-size: 10pt; + cursor: pointer; + text-decoration: none; + text-align: center; + -webkit-border-radius: 50px; + border-radius: 50px; + background-clip: padding-box; + -webkit-transition: all 0.2s linear; + -moz-transition: all 0.2s linear; + -o-transition: all 0.2s linear; + transition: all 0.2s linear; +} + +.remodal-confirm { + border: 2px solid #16a085; + background: #f4f4f4; + color: #16a085; +} + +.remodal-confirm:hover, .remodal-confirm:active { + background: #16a085; + color: #f4f4f4; +} + +.remodal-cancel { + border: 2px solid #c0392b; + background: #f4f4f4; + color: #c0392b; +} + +.remodal-cancel:hover, .remodal-cancel:active { + background: #c0392b; + color: #f4f4f4; +} + +/* Media queries + ========================================================================== */ + +@media only screen and (min-width: 40.063em) /* min-width 641px */ { + .remodal { + max-width: 700px; + margin: 20px auto; + min-height: 0; + + -webkit-border-radius: 6px; + border-radius: 6px; + } +} \ No newline at end of file diff --git a/themes/grav/js/jquery.remodal.min.js b/themes/grav/js/jquery.remodal.min.js new file mode 100644 index 00000000..9e2adb12 --- /dev/null +++ b/themes/grav/js/jquery.remodal.min.js @@ -0,0 +1,9 @@ +/* + * Remodal - v0.2.0 + * Flat, responsive, lightweight, easy customizable modal window plugin with declarative state notation and hash tracking. + * http://vodkabears.github.io/remodal/ + * + * Made by Ilya Makarov + * Under MIT License + */ +!function(a){"use strict";function b(b,e){this.settings=a.extend({},d,e),this.modal=b,this.buildDOM(),this.addEventListeners(),this.index=a[c].lookup.push(this)-1,this.busy=!1}var c="remodal",d={hashTracking:!0,closeOnConfirm:!0,closeOnCancel:!0};a[c]={lookup:[]};var e,f,g=function(a){var b=a.css("transition-duration")||a.css("-webkit-transition-duration")||a.css("-moz-transition-duration")||a.css("-o-transition-duration")||a.css("-ms-transition-duration")||0,c=a.css("transition-delay")||a.css("-webkit-transition-delay")||a.css("-moz-transition-delay")||a.css("-o-transition-delay")||a.css("-ms-transition-delay")||0;return 1e3*(parseFloat(b)+parseFloat(c))},h=function(){if(a(document.body).height()<=a(window).height())return 0;var b=document.createElement("div");b.style.visibility="hidden",b.style.width="100px",document.body.appendChild(b);var c=b.offsetWidth;b.style.overflow="scroll";var d=document.createElement("div");d.style.width="100%",b.appendChild(d);var e=d.offsetWidth;return b.parentNode.removeChild(b),c-e},i=function(){a(document.body).css("padding-right","+="+h()),a("html, body").addClass(c+"_lock")},j=function(){a(document.body).css("padding-right","-="+h()),a("html, body").removeClass(c+"_lock")},k=function(a){var b,c,d={};b=a.replace(/\s*:\s*/g,":").replace(/\s*,\s*/g,","),c=b.split(",");var e,f,g;for(e=0,f=c.length;f>e;e++)c[e]=c[e].split(":"),g=c[e][1],("string"==typeof g||g instanceof String)&&(g="true"===g||("false"===g?!1:g)),("string"==typeof g||g instanceof String)&&(g=isNaN(g)?g:+g),d[c[e][0]]=g;return d};b.prototype.buildDOM=function(){this.body=a(document.body),this.bg=a("."+c+"-bg"),this.modalClose=a("").addClass(c+"-close"),this.overlay=a("
").addClass(c+"-overlay"),this.modal.hasClass(c)||this.modal.addClass(c),this.modal.css("visibility","visible"),this.modal.append(this.modalClose),this.overlay.append(this.modal),this.body.append(this.overlay),this.confirm=this.modal.find("."+c+"-confirm"),this.cancel=this.modal.find("."+c+"-cancel");var b=g(this.overlay),d=g(this.modal),e=g(this.bg);this.td=d>b?d:b,this.td=e>this.td?e:this.td},b.prototype.addEventListeners=function(){var b=this;this.modalClose.bind("click."+c,function(a){a.preventDefault(),b.close()}),this.cancel.bind("click."+c,function(a){a.preventDefault(),b.modal.trigger("cancel"),b.settings.closeOnCancel&&b.close()}),this.confirm.bind("click."+c,function(a){a.preventDefault(),b.modal.trigger("confirm"),b.settings.closeOnConfirm&&b.close()}),a(document).bind("keyup."+c,function(a){27===a.keyCode&&b.close()}),this.overlay.bind("click."+c,function(d){var e=a(d.target);e.hasClass(c+"-overlay")&&b.close()})},b.prototype.open=function(){if(!this.busy){this.busy=!0,this.modal.trigger("open");var b=this.modal.attr("data-"+c+"-id");b&&this.settings.hashTracking&&(f=a(window).scrollTop(),location.hash=b),e&&e!==this&&(e.overlay.hide(),e.body.removeClass(c+"_active")),e=this,i(),this.overlay.show();var d=this;setTimeout(function(){d.body.addClass(c+"_active"),setTimeout(function(){d.busy=!1,d.modal.trigger("opened")},d.td+50)},25)}},b.prototype.close=function(){if(!this.busy){this.busy=!0,this.modal.trigger("close"),this.settings.hashTracking&&this.modal.attr("data-"+c+"-id")===location.hash.substr(1)&&(location.hash="",a(window).scrollTop(f)),this.body.removeClass(c+"_active");var b=this;setTimeout(function(){b.overlay.hide(),j(),b.busy=!1,b.modal.trigger("closed")},b.td+50)}},a&&(a.fn[c]=function(d){var e;return this.each(function(f,g){var h=a(g);null==h.data(c)&&(e=new b(h,d),h.data(c,e.index),e.settings.hashTracking&&h.attr("data-"+c+"-id")===location.hash.substr(1)&&e.open())}),e}),a(document).ready(function(){a(document).on("click","[data-"+c+"-target]",function(b){b.preventDefault();var d=b.currentTarget,e=d.getAttribute("data-"+c+"-target"),f=a("[data-"+c+"-id="+e+"]");a[c].lookup[f.data(c)].open()}),a(document).find("."+c).each(function(b,d){var e=a(d),f=e.data(c+"-options");f?("string"==typeof f||f instanceof String)&&(f=k(f)):f={},e[c](f)})});var l=function(b,d){var f=location.hash.replace("#","");if("undefined"==typeof d&&(d=!0),f){var g;try{g=a("[data-"+c+"-id="+f.replace(new RegExp("/","g"),"\\/")+"]")}catch(b){}if(g&&g.length){var h=a[c].lookup[g.data(c)];h&&h.settings.hashTracking&&h.open()}}else d&&e&&!e.busy&&e.settings.hashTracking&&e.close()};a(window).bind("hashchange."+c,l)}(window.jQuery||window.Zepto); \ No newline at end of file