woocommerce/woocommerce-paypal-payments
2
0
Fork 0
mirror of https://github.com/woocommerce/woocommerce-paypal-payments.git synced 2025-08-30 05:00:51 +08:00
Code Issues Projects Packages Wiki Activity Actions 18

💄 Give payment method icons a fixed size

Browse source
This commit is contained in:
Philipp Stracker 2025-01-27 10:55:17 +01:00
parent 5c5601af97
commit 6e2f58c565
No known key found for this signature in database
3 changed files with 19 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

1
modules/ppcp-settings/resources/css/components/reusable-components/_payment-method-icons.scss
View file

@ -3,6 +3,7 @@
gap: 8px;
justify-content: center;
flex-wrap: wrap;
> img{
width: 38px;
height: 24px;

5
modules/ppcp-settings/resources/css/components/reusable-components/_payment-method-item.scss
View file

@ -65,6 +65,11 @@
}
}
.ppcp--method-icon {
width: 30px;
height: 30px;
}
button.is-secondary {
@include small-button;
}

21
modules/ppcp-settings/resources/js/Components/ReusableComponents/PaymentMethodIcon.js
View file

@ -1,15 +1,20 @@
import { Icon } from '@wordpress/components';
import data from '../../utils/data';
const PaymentMethodIcon = ( props ) => {
if (
( Array.isArray( props.icons ) &&
props.icons.includes( props.type ) ) ||
props.icons === 'all'
) {
return data().getImage( 'icon-button-' + props.type + '.svg' );
const PaymentMethodIcon = ( { icons, type } ) => {
const validIcon = Array.isArray( icons ) && icons.includes( type );
if ( validIcon || icons === 'all' ) {
return (
<Icon
icon={ data().getImage( 'icon-button-' + type + '.svg' ) }
className="ppcp--method-icon"
/>
);
}
return <></>;
return null;
};
export default PaymentMethodIcon;