Skip to content
Snippets Groups Projects
Commit 354651eb authored by Bastien DUMONT's avatar Bastien DUMONT :angel:
Browse files

date selector

parent 80348d1a
No related branches found
No related tags found
1 merge request!118feat(ui): use mui components and upgrade to v5
Pipeline #73254 passed
import { Button } from '@mui/material'
import { Button, IconButton } from '@mui/material'
import React, { useState } from 'react'
import leftChevron from '../../../assets/icons/left-chevron.svg'
import rightChevron from '../../../assets/icons/right-chevron.svg'
......@@ -45,21 +45,16 @@ const DateSelector: React.FC<DateSelectorProps> = ({
}
return (
<div className="date-selector">
<img
src={leftChevron}
alt="Previous Month"
onClick={handlePrevMonth}
className="arrow"
/>
<IconButton onClick={handlePrevMonth}>
<img src={leftChevron} alt="Previous Month" className="arrow" />
</IconButton>
<div className="text">
{date.toLocaleString('default', { month: 'long', year: 'numeric' })}
</div>
<img
src={rightChevron}
alt="Next Month"
onClick={handleNextMonth}
className="arrow"
/>
<IconButton onClick={handleNextMonth}>
<img src={rightChevron} alt="Next Month" className="arrow" />
</IconButton>
{openModal && (
<Modal>
<>
......
......@@ -26,14 +26,11 @@
padding: 0.5rem;
border-radius: 50%;
background: #343641;
margin: 0 0.5rem;
box-shadow: 0px 5px 5px rgb(0 0 0 / 20%), 0px 3px 14px rgb(0 0 0 / 12%),
box-shadow:
0px 5px 5px rgb(0 0 0 / 20%),
0px 3px 14px rgb(0 0 0 / 12%),
0px 8px 10px rgb(0 0 0 / 14%);
transition: all 300ms ease;
&:hover {
background: $text-grey;
opacity: 0.9;
}
}
}
.modal-text {
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment