Proyectos de Subversion LeadersLinked - SPA

Rev

Rev 3550 | Ir a la última revisión | Mostrar el archivo completo | | | Autoría | Ultima modificación | Ver Log |

Rev 3550 Rev 3556
Línea 1... Línea 1...
1 
import React from 'react';
 1 
import React from 'react';
2 
import { Link } from 'react-router-dom';
 - 
 
3 
import { Box, Button, styled, Typography } from '@mui/material';
 2 
import { Box, LinearProgress, Typography } from '@mui/material';
4 
import { NavigateNext } from '@mui/icons-material';
 - 
 
Línea 5... Línea 3...
5 
 
 3 
 
6 
import { Card, CardContent } from '@shared/components';
 - 
 
Línea 7... Línea -...
7 
import { parse } from '@shared/utils';
 - 
 
8 
 
 - 
 
9 
const CardImage = styled('img')(({ theme }) => ({
 - 
 
10 
  borderRadius: theme.shape.borderRadius,
 - 
 
11 
  maxWidth: 100,
 - 
 
12 
  aspectRatio: '1/1.5',
 - 
 
13 
  objectFit: 'cover'
 - 
 
14 
}));
 4 
import { Card, CardContent, CardHeader, CardMedia } from '@shared/components';
15 
 
 5 
 
16 
export function CapsuleCard({ capsule: { name, description, image, completed, uuid } }) {
 6 
export function CapsuleCard({ capsule: { name, image, progress } }) {
17 
  return (
 7 
  return (
18 
    <Card>
 - 
 
19 
      <CardContent>
 - 
 
20 
        <Box
 - 
 
21 
          sx={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: 0.5 }}
 - 
 
22 
        >
 - 
 
23 
          <Box>
 8 
    <Card>
24 
            <Typography variant='caption'>{completed ? 'Completa' : 'En curso'}</Typography>
 - 
 
Línea 25... Línea -...
25 
            <Typography variant='h2'>{name}</Typography>
 - 
 
26 
            <Typography>{parse(description)}</Typography>
 9 
      <CardHeader title={name} />
27 
 
 10 
      <CardMedia src={image} />
28 
            <Button LinkComponent={Link} to={`/microlearning/capsules/${uuid}/slides`}>
 11 
 
29 
              Ver cápsula
 - 
 
30 
              <NavigateNext fontSize='small' />
 - 
 
31 
            </Button>
 12 
      <CardContent>
32 
          </Box>
 13 
        <Box sx={{ display: 'flex', alignItems: 'center', gap: 0.5 }}>
33 
 
 14 
          <LinearProgress variant='determinate' value={progress} />
34 
          <CardImage src={image} alt={name} />
 15 
          <Typography variant='caption'>{`${progress}%`}</Typography>
35 
        </Box>
 16 
        </Box>
36 
      </CardContent>
 17 
      </CardContent>