Add links to the home and settings pages in the footer.
This commit is contained in:
parent
bc02927d8b
commit
71331a6ee0
|
@ -2,14 +2,31 @@ import {Component, html} from 'htm/preact';
|
||||||
|
|
||||||
import ExternalAnchor from './external-anchor.js';
|
import ExternalAnchor from './external-anchor.js';
|
||||||
|
|
||||||
export default class SharedFooter extends Component {
|
type Props = {
|
||||||
|
page: string;
|
||||||
|
};
|
||||||
|
|
||||||
|
export default class SharedFooter extends Component<Props> {
|
||||||
render() {
|
render() {
|
||||||
|
const {page} = this.props;
|
||||||
|
|
||||||
|
const homeLink =
|
||||||
|
page === 'home' || page === 'not-found'
|
||||||
|
? undefined
|
||||||
|
: html`<a href="/">Home</a>${' '}`;
|
||||||
|
|
||||||
|
const settingsLink =
|
||||||
|
page === 'settings'
|
||||||
|
? undefined
|
||||||
|
: html`<a href="/settings">Settings</a>${' '}`;
|
||||||
|
|
||||||
const githubUrl = 'https://github.com/Bauke/href-plus';
|
const githubUrl = 'https://github.com/Bauke/href-plus';
|
||||||
const versionText = `v${hrefPlusVersion}/${hrefPlusCommitHash}`;
|
const versionText = `v${hrefPlusVersion}/${hrefPlusCommitHash}`;
|
||||||
const versionUrl = `${githubUrl}/tree/${hrefPlusCommitHash}`;
|
const versionUrl = `${githubUrl}/tree/${hrefPlusCommitHash}`;
|
||||||
|
|
||||||
return html`
|
return html`
|
||||||
<footer class="shared-footer">
|
<footer class="shared-footer">
|
||||||
|
${homeLink}${settingsLink}
|
||||||
<${ExternalAnchor} text="GitHub" url=${githubUrl} />
|
<${ExternalAnchor} text="GitHub" url=${githubUrl} />
|
||||||
${' '}
|
${' '}
|
||||||
<${ExternalAnchor} text=${versionText} url=${versionUrl} />
|
<${ExternalAnchor} text=${versionText} url=${versionUrl} />
|
||||||
|
|
|
@ -59,7 +59,7 @@ export default class HomePage extends Component {
|
||||||
</div>
|
</div>
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
<${SharedFooter} />
|
<${SharedFooter} page="home" />
|
||||||
</div>
|
</div>
|
||||||
`;
|
`;
|
||||||
}
|
}
|
||||||
|
|
|
@ -13,7 +13,7 @@ export default class NotFoundPage extends Component {
|
||||||
<a href="/">← Home</a>
|
<a href="/">← Home</a>
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
<${SharedFooter} />
|
<${SharedFooter} page="not-found" />
|
||||||
</div>
|
</div>
|
||||||
`;
|
`;
|
||||||
}
|
}
|
||||||
|
|
|
@ -59,7 +59,7 @@ export default class SettingsPage extends Component<Props, State> {
|
||||||
</p>
|
</p>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<${SharedFooter} />
|
<${SharedFooter} page="settings" />
|
||||||
</div>
|
</div>
|
||||||
`;
|
`;
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue