From b0b62bc06228693291b5126f647b5b2611036193 Mon Sep 17 00:00:00 2001 From: Andrew Gioia Date: Wed, 29 Apr 2026 13:56:08 -0400 Subject: [PATCH] Homepage v1 done with case study list handling; improvements to icon partial --- assets/css/site.css | 692 ++++++++++++++------- assets/img/kangaroo.svg | 1 - content/_index.md | 4 +- content/studies/legacy/img/card-legacy.png | Bin 0 -> 108816 bytes content/studies/legacy/index.md | 21 +- layouts/_default/baseof.html | 6 +- layouts/_default/study.html | 51 +- layouts/index.html | 85 ++- layouts/partials/footer.html | 1 + layouts/partials/icon.html | 5 +- static/img/home.svg | 1 + static/js/main.js | 11 +- 12 files changed, 583 insertions(+), 295 deletions(-) delete mode 100644 assets/img/kangaroo.svg create mode 100644 content/studies/legacy/img/card-legacy.png create mode 100644 static/img/home.svg diff --git a/assets/css/site.css b/assets/css/site.css index cace71a..65921fe 100644 --- a/assets/css/site.css +++ b/assets/css/site.css @@ -12,11 +12,10 @@ --yellow-body: #E29900; --red: #eb452b; --red-body: #de342a; - --blue: #3157AE; /*#2F4C8E;*/ - --blue-body: #0070C0; + --blue: #0070C0; --black: #272727; --bg1: #E5DAD2; - --green-body: #03A653; + --green: #03A653; --darkcyan: #008694; @@ -51,7 +50,7 @@ a { color: inherit; font-weight: 500; text-decoration: underline; - text-decoration-thickness: 1.5px; + text-decoration-thickness: 0.1rem; text-underline-offset: 0.2rem; &:hover { @@ -60,13 +59,17 @@ a { text-decoration-thickness: 1.5px; text-underline-offset: 0.2rem; } + + &[in] { + text-decoration-style: dotted; + } } h1 { font-size: clamp(2.25rem, 9dvw, 4rem); font-weight: 700; letter-spacing: -0.5px; - line-height: 1; + line-height: 1.05; margin: 0 0 1rem; } @@ -249,16 +252,18 @@ body { /* *
is case study wrapper and includes: - * 1.
is the initial full screen pane + * 1.
is the initial full screen pane * 2.
diff --git a/layouts/_default/study.html b/layouts/_default/study.html index 3254043..e90d358 100644 --- a/layouts/_default/study.html +++ b/layouts/_default/study.html @@ -1,36 +1,17 @@ {{- define "main" -}} - {{- $heroImage := "" -}} - {{- $heroInlineSvg := "" -}} - {{- with .Params.hero.image -}} + {{- $svg := "" -}} + {{- with .Params.hero.svg -}} {{- $match := $.Resources.GetMatch . -}} {{- if not $match -}} {{- $match = $.Resources.GetMatch (printf "img/%s" .) -}} {{- end -}} {{- with $match -}} - {{- $heroImage = .RelPermalink -}} - {{- end -}} - {{- end -}} - {{- with .Params.hero.inline_svg -}} - {{- $match := $.Resources.GetMatch . -}} - {{- if not $match -}} - {{- $match = $.Resources.GetMatch (printf "img/%s" .) -}} - {{- end -}} - {{- with $match -}} - {{- $heroInlineSvg = .Content -}} + {{- $svg = .Content -}} {{- end -}} {{- end -}} - -
- {{- with .Params.hero.tags -}} - - {{- end -}} +
+

{{ with .Params.hero.title }}{{ . }}{{ else }}{{ .Title }}{{ end }}

{{- with .Params.hero.deck -}}

{{ . | markdownify }}

@@ -38,31 +19,30 @@ {{- if and (not .Params.hero.deck) .Summary -}}

{{ .Summary | markdownify }}

{{- end -}} -
- + {{- with .Params.study -}} {{- end -}} - {{- with $heroInlineSvg -}} + {{- with $svg -}} {{ . | safeHTML }} {{- end -}} -
+
{{- with .Params.study.toc -}} -
-{{- end -}} +{{- end -}} \ No newline at end of file diff --git a/layouts/index.html b/layouts/index.html index f8ebd49..6cb460b 100644 --- a/layouts/index.html +++ b/layouts/index.html @@ -1,25 +1,64 @@ -{{ define "main" }} -
-

Portfolio

-

Case studies with room for the full story.

+{{- define "main" -}} +
+
+

+ Principle product designer building thoughtful and accessible interfaces. +

- A custom Hugo setup for showcasing product and UX work without relying on a theme. + 20 years experience designing and building software for the browser. I balance intentional design principles with a mastery of CSS, HTML, JavaScript, & WCAG to bridge design and engineering. Performance, accessibility, and the semantic web still matter!

-
- -
-
-

Selected work

-

Current case studies

-
-
- {{ range where .Site.RegularPages "Section" "studies" }} -
-

{{ with .Params.hero.title }}{{ . }}{{ else }}{{ .Title }}{{ end }}

-

{{ .Title }}

-

{{ .Summary }}

-
- {{ end }} -
-
-{{ end }} +

+ Read more about my design philosophy or take a look at some case studies below. +

+ +
+
+
+
+
+ +
+

Case studies

+ {{ range where .Site.RegularPages "Section" "studies" }} + {{- $page := . -}} + {{- $cardImage := "" -}} + {{- with .Params.list.img -}} + {{- $match := $page.Resources.GetMatch . -}} + {{- if not $match -}} + {{- $match = $page.Resources.GetMatch (printf "img/%s" .) -}} + {{- end -}} + {{- with $match -}} + {{- $cardImage = .RelPermalink -}} + {{- end -}} + {{- end -}} + + +

{{ .Title }}

+

{{ .Summary }}

+ {{ with .Params.list.more }}

{{ . }}

{{ end }} + {{- with .Params.study.facts -}} +
+ {{- range . -}} + {{- if or (eq .label "Role") (eq .label "Tools") (eq .label "Industry") -}} + {{- $fact := . -}} + {{- $iconColor := "" -}} + {{- range $page.Params.list.facts -}} + {{- if eq (lower .key) (lower $fact.label) -}} + {{- $iconColor = .color -}} + {{- end -}} + {{- end -}} +
+ {{- with $fact.icon -}} + {{ partial "icon.html" (dict "name" . "color" $iconColor) }} + {{- end -}} +
{{ $fact.value | markdownify }}
+
+ {{- end -}} + {{- end -}} +
+ {{- end -}} + + + {{- end -}} +
+{{ end }} \ No newline at end of file diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html index c65bbba..c26d026 100644 --- a/layouts/partials/footer.html +++ b/layouts/partials/footer.html @@ -26,6 +26,7 @@ {{- end -}}
+ {{ if eq (len $footnotes) 0 }}Ag{{ end }}

This is the design portfolio for Andrew Gioia, co-founder of TeachBoost and current Staff Designer at SchoolStatus.

{{ partial "icon.html" (dict "name" "cc") }} 2026 BY-NC-ND. Please share this responsibly.
diff --git a/layouts/partials/icon.html b/layouts/partials/icon.html index 73c4f11..65833ae 100644 --- a/layouts/partials/icon.html +++ b/layouts/partials/icon.html @@ -1,11 +1,12 @@ {{- $name := .name | default . -}} {{- $class := .class -}} {{- $label := .label -}} +{{- $color := .color -}} {{- $path := printf "icons/%s.svg" $name -}} {{- with resources.Get $path -}} -