Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix: missing rows cause extra spacing #230

Merged
merged 1 commit into from
Jul 10, 2024
Merged

Fix: missing rows cause extra spacing #230

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
234 changes: 119 additions & 115 deletions src/our-work.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,37 +27,39 @@ <h1 class="mt-4 mb-3">Building solutions that empower government services</h1>
<hr class="border border-100 border-dark border-half opacity-100 mb-1" />
<hr class="border border-100 border-dark border-half opacity-100 mb-1" />

<div class="container my-5 py-md-5 py-4">
<div class="offset-lg-1 col-lg-10 mb-md-4">
<span class="text-dark pill border-0 ps-0 pb-md-5 mb-md-3 pb-4 mb-3 d-inline-block">What we do</span>
<h2 class="text-dark mb-4">Our services</h2>

<div class="row pb-5 mb-5">
<div class="accordion" id="our-services-accordion">
{% for service in site.data.services %}
<div class="accordion-item">
<h2 class="accordion-header" id="our-services-{{ service.id }}">
<button
class="accordion-button fw-boldest collapsed"
type="button"
data-bs-toggle="collapse"
data-bs-target="#collapse-{{ service.id }}"
aria-expanded="false"
aria-controls="collapse-{{ service.id }}"
<div class="row">
<div class="container my-5 py-md-5 py-4">
<div class="offset-lg-1 col-lg-10 mb-md-4">
<span class="text-dark pill border-0 ps-0 pb-md-5 mb-md-3 pb-4 mb-3 d-inline-block">What we do</span>
<h2 class="text-dark mb-4">Our services</h2>

<div class="row pb-5 mb-5">
<div class="accordion" id="our-services-accordion">
{% for service in site.data.services %}
<div class="accordion-item">
<h2 class="accordion-header" id="our-services-{{ service.id }}">
<button
class="accordion-button fw-boldest collapsed"
type="button"
data-bs-toggle="collapse"
data-bs-target="#collapse-{{ service.id }}"
aria-expanded="false"
aria-controls="collapse-{{ service.id }}"
>
{{ service.name }}
</button>
</h2>
<div
id="collapse-{{ service.id }}"
class="accordion-collapse collapse"
aria-labelledby="our-services-{{ service.id }}"
data-bs-parent="#our-services-accordion"
>
{{ service.name }}
</button>
</h2>
<div
id="collapse-{{ service.id }}"
class="accordion-collapse collapse"
aria-labelledby="our-services-{{ service.id }}"
data-bs-parent="#our-services-accordion"
>
<div class="accordion-body">{{ service.description }}</div>
<div class="accordion-body">{{ service.description }}</div>
</div>
</div>
{% endfor %}
</div>
{% endfor %}
</div>
</div>
</div>
Expand All @@ -79,82 +81,57 @@ <h2 class="accordion-header" id="our-services-{{ service.id }}">
</section>

<section class="bg-w-100">
<div class="container my-5 py-md-5 py-4">
<div class="offset-lg-1 col-lg-7">
<span class="pill border-0 ps-0 pb-md-5 mb-md-3 pb-4 mb-3 d-inline-block">What we've done</span>
<h2 class="mb-4">Featured work</h2>
<p class="pb-5 mb-0 pb-lg-2 mb-lg-5">
Explore our list of projects ranging from local, regional, and state governments. We curate a variety of technology and
delivery solutions for our clients and have lasting successful outcomes.
</p>
</div>
<div class="row">
<div class="container my-5 py-md-5 py-4">
<div class="offset-lg-1 col-lg-7">
<span class="pill border-0 ps-0 pb-md-5 mb-md-3 pb-4 mb-3 d-inline-block">What we've done</span>
<h2 class="mb-4">Featured work</h2>
<p class="pb-5 mb-0 pb-lg-2 mb-lg-5">
Explore our list of projects ranging from local, regional, and state governments. We curate a variety of technology and
delivery solutions for our clients and have lasting successful outcomes.
</p>
</div>

<div class="offset-lg-1 col-lg-10 mb-md-4">
<div class="row row-cols-1 row-cols-lg-2 g-4">
{% for featured_work in site.data.featured_work limit: 2 %}
<div class="col">
<div class="card h-100 text-dark border-0">
<div class="card-body px-lg-5 mx-lg-3 py-lg-5 my-lg-5 pt-3 mt-3 pb-5 pb-3 px-4 px-2">
<div class="min-h-40">
{% if featured_work.tags %}
<div class="row row-cols-1 row-cols-lg-auto g-2 g-lg-1">
{% for tag in featured_work.tags %}
<div class="col">
<span class="pill pill-tag" aria-hidden="true">{{ tag }}</span>
<div class="offset-lg-1 col-lg-10 mb-md-4">
<div class="row row-cols-1 row-cols-lg-2 g-4">
{% for featured_work in site.data.featured_work limit: 2 %}
<div class="col">
<div class="card h-100 text-dark border-0">
<div class="card-body px-lg-5 mx-lg-3 py-lg-5 my-lg-5 pt-3 mt-3 pb-5 pb-3 px-4 px-2">
<div class="min-h-40">
{% if featured_work.tags %}
<div class="row row-cols-1 row-cols-lg-auto g-2 g-lg-1">
{% for tag in featured_work.tags %}
<div class="col">
<span class="pill pill-tag" aria-hidden="true">{{ tag }}</span>
</div>
{% endfor %}
</div>
{% endfor %}
{% endif %}
<h3 class="card-title fw-boldest pb-4 mb-0 pb-lg-2 mb-lg-5 pt-2 pt-lg-0 mt-4">{{ featured_work.title }}</h3>
</div>
<div class="min-h-35">
<p class="card-text pb-2 mb-5">{{ featured_work.description }}</p>
</div>
{% endif %}
<h3 class="card-title fw-boldest pb-4 mb-0 pb-lg-2 mb-lg-5 pt-2 pt-lg-0 mt-4">{{ featured_work.title }}</h3>
</div>
<div class="min-h-35">
<p class="card-text pb-2 mb-5">{{ featured_work.description }}</p>
</div>

<div>
<h4 class="pill fs-8 text-dark fw-boldest ps-0">Outcome</h4>
<p class="card-text">{{ featured_work.outcome }}</p>
</div>
</div>
</div>
</div>
{% endfor %}
</div>

<div class="row row-cols-1 g-4 mt-0">
{% for featured_work in site.data.featured_work limit: 2 offset: 2 %} {% if forloop.index0 == 0 %} {% assign class = "col"
%} {% else %} {% assign class = "col collapseMore collapse" %} {% endif %}

<div class="{{ class }}">
<div class="card h-100 text-dark border-0">
<img src="{{ featured_work.image }}" class="card-img-top" alt="{{ featured_work.image_alt_text }}" />
<div class="card-body px-4 mx-2 p-lg-5 m-lg-2 mb-5 mb-lg-4">
{% if featured_work.tags %}
<div class="row row-cols-1 row-cols-lg-auto g-2 g-lg-1">
{% for tag in featured_work.tags %}
<div class="col">
<span class="pill pill-tag" aria-hidden="true">{{ tag }}</span>
<div>
<h4 class="pill fs-8 text-dark fw-boldest ps-0">Outcome</h4>
<p class="card-text">{{ featured_work.outcome }}</p>
</div>
{% endfor %}
</div>
{% endif %}
<h3 class="card-title fw-boldest pt-5 mt-3 mb-4 mt-lg-2">{{ featured_work.title }}</h3>
<p class="card-text pb-2 mb-4 pb-lg-0">{{ featured_work.description }}</p>

<h4 class="pill fs-8 p-0 mb-3 text-dark fw-boldest">Outcome</h4>
<p class="card-text">{{ featured_work.outcome }}</p>
</div>
</div>
{% endfor %}
</div>
{% endfor %}
</div>

<div class="row row-cols-1 row-cols-lg-2 g-4 mt-0">
{% for featured_work in site.data.featured_work limit: 2 offset: 4 %}
<div class="col collapseMore collapse">
<div class="card h-100 text-dark border-0">
<div class="card-body px-lg-5 mx-lg-3 py-lg-5 my-lg-5 pt-3 mt-3 pb-5 pb-3 px-4 px-2">
<div class="min-h-40">
<div class="row row-cols-1 g-4 mt-0">
{% for featured_work in site.data.featured_work limit: 2 offset: 2 %} {% if forloop.index0 == 0 %} {% assign class =
"col" %} {% else %} {% assign class = "col collapseMore collapse" %} {% endif %}

<div class="{{ class }}">
<div class="card h-100 text-dark border-0">
<img src="{{ featured_work.image }}" class="card-img-top" alt="{{ featured_work.image_alt_text }}" />
<div class="card-body px-4 mx-2 p-lg-5 m-lg-2 mb-5 mb-lg-4">
{% if featured_work.tags %}
<div class="row row-cols-1 row-cols-lg-auto g-2 g-lg-1">
{% for tag in featured_work.tags %}
Expand All @@ -164,33 +141,60 @@ <h4 class="pill fs-8 p-0 mb-3 text-dark fw-boldest">Outcome</h4>
{% endfor %}
</div>
{% endif %}
<h3 class="card-title fw-boldest pb-4 mb-0 pb-lg-2 mb-lg-5 pt-2 pt-lg-0 mt-4">{{ featured_work.title }}</h3>
</div>
<div class="min-h-35">
<p class="card-text pb-2 mb-5">{{ featured_work.description }}</p>
</div>
<h3 class="card-title fw-boldest pt-5 mt-3 mb-4 mt-lg-2">{{ featured_work.title }}</h3>
<p class="card-text pb-2 mb-4 pb-lg-0">{{ featured_work.description }}</p>

<div>
<h4 class="pill fs-8 text-dark fw-boldest ps-0">Outcome</h4>
<h4 class="pill fs-8 p-0 mb-3 text-dark fw-boldest">Outcome</h4>
<p class="card-text">{{ featured_work.outcome }}</p>
</div>
</div>
</div>
{% endfor %}
</div>
{% endfor %}
</div>
<div class="row pt-4 mt-lg-3">
<div class="col-lg-3">
<a
class="btn btn-primary btn-collapse-projects"
href="#"
data-bs-toggle="collapse"
data-bs-target=".collapseMore"
role="button"
aria-expanded="false"
aria-label="Toggle projects"
aria-controls="collapseMore"
></a>

<div class="row row-cols-1 row-cols-lg-2 g-4 mt-0">
{% for featured_work in site.data.featured_work limit: 2 offset: 4 %}
<div class="col collapseMore collapse">
<div class="card h-100 text-dark border-0">
<div class="card-body px-lg-5 mx-lg-3 py-lg-5 my-lg-5 pt-3 mt-3 pb-5 pb-3 px-4 px-2">
<div class="min-h-40">
{% if featured_work.tags %}
<div class="row row-cols-1 row-cols-lg-auto g-2 g-lg-1">
{% for tag in featured_work.tags %}
<div class="col">
<span class="pill pill-tag" aria-hidden="true">{{ tag }}</span>
</div>
{% endfor %}
</div>
{% endif %}
<h3 class="card-title fw-boldest pb-4 mb-0 pb-lg-2 mb-lg-5 pt-2 pt-lg-0 mt-4">{{ featured_work.title }}</h3>
</div>
<div class="min-h-35">
<p class="card-text pb-2 mb-5">{{ featured_work.description }}</p>
</div>

<div>
<h4 class="pill fs-8 text-dark fw-boldest ps-0">Outcome</h4>
<p class="card-text">{{ featured_work.outcome }}</p>
</div>
</div>
</div>
</div>
{% endfor %}
</div>
<div class="row pt-4 mt-lg-3">
<div class="col-lg-3">
<a
class="btn btn-primary btn-collapse-projects"
href="#"
data-bs-toggle="collapse"
data-bs-target=".collapseMore"
role="button"
aria-expanded="false"
aria-label="Toggle projects"
aria-controls="collapseMore"
></a>
</div>
</div>
</div>
</div>
Expand Down