1
0
Fork 0
mirror of https://git.sr.ht/~ashkeel/strimertul-website synced 2024-11-21 21:22:21 +00:00

add pictures to landing points

This commit is contained in:
Ash Keel 2023-02-06 12:44:41 +01:00
parent 9d2b33e139
commit a31b2dd074
No known key found for this signature in database
GPG key ID: BAD8D93E7314ED3E
6 changed files with 74 additions and 25 deletions

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 12 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 22 KiB

BIN
assets/landing/rewards.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 149 KiB

View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="256" height="193" preserveAspectRatio="xMidYMid"><path fill="#18a18e" d="M192 145h32V68l-36-35-22 22 26 27v63Zm32 16H113l-26-27 11-11 22 22h45l-44-45 11-11 44 44V88l-21-22 11-11-55-55H0l32 32h65l24 23-34 34-24-23V48H32v31l55 55-23 22 36 36h156l-32-31Z"/></svg>

After

Width:  |  Height:  |  Size: 307 B

View file

@ -14,43 +14,73 @@
<section class="features">
<article>
<div class="maxw">
<div class="flex">
<div>
<header>One API for everything</header>
<p>
Build overlays and tooling with easy access to Twitch alerts, chat
messages and more through a single websocket interface.
</p>
</div>
</article>
<article>
<div class="maxw">
<header>No Twitch Affiliate?</header>
<p>
Our loyalty system lets regular viewers accrue points, claim rewards
and contribute towards community goals.
</p>
{{ $image := resources.Get "landing/websocket.svg" }}
<img
class="landing-point"
src="{{ $image.RelPermalink }}"
style="width: 200px; padding-left: 20px"
/>
</div>
</div>
</article>
<article>
<div class="maxw">
<div class="flex">
{{ $image := resources.Get "landing/rewards.png" }}
<img class="landing-point" src="{{ $image.RelPermalink }}" />
<div>
<header>No Twitch Affiliate?</header>
<p>
Our loyalty system lets regular viewers accrue points, claim
rewards and contribute towards community goals.
</p>
</div>
</div>
</div>
</article>
<article>
<div class="maxw">
<div class="flex">
<div class="flex-copy">
<header>Keep total control</header>
<p>
strimertül runs completely in your computer and has no remote
components.
</p>
</div>
{{ $image := resources.Get "landing/downloads.png" }}
<img class="landing-point" src="{{ $image.RelPermalink }}" />
</div>
</div>
</article>
<article>
<div class="maxw">
<div class="flex">
{{ $image := resources.Get "landing/AGPLv3_Logo.svg" }}
<img class="landing-point" src="{{ $image.RelPermalink }}" />
<div>
<header>Won't turn evil</header>
<p>
strimertül is licensed under
<a href="https://github.com/strimertul/strimertul/blob/master/LICENSE"
<a
href="https://github.com/strimertul/strimertul/blob/master/LICENSE"
>AGPLv3</a
>, a strong
<a href="https://en.wikipedia.org/wiki/Copyleft">copyleft license</a>,
meaning we couldn't close it down even if we wanted!
<a href="https://en.wikipedia.org/wiki/Copyleft"
>copyleft license</a
>, meaning we couldn't close it down even if we wanted!
</p>
</div>
</div>
</div>
</article>
</section>
</main>

View file

@ -4,6 +4,22 @@
margin: 0 auto;
width: 100%;
}
.flex {
display: flex;
gap: 30px;
padding: 10px 0;
.flex-copy {
flex: 1;
}
}
.landing-point {
width: 300px;
opacity: 0.8;
@media only screen and (max-width: $mobile) {
display: none;
}
}
.features {
display: flex;
flex-direction: column;
@ -24,8 +40,9 @@
display: flex;
align-items: flex-end;
font-weight: bold;
font-size: 18px;
font-size: 20px;
padding-top: 10px;
padding-bottom: 5px;
}
}
}