Files
arboretum/packages/site/src/components/FinalCta.vue
Johan LEROY ca6700d6ce
All checks were successful
Deploy site (production) / build-and-deploy (push) Successful in 15s
fix(site): corrige la page blanche (PageSpeed), ajoute des boutons copier, corrige l'URL Gitea
- .htaccess : désactive Google PageSpeed (mod_pagespeed/ngx_pagespeed) qui renvoyait
  un corps HTML vide sur le vhost Plesk (home en 200 mais 0 octet → page blanche),
  alors que les assets Vite passaient. Backstop versionné du fix côté serveur.
- CopyButton réutilisable (variantes bar/icon, retour ✓ 1,8 s, bilingue, accessible) :
  ajoute « copier » sur la commande de How-it-works, l'URL localhost et la commande du footer.
- URL du dépôt Gitea : johanleroy/git-arboretum → johanleroy/arboretum (centralisée dans
  lib/links.ts). Le paquet npm @johanleroy/git-arboretum reste inchangé (c'est son nom).
- Port affiché corrigé : localhost:7777 → 7317 (port réel du daemon, cf. config.ts).
2026-06-19 10:42:41 +02:00

53 lines
1.9 KiB
Vue

<script setup lang="ts">
import { useI18n } from 'vue-i18n';
import { INSTALL_COMMAND } from '../composables/useCopy';
import { REPO } from '../lib/links';
import IconGitea from './icons/IconGitea.vue';
import CopyButton from './CopyButton.vue';
const { t } = useI18n();
</script>
<template>
<section class="mx-auto max-w-[1200px] px-6 pb-[100px]">
<div
v-reveal
class="rounded-[20px] border border-zinc-800 px-6 py-[clamp(36px,5vw,64px)] text-center"
style="background: radial-gradient(120% 140% at 50% 0%, rgba(16, 185, 129, 0.1), transparent 60%), #0c0c0e"
>
<img
src="/assets/arboretum-mark.png"
alt=""
width="52"
height="52"
class="mx-auto mb-5 block h-[52px] w-[52px] object-contain"
/>
<h2 class="m-0 mb-3.5 text-[clamp(30px,4vw,46px)] font-bold leading-[1.08] tracking-[-0.03em] text-zinc-50">
{{ t('ctaTitle') }}
</h2>
<p class="mx-auto mb-7 max-w-[480px] text-[17px] text-zinc-400">{{ t('ctaBody') }}</p>
<div
class="mx-auto flex max-w-[460px] items-stretch overflow-hidden rounded-[10px] border border-zinc-800 bg-zinc-950"
>
<div class="flex min-w-0 flex-1 items-center gap-2.5 overflow-x-auto whitespace-nowrap px-4 font-mono text-sm">
<span class="text-emerald-400">$</span><span class="text-zinc-200">{{ INSTALL_COMMAND }}</span>
</div>
<CopyButton variant="bar" :text="INSTALL_COMMAND" :label="t('copyCommand')" bar-class="px-4" />
</div>
<div class="mt-[18px]">
<a
:href="REPO"
target="_blank"
rel="noopener"
class="inline-flex items-center gap-2 text-[14.5px] text-zinc-400 no-underline transition-colors hover:text-emerald-400"
>
<IconGitea :size="16" />
{{ t('ctaSource') }}
</a>
</div>
</div>
</section>
</template>