This commit is contained in:
Paul Sealock 2020-06-19 12:13:41 +12:00 committed by GitHub
parent 5529156480
commit c938b66ee7
6 changed files with 21 additions and 6 deletions

View File

@ -60,6 +60,7 @@
grid-template-columns: auto 24px; grid-template-columns: auto 24px;
// IE doesn't support `align-items` on grid container // IE doesn't support `align-items` on grid container
& > * { & > * {
align-self: center; align-self: center;
} }

View File

@ -157,7 +157,7 @@ function getLinkTypeAndHref( item ) {
function getListItems( props ) { function getListItems( props ) {
return getItems( props ).map( ( item ) => { return getItems( props ).map( ( item ) => {
return { return {
title: item.title, title: <Text as="div" variant="button">{ item.title }</Text>,
before: <Icon icon={ item.icon } />, before: <Icon icon={ item.icon } />,
after: <Icon icon={ chevronRight } />, after: <Icon icon={ chevronRight } />,
...getLinkTypeAndHref( item ), ...getLinkTypeAndHref( item ),

View File

@ -313,6 +313,10 @@ class TaskDashboard extends Component {
</div> </div>
); );
task.title = (
<Text as="div" variant={ task.completed ? 'body.small' : 'button' }>{ task.title }</Text>
);
if ( ! task.completed ) { if ( ! task.completed ) {
task.after = task.time ? ( task.after = task.time ? (
<span className="woocommerce-task-estimated-time"> <span className="woocommerce-task-estimated-time">

View File

@ -15,6 +15,12 @@
} }
} }
.woocommerce-list__item.is-complete {
.woocommerce-list__item-title {
color: $medium-gray-text;
}
}
.woocommerce-list__item-before .woocommerce-task__icon { .woocommerce-list__item-before .woocommerce-task__icon {
border-radius: 50%; border-radius: 50%;
width: 32px; width: 32px;
@ -34,6 +40,10 @@
} }
} }
.woocommerce-task-estimated-time {
color: $medium-gray-text;
}
.woocommerce-card.is-narrow { .woocommerce-card.is-narrow {
max-width: 680px; max-width: 680px;
margin-left: auto; margin-left: auto;

View File

@ -149,7 +149,10 @@ List.propTypes = {
/** /**
* Title displayed for the list item. * Title displayed for the list item.
*/ */
title: PropTypes.string.isRequired, title: PropTypes.oneOfType( [
PropTypes.string,
PropTypes.node,
] ),
} ) } )
).isRequired, ).isRequired,
}; };

View File

@ -17,7 +17,7 @@
width: 100%; width: 100%;
display: flex; display: flex;
align-items: center; align-items: center;
padding: $gap; padding: $gap $gap-large;
&:focus { &:focus {
box-shadow: inset 0 0 0 1px $studio-wordpress-blue, inset 0 0 0 2px $studio-white; box-shadow: inset 0 0 0 1px $studio-wordpress-blue, inset 0 0 0 2px $studio-white;
@ -25,9 +25,6 @@
} }
.woocommerce-list__item-title { .woocommerce-list__item-title {
display: block;
font-size: 16px;
line-height: 22px;
color: $studio-gray-90; color: $studio-gray-90;
} }