From 7b3aff07a70056bb7da2715f95fec436236fbdce Mon Sep 17 00:00:00 2001
From: George Cushen <gcushen@users.noreply.github.com>
Date: Fri, 8 Jan 2021 18:50:55 +0000
Subject: [PATCH] feat: migrate to latest web best practices

Improve accessibility, informed by Google Lighthouse insights.

Part 3
---
 wowchemy/assets/scss/wowchemy/_search.scss           | 3 +++
 wowchemy/assets/scss/wowchemy/_widgets.scss          | 6 +++++-
 wowchemy/layouts/partials/portfolio_li_showcase.html | 4 ++--
 3 files changed, 10 insertions(+), 3 deletions(-)

diff --git a/wowchemy/assets/scss/wowchemy/_search.scss b/wowchemy/assets/scss/wowchemy/_search.scss
index aa03249f..d9c07de3 100644
--- a/wowchemy/assets/scss/wowchemy/_search.scss
+++ b/wowchemy/assets/scss/wowchemy/_search.scss
@@ -165,6 +165,9 @@
 .sidebar-search-text {
   flex-grow: 1;
   text-align: left;
+  // Multilingual safe option to prevent long placeholders overflowing search box.
+  overflow: hidden;
+  font-size: .8rem;
 }
 
 .sidebar-search-shortcut {
diff --git a/wowchemy/assets/scss/wowchemy/_widgets.scss b/wowchemy/assets/scss/wowchemy/_widgets.scss
index acfa8bf9..8ac334be 100644
--- a/wowchemy/assets/scss/wowchemy/_widgets.scss
+++ b/wowchemy/assets/scss/wowchemy/_widgets.scss
@@ -143,7 +143,11 @@
 .section-heading p {
   font-weight: 400;
   font-size: 1.1rem;
-  color: #b2b2b2;
+  color: rgba(0,0,0,0.54);  // Accessible contrast, matching footer text color.
+}
+
+.dark .section-heading p {
+  color: rgb(158, 158, 158);
 }
 
 /*************************************************
diff --git a/wowchemy/layouts/partials/portfolio_li_showcase.html b/wowchemy/layouts/partials/portfolio_li_showcase.html
index 2480a988..e7e5e976 100644
--- a/wowchemy/layouts/partials/portfolio_li_showcase.html
+++ b/wowchemy/layouts/partials/portfolio_li_showcase.html
@@ -31,11 +31,11 @@
 <div class="col-lg-12 project-item isotope-item {{ $js_tag_classes | safeHTMLAttr }}">
   <div class="row align-items-center">
     <div class="col-12 col-md-6">
-      <h3 class="article-title mb-0 mt-0">
+      <div class="section-subheading article-title mb-0 mt-0">
         {{- if $do_link}}<a href="{{ $link }}" {{ $target | safeHTMLAttr }}>{{end -}}
         {{ $item.Title | markdownify | emojify }}
         {{- if $do_link}}</a>{{end -}}
-      </h3>
+      </div>
 
       {{ with $summary }}
       <div class="article-style">