Proyectos de Subversion LeadersLinked - SPA

Rev

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

Rev 1331 Rev 1338
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'
Línea 3... Línea 3...
3 
 
 3 
 
- 
 
 4 
import WidgetLayout from 'components/widgets/WidgetLayout'
Línea 4... Línea 5...
4 
import WidgetLayout from 'components/widgets/WidgetLayout'
 5 
import { NavLink } from 'react-router-dom'
5 
 
 6 
 
6 
const SideMenuContainer = styled(WidgetLayout)`
 7 
const SideMenuContainer = styled(WidgetLayout)`
7 
  padding: 1rem;
 8 
  padding: 1rem;
Línea 11... Línea 12...
11 
    gap: 0.5rem;
 12 
    gap: 0.5rem;
12 
    li,
 13 
    li,
13 
    label {
 14 
    label {
14 
      cursor: pointer;
 15 
      cursor: pointer;
15 
    }
 16 
    }
16 
    .selected label {
 17 
    input:checked ~ label {
17 
      font-weight: 600;
 18 
      font-weight: 600;
18 
    }
 19 
    }
19 
  }
 20 
  }
20 
`
 21 
`
Línea 21... Línea 22...
21 
 
 22 
 
22 
const SideMenu = ({ items = [], onChange = () => {}, currentItem }) => {
 23 
const SideMenu = ({ items = [], onChange = () => {} }) => {
23 
  return (
 24 
  return (
24 
    <SideMenuContainer>
 25 
    <SideMenuContainer>
25 
      <ul>
 26 
      <ul>
26 
        {items.map(({ value, name }) => (
 - 
 
27 
          <li className={currentItem === value && 'selected'} key={value}>
 - 
 
28 
            <input
 - 
 
29 
              type='radio'
 - 
 
30 
              id={`category-${name}`}
 - 
 
31 
              name='category'
 27 
        {items.map(({ value, name }) => (
32 
              value={value}
 28 
          <li key={value}>
33 
              onChange={(e) => onChange(e.target.value)}
 29 
            <NavLink to={value} onClick={onChange}>
34 
              hidden
 30 
              {name}
35 
            />
 - 
 
36 
            <label htmlFor={`category-${name}`}>{name}</label>
 31 
            </NavLink>
37 
          </li>
 32 
          </li>
38 
        ))}
 33 
        ))}
39 
      </ul>
 34 
      </ul>
40 
    </SideMenuContainer>
 35 
    </SideMenuContainer>