# All files / src/Navigation/components ItemGroup.styled.ts

54.55% Statements 6/11
0% Branches 0/10
0% Functions 0/5
54.55% Lines 6/11

Press n or j to go to the next uncovered block, b, p or k for the previous block.

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    3811x
    11x

    11x

    11x

    11x

    11x

     import { styled, th } from '../../styles/styled'
    import { StyledItemWrapper } from './Item.styled'

    export const StyledItemGroupWrapper = styled.div``

    export const StyledItemGroupTitleWrapper = styled.div<{ active: boolean }>`
      position: relative;
      color: ${({ active }): string => (active ? th.color('primary.default') : 'inherit')};
    `

    export const StyledItemGroupTitleIconWrapper = styled.div<{
      open: boolean
      expanded: boolean
      acrylic: boolean
    }>`
      width: 24px;
      height: 24px;
      position: absolute;
      right: 12px;
      top: 50%;
      cursor: pointer;
      margin-top: -12px;
      display: flex;
      justify-content: center;
      align-items: center;
      font-size: 12px;
      transition: ${th.transition('navigation')};
      transform: rotate(${({ open }): number => (open ? 180 : 0)}deg);
      z-index: ${({ acrylic }): number => (acrylic ? -1 : 1)};
      opacity: ${({ expanded }): number => (expanded ? 1 : 0)};
    `

    export const StyledItemGroupItemWrapper = styled.div<{ level: number }>`
      ${StyledItemWrapper} {
        padding-left: ${({ level }): number => (level ? 40 + level * 12 : 0)}px !important;
      }
    `