Switch 'Try reloading the page' from links to buttons (https://github.com/woocommerce/woocommerce-blocks/pull/2105)

* Switch 'Reload page' from links to buttons

* Rename class to wp-block-link-button

* Remove no longer needed CSS property
This commit is contained in:
Albert Juhé Lluveras 2020-04-03 15:22:56 +02:00 committed by GitHub
parent d83214ed44
commit 72801baf97
5 changed files with 27 additions and 16 deletions

View File

@ -90,8 +90,10 @@
padding: 0; padding: 0;
border: 0; border: 0;
color: inherit;
font-size: inherit; font-size: inherit;
font-weight: normal; font-weight: normal;
text-decoration: underline;
background: transparent; background: transparent;
&:hover { &:hover {

View File

@ -1 +1,3 @@
/* Moved */ .wc-block-link-button {
@include link-button();
}

View File

@ -24,6 +24,8 @@ import FullCart from './full-cart';
import blockAttributes from './attributes'; import blockAttributes from './attributes';
import renderFrontend from '../../../utils/render-frontend.js'; import renderFrontend from '../../../utils/render-frontend.js';
const reloadPage = () => void window.location.reload( true );
/** /**
* Renders the frontend block within the cart provider. * Renders the frontend block within the cart provider.
*/ */
@ -92,13 +94,15 @@ const getErrorBoundaryProps = () => {
header: __( 'Something went wrong…', 'woo-gutenberg-products-block' ), header: __( 'Something went wrong…', 'woo-gutenberg-products-block' ),
text: __experimentalCreateInterpolateElement( text: __experimentalCreateInterpolateElement(
__( __(
'The cart has encountered an unexpected error. <a>Try reloading the page</a>. If the error persists, please get in touch with us so we can assist.', 'The cart has encountered an unexpected error. <button>Try reloading the page</button>. If the error persists, please get in touch with us so we can assist.',
'woo-gutenberg-products-block' 'woo-gutenberg-products-block'
), ),
{ {
a: ( button: (
// eslint-disable-next-line jsx-a11y/anchor-has-content, jsx-a11y/anchor-is-valid <button
<a href="javascript:window.location.reload(true)" /> className="wp-block-link-button"
onClick={ reloadPage }
/>
), ),
} }
), ),

View File

@ -70,9 +70,6 @@ table.wc-block-cart-items {
margin-top: 0.5em; margin-top: 0.5em;
text-transform: none; text-transform: none;
white-space: nowrap; white-space: nowrap;
// Temporary - this is not yet a link or "link button".
// May not be needed when remove is hooked up to API properly.
text-decoration: underline;
} }
.wc-block-cart-item__remove-icon { .wc-block-cart-item__remove-icon {
@include link-button; @include link-button;

View File

@ -23,6 +23,8 @@ import blockAttributes from './attributes';
import renderFrontend from '../../../utils/render-frontend.js'; import renderFrontend from '../../../utils/render-frontend.js';
import EmptyCart from './empty-cart/index.js'; import EmptyCart from './empty-cart/index.js';
const reloadPage = () => void window.location.reload( true );
/** /**
* Wrapper component for the checkout block. * Wrapper component for the checkout block.
* *
@ -49,13 +51,15 @@ const CheckoutFrontend = ( props ) => {
) } ) }
text={ __experimentalCreateInterpolateElement( text={ __experimentalCreateInterpolateElement(
__( __(
'The checkout has encountered an unexpected error. <a>Try reloading the page</a>. If the error persists, please get in touch with us so we can assist.', 'The checkout has encountered an unexpected error. <button>Try reloading the page</button>. If the error persists, please get in touch with us so we can assist.',
'woo-gutenberg-products-block' 'woo-gutenberg-products-block'
), ),
{ {
a: ( button: (
// eslint-disable-next-line jsx-a11y/anchor-has-content <button
<a href="." /> className="wp-block-link-button"
onClick={ reloadPage }
/>
), ),
} }
) } ) }
@ -109,13 +113,15 @@ const getErrorBoundaryProps = () => {
header: __( 'Something went wrong…', 'woo-gutenberg-products-block' ), header: __( 'Something went wrong…', 'woo-gutenberg-products-block' ),
text: __experimentalCreateInterpolateElement( text: __experimentalCreateInterpolateElement(
__( __(
'The checkout has encountered an unexpected error. <a>Try reloading the page</a>. If the error persists, please get in touch with us so we can assist.', 'The checkout has encountered an unexpected error. <button>Try reloading the page</button>. If the error persists, please get in touch with us so we can assist.',
'woo-gutenberg-products-block' 'woo-gutenberg-products-block'
), ),
{ {
a: ( button: (
// eslint-disable-next-line jsx-a11y/anchor-has-content, jsx-a11y/anchor-is-valid <button
<a href="javascript:window.location.reload(true)" /> className="wp-block-link-button"
onClick={ reloadPage }
/>
), ),
} }
), ),