import { FC } from 'react';

import Stack from '@material-hu/mui/Stack';

import GooglePlay from 'src/assets/tag-app-google.webp';
import AppStore from 'src/assets/tag-app-store.svg';

import KioskQR from './kiosk-qr.svg';

const KioskStoreQR: FC = () => {
  return (
    <Stack
      sx={{
        flexDirection: 'row',
        justifyContent: 'center',
        gap: 2,
      }}
    >
      <img
        src={KioskQR}
        alt="kiosk-qr"
        crossOrigin="anonymous"
        style={{ height: '160px', width: '160px' }}
      />
      <Stack sx={{ justifyContent: 'space-between' }}>
        <img
          src={GooglePlay}
          alt="google-play"
          crossOrigin="anonymous"
          style={{ maxWidth: '203px' }}
        />
        <img
          src={AppStore}
          alt="app-store"
          crossOrigin="anonymous"
        />
      </Stack>
    </Stack>
  );
};

export default KioskStoreQR;