2019-10-16 16:56:44 +02:00
|
|
|
import styled from 'styled-components';
|
|
|
|
|
2019-10-24 14:41:06 +02:00
|
|
|
import colors from '../../assets/styles/colors';
|
2019-10-16 16:56:44 +02:00
|
|
|
|
|
|
|
const Wrapper = styled.div`
|
2019-11-28 11:01:47 +01:00
|
|
|
margin-bottom: 24px;
|
2019-10-23 15:49:03 +02:00
|
|
|
button {
|
|
|
|
outline: 0;
|
|
|
|
}
|
2019-10-16 16:56:44 +02:00
|
|
|
.list-header {
|
|
|
|
color: ${colors.leftMenu.darkGrey};
|
2019-10-23 15:49:03 +02:00
|
|
|
> div {
|
2019-10-16 16:56:44 +02:00
|
|
|
position: relative;
|
|
|
|
}
|
2019-10-23 15:49:03 +02:00
|
|
|
// Title
|
2019-10-16 16:56:44 +02:00
|
|
|
h3 {
|
2019-10-23 15:49:03 +02:00
|
|
|
margin-bottom: 21px;
|
|
|
|
padding-right: 20px;
|
|
|
|
padding-top: 2px;
|
2019-10-16 16:56:44 +02:00
|
|
|
font-family: Lato;
|
|
|
|
font-size: 1.1rem;
|
2019-10-23 15:49:03 +02:00
|
|
|
line-height: normal;
|
|
|
|
letter-spacing: 0.1rem;
|
2019-10-16 16:56:44 +02:00
|
|
|
font-weight: bold;
|
|
|
|
text-transform: uppercase;
|
2019-10-23 15:49:03 +02:00
|
|
|
span:last-of-type {
|
2019-10-16 16:56:44 +02:00
|
|
|
margin-top: 2px;
|
|
|
|
padding: 1px 3px;
|
|
|
|
height: 14px;
|
|
|
|
min-width: 14px;
|
|
|
|
display: inline-block;
|
|
|
|
background-color: ${colors.leftMenu.lightGrey};
|
|
|
|
text-align: center;
|
|
|
|
}
|
2019-10-23 15:49:03 +02:00
|
|
|
& + button {
|
|
|
|
position: absolute;
|
|
|
|
top: 2px;
|
|
|
|
right: 0;
|
|
|
|
padding: 2px 0 0px 5px;
|
|
|
|
line-height: 11px;
|
2019-12-03 16:04:41 +01:00
|
|
|
i,
|
|
|
|
svg {
|
2019-10-23 15:49:03 +02:00
|
|
|
font-size: 11px;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
// Search
|
|
|
|
.search-wrapper {
|
|
|
|
margin-bottom: 16px;
|
|
|
|
&::after {
|
|
|
|
display: block;
|
|
|
|
content: '';
|
|
|
|
height: 2px;
|
|
|
|
width: calc(100% - 20px);
|
|
|
|
background: ${colors.leftMenu.lightGrey};
|
|
|
|
}
|
2019-12-03 16:04:41 +01:00
|
|
|
> svg {
|
2019-10-23 15:49:03 +02:00
|
|
|
position: absolute;
|
|
|
|
bottom: 6px;
|
|
|
|
left: 0;
|
|
|
|
font-size: 11px;
|
|
|
|
}
|
|
|
|
button {
|
|
|
|
position: absolute;
|
|
|
|
top: 0;
|
|
|
|
right: 0;
|
|
|
|
padding: 5px 0 0px 5px;
|
|
|
|
line-height: 11px;
|
2019-12-03 16:04:41 +01:00
|
|
|
i,
|
|
|
|
svg {
|
2019-10-23 15:49:03 +02:00
|
|
|
font-size: 11px;
|
|
|
|
}
|
|
|
|
}
|
2019-10-16 16:56:44 +02:00
|
|
|
}
|
|
|
|
}
|
2019-10-23 15:49:03 +02:00
|
|
|
ul {
|
|
|
|
list-style: none;
|
|
|
|
li {
|
|
|
|
a {
|
|
|
|
text-transform: capitalize;
|
2019-10-16 16:56:44 +02:00
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
`;
|
|
|
|
|
|
|
|
export default Wrapper;
|