Proyectos de Subversion LeadersLinked - SPA

Rev

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

Rev 530 Rev 531
Línea 1... Línea 1...
1 
import React from 'react'
 1 
import React from 'react'
2 
import styled from 'styled-components'
 2 
import styled from 'styled-components'
3 
import { device } from '../../styles/MediaQueries'
 3 
import { device } from '../../styles/MediaQueries'
Línea 4... Línea 4...
4 
 
 4 
 
5 
const LocationWidget = styled.div`
 5 
const LayoutContainer = styled.div`
6 
  background-color: var(--bg-color);
 6 
  background-color: var(--bg-color);
7 
  box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.08);
 7 
  box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.08);
8 
  height: fit-content;
 8 
  height: fit-content;
9 
  width: -moz-available;
 9 
  width: -moz-available;
10 
  width: -webkit-fill-available;
 10 
  width: -webkit-fill-available;
11 
  width: fill-available;
 11 
  width: fill-available;
12 
  p {
 12 
  p {
13 
    color: var(--font-color);
 13 
    color: var(--font-color);
14 
    font-size: 14px;
 - 
 
15 
    font-weight: 400;
 14 
    font-size: 14px;
16 
    text-align: justify;
 15 
    text-align: justify;
- 
 
 16 
  }
- 
 
 17 
  span {
- 
 
 18 
    font-size: 0.9rem;
17 
  }
 19 
  }
18 
  @media ${device.tablet} {
 20 
  @media ${device.tablet} {
19 
    border-radius: var(--border-radius);
 21 
    border-radius: var(--border-radius);
20 
  }
 22 
  }
Línea -... Línea 23...
- 
 
 23 
`
- 
 
 24 
 
- 
 
 25 
const LayoutActions = styled.div`
- 
 
 26 
  display: flex;
- 
 
 27 
  justify-content: space-between;
- 
 
 28 
  border-top: 1px solid rgb(211, 211, 211);
- 
 
 29 
  padding: 10px;
- 
 
 30 
  & > button {
- 
 
 31 
    align-items: center;
- 
 
 32 
    border-radius: var(--border-radius);
- 
 
 33 
    cursor: pointer;
- 
 
 34 
    display: inline-flex;
- 
 
 35 
    flex-direction: column;
- 
 
 36 
    font-size: 0.9rem;
- 
 
 37 
    padding: 5px;
- 
 
 38 
    position: relative;
- 
 
 39 
    &:hover {
- 
 
 40 
      background-color: whitesmoke;
- 
 
 41 
    }
- 
 
 42 
    @media ${device.tablet} {
- 
 
 43 
      flex-direction: row;
- 
 
 44 
      gap: 0.5rem;
- 
 
 45 
      font-size: 1rem;
- 
 
 46 
    }
- 
 
 47 
  }
21 
`
 48 
`
22 
 
 49 
 
- 
 
 50 
const StyledContainer = ({ children, ...rest }) => {
- 
 
 51 
  return <LayoutContainer {...rest}>{children}</LayoutContainer>
- 
 
 52 
}
- 
 
 53 
 
23 
const WidgetLayout = ({ children, ...rest }) => {
 54 
const Actions = ({ children, ...rest }) => {
Línea -... Línea 55...
- 
 
 55 
  return <LayoutActions {...rest}>{children}</LayoutActions>
- 
 
 56 
}
24 
  return <LocationWidget {...rest}>{children}</LocationWidget>
 57