perf: use raw html for some external links (#1600)

This commit is contained in:
Nolan Lawson 2019-10-24 19:03:03 -07:00 committed by GitHub
parent 852a8582fb
commit 0194a07823
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 71 additions and 48 deletions

View File

@ -1,21 +1,26 @@
<HiddenFromSSR> <HiddenFromSSR>
<footer> <footer>
<!-- Use raw HTML to make the output smaller -->
{@html `
<p> <p>
Pinafore is <ExternalLink href="https://github.com/nolanlawson/pinafore">open-source software</ExternalLink> Pinafore is
created by <ExternalLink href="https://nolanlawson.com">Nolan Lawson</ExternalLink> and distributed under the <a rel="noopener" target="_blank" href="https://github.com/nolanlawson/pinafore">open-source software</a>
<ExternalLink href="https://github.com/nolanlawson/pinafore/blob/master/LICENSE">AGPL License</ExternalLink>. created by
<a rel="noopener" target="_blank" href="https://nolanlawson.com">Nolan Lawson</a>
and distributed under the
<a rel="noopener" target="_blank"
href="https://github.com/nolanlawson/pinafore/blob/master/LICENSE">AGPL License</a>.
Here is the <a href="/settings/about#privacy-policy" rel="prefetch">privacy policy</a>. Here is the <a href="/settings/about#privacy-policy" rel="prefetch">privacy policy</a>.
</p> </p>
`}
</footer> </footer>
</HiddenFromSSR> </HiddenFromSSR>
<script> <script>
import HiddenFromSSR from './HiddenFromSSR.html' import HiddenFromSSR from './HiddenFromSSR.html'
import ExternalLink from './ExternalLink.html'
export default { export default {
components: { components: {
HiddenFromSSR, HiddenFromSSR
ExternalLink
} }
} }
</script> </script>

View File

@ -5,11 +5,27 @@
<SvgIcon className="not-logged-in-home-svg" href="#pinafore-logo" /> <SvgIcon className="not-logged-in-home-svg" href="#pinafore-logo" />
<h1>Pinafore</h1> <h1>Pinafore</h1>
</div> </div>
<p>Pinafore is a web client for <ExternalLink href="https://joinmastodon.org">Mastodon</ExternalLink>, designed for speed and simplicity.</p> <!-- Use raw HTML to make the output smaller -->
{@html `
<div>
<p>
Pinafore is a web client for
<a rel="noopener" target="_blank" href="https://joinmastodon.org">Mastodon</a>,
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>
Read the
<a rel="noopener" target="_blank"
href="https://nolanlawson.com/2018/04/09/introducing-pinafore-for-mastodon/">introductory blog post</a>,
or get started by logging in to an instance:
</p>
<p style="text-align: right;"><a class="button primary" rel="prefetch" href="/settings/instances/add">Add instance</a></p> <p style="text-align: right;">
<a class="button primary" rel="prefetch" href="/settings/instances/add">Add instance</a>
</p>
</div>
`}
</div> </div>
</FreeTextLayout> </FreeTextLayout>
</HiddenFromSSR> </HiddenFromSSR>
@ -50,14 +66,12 @@
<script> <script>
import FreeTextLayout from './FreeTextLayout.html' import FreeTextLayout from './FreeTextLayout.html'
import HiddenFromSSR from './HiddenFromSSR.html' import HiddenFromSSR from './HiddenFromSSR.html'
import ExternalLink from './ExternalLink.html'
import SvgIcon from './SvgIcon.html' import SvgIcon from './SvgIcon.html'
export default { export default {
components: { components: {
FreeTextLayout, FreeTextLayout,
HiddenFromSSR, HiddenFromSSR,
ExternalLink,
SvgIcon SvgIcon
} }
} }

View File

@ -1,18 +1,27 @@
<SettingsLayout page='settings/about' label="About Pinafore"> <SettingsLayout page='settings/about' label="About Pinafore">
<div>
<!-- Use raw HTML to make the output smaller -->
{@html `
<h1>About Pinafore</h1> <h1>About Pinafore</h1>
<h2>Version {version}</h2> <h2>Version ${version}</h2>
<p> <p>
Pinafore is <ExternalLink href="https://github.com/nolanlawson/pinafore">free and open-source software</ExternalLink> Pinafore is
created by <ExternalLink href="https://nolanlawson.com">Nolan Lawson</ExternalLink> and distributed under the <a rel="noopener" target="_blank"
<ExternalLink href="https://github.com/nolanlawson/pinafore/blob/master/LICENSE">GNU Affero General Public License</ExternalLink>. href="https://github.com/nolanlawson/pinafore">free and open-source software</a>
created by
<a rel="noopener" target="_blank" href="https://nolanlawson.com">Nolan Lawson</a>
and distributed under the
<a rel="noopener" target="_blank"
href="https://github.com/nolanlawson/pinafore/blob/master/LICENSE">GNU Affero General Public License</a>.
</p> </p>
<h2 id="privacy-policy">Privacy Policy</h2> <h2 id="privacy-policy">Privacy Policy</h2>
<p> <p>
Pinafore does not store any personal information on its servers, including but not limited to names, email addresses, Pinafore does not store any personal information on its servers,
including but not limited to names, email addresses,
IP addresses, posts, and photos. IP addresses, posts, and photos.
</p> </p>
@ -24,25 +33,24 @@
<h2>Credits</h2> <h2>Credits</h2>
<p> <p>
Icons provided by <ExternalLink href="http://fontawesome.io/">Font Awesome</ExternalLink>. Icons provided by <a rel="noopener" target="_blank" href="http://fontawesome.io/">Font Awesome</a>.
</p> </p>
<p> <p>
Logo thanks to "sailboat" by Gregor Cresnar from <ExternalLink href="https://thenounproject.com/">the Noun Project</ExternalLink>. Logo thanks to "sailboat" by Gregor Cresnar from
<a rel="noopener" target="_blank" href="https://thenounproject.com/">the Noun Project</a>.
</p> </p>
`}
</div>
</SettingsLayout> </SettingsLayout>
<script> <script>
import SettingsLayout from '../../_components/settings/SettingsLayout.html' import SettingsLayout from '../../_components/settings/SettingsLayout.html'
import ExternalLink from '../../_components/ExternalLink.html'
import { version } from '../../../../package.json' import { version } from '../../../../package.json'
export default { export default {
components: { components: {
SettingsLayout, SettingsLayout
ExternalLink
}, },
data: () => ({ data: () => ({
version version

View File

@ -43,7 +43,7 @@
tooltipText="An instance is your Mastodon home server, such as mastodon.social or cybre.space." tooltipText="An instance is your Mastodon home server, such as mastodon.social or cybre.space."
/> />
? ?
<ExternalLink href="https://joinmastodon.org">Join Mastodon!</ExternalLink> <a rel="noopener" target="_blank" href="https://joinmastodon.org">Join Mastodon!</a>
</p> </p>
{/if} {/if}
</SettingsLayout> </SettingsLayout>
@ -86,7 +86,6 @@
import SettingsLayout from '../../../_components/settings/SettingsLayout.html' import SettingsLayout from '../../../_components/settings/SettingsLayout.html'
import { store } from '../../../_store/store' import { store } from '../../../_store/store'
import { logInToInstance, handleOauthCode } from '../../../_actions/addInstance' import { logInToInstance, handleOauthCode } from '../../../_actions/addInstance'
import ExternalLink from '../../../_components/ExternalLink.html'
import { testHasIndexedDB, testHasLocalStorage } from '../../../_utils/testStorage' import { testHasIndexedDB, testHasLocalStorage } from '../../../_utils/testStorage'
import Tooltip from '../../../_components/Tooltip.html' import Tooltip from '../../../_components/Tooltip.html'
@ -103,7 +102,6 @@
}, },
components: { components: {
SettingsLayout, SettingsLayout,
ExternalLink,
Tooltip Tooltip
}, },
store: () => store, store: () => store,

View File

@ -60,7 +60,7 @@
</form> </form>
<p> <p>
These settings are partly based on guidelines from the These settings are partly based on guidelines from the
<ExternalLink href="https://humanetech.com">Center for Humane Technology</ExternalLink>. <a rel="noopener" target="_blank" href="https://humanetech.com">Center for Humane Technology</a>.
</p> </p>
</SettingsLayout> </SettingsLayout>
<UISettingsStyles /> <UISettingsStyles />
@ -72,7 +72,6 @@
<script> <script>
import SettingsLayout from '../../_components/settings/SettingsLayout.html' import SettingsLayout from '../../_components/settings/SettingsLayout.html'
import { store } from '../../_store/store' import { store } from '../../_store/store'
import ExternalLink from '../../_components/ExternalLink.html'
import InfoAside from '../../_components/InfoAside.html' import InfoAside from '../../_components/InfoAside.html'
import UISettingsStyles from '../../_components/settings/UISettingsStyles.html' import UISettingsStyles from '../../_components/settings/UISettingsStyles.html'
@ -82,7 +81,6 @@
}, },
components: { components: {
SettingsLayout, SettingsLayout,
ExternalLink,
InfoAside, InfoAside,
UISettingsStyles UISettingsStyles
}, },