1
0
mirror of https://github.com/LaCasemate/fab-manager.git synced 2025-01-30 19:52:20 +01:00

Fix button color + standardise class names

This commit is contained in:
vincent 2022-07-29 10:56:15 +02:00 committed by Sylvain
parent 5e61e9c409
commit be6ba8deff
4 changed files with 15 additions and 11 deletions

View File

@ -54,12 +54,12 @@ export const ManageProductCategory: React.FC<ManageProductCategoryProps> = ({ pr
case 'update': case 'update':
return (<FabButton type='button' return (<FabButton type='button'
icon={<i className="fas fa-pen" />} icon={<i className="fas fa-pen" />}
className="edit-button" className="edit-btn"
onClick={toggleModal} />); onClick={toggleModal} />);
case 'delete': case 'delete':
return (<FabButton type='button' return (<FabButton type='button'
icon={<i className="fa fa-trash" />} icon={<i className="fa fa-trash" />}
className="delete-button" className="delete-btn"
onClick={toggleModal} />); onClick={toggleModal} />);
} }
}; };

View File

@ -36,7 +36,7 @@ export const ProductCategoriesItem: React.FC<ProductCategoriesItemProps> = ({ pr
<p className='itemInfo-name'>{category.name}</p> <p className='itemInfo-name'>{category.name}</p>
<span className='itemInfo-count'>[count]</span> <span className='itemInfo-count'>[count]</span>
</div> </div>
<div className='action'> <div className='actions'>
<div className='manage'> <div className='manage'>
<ManageProductCategory action='update' <ManageProductCategory action='update'
productCategories={productCategories} productCategories={productCategories}

View File

@ -65,22 +65,22 @@
} }
} }
.action { .actions {
display: flex; display: flex;
justify-content: flex-end; justify-content: flex-end;
align-items: center; align-items: center;
.manage { .manage {
overflow: hidden; overflow: hidden;
display: flex; display: flex;
border-radius: var(--border-radius); border-radius: var(--border-radius-sm);
button { button {
@include btn; @include btn;
border-radius: 0; border-radius: 0;
color: var(--gray-soft-lightest); color: var(--gray-soft-lightest);
&:hover { opacity: 0.75; } &:hover { opacity: 0.75; }
} }
.edit-button {background: var(--gray-hard-darkest) } .edit-btn {background: var(--gray-hard-darkest) }
.delete-button {background: var(--error) } .delete-btn {background: var(--error) }
} }
} }

View File

@ -113,11 +113,15 @@
} }
} }
.save-btn { .save-btn {
background-color: var(--secondary-dark); float: right;
border-color: var(--secondary-dark);
color: var(--secondary-text-color);
margin-bottom: 15px; margin-bottom: 15px;
margin-top: 15px; margin-top: 15px;
float: right; background-color: var(--secondary);
border-color: var(--secondary);
color: var(--secondary-text-color);
&:hover {
background-color: var(--secondary-dark);
border-color: var(--secondary-dark);
}
} }
} }