Proyectos de Subversion LeadersLinked - SPA

Rev

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

Rev 690 Rev 1360
Línea 1... Línea 1...
1 
import React from 'react'
 1 
import React from 'react'
2 
import styled from 'styled-components'
 2 
import { Box, styled } from '@mui/material'
Línea 3... Línea 3...
3 
 
 3 
 
4 
const SpinnerContainer = styled.div`
 4 
const EllipsisContainer = styled(Box)`
5 
  width: 100%;
 5 
  width: 100%;
6 
  height: 100%;
 6 
  height: 100%;
7 
  display: grid;
 7 
  display: grid;
8 
  place-items: center;
 8 
  place-items: center;
9 
  position: absolute;
 9 
  position: absolute;
10 
  top: 0;
 10 
  top: 0;
11 
  left: 0;
 - 
 
12 
`
 - 
 
13 
 
 - 
 
14 
const StyledSpinner = styled.div`
 11 
  left: 0;
15 
  .lds-ellipsis {
 12 
  .lds-ellipsis {
16 
    display: inline-block;
 13 
    display: inline-block;
17 
    position: relative;
 14 
    position: relative;
18 
    width: 80px;
 15 
    width: 80px;
Línea 67... Línea 64...
67 
      transform: translate(24px, 0);
 64 
      transform: translate(24px, 0);
68 
    }
 65 
    }
69 
  }
 66 
  }
70 
`
 67 
`
Línea -... Línea 68...
- 
 
 68 
 
- 
 
 69 
const SpinnerContainer = styled(Box)`
- 
 
 70 
  inset: 0;
- 
 
 71 
  margin: auto;
- 
 
 72 
  width: 80px;
- 
 
 73 
  text-align: center;
- 
 
 74 
  height: 80px;
- 
 
 75 
  border-radius: 100px;
- 
 
 76 
  background-color: #fff;
- 
 
 77 
  line-height: 80px;
- 
 
 78 
  border: 1px solid #e1e1e1;
- 
 
 79 
  cursor: pointer;
- 
 
 80 
`
71 
 
 81 
 
72 
const Spinner = () => {
 82 
const Spinner = ({ ...rest }) => {
73 
  return (
 83 
  return (
74 
    <SpinnerContainer>
 84 
    <SpinnerContainer {...rest}>
75 
      <StyledSpinner>
 85 
      <EllipsisContainer>
76 
        <div className='lds-ellipsis'>
 86 
        <div className='lds-ellipsis'>
77 
          <div></div>
 87 
          <div></div>
78 
          <div></div>
 88 
          <div></div>
79 
          <div></div>
 89 
          <div></div>
80 
          <div></div>
 90 
          <div></div>
81 
        </div>
 91 
        </div>
82 
      </StyledSpinner>
 92 
      </EllipsisContainer>
83 
    </SpinnerContainer>
 93 
    </SpinnerContainer>
84 
  )
 94 
  )
Línea 85... Línea 95...
85 
}
 95 
}