diff --git a/components/teks/teks.js b/components/teks/teks.js index 649c5c2..90e231c 100644 --- a/components/teks/teks.js +++ b/components/teks/teks.js @@ -13,6 +13,8 @@ import slugify from 'slugify' import {styled} from '@mui/material/styles' import ExplicitIcon from '@mui/icons-material/Explicit' +import ArrowBackIosNewIcon from '@mui/icons-material/ArrowBackIosNew' +import ArrowForwardIosIcon from '@mui/icons-material/ArrowForwardIos' import Image from 'next/image' @@ -225,7 +227,26 @@ export default function Teks({parole}) { scrollButtons allowScrollButtonsMobile centered={langArray.length === 0} - sx={{borderBottom: 1, borderColor: 'divider', mb: 2}} + slots={{ + StartScrollButtonIcon: ArrowBackIosNewIcon, + EndScrollButtonIcon: ArrowForwardIosIcon + }} + sx={{ + borderBottom: 1, + borderColor: 'divider', + mb: 2, + '& .MuiTabs-scrollButtons': { + width: 36, + height: 36, + borderRadius: '50%', + color: 'primary.main', + backgroundColor: 'action.hover', + mx: 0.5, + '&.Mui-disabled': { + opacity: 0 + } + } + }} > {langArray.map(({title}) => (