12345678910111213141516171819202122232425262728293031 |
- import styled from "styled-components";
- export const Wrapper = styled.div`
- display: flex;
- width: 99%;
- margin: 0 0 5px -10px;
- padding: 5px 0 5px 10px;
- display: flex;
- align-items: center;
- transition: 0.2s;
- border-radius: 0 3px 3px 0;
- background: ${({ active }) =>
- active ? "rgba(255, 255, 255, 0.1)" : "none"};
- &:hover {
- cursor: pointer;
- background: rgba(255, 255, 255, 0.1);
- }
- `;
- export const Text = styled.p`
- font-size: 14px;
- margin-left: 10px;
- `;
- export const Image = styled.img`
- filter: invert(100%) sepia(0%) saturate(7500%) hue-rotate(116deg)
- brightness(109%) contrast(109%);
- width: 20px;
- height: 20px;
- `;
|