81 lines
2.1 KiB
Plaintext
81 lines
2.1 KiB
Plaintext
---
|
|
import WebExtensionStore from "../components/web-extension-store.astro";
|
|
import BaseLayout, {Props as BaseProps} from "./base.astro";
|
|
|
|
/** Props for the WebExtension layout. */
|
|
export interface Props {
|
|
frontmatter: {
|
|
/** A one-liner for a short description. */
|
|
byline?: string;
|
|
/** Data for the footer. */
|
|
footer: {
|
|
/** A link to the code's git repository. */
|
|
link: string;
|
|
/** The SPDX license identifier of the project. */
|
|
license: string;
|
|
};
|
|
/** The name of the WebExtension to use in the header. */
|
|
name: string;
|
|
/** The path for the screenshot image. */
|
|
screenshot: string;
|
|
/** All the stores the WebExtension is available in. */
|
|
stores: {
|
|
/** The ID for the Chrome Web Store page. */
|
|
chrome?: string;
|
|
/** The ID for the Microsoft Edge Marketplace page. */
|
|
edge?: string;
|
|
/** The ID for the Mozilla Addons page. */
|
|
firefox?: string;
|
|
};
|
|
} & BaseProps["frontmatter"];
|
|
}
|
|
|
|
const {frontmatter} = Astro.props;
|
|
---
|
|
|
|
<BaseLayout {...Astro.props}>
|
|
<header class="page-header">
|
|
<h1>
|
|
<slot name="header-image" />
|
|
{frontmatter.name}
|
|
</h1>
|
|
|
|
{
|
|
frontmatter.byline ? (
|
|
<p class="byline">{frontmatter.byline}</p>
|
|
) : undefined
|
|
}
|
|
</header>
|
|
|
|
<main class="page-main">
|
|
<slot name="main-content">
|
|
<p class="store-links">
|
|
{
|
|
Object.entries(frontmatter.stores).map(([key, value]) => (
|
|
<WebExtensionStore
|
|
name={frontmatter.name}
|
|
store={key}
|
|
webExtensionId={value as string}
|
|
/>
|
|
))
|
|
}
|
|
</p>
|
|
|
|
<img
|
|
class="screenshot"
|
|
alt=`${frontmatter.name} Screenshot`
|
|
title=`${frontmatter.name} Screenshot`
|
|
src={frontmatter.screenshot}
|
|
/>
|
|
</slot>
|
|
</main>
|
|
|
|
<footer class="page-footer">
|
|
©
|
|
<a href={frontmatter.footer.link}>{frontmatter.footer.license}</a>
|
|
💖
|
|
<a href="mailto:helllo@holllo.org">helllo@holllo.org</a>
|
|
<slot name="extra-footer-content" />
|
|
</footer>
|
|
</BaseLayout>
|