basspistol2025/themes/basspistol2025/layouts/partials/body/gang.html
2025-05-18 23:19:04 +02:00

128 lines
2.2 KiB
HTML

<style>
#gang {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
a {
text-decoration: none;
}
article {
margin:2px;
flex: 1 1 300px;
}
h2 {
font-size: 24em;
/* text-transform: uppercase;*/
line-height: 1em;
flex: 1 1 100%;
}
p {
flex: 1 1 100%;
font-size: 1.5em;
line-height: 1em;
}
@media screen and (max-width: 1024px) {
h2 {
font-size: 8em;
}
p {
font-size: 1em;
}
}
figure {
padding: 4px;
margin: auto;
border-style: double;
border-color: purple;
border-width: 10px;
img {
width: 100%;
object-fit: cover;
max-height: 300px;
}
}
figcaption {
font-family: Outward, 'Arial', 'Helvetica', sans-serif;
font-size: 9em;
line-height: 0.3em;
font-weight: bold;
/* font-style: italic;*/
background-color: black;
color: white;
padding: 20px;
text-align: center;
color: orange;
z-index: 100;
position: relative;
text-decoration: none;
margin-bottom: 4px;
text-transform: lowercase;
}
@media screen and (max-width: 1024px) {
figcaption {
font-size: 7em;
line-height: 0.35em;
}
}
.section-headers {
padding: 80px;
border-style: double;
border-color: purple;
border-width: 10px;
flex: 1 0 100%;
max-width: 100%;
margin-top: 0;
}
}
</style>
<section id="gang">
<article class="section-headers">
<h2>Gung</h2>
<p>Ordinary people with extraordinary visions. <br />
Powerful. Syndicated. Artists.</p>
</article>
{{/* prebuild/layouts/index.html */}}
{{ $url := "https://s.basspistol.org/api/pinned-users" }}
{{ $opts := dict
"method" "post"
"body" `{"complete": true}`
"headers" (dict "Content-Type" "application/json")
}}
{{ with resources.GetRemote $url $opts }}
{{ $monsters := unmarshal .Content }}
{{ range $monsters }}
<article>
{{ if .url }}
<a href="{{ .url }}" target="_blank">
{{ else }}
<a href="https://s.basspistol.org/@{{ .username }}" target="_blank">
{{ end }}
<figure>
<figcaption>{{ .username }}</figcaption>
<img src="{{ .avatarUrl }}" />
</figure>
</a>
</article>
{{ end }}
{{ end }}
</section>