import styled from 'styled-components/macro'

import { T9n } from 'features/T9n'

export const Wrapper = styled.div`
  display: flex;
  align-items: center;
  height: 30px;
  padding-left: 20px;
  background-color: #005EDD;
`

export const Icon = styled.div<{ image: string }>`
  width: 20px;
  height: 20px;
  margin-right: 10px;
  background-image: url(/images/${({ image }) => `${image}.svg`});
  background-size: 100%;
  background-repeat: no-repeat;
`

export const Title = styled(T9n)`
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: #fff;
`
