Skip to content

Commit

Permalink
new and improved FAQ page + various other fixes
Browse files Browse the repository at this point in the history
  • Loading branch information
zipper3030 committed Oct 18, 2023
1 parent 81ce340 commit 7f662fd
Show file tree
Hide file tree
Showing 12 changed files with 145 additions and 49 deletions.
2 changes: 2 additions & 0 deletions _faqs/data.md
Original file line number Diff line number Diff line change
Expand Up @@ -3,3 +3,5 @@ title: "Data"
description: "How does the DHRIFT project handle my data?"
order: 6
---

Very carefully
2 changes: 1 addition & 1 deletion _includes/footer.html
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
<div class="container">
<div class="footer-inner">
<div class="logo">
<a href="{{ site.baseurl }}"><img width="{{ site.logo.desktop_width }}" height="{{ site.logo.desktop_height }}" alt="{{ site.title }}" src="{{ site.logo.light | relative_url }}" /></a>
<a href="https://dhrift.org"><img width="{{ site.logo.desktop_width }}" height="{{ site.logo.desktop_height }}" alt="{{ site.title }}" src="{{ site.logo.light | absolute_url }}" /></a>
</div>
<ul class="menu">
{% assign footermenu = site.data.menus.footer | sort: 'weight' %}
Expand Down
2 changes: 1 addition & 1 deletion _includes/header-home.html
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
<div class="container">
<div class="top-row">
<div class="logo">
<a href="{{ site.baseurl }}"><img width="{{ site.logo.desktop_width }}" height="{{ site.logo.desktop_height }}" alt="{{ site.title }}" src="{{ site.logo.desktop | relative_url }}" /></a>
<a href="https://dhrift.org"><img width="{{ site.logo.desktop_width }}" height="{{ site.logo.desktop_height }}" alt="{{ site.title }}" src="{{ site.logo.desktop | absolute_url }}" /></a>
</div>
<div class="navigation">
{% include main-menu.html %}
Expand Down
4 changes: 2 additions & 2 deletions _includes/header.html
Original file line number Diff line number Diff line change
Expand Up @@ -2,15 +2,15 @@
<div class="container">
<div class="top-row">
<div class="logo">
<a href="{{ site.baseurl }}"><img width="{{ site.logo.desktop_width }}" height="{{ site.logo.desktop_height }}" alt="{{ site.title }}" src="{{ site.logo.desktop | relative_url }}" /></a>
<a href="https://dhrift.org"><img width="{{ site.logo.desktop_width }}" height="{{ site.logo.desktop_height }}" alt="{{ site.title }}" src="{{ site.logo.desktop | absolute_url }}" /></a>
</div>
<div class="navigation">
{% include main-menu.html %}
{% include hamburger.html %}
</div>
</div>
<div class="page-name">
<span id="currentPageName"></span>
<h1 id="currentPageName"></h1>
</div>
</div>
</div>
4 changes: 2 additions & 2 deletions _includes/logo-banner.html
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,8 @@
<div class="container">
<div class="banner-container">
<img src="/images/logo/gcdi.png" alt="GCDI logo" class="partner">
<img src="/images/logo/neh.jpg" alt="NEH logo" class="partner">
<img src="/images/logo/gc_logo.png" alt="GC logo" class="partner">
<img src="/images/logo/NEH.png" alt="NEH logo" class="partner">
<img src="/images/logo/GC.svg" alt="GC logo" class="partner">
</div>
</div>
</div>
5 changes: 5 additions & 0 deletions _layouts/default.html
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,10 @@
<!-- Self host font -->
<!-- <link rel="preload" href="{{ '/assets/fonts/playfair-display.woff2' | relative_url }}" as="font" type="font/woff2" crossorigin> -->
<link href="{{ '/assets/css/style.css' | relative_url }}" rel="stylesheet">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>

{% if page.description %}<meta name="description" content="{{ page.description }}" />{% endif %}
{% if page.meta_title %}<meta property="og:title" content="{{ page.meta_title }}"/>{% else %}<meta property="og:title" content="{{ page.title }}"/>{% endif %}
Expand All @@ -38,6 +42,7 @@
{% endif %}
{{content}}
</div>
{% include logo-banner.html %}
{% include footer.html %}
{% include sub-footer.html %}
<script type="text/javascript" src="{{ '/assets/js/scripts.js' | relative_url }}"></script>
Expand Down
33 changes: 27 additions & 6 deletions _layouts/faq.html
Original file line number Diff line number Diff line change
@@ -1,15 +1,36 @@
---
layout: default
bodyClass: "page-service"
id: "faq-page"
---

<div class="container pt-0 pb-0">
<div class="row justify-content-start">
<div class="col-12 col-md-8">
<div class="service service-single">
<h1 class="title">{{page.title}}</h1>
<div class="content">{{content}}</div>
{% assign sorted_pages = site.faqs | sort: "order" %}

<div class="container pt-0">
<div class="row">
<div class="col-12">
{% for faq in sorted_pages %}
<div class="faq service-summary">
<div class="faq-content">
<div class="row">
<div class="col-10">
<h2 class="service-title faq-title">{{ faq.title }}</h2>
<p class="description">{{ faq.description }}</p>
</div>
<div class="col-2 text-right">
<button class="toggle-button rotate-icon" data-toggle="collapse" data-target="#faq-{{ forloop.index }}">
<i class="fa fa-angle-down fa-3x" aria-hidden="true"></i>
</button>
</div>
</div>
<div id="faq-{{ forloop.index }}" class="collapse">
<div class="answer">{{ faq.content }}</div>
</div>
</div>
</div>
{% endfor %}
</div>
</div>
</div>


74 changes: 57 additions & 17 deletions assets/css/style.scss
Original file line number Diff line number Diff line change
Expand Up @@ -122,7 +122,7 @@ ul li {
background-color: $dark-cream;
display: flex;
justify-content: space-between;
flex-direction: column
flex-direction: column;
}

// lighten up the header image a bit more with a gradient
Expand All @@ -147,7 +147,8 @@ ul li {
background-color: $dark-cream;
display: flex;
justify-content: space-between;
flex-direction: column
flex-direction: column;
width: 100%;
}

.header-home::before {
Expand All @@ -166,17 +167,19 @@ ul li {
.container {
display: flex;
justify-content: space-between;
align-items: center;
//align-items: center;
flex-direction: column;
width: 100%;
}

.header-home-content {
display: flex;
flex-direction: column;
width: 100%;
}

.logo-container {
margin-right: auto !important;
//margin-right: auto !important;
}

.top-row {
Expand All @@ -188,26 +191,33 @@ ul li {
}

.logo {
margin-right: auto;
//margin-right: auto;
img {
width: 500px;
height: auto;
}
}

.navigation {
margin-left: auto ;
//margin-left: auto ;
font-family: $font-family-heading !important;
}

.page-name {
text-align: center;
//font-weight: bold;
font-size: 3.2em;
font-size: 6em !important;
margin-top: 20px;
font-family: $font-family-heading;
font-family: $font-family-heading !important;
}

#currentPageName {
text-align: center;
font-weight: bold;
font-size: .6em !important;
margin-top: 20px;
font-family: $font-family-heading !important;
}
.main-menu ul li a {
font-size: 1.7em;
padding-right: 25px;
Expand Down Expand Up @@ -321,15 +331,15 @@ ul li {
//actions
#actions {
text-align: center;
margin: 30px 0;
//margin: 30px 0;
display: flex;
flex-direction: column;
align-items: center;
background-color: $secondary;
margin: 0;
//margin: 0;
padding: 0;
margin-bottom: 20px;
margin-top: 20px;
//margin-bottom: 20px;
//margin-top: 20px;
}

.action {
Expand Down Expand Up @@ -361,7 +371,7 @@ ul li {
justify-content: center;
flex-wrap: wrap;
gap: 80px;
margin-right: 55px;
margin-right: 32px;
align-items: flex-start;
}

Expand Down Expand Up @@ -427,23 +437,53 @@ ul li {

// partner logos banner
.banner {
// add background image
background-color: $dark-cream;
// add background image?
background-color: $primary;
color: #fff;
padding: 20px 0;
z-index: 1;
}

.banner-container {
display: flex;
align-items: center;
justify-content: center;
z-index: 2;
}

.partner {
margin: 0 30px;
max-width: 170px;
margin: 0 60px;
max-width: 350px;
max-height: fit-content;
}

// team page


// faq
.faq.service-summary {
border-bottom: 1px solid $peach;
padding-top: 15px;
padding-bottom: 15px;
margin-bottom: 15px;
}

.toggle-button {
border: none;
background: none;
color: $peach;
}

.rotate-icon .fa-angle-down {
transition: transform 0.3s;
}

.rotate-icon[aria-expanded="true"] .fa-angle-down {
transform: rotate(180deg);
}

.faq-title {
font-family: $font-family-base !important;
color: $primary !important;
font-weight: bold;
}
33 changes: 19 additions & 14 deletions assets/js/updatePageName.js
Original file line number Diff line number Diff line change
@@ -1,15 +1,20 @@
// get the current page url and name and update the page name in the header

document.addEventListener("DOMContentLoaded", function () {
let currentPageURL = window.location.pathname;

currentPageURL = currentPageURL.replace(/\/$/, '');

let pageName = currentPageURL.split("/").pop().replace(".html", "");
pageName = pageName.charAt(0).toUpperCase() + pageName.slice(1);

let currentPageNameElement = document.getElementById("currentPageName");
if (currentPageNameElement) {
currentPageNameElement.textContent = pageName;
}
});
let currentPageURL = window.location.pathname;

currentPageURL = currentPageURL.replace(/\/$/, '');

let pageName = currentPageURL.split("/").pop().replace(".html", "");
pageName = pageName.charAt(0).toUpperCase() + pageName.slice(1);

//changing faq doesn't seem to be working for some reason, unsure why :(
if (pageName.toLowerCase() === "faq") {
pageName = "Frequently Asked Questions";
console.log("pageName: " + pageName);
}

let currentPageNameElement = document.getElementById("currentPageName");
if (currentPageNameElement) {
currentPageNameElement.textContent = pageName;
}
});

9 changes: 3 additions & 6 deletions faq.md
Original file line number Diff line number Diff line change
@@ -1,8 +1,5 @@
---
title: FAQs
layout: faqs
description: Frequently Asked Questions
intro_image_absolute: true
intro_image_hide_on_mobile: true
layout: faq
title: "FAQ"
permalink: /faq/
---

26 changes: 26 additions & 0 deletions images/logo/GC.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added images/logo/NEH.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.

0 comments on commit 7f662fd

Please sign in to comment.