pinafore/routes/_pages/settings/instances/index.html
Pheng Heong TAN c305a9827a Provide directions to change the theme (#585)
* Add directions to change themes

The page 'general' was the first place I looked when I
wanted to change the theme. Not managing to find it,
I went on a search throughout various issues ( #46 , for
example) on Github before locating it.

Now I hope to spare others the search

* Hint the user about themes

When I was on this page, it wasn't immediately apparent
to me that the SettingsListItem was clickable (I thought it
was a list rather than a button)
2018-10-28 15:34:34 -07:00

39 lines
1.4 KiB
HTML

<SettingsLayout page='settings/instances' label="Instances">
<h1>Instances</h1>
{#if $isUserLoggedIn}
<p>Instances you've logged in to:
<br />
(click to change themes/colours)
</p>
<SettingsList label="Instances">
{#each $loggedInInstancesAsList as instance}
<SettingsListItem offsetForIcon={instance.name !== $currentInstance}
icon={instance.name === $currentInstance ? '#fa-star' : ''}
href="/settings/instances/{instance.name}"
label={instance.name}
ariaLabel="{instance.name} {instance.name === $currentInstance ? '(current instance)' : ''}" />
{/each}
</SettingsList>
<p><a href="/settings/instances/add">Add another instance</a></p>
{:else}
<p>You're not logged in to any instances.</p>
<p><a href="/settings/instances/add">Log in to an instance</a> to start using Pinafore.</p>
{/if}
</SettingsLayout>
<script>
import { store } from '../../../_store/store'
import SettingsLayout from '../../../_components/settings/SettingsLayout.html'
import SettingsList from '../../../_components/settings/SettingsList.html'
import SettingsListItem from '../../../_components/settings/SettingsListItem.html'
export default {
components: {
SettingsLayout,
SettingsList,
SettingsListItem
},
store: () => store
}
</script>