feat: Add sys design

This commit is contained in:
Wanjohi
2024-09-23 20:15:49 +03:00
parent e322693b70
commit efe95a7c8d
5 changed files with 161 additions and 55 deletions

View File

@@ -11,16 +11,20 @@ export const RouterHead = component$(() => {
return (
<>
<title>{loc.url.pathname === "/" ? "Nestri Your games. Your rules." : `${loc.url.pathname.split("/")[1].charAt(0).toUpperCase() + loc.url.pathname.split("/")[1].slice(1)} Nestri`}</title>
<title>
{/* {head.title} */}
{loc.url.pathname === "/"
? "Nestri Your games. Your rules.":
loc.url.pathname.startsWith("/blog/")
?
head.title
: `${loc.url.pathname.split("/")[1].charAt(0).toUpperCase() + loc.url.pathname.split("/")[1].slice(1)} Nestri`
}
</title>
<link rel="canonical" href={loc.url.href} />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
{/**For SEO optimisation purposes refrain from SVG favicons and use PNG instead */}
{/* <link rel="icon" type="image/svg+xml" href="/favicon.svg" /> */}
{/* <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png" />
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png" />
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png" />
<link rel="manifest" href="/manifest.json" /> */}
<link rel="apple-touch-icon" sizes="180x180" href="/seo/apple-touch-icon.png" />
<link rel="icon" type="image/png" sizes="32x32" href="/seo/favicon-32x32.png" />
<link rel="icon" type="image/png" sizes="16x16" href="/seo/favicon-16x16.png" />
@@ -34,36 +38,47 @@ export const RouterHead = component$(() => {
<meta property="twitter:url" content={domain} />
<meta property="twitter:domain" content={domain.replace("https://", "")} />
<meta property="og:type" content="website" />
<meta property="og:image" content={`${domain}/seo/banner.png`} />
<meta property="twitter:image" content={`${domain}/seo/banner.png`} />
{!loc.url.pathname.startsWith("/blog/") && (
<>
<meta property="og:image" content={`${domain}/seo/banner.png`} />
<meta property="twitter:image" content={`${domain}/seo/banner.png`} />
</>
)}
{
head.meta.map((m) => (
<meta key={m.key} {...m} />
))
}
{head.meta.map((m) => (
<meta key={m.key} {...m} />
))}
{
head.links.map((l) => (
<link key={l.key} {...l} />
))
}
{head.links.map((l) => (
<link key={l.key} {...l} />
))}
{
head.styles.map((s) => (
<style
key={s.key}
{...s.props}
{...(s.props?.dangerouslySetInnerHTML
? {}
: { dangerouslySetInnerHTML: s.style })}
/>
))
}
{head.styles.map((s) => (
<style
key={s.key}
{...s.props}
{...(s.props?.dangerouslySetInnerHTML
? {}
: { dangerouslySetInnerHTML: s.style })}
/>
))}
{head.scripts.map((s) => (
<script
key={s.key}
{...s.props}
{...(s.props?.dangerouslySetInnerHTML
? {}
: { dangerouslySetInnerHTML: s.script })}
/>
))}
{
head.scripts.map((s) => (
<script
key={s.key}
{...s.props}
{...(s.props?.dangerouslySetInnerHTML
? {}
: { dangerouslySetInnerHTML: s.script })}
/>
))
}
</>
);
});