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

Featured Products style tweaks (https://github.com/woocommerce/woocommerce-blocks/pull/316) 

* Update search list item padding

* Fix search list item radio alignment

* Star icon: Material -> Dashicons

* Featured product min height

* placeholder icon + explanation of explicit height value

* Fix linter errors

* Remove unnecessary Icon from block registration

* Remove the star icon
This commit is contained in:
James Koster 2019-01-14 19:37:35 +00:00 committed by Kelly Dwan
parent 7d1c67fd2d
commit 9c414cac0a
6 changed files with 8 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
plugins/woocommerce-blocks/assets/js/blocks/featured-product/block.js
View File

@ -30,7 +30,6 @@ import PropTypes from 'prop-types';
/**
* Internal dependencies
*/
import { IconStar } from '../../components/icons';
import ProductControl from '../../components/product-control';
// Copied from core/cover, updated for product.
@ -161,7 +160,7 @@ class FeaturedProduct extends Component {
return (
<Placeholder
icon={ <IconStar /> }
icon="star-filled"
label={ __( 'Featured Product', 'woo-gutenberg-products-block' ) }
className="wc-block-featured-product"
>
@ -270,7 +269,7 @@ class FeaturedProduct extends Component {
) : (
<Placeholder
className="wc-block-featured-product"
icon={ <IconStar /> }
icon="star-filled"
label={ __( 'Featured Product', 'woo-gutenberg-products-block' ) }
>
{ ! loaded ? (

3
plugins/woocommerce-blocks/assets/js/blocks/featured-product/index.js
View File

@ -9,14 +9,13 @@ import { registerBlockType } from '@wordpress/blocks';
*/
import './style.scss';
import Block from './block';
import { IconStar } from '../../components/icons';
/**
* Register and run the "Featured Product" block.
*/
registerBlockType( 'woocommerce/featured-product', {
title: __( 'Featured Product', 'woo-gutenberg-products-block' ),
icon: <IconStar />,
icon: 'star-filled',
category: 'woocommerce',
keywords: [ __( 'WooCommerce', 'woo-gutenberg-products-block' ) ],
description: __(

2
plugins/woocommerce-blocks/assets/js/blocks/featured-product/style.scss
View File

@ -3,7 +3,7 @@
background-color: $black;
background-size: cover;
background-position: center center;
min-height: 430px;
min-height: 500px;
width: 100%;
margin: 0 0 1.5em 0;
display: flex;

1
plugins/woocommerce-blocks/assets/js/components/icons/index.js
View File

@ -4,5 +4,4 @@ export { default as IconCheckUnchecked } from './checkbox-unchecked';
export { default as IconNewReleases } from './new-releases';
export { default as IconRadioSelected } from './radio-selected';
export { default as IconRadioUnselected } from './radio-unselected';
export { default as IconStar } from './star';
export { default as IconWidgets } from './widgets';

20
plugins/woocommerce-blocks/assets/js/components/icons/star.js
View File

@ -1,20 +0,0 @@
/**
* External dependencies
*/
import { Icon } from '@wordpress/components';
export default () => (
<Icon
icon={
<svg
xmlns="http://www.w3.org/2000/svg"
width="18"
height="18"
viewBox="0 0 18 18"
>
<path d="M9 11.3l3.71 2.7-1.42-4.36L15 7h-4.55L9 2.5 7.55 7H3l3.71 2.64L5.29 14z" />
<path fill="none" d="M0 0h18v18H0z" />
</svg>
}
/>
);

6
plugins/woocommerce-blocks/assets/js/components/search-list-control/style.scss
View File

@ -36,7 +36,7 @@
.woocommerce-search-list__list {
padding: 0;
max-height: 18.5em;
max-height: 17em;
overflow-x: hidden;
overflow-y: auto;
border-top: 1px solid $core-grey-light-500;
@ -85,7 +85,7 @@
display: flex;
align-items: center;
margin-bottom: 0;
padding: $gap;
padding: $gap-small $gap;
background: $white;
// !important to keep the border around on hover
border-bottom: 1px solid $core-grey-light-500 !important;
@ -102,6 +102,8 @@
.woocommerce-search-list__item-state {
flex: 0 0 16px;
margin-right: $gap-smaller;
// Set an explicit height to ensure vertical alignment
height: 24px;
}
.woocommerce-search-list__item-label {