Steve-Dee-Designs
/
woocommerce
mirror of https://github.com/woocommerce/woocommerce.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Changed price toggle placement (https://github.com/woocommerce/woocommerce-admin/pull/5708) 

* Changed price toggle placement

This commit changes the price toggle placement

* Fixed margin

Co-authored-by: Fernando Marichal <contacto@fernandomarichal.com>
This commit is contained in:
Fernando 2020-11-23 11:40:14 -03:00 committed by GitHub
parent da14803c64
commit a4ed451065
3 changed files with 79 additions and 77 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
plugins/woocommerce-admin/client/profile-wizard/steps/product-types/index.js
View File

@ -148,25 +148,6 @@ export class ProductTypes extends Component {
/>
);
} ) }
<div className="woocommerce-profile-wizard__product-types-pricing-toggle woocommerce-profile-wizard__checkbox">
<label htmlFor="woocommerce-product-types__pricing-toggle">
<Text variant="body">
{ __(
'Display monthly prices',
'woocommerce-admin'
) }
</Text>
<FormToggle
id="woocommerce-product-types__pricing-toggle"
checked={ isMonthlyPricing }
onChange={ () =>
this.setState( {
isMonthlyPricing: ! isMonthlyPricing,
} )
}
/>
</label>
</div>
{ error && (
<span className="woocommerce-profile-wizard__error">
{ error }
@ -184,6 +165,25 @@ export class ProductTypes extends Component {
</div>
</Card>
<div className="woocommerce-profile-wizard__card-help-text">
<div className="woocommerce-profile-wizard__product-types-pricing-toggle woocommerce-profile-wizard__checkbox">
<label htmlFor="woocommerce-product-types__pricing-toggle">
<Text variant="body">
{ __(
'Display monthly prices',
'woocommerce-admin'
) }
</Text>
<FormToggle
id="woocommerce-product-types__pricing-toggle"
checked={ isMonthlyPricing }
onChange={ () =>
this.setState( {
isMonthlyPricing: ! isMonthlyPricing,
} )
}
/>
</label>
</div>
<Text variant="caption">
{ __(
'Billing is annual. All purchases are covered by our 30 day money back guarantee and include access to support and updates. Extensions will be added to a cart for you to purchase later.',

2
plugins/woocommerce-admin/client/profile-wizard/steps/product-types/style.scss
View File

@ -47,10 +47,12 @@
align-items: center;
justify-content: flex-end;
color: $gray-600;
margin-bottom: $gap;
label {
display: inline-flex;
align-items: center;
margin: auto;
}
.components-form-toggle {

116
plugins/woocommerce-admin/client/profile-wizard/steps/product-types/test/__snapshots__/index.js.snap
View File

@ -105,35 +105,6 @@ you can purchase and install it later.
</label>
</div>
</div>
<div
class="woocommerce-profile-wizard__product-types-pricing-toggle woocommerce-profile-wizard__checkbox"
>
<label
for="woocommerce-product-types__pricing-toggle"
>
<p
class="css-1f0yw52-Text e15wbhsk0"
>
Display monthly prices
</p>
<span
class="components-form-toggle is-checked"
>
<input
checked=""
class="components-form-toggle__input"
id="woocommerce-product-types__pricing-toggle"
type="checkbox"
/>
<span
class="components-form-toggle__track"
/>
<span
class="components-form-toggle__thumb"
/>
</span>
</label>
</div>
<div
class="woocommerce-profile-wizard__card-actions"
>
@ -151,6 +122,35 @@ you can purchase and install it later.
<div
class="woocommerce-profile-wizard__card-help-text"
>
<div
class="woocommerce-profile-wizard__product-types-pricing-toggle woocommerce-profile-wizard__checkbox"
>
<label
for="woocommerce-product-types__pricing-toggle"
>
<p
class="css-1f0yw52-Text e15wbhsk0"
>
Display monthly prices
</p>
<span
class="components-form-toggle is-checked"
>
<input
checked=""
class="components-form-toggle__input"
id="woocommerce-product-types__pricing-toggle"
type="checkbox"
/>
<span
class="components-form-toggle__track"
/>
<span
class="components-form-toggle__thumb"
/>
</span>
</label>
</div>
<p
class="css-1qmnemh-Text e15wbhsk0"
>
@ -266,35 +266,6 @@ you can purchase and install it later.
</label>
</div>
</div>
<div
class="woocommerce-profile-wizard__product-types-pricing-toggle woocommerce-profile-wizard__checkbox"
>
<label
for="woocommerce-product-types__pricing-toggle"
>
<p
class="css-1f0yw52-Text e15wbhsk0"
>
Display monthly prices
</p>
<span
class="components-form-toggle"
>
<input
checked=""
class="components-form-toggle__input"
id="woocommerce-product-types__pricing-toggle"
type="checkbox"
/>
<span
class="components-form-toggle__track"
/>
<span
class="components-form-toggle__thumb"
/>
</span>
</label>
</div>
<div
class="woocommerce-profile-wizard__card-actions"
>
@ -312,6 +283,35 @@ you can purchase and install it later.
<div
class="woocommerce-profile-wizard__card-help-text"
>
<div
class="woocommerce-profile-wizard__product-types-pricing-toggle woocommerce-profile-wizard__checkbox"
>
<label
for="woocommerce-product-types__pricing-toggle"
>
<p
class="css-1f0yw52-Text e15wbhsk0"
>
Display monthly prices
</p>
<span
class="components-form-toggle"
>
<input
checked=""
class="components-form-toggle__input"
id="woocommerce-product-types__pricing-toggle"
type="checkbox"
/>
<span
class="components-form-toggle__track"
/>
<span
class="components-form-toggle__thumb"
/>
</span>
</label>
</div>
<p
class="css-1qmnemh-Text e15wbhsk0"
>