hmn
/
hmn
4
Fork 9
Code Issues 59 Pull Requests 1 Releases Activity

Fixed style and links for vis jam

This commit is contained in:
Asaf Gartner 2023-04-11 17:38:32 +03:00
parent 4651e8a477
commit ef16a4f3e0
4 changed files with 75 additions and 67 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

128
src/templates/src/jam_2023_visibility.html
View File

@ -16,75 +16,77 @@ $discordInviteURL := "https://discord.gg/hmn" }}
} }
</style> </style>
<div id="top-container" class="flex flex-column items-center ph3"> <div>
<img id="logo" src="{{ static "visjam2023/logo.svg" }}"> <div id="top-container" class="flex flex-column items-center ph3">
<h1 id="title">Visibility Jam</h1> <img id="logo" src="{{ static "visjam2023/logo.svg" }}">
<h2 id="dates">April 14 - 16, 2O23</h2> <h1 id="title">Visibility Jam</h1>
<div id="tagline" class="center"> <h2 id="dates">April 14 - 16, 2O23</h2>
See things in a new way. <div id="tagline" class="center">
{{ if gt .DaysUntilEnd 0 }} See things in a new way.
{{ if eq .DaysUntilStart 0 }} {{ if gt .DaysUntilEnd 0 }}
<b>Happening now.</b> {{ if eq .DaysUntilStart 0 }}
{{ else if eq .DaysUntilStart 1 }} <b>Happening now.</b>
<b>Starting tomorrow.</b> {{ else if eq .DaysUntilStart 1 }}
{{ else }} <b>Starting tomorrow.</b>
<b>Starting in {{ .DaysUntilStart }} days.</b> {{ else }}
{{ end }} <b>Starting in {{ .DaysUntilStart }} days.</b>
{{ end }} {{ end }}
</div> {{ end }}
<div class="actions flex justify-center"> </div>
{{ if gt .DaysUntilStart 0 }} <div class="actions flex justify-center">
<a {{ if gt .DaysUntilStart 0 }}
class="ba b--white br2 pv2 pv3-ns ph3 ph4-ns"
href="#inspiration"
>Get inspired</a
>
{{ else if gt .DaysUntilEnd 0 }}
{{ if .SubmittedProjectUrl }}
<a <a
class="ba b--white br2 pv2 pv3-ns ph3 ph4-ns" class="ba b--white br2 pv2 pv3-ns ph3 ph4-ns"
target="_blank" href="#inspiration"
href="{{ .SubmittedProjectUrl }}" >Get inspired</a
>Share your progress</a
> >
{{ else }} {{ else if gt .DaysUntilEnd 0 }}
{{ if .SubmittedProjectUrl }}
<a
class="ba b--white br2 pv2 pv3-ns ph3 ph4-ns"
target="_blank"
href="{{ .SubmittedProjectUrl }}"
>Share your progress</a
>
{{ else }}
<a
class="ba b--white br2 pv2 pv3-ns ph3 ph4-ns ml3"
target="_blank"
href="{{ .ProjectSubmissionUrl }}"
>Create your project</a
>
{{ end }}
{{ else }}
<a <a
class="ba b--white br2 pv2 pv3-ns ph3 ph4-ns ml3" class="ba b--white br2 pv2 pv3-ns ph3 ph4-ns ml3"
target="_blank" href="{{ .ShowcaseFeedUrl }}"
href="{{ .ProjectSubmissionUrl }}" >See the results</a
>Create your project</a
> >
{{ end }} {{ end }}
{{ else }} <a
<a
class="ba b--white br2 pv2 pv3-ns ph3 ph4-ns ml3" class="ba b--white br2 pv2 pv3-ns ph3 ph4-ns ml3"
href="{{ .ShowcaseFeedUrl }}" target="_blank"
>See the results</a href="{{ $discordInviteURL }}"
> >Join the Discord</a
{{ end }} >
<a </div>
class="ba b--white br2 pv2 pv3-ns ph3 ph4-ns ml3" </div>
target="_blank"
href="{{ $discordInviteURL }}"
>Join the Discord</a
>
</div>
</div>
<div class="section mw8 margin-center ph3 ph4-l mv4"> <div class="section mw8 margin-center ph3 ph4-l mv4">
<p> <p>
Too many things in computing are <b>invisible</b>. Too many things in computing are <b>invisible</b>.
</p> </p>
<p> <p>
Bugs linger for years because nobody can see their effects. We run arcane command line tools just to find out what port a program is using. Your computer is full of helpful information, but no one can use it until someone <b>makes it visible.</b> Bugs linger for years because nobody can see their effects. We run arcane command line tools just to find out what port a program is using. Your computer is full of helpful information, but no one can use it until someone <b>makes it visible.</b>
</p> </p>
<p> <p>
So for this jam, make it visible. Maybe it's a data structure in your program. Maybe it's some obscure metrics from your operating system. Maybe it's your sleep schedule. Whether you make a Graphviz diagram or an experimental code editor, you have a weekend to make it happen. So for this jam, make it visible. Maybe it's a data structure in your program. Maybe it's some obscure metrics from your operating system. Maybe it's your sleep schedule. Whether you make a Graphviz diagram or an experimental code editor, you have a weekend to make it happen.
</p> </p>
</div>
</div> </div>
{{ if eq .DaysUntilEnd 0 }} {{ if eq .DaysUntilEnd 0 }}
<div class="section bg-black-20 pv4 overflow-hidden"> <div class="section pv4 overflow-hidden">
<div class="mw8 margin-center ph3 ph4-l"> <div class="mw8 margin-center ph3 ph4-l">
<h2>Submitted projects</h2> <h2>Submitted projects</h2>
<div class="mt3 projects g3 back-to-normal"> <div class="mt3 projects g3 back-to-normal">
@ -100,7 +102,7 @@ $discordInviteURL := "https://discord.gg/hmn" }}
</div> </div>
</div> </div>
{{ else if and (eq .DaysUntilStart 0) (not (eq .ShowcaseJson "[]")) }} {{ else if and (eq .DaysUntilStart 0) (not (eq .ShowcaseJson "[]")) }}
<div id="showcase-outer-container" class="bg-black-20 pt4 pb3 pb4-ns"> <div id="showcase-outer-container" class="pt4 pb3 pb4-ns">
<div class="section mw8 margin-center ph3 ph4-l"> <div class="section mw8 margin-center ph3 ph4-l">
{{ if gt .DaysUntilEnd 0 }} {{ if gt .DaysUntilEnd 0 }}
<h2>Recent updates</h2> <h2>Recent updates</h2>
@ -239,7 +241,7 @@ $discordInviteURL := "https://discord.gg/hmn" }}
</script> </script>
{{ end }} {{ end }}
<div id="inspiration" class="bg-black-20 pt4"> <div id="inspiration" class="pt4">
<div class="section mw8 margin-center ph3 ph4-l"> <div class="section mw8 margin-center ph3 ph4-l">
<h2>Inspiration</h2> <h2>Inspiration</h2>
</div> </div>
@ -374,7 +376,7 @@ $discordInviteURL := "https://discord.gg/hmn" }}
</div> </div>
</div> </div>
<div class="bg-black-20 pt4 pb3 pb4-ns"> <div class="pt4 pb3 pb4-ns">
<div class="section mw8 margin-center ph3 ph4-l"> <div class="section mw8 margin-center ph3 ph4-l">
<h2>Rules</h2> <h2>Rules</h2>
<ul> <ul>

4
src/templates/src/jam_2023_vj_feed.html
View File

@ -12,11 +12,11 @@
<div id="top-container" class="flex flex-column items-center ph3"> <div id="top-container" class="flex flex-column items-center ph3">
<h1 id="title">Visibility Jam</h1> <h1 id="title">Visibility Jam</h1>
<h2 id="dates">April 14 - 16, 2023</h2> <h2 id="dates">April 14 - 16, 2O23</h2>
<div id="tagline" class="center">See things in a new way.</div> <div id="tagline" class="center">See things in a new way.</div>
</div> </div>
<div class="section bg-black-20 pt4 pb3 pb4-ns"> <div class="section pt4 pb3 pb4-ns">
<div class="mw8 margin-center ph3 ph4-l flex flex-column flex-row-ns g3"> <div class="mw8 margin-center ph3 ph4-l flex flex-column flex-row-ns g3">
<div class="flex-grow-1 overflow-hidden"> <div class="flex-grow-1 overflow-hidden">
{{ if eq .DaysUntilEnd 0 }} {{ if eq .DaysUntilEnd 0 }}

8
src/templates/src/layouts/jam_2023_visibility_base.html
View File

@ -333,6 +333,10 @@
background-color: {{ $themeDimmest }}; background-color: {{ $themeDimmest }};
background-color: var(--theme-color-dimmest); background-color: var(--theme-color-dimmest);
} }
.jam-sections > div:nth-of-type(even) {
background-color: rgba(0, 0, 0, 0.2);
}
</style> </style>
<script src="{{ static "js/carousel.js" }}"></script> <script src="{{ static "js/carousel.js" }}"></script>
@ -344,7 +348,9 @@
{{ template "header.html" . }} {{ template "header.html" . }}
</div> </div>
{{ block "content" . }}{{ end }} <div class="jam-sections">
{{ block "content" . }}{{ end }}
</div>
<div class="mw8 margin-center ph3-m ph4-l"> <div class="mw8 margin-center ph3-m ph4-l">
{{ template "footer.html" . }} {{ template "footer.html" . }}

2
src/website/jam.go
View File

@ -104,7 +104,7 @@ func JamIndex2023_Visibility(c *RequestContext) ResponseData {
EndTimeUnix: hmndata.VJ2023.EndTime.Unix(), EndTimeUnix: hmndata.VJ2023.EndTime.Unix(),
ProjectSubmissionUrl: hmnurl.BuildProjectNewJam(), ProjectSubmissionUrl: hmnurl.BuildProjectNewJam(),
SubmittedProjectUrl: submittedProjectUrl, SubmittedProjectUrl: submittedProjectUrl,
ShowcaseFeedUrl: hmnurl.BuildJamFeed2022(), ShowcaseFeedUrl: hmnurl.BuildJamFeed2023_Visibility(),
ShowcaseJson: showcaseJson, ShowcaseJson: showcaseJson,
JamProjects: pageProjects, JamProjects: pageProjects,
}, c.Perf) }, c.Perf)