AgileWebs/fendi-react-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

chore: add styles to buttons

Browse Source
This commit is contained in:
Rodolfo Ruiz 2025-06-05 19:57:25 -06:00
parent b03dd0a418
commit c22d0ab9c2
2 changed files with 128 additions and 60 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
src/private/AddOrEditProductForm.jsx
View File

@ -119,7 +119,18 @@ export default function AddOrEditProductForm({ onAdd, initialData, onCancel }) {
/>
</Box>
)}
<Button variant="outlined" component="label">
<Button component="label"
sx={{
backgroundColor: 'transparent',
color: 'black',
textTransform: 'uppercase',
fontWeight: 600,
px: 3,
'&:hover': {
backgroundColor: '#26201A',
color: '#fff',
},
}}>
Upload Image
<input type="file" hidden accept="image/*" onChange={handleImageChange} />
</Button>
@ -128,8 +139,32 @@ export default function AddOrEditProductForm({ onAdd, initialData, onCancel }) {
<Box mt={2}>
{/* Fields... */}
<Box display="flex" justifyContent="flex-end" gap={1} mt={2}>
<Button onClick={onCancel}>Cancel</Button>
<Button variant="contained" onClick={handleSubmit}>Save</Button>
<Button onClick={onCancel}
sx={{
backgroundColor: 'transparent',
color: 'black',
textTransform: 'uppercase',
fontWeight: 600,
px: 3,
'&:hover': {
backgroundColor: '#26201A',
color: '#fff',
},
}}>
Cancel</Button>
<Button variant="contained" onClick={handleSubmit}
sx={{
backgroundColor: '#A68A72',
color: '#fff',
borderRadius: 2,
textTransform: 'uppercase',
fontWeight: 600,
px: 3,
'&:hover': {
backgroundColor: '#26201A',
},
}}>
Save</Button>
</Box>
</Box>
</Box>

41
src/private/Admin.jsx
View File

@ -109,7 +109,7 @@ export default function Admin({ children, maxWidth = 'lg', sx = {} }) {
<Dialog open={open} onClose={() => { setOpen(false); setEditingProduct(null); }} maxWidth="sm" fullWidth>
<DialogTitle>{editingProduct ? 'Edit Product' : 'Add Product'}</DialogTitle>
<DialogContent>
<AddOrEditProductForm onAdd={handleAddOrEditProduct} initialData={editingProduct} onCancel={() => { setOpen(false); setEditingProduct(null); }}/>
<AddOrEditProductForm onAdd={handleAddOrEditProduct} initialData={editingProduct} onCancel={() => { setOpen(false); setEditingProduct(null); }} />
</DialogContent>
</Dialog>
@ -121,8 +121,30 @@ export default function Admin({ children, maxWidth = 'lg', sx = {} }) {
<strong>{rowToDelete?.name}</strong>?
</Typography>
<Box mt={2} display="flex" justifyContent="flex-end" gap={1}>
<Button onClick={() => setConfirmOpen(false)}>Cancel</Button>
<Button variant="contained" color="error" onClick={confirmDelete}>Delete</Button>
<Button onClick={() => setConfirmOpen(false)}
sx={{
backgroundColor: 'transparent',
color: 'black',
textTransform: 'uppercase',
fontWeight: 600,
px: 3,
'&:hover': {
backgroundColor: '#26201A',
color: '#fff',
},
}}>Cancel</Button>
<Button variant="contained" color="error" onClick={confirmDelete}
sx={{
backgroundColor: '#A68A72',
color: '#fff',
borderRadius: 2,
textTransform: 'uppercase',
fontWeight: 600,
px: 3,
'&:hover': {
backgroundColor: '#26201A',
},
}}>Delete</Button>
</Box>
</DialogContent>
</Dialog>
@ -136,7 +158,18 @@ export default function Admin({ children, maxWidth = 'lg', sx = {} }) {
/>
<Box display="flex" justifyContent="flex-end" mt={2}>
<Button variant="contained" color="primary" onClick={() => setOpen(true)}>
<Button variant="contained" color="primary" onClick={() => setOpen(true)}
sx={{
backgroundColor: '#A68A72',
color: '#fff',
borderRadius: 2,
textTransform: 'uppercase',
fontWeight: 600,
px: 3,
'&:hover': {
backgroundColor: '#26201A',
},
}}>
Add Product
</Button>
</Box>