diff --git a/assets/_src/js/ascribe.js b/assets/_src/js/ascribe.js index a41d1e7..dcb32a6 100644 --- a/assets/_src/js/ascribe.js +++ b/assets/_src/js/ascribe.js @@ -2,7 +2,7 @@ $(document).ready(function(){ slider(); - featuredFAQ(); + faqToggle(); marketplaces(); tourNav(); mobileNav(); @@ -40,8 +40,8 @@ $(document).ready(function(){ }); } - function featuredFAQ() { - $('.faq--featured .faq__question').click(function() { + function faqToggle() { + $('.faq__question').click(function() { $(this).toggleClass('open'); $(this).next('.faq__answer').toggleClass('open'); }); diff --git a/assets/_src/less/ascribe/_faq.less b/assets/_src/less/ascribe/_faq.less index 838fba2..4e19975 100644 --- a/assets/_src/less/ascribe/_faq.less +++ b/assets/_src/less/ascribe/_faq.less @@ -1,60 +1,47 @@ .subtemplate--faq { - + padding-top: @spacer; + padding-bottom: @spacer; } .faq { - // reset default dl,dt,dd styles - &, - .faq__answer { - margin: 0; - padding: 0; - } - + margin-left: 20px; } .faq__title { margin-top: 0; } .faq__question { - &:extend(.h4); + &: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 { - &:not(:last-child) { - margin-bottom: @spacer; + display: none; + margin-bottom: @spacer; + margin-left: 0; + + &.open { + display: block; + max-height: 800px; } } -.faq--featured { - margin-left: 20px; +.faq--featured { .faq__question { color: @pink; - cursor: pointer; - - .caret { - margin-left: -20px; - margin-right: 10px; - } - - &.open .caret { - transform: rotate(90deg); - } - } - - .faq__answer { - transition: .2s ease-out; - height: 0; - opacity: 0; - margin-bottom: @spacer; - - &.open { - height: 100%; - opacity: 1; - max-height: 800px; - } } } diff --git a/controller/classes/Subtemplate.php b/controller/classes/Subtemplate.php index 20f94eb..9fc5318 100644 --- a/controller/classes/Subtemplate.php +++ b/controller/classes/Subtemplate.php @@ -667,7 +667,7 @@ class Subtemplate { $question = get_sub_field('question'); $answer = get_sub_field('answer'); - $featuredFAQ .= "
{$question}
+ $featuredFAQ .= "
{$question}
{$answer}
"; } @@ -684,7 +684,7 @@ class Subtemplate { $question = get_sub_field('question'); $answer = get_sub_field('answer'); - $regularFAQ .= "
{$question}
+ $regularFAQ .= "
{$question}
{$answer}
"; }