Agregar Tracking
This commit is contained in:
parent
3ae1904dd4
commit
c3275dde48
1 changed files with 157 additions and 113 deletions
|
|
@ -1,22 +1,22 @@
|
||||||
---
|
---
|
||||||
import '@/styles/global.css';
|
import "@/styles/global.css";
|
||||||
import siteConfig from '@/config/site.config';
|
import siteConfig from "@/config/site.config";
|
||||||
import Header from '@/components/layout/Header.astro';
|
import Header from "@/components/layout/Header.astro";
|
||||||
import Footer from '@/components/layout/Footer.astro';
|
import Footer from "@/components/layout/Footer.astro";
|
||||||
import CursorTrail from '@/components/effects/CursorTrail.astro';
|
import CursorTrail from "@/components/effects/CursorTrail.astro";
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
title?: string;
|
title?: string;
|
||||||
description?: string;
|
description?: string;
|
||||||
image?: string;
|
image?: string;
|
||||||
noindex?: boolean;
|
noindex?: boolean;
|
||||||
}
|
}
|
||||||
|
|
||||||
const {
|
const {
|
||||||
title,
|
title,
|
||||||
description = siteConfig.description,
|
description = siteConfig.description,
|
||||||
image,
|
image,
|
||||||
noindex = false,
|
noindex = false,
|
||||||
} = Astro.props;
|
} = Astro.props;
|
||||||
|
|
||||||
const pageTitle = title ? `${title} | ${siteConfig.name}` : siteConfig.name;
|
const pageTitle = title ? `${title} | ${siteConfig.name}` : siteConfig.name;
|
||||||
|
|
@ -24,109 +24,153 @@ const canonicalURL = new URL(Astro.url.pathname, siteConfig.url);
|
||||||
---
|
---
|
||||||
|
|
||||||
<!doctype html>
|
<!doctype html>
|
||||||
<html lang="es" class="scroll-smooth dark" data-theme="default" data-theme-mode="system">
|
<html
|
||||||
<head>
|
lang="es"
|
||||||
<meta charset="UTF-8" />
|
class="scroll-smooth dark"
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
data-theme="default"
|
||||||
<meta name="generator" content={Astro.generator} />
|
data-theme-mode="system"
|
||||||
|
>
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
|
<meta name="generator" content={Astro.generator} />
|
||||||
|
|
||||||
<link rel="icon" type="image/svg+xml" href={siteConfig.favicon} />
|
<link rel="icon" type="image/svg+xml" href={siteConfig.favicon} />
|
||||||
<meta name="theme-color" content="#3b82f6" />
|
<meta name="theme-color" content="#3b82f6" />
|
||||||
|
|
||||||
<title>{pageTitle}</title>
|
<title>{pageTitle}</title>
|
||||||
<meta name="description" content={description} />
|
<meta name="description" content={description} />
|
||||||
<link rel="canonical" href={canonicalURL} />
|
<link rel="canonical" href={canonicalURL} />
|
||||||
{noindex && <meta name="robots" content="noindex, nofollow" />}
|
{noindex && <meta name="robots" content="noindex, nofollow" />}
|
||||||
|
|
||||||
<meta property="og:type" content="website" />
|
<meta property="og:type" content="website" />
|
||||||
<meta property="og:url" content={canonicalURL} />
|
<meta property="og:url" content={canonicalURL} />
|
||||||
<meta property="og:title" content={pageTitle} />
|
<meta property="og:title" content={pageTitle} />
|
||||||
<meta property="og:description" content={description} />
|
<meta property="og:description" content={description} />
|
||||||
{image && <meta property="og:image" content={new URL(image, siteConfig.url)} />}
|
{
|
||||||
|
image && (
|
||||||
<meta name="twitter:card" content="summary_large_image" />
|
<meta
|
||||||
<meta name="twitter:title" content={pageTitle} />
|
property="og:image"
|
||||||
<meta name="twitter:description" content={description} />
|
content={new URL(image, siteConfig.url)}
|
||||||
{image && <meta name="twitter:image" content={new URL(image, siteConfig.url)} />}
|
/>
|
||||||
|
)
|
||||||
<script is:inline>
|
|
||||||
(function () {
|
|
||||||
const VALID_MODES = ['system', 'light', 'dark'];
|
|
||||||
function getMode() {
|
|
||||||
try {
|
|
||||||
const stored = localStorage.getItem('theme');
|
|
||||||
if (VALID_MODES.indexOf(stored) !== -1) return stored;
|
|
||||||
} catch {}
|
|
||||||
return 'system';
|
|
||||||
}
|
|
||||||
function applyMode(el) {
|
|
||||||
const mode = getMode();
|
|
||||||
el.setAttribute('data-theme-mode', mode);
|
|
||||||
const isDark = mode === 'dark' || (mode === 'system' && window.matchMedia('(prefers-color-scheme: dark)').matches);
|
|
||||||
if (isDark) el.classList.add('dark');
|
|
||||||
else el.classList.remove('dark');
|
|
||||||
}
|
|
||||||
applyMode(document.documentElement);
|
|
||||||
if (!window.__themeListenersInit) {
|
|
||||||
window.__themeListenersInit = true;
|
|
||||||
const mql = window.matchMedia('(prefers-color-scheme: dark)');
|
|
||||||
const onSchemeChange = function () { if (getMode() === 'system') applyMode(document.documentElement); };
|
|
||||||
if (mql.addEventListener) mql.addEventListener('change', onSchemeChange);
|
|
||||||
}
|
|
||||||
})();
|
|
||||||
</script>
|
|
||||||
</head>
|
|
||||||
|
|
||||||
<body class="min-h-screen bg-background text-foreground antialiased">
|
|
||||||
<a
|
|
||||||
href="#main-content"
|
|
||||||
class="sr-only focus:not-sr-only focus:fixed focus:left-4 focus:top-4 focus:z-50 focus:rounded-md focus:bg-primary focus:px-4 focus:py-2 focus:text-primary-foreground"
|
|
||||||
>
|
|
||||||
Saltar al contenido
|
|
||||||
</a>
|
|
||||||
|
|
||||||
<Header />
|
|
||||||
|
|
||||||
<main id="main-content" class="flex-1 pt-16">
|
|
||||||
<slot />
|
|
||||||
</main>
|
|
||||||
|
|
||||||
<Footer />
|
|
||||||
|
|
||||||
<CursorTrail />
|
|
||||||
|
|
||||||
<button
|
|
||||||
id="back-to-top"
|
|
||||||
aria-label="Volver arriba"
|
|
||||||
class="fixed bottom-6 right-6 z-50 h-12 w-12 rounded-full bg-background border border-border-strong text-foreground-muted shadow-md hover:bg-secondary transition-all duration-200 opacity-0 translate-y-4 pointer-events-none"
|
|
||||||
>
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" class="mx-auto"><path d="m18 15-6-6-6 6"/></svg>
|
|
||||||
</button>
|
|
||||||
|
|
||||||
<script is:inline>
|
|
||||||
(function () {
|
|
||||||
const THRESHOLD = 400;
|
|
||||||
const btn = document.getElementById('back-to-top');
|
|
||||||
if (!btn) return;
|
|
||||||
|
|
||||||
function update() {
|
|
||||||
if (window.scrollY > THRESHOLD) {
|
|
||||||
btn.style.opacity = '1';
|
|
||||||
btn.style.translate = '0 0';
|
|
||||||
btn.style.pointerEvents = 'auto';
|
|
||||||
} else {
|
|
||||||
btn.style.opacity = '0';
|
|
||||||
btn.style.translate = '0 1rem';
|
|
||||||
btn.style.pointerEvents = 'none';
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
window.addEventListener('scroll', update, { passive: true });
|
<meta name="twitter:card" content="summary_large_image" />
|
||||||
btn.addEventListener('click', function () {
|
<meta name="twitter:title" content={pageTitle} />
|
||||||
window.scrollTo({ top: 0, behavior: 'smooth' });
|
<meta name="twitter:description" content={description} />
|
||||||
});
|
{
|
||||||
update();
|
image && (
|
||||||
})();
|
<meta
|
||||||
</script>
|
name="twitter:image"
|
||||||
</body>
|
content={new URL(image, siteConfig.url)}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
<script is:inline>
|
||||||
|
(function () {
|
||||||
|
const VALID_MODES = ["system", "light", "dark"];
|
||||||
|
function getMode() {
|
||||||
|
try {
|
||||||
|
const stored = localStorage.getItem("theme");
|
||||||
|
if (VALID_MODES.indexOf(stored) !== -1) return stored;
|
||||||
|
} catch {}
|
||||||
|
return "system";
|
||||||
|
}
|
||||||
|
function applyMode(el) {
|
||||||
|
const mode = getMode();
|
||||||
|
el.setAttribute("data-theme-mode", mode);
|
||||||
|
const isDark =
|
||||||
|
mode === "dark" ||
|
||||||
|
(mode === "system" &&
|
||||||
|
window.matchMedia("(prefers-color-scheme: dark)")
|
||||||
|
.matches);
|
||||||
|
if (isDark) el.classList.add("dark");
|
||||||
|
else el.classList.remove("dark");
|
||||||
|
}
|
||||||
|
applyMode(document.documentElement);
|
||||||
|
if (!window.__themeListenersInit) {
|
||||||
|
window.__themeListenersInit = true;
|
||||||
|
const mql = window.matchMedia(
|
||||||
|
"(prefers-color-scheme: dark)",
|
||||||
|
);
|
||||||
|
const onSchemeChange = function () {
|
||||||
|
if (getMode() === "system")
|
||||||
|
applyMode(document.documentElement);
|
||||||
|
};
|
||||||
|
if (mql.addEventListener)
|
||||||
|
mql.addEventListener("change", onSchemeChange);
|
||||||
|
}
|
||||||
|
})();
|
||||||
|
</script>
|
||||||
|
<script
|
||||||
|
defer
|
||||||
|
src="https://umami.aoncoz.cc/script.js"
|
||||||
|
data-website-id="58738a7d-4beb-46c1-906b-75ec06340f25"></script>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body class="min-h-screen bg-background text-foreground antialiased">
|
||||||
|
<a
|
||||||
|
href="#main-content"
|
||||||
|
class="sr-only focus:not-sr-only focus:fixed focus:left-4 focus:top-4 focus:z-50 focus:rounded-md focus:bg-primary focus:px-4 focus:py-2 focus:text-primary-foreground"
|
||||||
|
>
|
||||||
|
Saltar al contenido
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<Header />
|
||||||
|
|
||||||
|
<main id="main-content" class="flex-1 pt-16">
|
||||||
|
<slot />
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<Footer />
|
||||||
|
|
||||||
|
<CursorTrail />
|
||||||
|
|
||||||
|
<button
|
||||||
|
id="back-to-top"
|
||||||
|
aria-label="Volver arriba"
|
||||||
|
class="fixed bottom-6 right-6 z-50 h-12 w-12 rounded-full bg-background border border-border-strong text-foreground-muted shadow-md hover:bg-secondary transition-all duration-200 opacity-0 translate-y-4 pointer-events-none"
|
||||||
|
>
|
||||||
|
<svg
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
width="16"
|
||||||
|
height="16"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
fill="none"
|
||||||
|
stroke="currentColor"
|
||||||
|
stroke-width="2.5"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
class="mx-auto"><path d="m18 15-6-6-6 6"></path></svg
|
||||||
|
>
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<script is:inline>
|
||||||
|
(function () {
|
||||||
|
const THRESHOLD = 400;
|
||||||
|
const btn = document.getElementById("back-to-top");
|
||||||
|
if (!btn) return;
|
||||||
|
|
||||||
|
function update() {
|
||||||
|
if (window.scrollY > THRESHOLD) {
|
||||||
|
btn.style.opacity = "1";
|
||||||
|
btn.style.translate = "0 0";
|
||||||
|
btn.style.pointerEvents = "auto";
|
||||||
|
} else {
|
||||||
|
btn.style.opacity = "0";
|
||||||
|
btn.style.translate = "0 1rem";
|
||||||
|
btn.style.pointerEvents = "none";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
window.addEventListener("scroll", update, { passive: true });
|
||||||
|
btn.addEventListener("click", function () {
|
||||||
|
window.scrollTo({ top: 0, behavior: "smooth" });
|
||||||
|
});
|
||||||
|
update();
|
||||||
|
})();
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue