mirror of
https://github.com/stoatchat/for-legacy-web.git
synced 2026-03-07 01:15:28 +00:00
Add collapsible section component.
Can now collapse server categories. Client remembers collapse state, incl. advanced appearance settings.
This commit is contained in:
@@ -1,16 +1,29 @@
|
||||
import styled from "styled-components";
|
||||
import styled, { css } from "styled-components";
|
||||
|
||||
export default styled.details`
|
||||
export default styled.details<{ sticky?: boolean, large?: boolean }>`
|
||||
summary {
|
||||
${ props => props.sticky && css`
|
||||
top: -1px;
|
||||
z-index: 10;
|
||||
position: sticky;
|
||||
` }
|
||||
|
||||
${ props => props.large && css`
|
||||
padding: 5px 0;
|
||||
` }
|
||||
|
||||
outline: none;
|
||||
display: flex;
|
||||
cursor: pointer;
|
||||
list-style: none;
|
||||
align-items: center;
|
||||
transition: .2s opacity;
|
||||
|
||||
&::marker, &::-webkit-details-marker {
|
||||
display: none;
|
||||
}
|
||||
|
||||
svg {
|
||||
> svg {
|
||||
flex-shrink: 0;
|
||||
transition: .2s ease transform;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user