Adapt components with new css & NextJs rules

This commit is contained in:
2026-04-21 19:31:26 +04:00
parent 6b94f95bb8
commit 532a92fca2
26 changed files with 110 additions and 105 deletions
+8 -8
View File
@@ -11,7 +11,7 @@ import Button from '@mui/material/Button'
import CardActionArea from '@mui/material/CardActionArea'
import Chip from '@mui/material/Chip'
import Container from '@mui/material/Container'
import Grid from '@mui/material/Grid2'
import Grid from '@mui/material/Grid'
import Paper from '@mui/material/Paper'
import Card from '@mui/material/Card'
import CardContent from '@mui/material/CardContent'
@@ -44,8 +44,8 @@ export default function AwtisDetay({anAwtis}) {
return (
<Container>
<Box sx={{marginBlock: 2}}>
<Typography textAlign='center' variant='h6' component='h1'>
<Box sx={{marginTop: 8, marginBottom: 2}}>
<Typography sx={{textAlign: 'center'}} variant='h6' component='h1'>
{alias}
</Typography>
</Box>
@@ -56,7 +56,7 @@ export default function AwtisDetay({anAwtis}) {
sx={{width: 200, height: 200, border: `2px solid ${green[500]}`}}
/>
</Box>
<Grid container direction='column' justifyContent='center' alignItems='center' spacing={3}>
<Grid sx={{alignItems:'center'}} container direction='column' spacing={3}>
{biyo && (
<Grid size={{xs: 12, md: 6}}>
<Card sx={{minWidth: 300}}>
@@ -65,7 +65,7 @@ export default function AwtisDetay({anAwtis}) {
<Typography gutterBottom variant='body1' component='h2'>
<strong>Biographie</strong>
</Typography>
<Typography textAlign='justify' variant='subtitle1' component='h3'>
<Typography textalign='justify' variant='subtitle1' component='h3'>
{biyo}
</Typography>
</CardContent>
@@ -74,7 +74,7 @@ export default function AwtisDetay({anAwtis}) {
</Grid>
)}
<Grid size={{xs: 12, md: 6}}>
<Box marginBottom={3}>
<Box marginbottom={3}>
{paroles.data.length > 1 ? (
<Accordion>
<AccordionSummary
@@ -82,7 +82,7 @@ export default function AwtisDetay({anAwtis}) {
aria-controls='panel-teks-content'
id='panel-teks-header'
>
<Typography marginRight={2} textAlign='center' variant='body1' component='h2'><strong>Liste des paroles</strong></Typography>
<Typography sx={{marginRight: 2, textAlign:'center' }} variant='body1' component='h2'><strong>Liste des paroles</strong></Typography>
<Chip color='primary' label={paroles.data.length} size='small' variant='contained' />
</AccordionSummary>
<AccordionDetails sx={{paddingInline: 0}}>
@@ -103,7 +103,7 @@ export default function AwtisDetay({anAwtis}) {
<Typography gutterBottom textAlign='center' variant='body1' component='h2'><strong>Aucune parole pour le moment</strong></Typography>
) : (
<Box>
<Typography gutterBottom textAlign='center' variant='body1' component='h2'><strong>Parole</strong></Typography>
<Typography gutterBottom textalign='center' variant='body1' component='h2'><strong>Parole</strong></Typography>
<Paper sx={{height: '100%', paddingBlock: 2}}>
<MizikLyen anPawol={paroles[0]} kuveti={formatKuveti(paroles[0].couverture)} />
</Paper>
+1 -1
View File
@@ -5,7 +5,7 @@ import {useRouter} from 'next/navigation'
import PropTypes from 'prop-types'
import CardActionArea from '@mui/material/CardActionArea'
import Grid from '@mui/material/Grid2'
import Grid from '@mui/material/Grid'
import Card from '@mui/material/Card'
import CardMedia from '@mui/material/CardMedia'
import CardContent from '@mui/material/CardContent'
+3 -1
View File
@@ -50,7 +50,9 @@ export default function ChecheAwtis() {
}, [loading])
return (
<Container sx={{display: 'flex', justifyContent: 'center', marginBottom: 3}}>
<Container
sx={{ display: 'flex', justifyContent: 'center', marginBottom: 3 }}
>
<Autocomplete
autoHighlight
disableClearable
+2 -2
View File
@@ -3,7 +3,7 @@
import PropTypes from 'prop-types'
import {useRouter} from 'next/navigation'
import Pagination from '@mui/material/Pagination'
import Grid from '@mui/material/Grid2'
import Grid from '@mui/material/Grid'
export default function Pajinasyon({pajTotal, paj}) {
const router = useRouter()
@@ -14,7 +14,7 @@ export default function Pajinasyon({pajTotal, paj}) {
}
return (
<Grid container sx={{marginBlock: 3}} justifyContent='center'>
<Grid container sx={{marginTop: 10, marginBottom: 3, justifyContent: 'center'}}>
<Pagination size='small' page={paj} count={pajTotal} color='primary' onChange={handleChange} />
</Grid>
)