Proyectos de Subversion LeadersLinked - SPA

Rev

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

Rev Autor Línea Nro. Línea
5 stevensc 1 
import React from 'react'
405 stevensc 2 
import { Container } from 'react-bootstrap'
3 
import styled from 'styled-components'
4 
import AddIcon from '@mui/icons-material/Add'
5 stevensc 5 
 
405 stevensc 6 
import { device } from '../../styles/MediaQueries'
7 
 
8 
const StyledHeader = styled(Container)`
9 
  display: flex;
10 
  align-items: center;
11 
  justify-content: center;
12 
  position: relative;
13 
  h1 {
14 
    font-size: 1.1rem;
15 
    font-weight: 600;
16 
  }
17 
  button {
18 
    display: flex;
19 
    align-items: center;
20 
    gap: 0.5rem;
21 
    position: relative;
22 
    font-weight: 600;
23 
    @media ${device.tablet} {
24 
      position: absolute;
25 
      right: 0;
26 
      top: 50%;
27 
      transform: translateY(-50%);
28 
    }
29 
  }
30 
  @media ${device.mobile} {
31 
    justify-content: space-between;
32 
  }
33 
`
34 
 
741 stevensc 35 
const TitleSection = ({
36 
  onAdd = () => null,
37 
  addLabel = '',
38 
  title = '',
39 
  ...rest
40 
}) => {
5 stevensc 41 
  return (
741 stevensc 42 
    <StyledHeader {...rest}>
405 stevensc 43 
      <h1>{title}</h1>
409 stevensc 44 
      {addLabel && (
45 
        <button onClick={onAdd}>
46 
          <AddIcon />
47 
          {addLabel}
48 
        </button>
49 
      )}
405 stevensc 50 
    </StyledHeader>
5 stevensc 51 
  )
52 
}
53 
 
54 
export default TitleSection