Proyectos de Subversion LeadersLinked - SPA

Rev

Rev 3694 | Mostrar el archivo completo | | | Autoría | Ultima modificación | Ver Log |

Rev 3694 Rev 3719
Línea 1... Línea 1...
1 
import React from 'react';
 1 
import React from 'react';
2 
import { Avatar, styled, Typography } from '@mui/material';
 2 
import { Avatar, styled, Typography } from '@mui/material';
3 
import VisibilityOutlined from '@mui/icons-material/VisibilityOutlined';
 3 
import VisibilityOutlined from '@mui/icons-material/VisibilityOutlined';
4 
import MapOutlined from '@mui/icons-material/MapOutlined';
 4 
import MapOutlined from '@mui/icons-material/MapOutlined';
5 
import ShareOutlined from '@mui/icons-material/ShareOutlined';
 5 
import ShareOutlined from '@mui/icons-material/ShareOutlined';
6 
 
 6 
 
7 
import Widget from '@components/UI/Widget';
 7 
import Widget from '@components/UI/Widget';
8 
 
 8 
 
9 
const Row = styled('div')(() => ({
 9 
const Row = styled('div')(() => ({
10 
  display: 'flex',
 10 
  display: 'flex',
11 
  justifyContent: 'space-around',
 11 
  justifyContent: 'space-around',
12 
  alignItems: 'center'
 12 
  alignItems: 'center'
13 
}));
 13 
}));
14 
 
 14 
 
15 
export default function ProfileInfo({ image, fullName, visits, country, connections }) {
 15 
export default function ProfileInfo({ image, fullName, visits, country, connections }) {
16 
  return (
 16 
  return (
17 
    <Widget>
 17 
    <Widget>
18 
      <Widget.Body>
 18 
      <Widget.Body>
19 
        <Avatar
 19 
        <Avatar
20 
          src={image}
 20 
          src={image}
21 
          alt={`${fullName} profile-image`}
 21 
          alt={`${fullName} profile-image`}
22 
          sx={{ margin: '0 auto', width: 100, height: 100 }}
 22 
          sx={{ margin: '0 auto', width: 100, height: 100 }}
23 
        />
 23 
        />
24 
        <Typography variant='h2' sx={{ textAlign: 'center' }}>
 24 
        <Typography variant='h2' sx={{ textAlign: 'center' }}>
25 
          {fullName}
 25 
          {fullName}
26 
        </Typography>
 26 
        </Typography>
27 
 
 27 
 
28 
        <Row>
 28 
        <Row>
29 
          <Typography variant='overline'>
 29 
          <Typography variant='overline'>
30 
            <VisibilityOutlined />
 30 
            <VisibilityOutlined />
31 
            {visits}
 31 
            {visits}
32 
          </Typography>
 32 
          </Typography>
33 
 
 33 
 
34 
          <Typography variant='overline'>
 34 
          <Typography variant='overline'>
35 
            <MapOutlined />
 35 
            <MapOutlined />
36 
            {country}
 36 
            {country}
37 
          </Typography>
 37 
          </Typography>
38 
 
 38 
 
39 
          <Typography variant='overline'>
 39 
          <Typography variant='overline'>
40 
            <ShareOutlined />
 40 
            <ShareOutlined />
41 
            {connections}
 41 
            {connections}
42 
          </Typography>
 42 
          </Typography>
43 
        </Row>
 43 
        </Row>
44 
      </Widget.Body>
 44 
      </Widget.Body>
45 
    </Widget>
 45 
    </Widget>
46 
  );
 46 
  );
47 
}
 47 
}