@smbcloud / pepakbasajawa-web
Code Commits Issues Pulls Cloud Agent CI/CD
dependabot/npm_and_yarn/astro-5.16.4
copilot/add-i18n-support-for-english dependabot/npm_and_yarn/astro-5.16.4 dependabot/npm_and_yarn/katex-0.16.27 dependabot/npm_and_yarn/prettier-3.7.4 dependabot/npm_and_yarn/tailwindcss-4.1.16 dependabot/npm_and_yarn/tailwindcss/vite-4.1.16 dependabot/npm_and_yarn/typescript-eslint-8.46.2 dependabot/npm_and_yarn/typescript-eslint/parser-8.46.2 development main
astro 95 lines 2.93 KB
Raw
1 ---
2 // Import the global.css file here so that it is included on
3 // all pages through the use of the <BaseHead /> component.
4 import { SITE } from '@/config'
5 import type { BaseHeadProps } from '@/types/component.types'
6 import 'katex/dist/katex.min.css'
7
8 const canonicalURL = new URL(Astro.url.pathname, Astro.site)
9
10 const { title, description } = Astro.props as BaseHeadProps
11 ---
12
13 <!-- Global Metadata -->
14 <meta charset="utf-8" />
15 <meta name="viewport" content="width=device-width,initial-scale=1" />
16 {SITE.fadeAnimation && <meta name="view-transition" content="same-origin" />}
17 <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
18 <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
19 <link rel="preload" href="/fonts/Inter.woff2" as="font" type="font/woff2" crossorigin="anonymous" />
20 <link
21 rel="preload"
22 href="/fonts/Besley-Italic.woff2"
23 as="font"
24 type="font/woff2"
25 crossorigin="anonymous"
26 />
27 <link rel="sitemap" href="/sitemap-index.xml" />
28 <link
29 rel="alternate"
30 type="application/rss+xml"
31 title={SITE.title}
32 href={new URL('rss.xml', Astro.site)}
33 />
34 <meta name="generator" content={Astro.generator} />
35
36 <!-- Canonical URL -->
37 <link rel="canonical" href={canonicalURL} />
38
39 <!-- Primary Meta Tags -->
40 <title>
41 {title || SITE.title}
42 </title>
43 <meta name="title" content={title} />
44 <meta name="description" content={description} />
45
46 <!-- Open Graph / Facebook -->
47 <meta property="og:type" content="website" />
48 <meta property="og:url" content={Astro.url} />
49 <meta property="og:title" content={title} />
50 <meta property="og:description" content={description} />
51 <meta property="og:image" content={new URL('/chiri-og.png', Astro.url)} />
52
53 <!-- Twitter -->
54 <meta property="twitter:card" content="summary_large_image" />
55 <meta property="twitter:url" content={Astro.url} />
56 <meta property="twitter:title" content={title} />
57 <meta property="twitter:description" content={description} />
58 <meta property="twitter:image" content={new URL('/chiri-og.png', Astro.url)} />
59
60 <!-- Transitions Initialization -->
61 <script is:inline define:vars={{ fadeAnimation: SITE.fadeAnimation }}>
62 function initMotionPref(doc = document) {
63 const prefersReducedMotion = window.matchMedia('(prefers-reduced-motion: reduce)').matches
64 const supportsViewTransitions = 'startViewTransition' in document
65
66 doc.documentElement.classList.toggle('reduce-motion', prefersReducedMotion)
67
68 doc.documentElement.classList.toggle(
69 'disable-transitions',
70 !fadeAnimation || !supportsViewTransitions
71 )
72
73 doc.documentElement.classList.add('js')
74 }
75
76 initMotionPref()
77
78 document.addEventListener('astro:before-swap', ({ newDocument }) => {
79 initMotionPref(newDocument)
80 })
81
82 document.addEventListener('astro:page-load', () => {
83 initMotionPref()
84 })
85
86 document.addEventListener('visibilitychange', () => {
87 if (document.visibilityState === 'visible') {
88 initMotionPref()
89 }
90 })
91
92 window.addEventListener('pageshow', () => {
93 initMotionPref()
94 })
95 </script>