Proyectos de Subversion LeadersLinked - SPA

Rev

Rev 3338 | Rev 3388 | Ir a la última revisión | | Comparar con el anterior | Ultima modificación | Ver Log |

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