message: Added icons before technology subtitles
diff: import { useTranslation } from 'next-i18next'
  import { Box, Grid, Theme, Typography } from '@mui/material'
  +import JoinLeftIcon from '@mui/icons-material/JoinLeft'
  +import ImportantDevicesIcon from '@mui/icons-material/ImportantDevices'
  +import SettingsIcon from '@mui/icons-material/Settings'
  +
  +import Heading from 'components/common/Heading'
  import createStyles from '@mui/styles/createStyles'
  import makeStyles from '@mui/styles/makeStyles'
  -import Heading from 'components/common/Heading'
  -
  const rows = [
  {
  + icon: <JoinLeftIcon color="action" />,
  label: 'DevOps',
  items: [
  'about-project:tech-stack.docker',
  @@ -18,6 +22,7 @@ const rows = [
  ],
  },
  {
  + icon: <ImportantDevicesIcon color="action" />,
  label: 'Frontend',
  items: [
  'TypeScript',
  @@ -33,6 +38,7 @@ const rows = [
  ],
  },
  {
  + icon: <SettingsIcon color="action" />,
  label: 'Backend',
  items: ['TypeScript', 'Nest.js', 'PostgreSQL', 'Prisma', 'Jest', 'Sentry'],
  },
  @@ -67,9 +73,12 @@ export default function TechStack() {
  </Heading>
  <Grid container direction="column" component="section">
  <Grid item container justifyContent="center" spacing={2}>
  - {rows.map(({ label, items }, section: number) => (
  + {rows.map(({ label, icon, items }, section: number) => (
  <Grid item xs={12} sm={8} key={section}>
  + <Grid container justifyContent="center" gap="5px">
  + <Grid>{icon}</Grid>
  <Typography variant="subtitle1">{label}</Typography>
  + </Grid>
  <Grid item xs={12} component="ul" className={classes.list}>
  {items.map((line: string, key: number) => (
  <Typography key={key} variant="body2" component="li">
  