hugo-theme-zzo/assets/sass/components/_expand.scss

61 lines
1.2 KiB
SCSS
Raw Normal View History

2019-11-04 13:09:44 +00:00
.expand {
position: relative;
2020-01-07 07:30:51 +00:00
&__content {
padding: 0 18px;
overflow: hidden;
max-height: 0;
border-radius: 0.25rem;
@include transition(all, 0.2s, ease);
@include themify($themes) {
background-color: themed('toc-body-background-color');
}
}
&__button {
2019-11-04 13:09:44 +00:00
cursor: pointer;
2020-01-07 07:30:51 +00:00
width: 100%;
margin: auto 0;
text-align: left;
outline: none;
border: none;
padding: 0.125rem;
margin-top: 1.5rem;
margin-bottom: 0.125rem;
font-size: 1rem;
font-family: $title-font;
border-radius: 0.25rem;
2019-11-04 13:09:44 +00:00
@include flexbox();
@include align-items(center);
2020-01-07 07:30:51 +00:00
@include themify($themes) {
color: inherit;
background-color: themed('toc-header-background-color');
@include on-event {
background-color: themed('toc-header-background-color-hover');
}
}
2019-11-04 13:09:44 +00:00
}
2020-01-07 07:30:51 +00:00
&-label {
cursor: pointer;
@include flexbox();
@include align-items(center);
2019-11-04 13:09:44 +00:00
}
2020-01-07 07:30:51 +00:00
&-icon {
padding-top: 0.125rem;
padding-right: 0.5rem;
&__down {
2019-11-04 13:09:44 +00:00
@include rotate(90);
2020-01-07 07:30:51 +00:00
@include transition(all, 0.15s, ease);
2019-11-04 13:09:44 +00:00
}
&__right {
@include rotate(0);
2020-01-07 07:30:51 +00:00
@include transition(all, 0.15s, ease);
2019-11-04 13:09:44 +00:00
}
}
}