wp-theme/assets/_src/less/ascribe/_faq.less

114 lines
1.7 KiB
Plaintext

.section-faq {
padding-top: @spacer;
padding-bottom: @spacer;
}
.faq {
margin-left: 20px;
}
.faq__title {
&:extend(.h2);
margin-top: 0;
}
.faq__question {
&:extend(.bold);
display: block;
margin-top: 0;
margin-bottom: (@spacer / 2);
cursor: pointer;
.caret {
margin-left: -20px;
margin-right: 10px;
}
&.open .caret {
transform: rotate(90deg);
}
}
.faq__answer {
display: none;
margin-bottom: @spacer;
margin-left: 0;
&.open {
display: block;
max-height: 800px;
}
}
.faq--featured {
.faq__question {
color: @pink;
}
}
.caret {
display: inline-block;
width: 0;
height: 0;
border-style: solid;
border-width: 5px 0 5px 6px;
border-color: transparent transparent transparent @greySocial;
transition: .2s ease-out;
}
.grid__col--toc {
@media (@screen-sm) {
flex: 0 0 33% !important;
}
}
.grid__col--toc {
position: relative;
}
#toc {
margin-top: @spacer;
&.sticky {
position: fixed;
top: 0;
padding-top: @spacer;
}
ul {
&:extend(.list-unstyled all);
li,
a {
line-height: @line-height-base;
}
li {
display: inline-block;
@media (@screen-sm) {
display: block;
}
}
a {
&:extend(.h4);
color: @link-color;
display: block;
margin: 0;
padding: 8px 12px;
@media (@screen-sm) {
padding: 6px 0;
}
}
a:hover,
.toc-active a {
color: @link-hover-color;
}
}
}