Proyectos de Subversion LeadersLinked - SPA

Rev

Rev 3388 | | Comparar con el anterior | Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
3719 stevensc 1 
import React from 'react';
2 
import { styled } from '@mui/material';
3 
 
4 
const EmojisContainer = styled('div')(({ theme }) => ({
5 
  display: 'flex',
6 
  gap: theme.spacing(0.5),
7 
  justifyContent: 'center',
8 
  padding: theme.spacing(0.5, 0)
9 
}));
10 
 
11 
const Emoji = styled('button')(({ theme }) => ({
12 
  width: 20,
13 
  height: 20,
14 
  borderRadius: '50%',
15 
  transition: 'all 300ms',
16 
  '& > img': {
17 
    height: '100%',
18 
    objectFit: 'cover',
19 
    width: '100%'
20 
  },
21 
  '&:hover': {
22 
    transform: 'translateY(-5px)'
23 
  },
24 
  [theme.breakpoints.up('sm')]: {
25 
    width: 32,
26 
    height: 32
27 
  }
28 
}));
29 
 
30 
export default function EmojiGroup({ children }) {
31 
  return <EmojisContainer>{children}</EmojisContainer>;
32 
}
33 
 
34 
function EmojiItem({ onClick, image, index = 1 }) {
35 
  return (
36 
    <Emoji onClick={onClick} type='button'>
37 
      <img className='fadedown' src={image} style={{ animationDelay: `${index + 10}00ms` }} />
38 
    </Emoji>
39 
  );
40 
}
41 
 
42 
EmojiGroup.Item = EmojiItem;