pinafore/routes/_components/NotLoggedInHome.html
Nolan Lawson b2f5f36207
fix(svg): re-inline svg into html (#772)
* Revert "fix(icons): fix icons.svg url (#769)"

This reverts commit 1d34d45da7.

* Revert "perf: use prefetch instead of preload for svgs (#765)"

This reverts commit b73dd548ae.

* Revert "perf: build separate icons.svg file (#762)"

This reverts commit ee45c07314.

* move svg to end of 2xx.html
2018-12-10 00:13:54 -08:00

58 lines
1.5 KiB
HTML

<HiddenFromSSR>
<FreeTextLayout>
<div class="not-logged-in-home">
<div class="banner">
<svg aria-hidden="true" class="not-logged-in-home-svg">
<use xlink:href="#pinafore-logo" />
</svg>
<h1>Pinafore</h1>
</div>
<p>Pinafore is a web client for <ExternalLink href="https://joinmastodon.org">Mastodon</ExternalLink>, designed for speed and simplicity.</p>
<p>Read the <ExternalLink href="https://nolanlawson.com/2018/04/09/introducing-pinafore-for-mastodon/">introductory blog post</ExternalLink>, or get started by logging in to an instance:</p>
<p style="text-align: right;"><a class="button primary" href="/settings/instances/add">Add instance</a></p>
</div>
</FreeTextLayout>
</HiddenFromSSR>
<style>
.not-logged-in-home {
margin: 10px;
}
.not-logged-in-home .banner {
display: flex;
align-items: center;
margin: 0 0 30px;
}
.not-logged-in-home-svg {
width: 70px;
height: 70px;
fill: royalblue;
display: inline-block;
}
.not-logged-in-home h1 {
color: royalblue;
display: inline-block;
font-size: 3em;
margin: auto 15px;
}
@media (max-width: 767px) {
.not-logged-in-home h1 {
font-size: 2.7em;
}
}
</style>
<script>
import FreeTextLayout from './FreeTextLayout.html'
import HiddenFromSSR from './HiddenFromSSR.html'
import ExternalLink from './ExternalLink.html'
export default {
components: {
FreeTextLayout,
HiddenFromSSR,
ExternalLink
}
}
</script>