revite/src/components/navigation/SidebarBase.tsx

33 lines
731 B
TypeScript

import styled, { css } from "styled-components";
import { isTouchscreenDevice } from "../../lib/isTouchscreenDevice";
export default styled.div`
height: 100%;
display: flex;
user-select: none;
flex-direction: row;
align-items: stretch;
`;
export const GenericSidebarBase = styled.div<{ padding?: boolean }>`
height: 100%;
width: 240px;
display: flex;
flex-shrink: 0;
flex-direction: column;
background: var(--secondary-background);
${ props => props.padding && isTouchscreenDevice && css`
padding-bottom: 50px;
` }
`;
export const GenericSidebarList = styled.div`
padding: 6px;
flex-grow: 1;
overflow-y: scroll;
> img {
width: 100%;
}
`;