Proyectos de Subversion LeadersLinked - SPA

Rev

Rev 1479 | Rev 2798 | 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'
1477 stevensc 2
import { Container, styled } from '@mui/material'
3
import { Add } from '@mui/icons-material'
5 stevensc 4
 
1479 stevensc 5
const Header = styled(Container)(({ theme }) => ({
1477 stevensc 6
  display: 'flex',
7
  alignItems: 'center',
1479 stevensc 8
  justifyContent: 'space-between',
1477 stevensc 9
  position: 'relative',
10
  h1: {
1478 stevensc 11
    fontSize: '1.1rem',
1479 stevensc 12
    fontWeight: '600'
1477 stevensc 13
  },
14
  button: {
15
    display: 'flex',
16
    alignItems: 'center',
17
    gap: '0.5rem',
18
    position: 'relative',
19
    fontWeight: '600'
1478 stevensc 20
  },
1480 stevensc 21
  [theme.breakpoints.up('md')]: {
1479 stevensc 22
    justifyContent: 'center',
1478 stevensc 23
    button: {
24
      position: 'absolute',
25
      right: 0,
26
      top: '50%',
27
      transform: 'translateY(-50%)'
28
    }
405 stevensc 29
  }
1477 stevensc 30
}))
405 stevensc 31
 
1215 stevensc 32
const TitleSection = ({ onAdd, addLabel = '', title = '', ...rest }) => {
5 stevensc 33
  return (
1479 stevensc 34
    <Header {...rest}>
405 stevensc 35
      <h1>{title}</h1>
1215 stevensc 36
      {onAdd && (
409 stevensc 37
        <button onClick={onAdd}>
1477 stevensc 38
          <Add />
1216 stevensc 39
          {addLabel}
409 stevensc 40
        </button>
41
      )}
1479 stevensc 42
    </Header>
5 stevensc 43
  )
44
}
45
 
46
export default TitleSection