Hi Tuan, thanks for getting back to me!
Here's a link to the website: https://tarantula-garlic-8dak.squarespace.com/config/design
And the codes that I used that I believe are somehow contradicting one another:
Code 1 (custom timeline) - Design-->Custom CSS:
.sqs-block-summary-v2 .summary-block-setting-design-list .summary-item {
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
.sqs-gallery-design-list .summary-content {
border-left: 2px solid #000000;
margin-left: -5%;
padding-bottom: 7%;
padding-left: 7%;
}
.sqs-gallery-design-list .sqs-gallery-image-container {
padding-right: 0;
}
@media screen and (max-width: 640px) {
.sqs-block-summary-v2 .summary-block-setting-design-list .summary-item.summary-item-record-type-video .summary-thumbnail-container, .sqs-block-summary-v2 .summary-block-setting-design-list .summary-thumbnail-outer-container {
width: 10% !important;
}
.sqs-gallery-design-list .sqs-gallery-design-list-slide:not(.no-image) .sqs-gallery-meta-container {
width: 90% !important;
}
}
Code 2 (accordion style FAQ) - Settings-->Advanced-->Code injection:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$('.markdown-block .sqs-block-content h3').addClass('ui-closed').css('cursor','pointer');
$('.markdown-block .sqs-block-content h3').css('cursor','pointer');
$(".markdown-block .sqs-block-content h3").nextUntil("h3").slideToggle();
$(".markdown-block .sqs-block-content h3").click(function() {
$(".markdown-block .sqs-block-content h3").nextUntil("h3").slideUp();
$(".markdown-block .sqs-block-content h3").removeClass('ui-open');
$(".markdown-block .sqs-block-content h3").addClass('ui-closed');
$(this).nextUntil("h3").slideDown();
$(this).toggleClass('ui-closed ui-open');
});
});
</script>
Code 2 (accordion style FAQ) - Design-->Custom CSS:
.markdown-block p {
margin-left:1.5em;
}
.markdown-block .ui-closed:before {
font-family:monospace;
content:"+ ";
}
.markdown-block .ui-open:before {
font-family:monospace;
content:"- ";
}