Add todo item icon

This commit is contained in:
Emili Castells Guasch 2024-12-11 09:23:01 +01:00
parent 0b7c722da5
commit 2d27f5e99d
2 changed files with 9 additions and 25 deletions

View file

@ -66,6 +66,14 @@
@include font(13, 20, 400);
color: $color-blueberry;
}
&__icon {
border: 1px dashed #949494;
background: #fff;
border-radius: 50%;
width: 32px;
height: 32px;
}
}
.ppcp-r-feature-item {

View file

@ -1,6 +1,3 @@
import { PayPalCheckbox, handleCheckboxState } from '../Fields';
import data from '../../../utils/data';
const TodoSettingsBlock = ( {
todos,
setTodos,
@ -36,34 +33,13 @@ const TodoItem = ( props ) => {
return (
<div className="ppcp-r-todo-item">
<div className="ppcp-r-todo-item__inner">
<PayPalCheckbox
{ ...{
...props,
handleCheckboxState,
} }
/>
<div className="ppcp-r-todo-item__icon"></div>
<div className="ppcp-r-todo-item__description">
{ props.description }
</div>
</div>
<div
className="ppcp-r-todo-item__close"
onClick={ () =>
removeTodo(
props.value,
props.todosData,
props.changeTodos
)
}
>
{ data().getImage( 'icon-close.svg' ) }
</div>
</div>
);
};
const removeTodo = ( todoValue, todosData, changeTodos ) => {
changeTodos( todosData.filter( ( todo ) => todo.value !== todoValue ) );
};
export default TodoSettingsBlock;