2021-03-14 20:49:58 +00:00
{{ template "base.html" . }}
2021-04-24 04:27:45 +00:00
{{ define "extrahead" }}
2021-07-17 23:20:47 +00:00
< script src = "{{ static " js / templates . js " } } " > < / script >
2021-04-24 04:27:45 +00:00
{{ end }}
2021-03-14 20:49:58 +00:00
{{ define "content" }}
2021-10-26 04:42:55 +00:00
< div class = "mb3 ph3 ph0-ns" >
2021-08-28 11:26:17 +00:00
< style >
2021-10-26 03:21:11 +00:00
#hms-banner {
height: 10rem;
background-color: #0b0243;
2021-08-28 11:26:17 +00:00
color: white !important;
text-align: center;
2021-10-26 03:21:11 +00:00
position: relative;
overflow: hidden;
2021-08-28 11:26:17 +00:00
}
2021-10-26 03:21:11 +00:00
#hms-banner::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-image: url('{{ static "hms/banner.jpg" }}');
background-size: auto 100%;
z-index: 0;
opacity: 0.4;
}
#hms-banner h3 {
2021-08-28 11:26:17 +00:00
font-family: 'MohaveHMN', sans-serif;
font-weight: normal;
2021-10-26 03:21:11 +00:00
font-size: 2.6rem;
2021-08-28 11:26:17 +00:00
line-height: 0.8;
margin: 0;
text-transform: uppercase;
}
2021-10-26 03:21:11 +00:00
#hms-details {
2021-08-28 11:26:17 +00:00
font-family: 'MohaveHMN', sans-serif;
font-variant: small-caps;
2021-10-26 03:21:11 +00:00
font-size: 1.3rem;
2021-08-28 11:26:17 +00:00
line-height: 0.8;
margin-top: 0.6rem;
letter-spacing: 0.02rem;
}
2021-10-26 03:21:11 +00:00
#hms-learn-more {
2021-08-28 11:26:17 +00:00
font-size: 1rem;
}
@media screen and (min-width: 30rem) {
2021-10-26 03:21:11 +00:00
#hms-banner {
height: 12rem;
2021-08-28 11:26:17 +00:00
text-align: left;
2021-10-26 03:21:11 +00:00
color: #0b0243 !important;
2021-08-28 11:26:17 +00:00
}
2021-10-26 03:21:11 +00:00
#hms-banner::before {
opacity: 1;
}
#hms-title-container {
padding-left: 13.4rem;
2021-08-28 11:26:17 +00:00
}
}
2021-10-26 03:21:11 +00:00
@media screen and (min-width: 60em) {
#hms-banner {
height: 15rem;
text-align: left;
color: #0b0243 !important;
}
#hms-title-container {
padding-left: 16rem;
}
#hms-banner h3 {
font-size: 3rem;
}
#hms-details {
font-size: 1.5rem;
}
}
2021-08-28 11:26:17 +00:00
< / style >
2021-10-26 04:42:55 +00:00
< a id = "hms-banner" class = "pv3 ph3 ph4-l br3 flex flex-column flex-row-ns items-center" href = "https://handmade-seattle.com/" target = "_blank" >
2021-10-26 03:21:11 +00:00
< div id = "hms-title-container" class = "flex flex-column pl3-m pl4-l pv3 pv0-ns z-1" >
< h3 id = "hms-title" > Handmade Seattle< / h3 >
< div id = "hms-details" > November 11 - 12. In person and online.< / div >
2021-08-28 11:26:17 +00:00
< / div >
< div class = "flex-grow-1" > < / div >
2021-10-26 03:21:11 +00:00
< div id = "hms-learn-more" class = "z-1" >
Sign up
2021-08-28 11:26:17 +00:00
< div class = "dib svgicon" > {{ svg "chevron-right" }}< / div >
< / div >
< / a >
< / div >
2021-06-23 19:31:59 +00:00
2021-10-26 04:42:55 +00:00
{{ if not .User }}
< div class = "mb3 ph3 ph0-ns" >
< style >
#welcome {
2021-10-26 04:50:26 +00:00
background: linear-gradient(#753330, #823461); /* darker variant of jam color scheme */
2021-10-26 04:42:55 +00:00
color: white;
}
#welcome-logo {
font-family: 'MohaveHMN', sans-serif;
font-weight: 400;
font-size: 4rem;
2021-10-28 03:44:08 +00:00
display: flex;
justify-content: center;
}
#welcome-logo svg {
height: 100%;
fill: currentColor;
2021-10-26 04:42:55 +00:00
}
#welcome-content a {
color: white !important;
text-decoration: underline;
font-weight: bold;
}
#welcome-actions {
margin-top: 1.5rem;
}
#welcome-actions a {
color: white !important;
text-decoration: none;
line-height: 1.4;
font-weight: 500;
transition: background-color 50ms ease-in-out;
background-color:rgba(255, 255, 255, 0.1);
display: flex;
align-items: center;
justify-content: center;
text-align: center;
}
#welcome-actions a:hover {
background-color: rgba(255, 255, 255, 0.2);
}
#welcome-actions a:active {
background-color: rgba(255, 255, 255, 0.15);
}
< / style >
< div id = "welcome" class = "br3 pa3 pa4-ns bg--card f5" >
2021-10-28 03:44:08 +00:00
< div id = "welcome-logo" class = "h4 mb4" >
{{ svg "hmn_circuit" }}
< / div >
2021-10-26 04:42:55 +00:00
< div id = "welcome-content" class = "center-layout" style = "max-width: 51rem" >
< p class = "b" > We are a community of programmers committed to producing quality software through deeper understanding.< / p >
< p > Originally inspired by Casey Muratori's < a href = "https://handmadehero.org/" target = "_blank" > Handmade Hero< / a > , we have grown into a thriving community focused on building truly high-quality software. We're not low-level in the typical sense. Instead we realize that to write great software, you need to understand things at more than a surface level.< / p >
< p > Modern software is a mess. The status quo needs to change. But we're optimistic that we can change it.< / p >
< p > Help us change the face of software.< / p >
< / div >
< div id = "welcome-actions" class = "flex flex-column flex-row-ns justify-center" >
< a class = "ba b--white br2 pa3 ph4-ns" href = "{{ .ManifestoUrl }}" > Read our manifesto< / a >
< a class = "ba b--white br2 pa3 ph4-ns mt3 mt0-ns ml3-ns" href = "{{ .Header.ProjectIndexUrl }}" > View Handmade projects< / a >
< a class = "ba b--white br2 pa3 ph4-ns mt3 mt0-ns ml3-ns" target = "_blank" href = "https://discord.gg/hxWxDee" > Join our Discord< / a >
< / div >
< / div >
< / div >
{{ end }}
2021-10-24 20:48:28 +00:00
< div class = "landing-layout ph3 ph0-ns" >
{{/*
The order of the grid children should be as desired on mobile, then adapted to larger
sizes using CSS grid properties.
*/}}
< div >
< h2 > Latest News< / h2 >
{{ template "timeline_item.html" .NewsPost }}
< / div >
< div class = "landing-right" >
< h2 > Around the Network< / h2 >
< div class = "optionbar mb2" >
< div class = "options" >
< a class = "button" href = "{{ .AtomFeedUrl }}" > < span class = "icon big pr1" > 4< / span > RSS Feed< / a >
{{ if .User }}
< form method = "POST" action = "{{ .MarkAllReadUrl }}" >
{{ csrftoken .Session }}
< button type = "submit" > < span class = "big pr1" > ✓ < / span > Mark all posts on site as read< / button >
< / form >
{{ end }}
2021-06-23 19:31:59 +00:00
< / div >
2021-10-24 20:48:28 +00:00
< div class = "options" >
{{ template "pagination.html" .Pagination }}
2021-06-23 19:31:59 +00:00
< / div >
< / div >
2021-10-24 20:48:28 +00:00
{{ range .TimelineItems }}
{{ template "timeline_item.html" . }}
{{ end }}
< div class = "optionbar bottom mt2" >
< div class = "options" > < / div >
< div class = "options" >
{{ template "pagination.html" .Pagination }}
< / div >
2021-06-23 19:31:59 +00:00
< / div >
< / div >
2021-10-24 20:48:28 +00:00
{{ if .ShowcaseTimelineJson }}
< div >
{{ template "showcase_templates.html" }}
< div >
< h2 > Community Showcase< / h2 >
< div class = "bg--card pa3 br3" >
< div class = "mb3" >
2021-10-28 01:35:53 +00:00
This is a selection of recent work done by community members. Want to participate? < a href = "https://discord.gg/hxWxDee" target = "_blank" > Join us on Discord.< / a >
2021-10-24 20:48:28 +00:00
< / div >
< div id = "showcase-container" > < / div >
< div >
< a class = "db w-100 tc pa2" href = "{{ .ShowcaseUrl }}" > View all »< / a >
< / div >
< / div >
< / div >
< script >
const showcaseItems = JSON.parse("{{ .ShowcaseTimelineJson }}");
initShowcaseContainer(document.querySelector('#showcase-container'), showcaseItems, 200);
< / script >
< / div >
{{ end }}
2021-05-30 18:35:01 +00:00
< / div >
{{ end }}