Skip to content

Commit 5c3d383

Browse files
author
Daniel Precioso, PhD
committed
Add project category tagging and styles for outreach events
1 parent 7340942 commit 5c3d383

4 files changed

Lines changed: 99 additions & 70 deletions

File tree

‎layouts/_default/single.html‎

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -276,10 +276,17 @@ <h2 class="text-2xl font-bold tracking-tight text-slate-900 dark:text-slate-100"
276276
{{ if gt (len $relatedOutreach) 0 }}
277277
<section class="mx-auto mt-12 max-w-5xl">
278278
<h2 class="text-2xl font-bold tracking-tight text-slate-900 dark:text-slate-100">Related Outreach</h2>
279+
{{ partial "components/project-category-tag-styles.html" . }}
279280
<div class="mt-4 space-y-3">
280281
{{ range $relatedOutreach }}
282+
{{ $categoryMeta := partial "functions/outreach-category-meta.html" (dict "event" .) }}
283+
{{ $categoryClass := index $categoryMeta "class" }}
284+
{{ $categoryLabel := index $categoryMeta "label" }}
281285
<article class="rounded-lg border border-slate-200/80 p-4 dark:border-slate-700/80">
282-
<a href="{{ .RelPermalink }}" class="text-lg font-semibold text-slate-900 hover:text-primary-600 dark:text-slate-100 dark:hover:text-primary-400">{{ .Title }}</a>
286+
<div class="flex flex-wrap items-start justify-between gap-2">
287+
<a href="{{ .RelPermalink }}" class="text-lg font-semibold text-slate-900 hover:text-primary-600 dark:text-slate-100 dark:hover:text-primary-400">{{ .Title }}</a>
288+
<span class="project-category-tag category-default {{ $categoryClass }}">{{ $categoryLabel }}</span>
289+
</div>
283290
<div class="mt-1 text-sm text-slate-600 dark:text-slate-300">
284291
{{ if .Date }}{{ .Date | time.Format "2006-01-02" }}{{ end }}
285292
{{ with .Params.event }} · {{ . | markdownify | plainify }}{{ end }}

‎layouts/event/list.html‎

Lines changed: 5 additions & 69 deletions
Original file line numberDiff line numberDiff line change
@@ -117,17 +117,6 @@ <h1 class="lg:text-6xl">{{ .Title }}</h1>
117117
text-underline-offset: 3px;
118118
}
119119

120-
.project-category-tag {
121-
padding: 0.33rem 0.72rem;
122-
border-radius: 9999px;
123-
font-size: 0.72rem;
124-
font-weight: 600;
125-
text-transform: uppercase;
126-
letter-spacing: 0.045em;
127-
box-shadow: 0 2px 8px rgba(2, 6, 23, 0.24);
128-
white-space: nowrap;
129-
}
130-
131120
.project-description {
132121
margin: 0;
133122
color: rgb(71, 85, 105);
@@ -137,27 +126,10 @@ <h1 class="lg:text-6xl">{{ .Title }}</h1>
137126
.dark .project-description {
138127
color: rgb(203, 213, 225);
139128
}
140-
141-
.category-energy { background-color: #f59e0b; color: white; }
142-
.category-maritime { background-color: #3b82f6; color: white; }
143-
.category-marketing { background-color: #ec4899; color: white; }
144-
.category-health { background-color: #10b981; color: white; }
145-
.category-transport { background-color: #8b5cf6; color: white; }
146-
.category-manufacturing { background-color: #f97316; color: white; }
147-
.category-insurance { background-color: #0ea5e9; color: white; }
148-
.category-fintech { background-color: #14b8a6; color: white; }
149-
.category-legaltech { background-color: #6366f1; color: white; }
150-
.category-talk { background-color: #2563eb; color: white; }
151-
.category-seminar { background-color: #0f766e; color: white; }
152-
.category-workshop { background-color: #4f46e5; color: white; }
153-
.category-conference { background-color: #7c3aed; color: white; }
154-
.category-interview { background-color: #db2777; color: white; }
155-
.category-media { background-color: #ea580c; color: white; }
156-
.category-research { background-color: #0891b2; color: white; }
157-
.category-outreach { background-color: #4338ca; color: white; }
158-
.category-default { background-color: #6b7280; color: white; }
159129
</style>
160130

131+
{{ partial "components/project-category-tag-styles.html" . }}
132+
161133
<div class="flex flex-col items-center">
162134
<div class="flex-auto">
163135
<div class="sm:px-8">
@@ -169,44 +141,9 @@ <h1 class="lg:text-6xl">{{ .Title }}</h1>
169141
{{ range $paginator.Pages }}
170142
{{ $event := . }}
171143
{{ $description := $event.Params.summary | default $event.Params.abstract | default $event.Params.description }}
172-
{{ $category := $event.Params.category }}
173-
174-
{{ if not $category }}
175-
{{ with $event.Params.projects }}
176-
{{ $projectRef := printf "%v" (index . 0) }}
177-
{{ $projectSlug := replaceRE "^.*/" "" $projectRef }}
178-
{{ $projectPage := or ($event.Site.GetPage (printf "/industry/%s" $projectSlug)) ($event.Site.GetPage (printf "/research/%s" $projectSlug)) }}
179-
{{ with $projectPage }}
180-
{{ with .Params.category }}
181-
{{ $category = . }}
182-
{{ else }}
183-
{{ $category = .CurrentSection.Title | default (humanize .Type) }}
184-
{{ end }}
185-
{{ end }}
186-
{{ end }}
187-
{{ end }}
188-
189-
{{ if not $category }}
190-
{{ if in $event.Params.tags "media" }}
191-
{{ $category = "Media" }}
192-
{{ else if in $event.Params.tags "interview" }}
193-
{{ $category = "Interview" }}
194-
{{ else if in $event.Params.tags "workshop" }}
195-
{{ $category = "Workshop" }}
196-
{{ else if in $event.Params.tags "seminar" }}
197-
{{ $category = "Seminar" }}
198-
{{ else if in $event.Params.tags "conference" }}
199-
{{ $category = "Conference" }}
200-
{{ else if in $event.Params.tags "talk" }}
201-
{{ $category = "Talk" }}
202-
{{ else if gt (len $event.Params.tags) 0 }}
203-
{{ $category = title (index $event.Params.tags 0) }}
204-
{{ else }}
205-
{{ $category = "Outreach" }}
206-
{{ end }}
207-
{{ end }}
208-
209-
{{ $categoryClass := print "category-" (lower (replace $category " " "-")) }}
144+
{{ $categoryMeta := partial "functions/outreach-category-meta.html" (dict "event" $event) }}
145+
{{ $categoryClass := index $categoryMeta "class" }}
146+
{{ $categoryLabel := index $categoryMeta "label" }}
210147
<article class="project-row group">
211148
<a href="{{ $event.RelPermalink }}" class="project-media">
212149
<div class="project-image-zoom">
@@ -224,7 +161,6 @@ <h1 class="lg:text-6xl">{{ .Title }}</h1>
224161
<h3 class="project-row-title">
225162
<a href="{{ $event.RelPermalink }}" class="project-row-title-link">{{ $event.Title }}</a>
226163
</h3>
227-
{{ $categoryLabel := title (replace (replace $category "-" " ") "_" " ") }}
228164
<span class="project-category-tag category-default {{ $categoryClass }}">{{ $categoryLabel }}</span>
229165
</div>
230166

‎layouts/partials/components/project-category-tag-styles.html‎

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
<style>
2+
.project-category-tag {
3+
padding: 0.33rem 0.72rem;
4+
border-radius: 9999px;
5+
font-size: 0.72rem;
6+
font-weight: 600;
7+
text-transform: uppercase;
8+
letter-spacing: 0.045em;
9+
box-shadow: 0 2px 8px rgba(2, 6, 23, 0.24);
10+
white-space: nowrap;
11+
}
12+
13+
.category-default { background-color: #6b7280; color: white; }
14+
.category-energy { background-color: #f59e0b; color: white; }
15+
.category-maritime { background-color: #3b82f6; color: white; }
16+
.category-marketing { background-color: #ec4899; color: white; }
17+
.category-health { background-color: #10b981; color: white; }
18+
.category-transport { background-color: #8b5cf6; color: white; }
19+
.category-manufacturing { background-color: #f97316; color: white; }
20+
.category-insurance { background-color: #0ea5e9; color: white; }
21+
.category-fintech { background-color: #14b8a6; color: white; }
22+
.category-legaltech { background-color: #6366f1; color: white; }
23+
.category-talk { background-color: #2563eb; color: white; }
24+
.category-seminar { background-color: #0f766e; color: white; }
25+
.category-workshop { background-color: #4f46e5; color: white; }
26+
.category-conference { background-color: #7c3aed; color: white; }
27+
.category-interview { background-color: #db2777; color: white; }
28+
.category-media { background-color: #ea580c; color: white; }
29+
.category-research { background-color: #0891b2; color: white; }
30+
.category-academic-research { background-color: #0891b2; color: white; }
31+
.category-outreach { background-color: #4338ca; color: white; }
32+
</style>

‎layouts/partials/functions/outreach-category-meta.html‎

Lines changed: 54 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
1+
{{- $event := .event -}}
2+
{{- $category := $event.Params.category -}}
3+
4+
{{- if not $category -}}
5+
{{- with $event.Params.projects -}}
6+
{{- $projectRef := "" -}}
7+
{{- if reflect.IsSlice . -}}
8+
{{- if gt (len .) 0 -}}
9+
{{- $projectRef = printf "%v" (index . 0) -}}
10+
{{- end -}}
11+
{{- else -}}
12+
{{- $projectRef = printf "%v" . -}}
13+
{{- end -}}
14+
15+
{{- if $projectRef -}}
16+
{{- $projectSlug := replaceRE "^.*/" "" $projectRef -}}
17+
{{- $projectPage := or ($event.Site.GetPage (printf "/industry/%s" $projectSlug)) ($event.Site.GetPage (printf "/research/%s" $projectSlug)) -}}
18+
{{- with $projectPage -}}
19+
{{- with .Params.category -}}
20+
{{- $category = . -}}
21+
{{- else -}}
22+
{{- $category = .CurrentSection.Title | default (humanize .Type) -}}
23+
{{- end -}}
24+
{{- end -}}
25+
{{- end -}}
26+
{{- end -}}
27+
{{- end -}}
28+
29+
{{- if not $category -}}
30+
{{- $tags := $event.Params.tags | default (slice) -}}
31+
{{- if in $tags "media" -}}
32+
{{- $category = "media" -}}
33+
{{- else if in $tags "interview" -}}
34+
{{- $category = "interview" -}}
35+
{{- else if in $tags "workshop" -}}
36+
{{- $category = "workshop" -}}
37+
{{- else if in $tags "seminar" -}}
38+
{{- $category = "seminar" -}}
39+
{{- else if in $tags "conference" -}}
40+
{{- $category = "conference" -}}
41+
{{- else if in $tags "talk" -}}
42+
{{- $category = "talk" -}}
43+
{{- else if gt (len $tags) 0 -}}
44+
{{- $category = index $tags 0 -}}
45+
{{- else -}}
46+
{{- $category = "outreach" -}}
47+
{{- end -}}
48+
{{- end -}}
49+
50+
{{- $categoryValue := printf "%v" $category -}}
51+
{{- $categoryClass := print "category-" (lower (replace (replace $categoryValue "_" "-") " " "-")) -}}
52+
{{- $categoryLabel := title (replace (replace (replace $categoryValue "-" " ") "_" " ") "/" " ") -}}
53+
54+
{{- return (dict "value" $categoryValue "class" $categoryClass "label" $categoryLabel) -}}

0 commit comments

Comments
 (0)