Add styling for the toggle input type
This commit is contained in:
parent
ed20d545a7
commit
9bd88f5677
5335
assets/css/admin.css
5335
assets/css/admin.css
File diff suppressed because one or more lines are too long
|
@ -2830,19 +2830,13 @@ table.wc-shipping-zones, table.wc-shipping-zone-methods, table.wc-shipping-class
|
||||||
}
|
}
|
||||||
.wc-shipping-zone-method-enabled {
|
.wc-shipping-zone-method-enabled {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
.status-enabled {
|
|
||||||
margin-top: 1px;
|
a {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
&::before {
|
|
||||||
line-height: inherit;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.status-disabled {
|
|
||||||
margin-top: 1px;
|
|
||||||
display: inline-block;
|
|
||||||
&::before {
|
|
||||||
line-height: inherit;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.woocommerce-input-toggle {
|
||||||
|
margin-top: 3px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
tfoot {
|
tfoot {
|
||||||
|
@ -2860,6 +2854,39 @@ table.wc-shipping-zones, table.wc-shipping-zone-methods, table.wc-shipping-class
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.woocommerce-input-toggle {
|
||||||
|
height: 16px;
|
||||||
|
width: 32px;
|
||||||
|
border: 2px solid #935687;
|
||||||
|
background-color: #935687;
|
||||||
|
display: inline-block;
|
||||||
|
text-indent: -9999px;
|
||||||
|
border-radius: 10em;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
&:before {
|
||||||
|
content: "";
|
||||||
|
display: block;
|
||||||
|
width: 16px;
|
||||||
|
height: 16px;
|
||||||
|
background: #fff;
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
right: 0;
|
||||||
|
border-radius: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.woocommerce-input-toggle--disabled {
|
||||||
|
border-color: #999;
|
||||||
|
background-color: #999;
|
||||||
|
|
||||||
|
&:before {
|
||||||
|
right: auto;
|
||||||
|
left: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.wc-modal-shipping-method-settings {
|
.wc-modal-shipping-method-settings {
|
||||||
background: #f8f8f8;
|
background: #f8f8f8;
|
||||||
padding: 1em !important;
|
padding: 1em !important;
|
||||||
|
|
|
@ -128,9 +128,9 @@
|
||||||
// Populate $tbody with the current methods
|
// Populate $tbody with the current methods
|
||||||
$.each( methods, function( id, rowData ) {
|
$.each( methods, function( id, rowData ) {
|
||||||
if ( 'yes' === rowData.enabled ) {
|
if ( 'yes' === rowData.enabled ) {
|
||||||
rowData.enabled_icon = '<span class="status-enabled">' + data.strings.yes + '</span>';
|
rowData.enabled_icon = '<span class="woocommerce-input-toggle woocommerce-input-toggle--enabled">' + data.strings.yes + '</span>';
|
||||||
} else {
|
} else {
|
||||||
rowData.enabled_icon = '<span class="status-disabled">' + data.strings.no + '</span>';
|
rowData.enabled_icon = '<span class="woocommerce-input-toggle woocommerce-input-toggle--disabled">' + data.strings.no + '</span>';
|
||||||
}
|
}
|
||||||
|
|
||||||
view.$el.append( view.rowTemplate( rowData ) );
|
view.$el.append( view.rowTemplate( rowData ) );
|
||||||
|
|
File diff suppressed because one or more lines are too long
Loading…
Reference in New Issue