Merge pull request #7889 from shivapoudel/tweak-backbone-modal
Tweak backbone modal
This commit is contained in:
commit
f6346c705c
File diff suppressed because one or more lines are too long
|
@ -4036,7 +4036,7 @@ table.bar_chart {
|
|||
*/
|
||||
.wc-backbone-modal {
|
||||
* {
|
||||
box-sizing: content-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.wc-backbone-modal-content {
|
||||
|
@ -4045,7 +4045,7 @@ table.bar_chart {
|
|||
left: 50%;
|
||||
width: 500px;
|
||||
background: #fff;
|
||||
margin: -150px 0 0 -250px;
|
||||
margin-left: -250px;
|
||||
z-index: 160000;
|
||||
}
|
||||
}
|
||||
|
@ -4063,69 +4063,60 @@ table.bar_chart {
|
|||
}
|
||||
|
||||
.wc-backbone-modal-main {
|
||||
padding-bottom: 50px;
|
||||
padding-bottom: 51px;
|
||||
|
||||
header,
|
||||
article {
|
||||
display: block;
|
||||
position: relative;
|
||||
padding: 4px 16px;
|
||||
}
|
||||
|
||||
.wc-backbone-modal-header {
|
||||
height: 50px;
|
||||
background: #fcfcfc;
|
||||
padding: 0 50px 0 16px;
|
||||
border-bottom: 1px solid #ddd;
|
||||
|
||||
h1 {
|
||||
font-size: 22px;
|
||||
font-weight: 700;
|
||||
line-height: 42px;
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.modal-close-link {
|
||||
cursor: pointer;
|
||||
color: #777;
|
||||
background-color: transparent;
|
||||
height: 50px;
|
||||
width: 50px;
|
||||
padding: 0;
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
border: 0;
|
||||
border-left: 1px solid #ddd;
|
||||
-webkit-transition: color .1s ease-in-out,background .1s ease-in-out;
|
||||
transition: color .1s ease-in-out,background .1s ease-in-out;
|
||||
top: 0;
|
||||
right: 0;
|
||||
text-decoration: none;
|
||||
|
||||
&:hover {
|
||||
background: #ddd;
|
||||
border-color: #ccc;
|
||||
color: #000;
|
||||
outline: 0;
|
||||
text-decoration: none;
|
||||
font-size: 18px;
|
||||
font-weight: 700;
|
||||
line-height: 50px;
|
||||
}
|
||||
|
||||
.close-icon {
|
||||
display: block;
|
||||
height: 15px;
|
||||
background-image: none;
|
||||
.modal-close-link {
|
||||
cursor: pointer;
|
||||
color: #777;
|
||||
height: 50px;
|
||||
width: 50px;
|
||||
padding: 0;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
text-align: center;
|
||||
margin: 14px;
|
||||
width: 22px;
|
||||
border: 0;
|
||||
border-left: 1px solid #ddd;
|
||||
background-color: transparent;
|
||||
-webkit-transition: color .1s ease-in-out,background .1s ease-in-out;
|
||||
transition: color .1s ease-in-out,background .1s ease-in-out;
|
||||
|
||||
&:before {
|
||||
content: '\f335';
|
||||
font-size: 22px;
|
||||
font: 400 20px/1 dashicons;
|
||||
speak: none;
|
||||
vertical-align: middle;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
font: normal 22px/50px 'dashicons' !important;
|
||||
color: #666;
|
||||
display: block;
|
||||
content: '\f335';
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
background: #ddd;
|
||||
border-color: #ccc;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
&:focus {
|
||||
outline: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -4144,17 +4135,20 @@ table.bar_chart {
|
|||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
height: 30px;
|
||||
z-index: 100;
|
||||
padding: 10px 0px;
|
||||
border: 0 solid #dfdfdf;
|
||||
border-width: 1px 0 0 0;
|
||||
padding: 10px 16px;
|
||||
background: #fcfcfc;
|
||||
border-top: 1px solid #dfdfdf;
|
||||
box-shadow: 0 -4px 4px -4px rgba(0,0,0,0.1);
|
||||
}
|
||||
|
||||
footer .inner {
|
||||
padding: 0 10px;
|
||||
text-align: right;
|
||||
.inner {
|
||||
float: right;
|
||||
line-height: 23px;
|
||||
|
||||
.button {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
File diff suppressed because one or more lines are too long
|
@ -66,7 +66,7 @@
|
|||
}).append( this.$el );
|
||||
|
||||
var $content = $( '.wc-backbone-modal-content' ).find( 'article' );
|
||||
var content_h = ( 0 === $content.height() ) ? 90 : $content.height();
|
||||
var content_h = ( $content.height() < 90 ) ? 90 : $content.height();
|
||||
var max_h = $( window ).height() - 200;
|
||||
|
||||
if ( max_h > 400 ) {
|
||||
|
@ -81,7 +81,7 @@
|
|||
} else {
|
||||
$content.css({
|
||||
'overflow': 'visible',
|
||||
height: content_h
|
||||
height: ( content_h > 90 ) ? 'auto' : content_h + 'px'
|
||||
});
|
||||
}
|
||||
|
||||
|
@ -113,8 +113,7 @@
|
|||
if ( data.hasOwnProperty( item.name ) ) {
|
||||
data[ item.name ] = $.makeArray( data[ item.name ] );
|
||||
data[ item.name ].push( item.value );
|
||||
}
|
||||
else {
|
||||
} else {
|
||||
data[ item.name ] = item.value;
|
||||
}
|
||||
});
|
||||
|
|
|
@ -1 +1 @@
|
|||
!function(a,b,c){"use strict";a.fn.WCBackboneModal=function(b){return this.each(function(){new a.WCBackboneModal(a(this),b)})},a.WCBackboneModal=function(b,c){var d=a.extend({},a.WCBackboneModal.defaultOptions,c);d.template&&new a.WCBackboneModal.View({target:d.template})},a.WCBackboneModal.defaultOptions={template:""},a.WCBackboneModal.View=b.View.extend({tagName:"div",id:"wc-backbone-modal-dialog",_target:void 0,events:{"click .modal-close":"closeButton","click #btn-ok":"addButton",keydown:"keyboardActions"},initialize:function(a){this._target=a.target,c.bindAll(this,"render"),this.render()},render:function(){this.$el.attr("tabindex","0").append(a(this._target).html()),a("body").css({overflow:"hidden"}).append(this.$el);var b=a(".wc-backbone-modal-content").find("article"),c=0===b.height()?90:b.height(),d=a(window).height()-200;d>400&&(d=400),b.css(c>d?{overflow:"auto",height:d+"px"}:{overflow:"visible",height:c}),a(".wc-backbone-modal-content").css({"margin-top":"-"+a(".wc-backbone-modal-content").height()/2+"px"}),a("body").trigger("wc_backbone_modal_loaded",this._target)},closeButton:function(b){b.preventDefault(),a("body").trigger("wc_backbone_modal_before_remove",this._target),this.undelegateEvents(),a(document).off("focusin"),a("body").css({overflow:"auto"}),this.remove(),a("body").trigger("wc_backbone_modal_removed",this._target)},addButton:function(b){a("body").trigger("wc_backbone_modal_response",[this._target,this.getFormData()]),this.closeButton(b)},getFormData:function(){var b={};return a.each(a("form",this.$el).serializeArray(),function(c,d){b.hasOwnProperty(d.name)?(b[d.name]=a.makeArray(b[d.name]),b[d.name].push(d.value)):b[d.name]=d.value}),b},keyboardActions:function(a){var b=a.keyCode||a.which;13!==b||a.target.tagName&&"input"===a.target.tagName.toLowerCase()||this.addButton(a),27===b&&this.closeButton(a)}})}(jQuery,Backbone,_);
|
||||
!function(a,b,c){"use strict";a.fn.WCBackboneModal=function(b){return this.each(function(){new a.WCBackboneModal(a(this),b)})},a.WCBackboneModal=function(b,c){var d=a.extend({},a.WCBackboneModal.defaultOptions,c);d.template&&new a.WCBackboneModal.View({target:d.template})},a.WCBackboneModal.defaultOptions={template:""},a.WCBackboneModal.View=b.View.extend({tagName:"div",id:"wc-backbone-modal-dialog",_target:void 0,events:{"click .modal-close":"closeButton","click #btn-ok":"addButton",keydown:"keyboardActions"},initialize:function(a){this._target=a.target,c.bindAll(this,"render"),this.render()},render:function(){this.$el.attr("tabindex","0").append(a(this._target).html()),a("body").css({overflow:"hidden"}).append(this.$el);var b=a(".wc-backbone-modal-content").find("article"),c=b.height()<90?90:b.height(),d=a(window).height()-200;d>400&&(d=400),b.css(c>d?{overflow:"auto",height:d+"px"}:{overflow:"visible",height:c>90?"auto":c+"px"}),a(".wc-backbone-modal-content").css({"margin-top":"-"+a(".wc-backbone-modal-content").height()/2+"px"}),a("body").trigger("wc_backbone_modal_loaded",this._target)},closeButton:function(b){b.preventDefault(),a("body").trigger("wc_backbone_modal_before_remove",this._target),this.undelegateEvents(),a(document).off("focusin"),a("body").css({overflow:"auto"}),this.remove(),a("body").trigger("wc_backbone_modal_removed",this._target)},addButton:function(b){a("body").trigger("wc_backbone_modal_response",[this._target,this.getFormData()]),this.closeButton(b)},getFormData:function(){var b={};return a.each(a("form",this.$el).serializeArray(),function(c,d){b.hasOwnProperty(d.name)?(b[d.name]=a.makeArray(b[d.name]),b[d.name].push(d.value)):b[d.name]=d.value}),b},keyboardActions:function(a){var b=a.keyCode||a.which;13!==b||a.target.tagName&&"input"===a.target.tagName.toLowerCase()||this.addButton(a),27===b&&this.closeButton(a)}})}(jQuery,Backbone,_);
|
|
@ -297,8 +297,10 @@ if ( wc_tax_enabled() ) {
|
|||
<div class="wc-backbone-modal-content">
|
||||
<section class="wc-backbone-modal-main" role="main">
|
||||
<header class="wc-backbone-modal-header">
|
||||
<a class="modal-close modal-close-link" href="#"><span class="close-icon"><span class="screen-reader-text">Close media panel</span></span></a>
|
||||
<h1><?php _e( 'Add products', 'woocommerce' ); ?></h1>
|
||||
<button class="modal-close modal-close-link dashicons dashicons-no-alt">
|
||||
<span class="screen-reader-text">Close modal panel</span>
|
||||
</button>
|
||||
</header>
|
||||
<article>
|
||||
<form action="" method="post">
|
||||
|
@ -313,7 +315,7 @@ if ( wc_tax_enabled() ) {
|
|||
</section>
|
||||
</div>
|
||||
</div>
|
||||
<div class="wc-backbone-modal-backdrop modal-close"> </div>
|
||||
<div class="wc-backbone-modal-backdrop modal-close"></div>
|
||||
</script>
|
||||
|
||||
<script type="text/template" id="wc-modal-add-tax">
|
||||
|
@ -321,8 +323,10 @@ if ( wc_tax_enabled() ) {
|
|||
<div class="wc-backbone-modal-content">
|
||||
<section class="wc-backbone-modal-main" role="main">
|
||||
<header class="wc-backbone-modal-header">
|
||||
<a class="modal-close modal-close-link" href="#"><span class="close-icon"><span class="screen-reader-text">Close media panel</span></span></a>
|
||||
<h1><?php _e( 'Add tax', 'woocommerce' ); ?></h1>
|
||||
<button class="modal-close modal-close-link dashicons dashicons-no-alt">
|
||||
<span class="screen-reader-text">Close modal panel</span>
|
||||
</button>
|
||||
</header>
|
||||
<article>
|
||||
<form action="" method="post">
|
||||
|
@ -368,5 +372,5 @@ if ( wc_tax_enabled() ) {
|
|||
</section>
|
||||
</div>
|
||||
</div>
|
||||
<div class="wc-backbone-modal-backdrop modal-close"> </div>
|
||||
<div class="wc-backbone-modal-backdrop modal-close"></div>
|
||||
</script>
|
||||
|
|
Loading…
Reference in New Issue