pigui/gureametsabilagun
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Indicaciones del cliente: adopción solo Perros/Gatos, fichas nuevas y todo configurable

Browse Source 
- Adopción sin filtros ni etiquetas: acceso a Perros y Gatos, tarjetas de foto y nombre.
- Ficha nueva: galería, vídeo, fecha de nacimiento o edad aproximada, carácter,
  necesidades, convivencia y hogar que buscamos (textos por idioma, datos compartidos).
- Estados disponible / en proceso / adoptado y animales destacados.
- Botón «Quiero conocerlo/la» con formulario breve (animal incluido) y confirmación.
- Botones para compartir cada ficha (WhatsApp, Facebook, copiar enlace).
- Portada corta según la propuesta del cliente; donaciones, cifras, etc. ocultas.
- Páginas Acoge y Preguntas frecuentes, menú con submenús, sin hotel.
- Aviso de cita previa y lista de ayuda material editables desde el panel.
- Plugin núcleo dividido en módulos (i18n, animales, formularios, APIs).
- Migración 5 idempotente: respeta las páginas editadas por el cliente.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
Josep Piguillem
2026-09-24 22:16:24 +02:00
parent 532bc620de
commit 4acc8b62d1
41 changed files with 1985 additions and 1533 deletions
Download Patch File Download Diff File Expand all files Collapse all files

101
wp-content/themes/gure-ametsa/style.css
View File

@@ -185,11 +185,22 @@ p { margin: 0 0 1.1em; }
.ga-nav { margin-inline: auto; }
.ga-nav ul { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: 2px; }
.ga-nav a {
display: block; padding: 8px 13px; border-radius: 999px;
color: var(--ga-ink); text-decoration: none; font-weight: 600; font-size: .96rem;
display: block; padding: 8px 11px; border-radius: 999px; white-space: nowrap;
color: var(--ga-ink); text-decoration: none; font-weight: 600; font-size: .95rem;
}
.ga-nav a:hover, .ga-nav .current-menu-item > a, .ga-nav .current_page_item > a { background: var(--ga-green-soft); color: var(--ga-green-dark); }
.ga-nav-highlight .ga-nav .menu-item:first-child a { background: var(--ga-red); color: var(--ga-on-red); }
.ga-nav-highlight .ga-nav .menu-item:first-child > a { background: var(--ga-red); color: var(--ga-on-red); }
.ga-nav .menu-item-has-children { position: relative; }
.ga-nav .menu-item-has-children > a::after { content: ""; display: inline-block; vertical-align: middle; width: 6px; height: 6px; margin-left: 7px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: translateY(-3px) rotate(45deg); opacity: .6; }
.ga-nav .sub-menu {
position: absolute; top: calc(100% + 6px); left: 0; min-width: 210px; z-index: 60;
display: none; flex-direction: column; align-items: stretch; gap: 2px; padding: 8px;
background: #fff; border: 1px solid var(--ga-line); border-radius: calc(var(--ga-radius) * .8); box-shadow: var(--ga-shadow);
}
.ga-nav .sub-menu::before { content: ""; position: absolute; inset: -10px 0 auto 0; height: 10px; }
.ga-nav .menu-item-has-children:hover > .sub-menu,
.ga-nav .menu-item-has-children:focus-within > .sub-menu { display: flex; }
.ga-nav .sub-menu a { border-radius: 8px; white-space: nowrap; }
.ga-header__actions { display: flex; align-items: center; gap: 12px; flex: none; }
.ga-header__phone { display: inline-flex; align-items: center; gap: 7px; color: var(--ga-green); font-weight: 700; text-decoration: none; font-size: .95rem; white-space: nowrap; }
@@ -208,10 +219,10 @@ p { margin: 0 0 1.1em; }
padding: 8px 14px; font: 700 .92rem var(--ga-sans); color: var(--ga-green); cursor: pointer;
}
@media (max-width: 1180px) {
@media (max-width: 1320px) {
.ga-header__phone span { display: none; }
}
@media (max-width: 1060px) {
@media (max-width: 1180px) {
.ga-menu-toggle { display: inline-flex; }
.ga-nav {
position: absolute; inset: 100% 0 auto 0; margin: 0;
@@ -221,6 +232,9 @@ p { margin: 0 0 1.1em; }
.ga-nav.is-open { display: block; }
.ga-nav ul { flex-direction: column; align-items: stretch; }
.ga-nav a { padding: 12px 16px; font-size: 1.05rem; }
.ga-nav .sub-menu { position: static; display: flex; box-shadow: none; border: 0; padding: 0 0 6px 16px; background: none; min-width: 0; }
.ga-nav .sub-menu a { font-size: .98rem; padding: 8px 16px; color: var(--ga-muted); }
.ga-nav .menu-item-has-children > a::after { display: none; }
.ga-header__actions { margin-left: auto; }
}
@media (max-width: 640px) {
@@ -282,7 +296,7 @@ body { overflow-x: clip; }
.ga-hero--split .ga-btn--ghost:hover { background: var(--ga-green); color: var(--ga-on-primary); }
.ga-hero__media img, .ga-hero__art { width: 100%; aspect-ratio: 4/5; object-fit: cover; border-radius: 240px 240px var(--ga-radius) var(--ga-radius); box-shadow: var(--ga-shadow); }
.ga-hero__art { background: var(--ga-green); color: var(--ga-cream); display: grid; place-items: center; }
.ga-hero__art svg { width: 55%; }
.ga-hero__art svg { width: 62%; height: auto; }
@media (max-width: 860px) {
.ga-hero--split .ga-hero__inner { grid-template-columns: 1fr; }
.ga-hero__media { max-width: 420px; }
@@ -340,7 +354,7 @@ body { overflow-x: clip; }
.ga-photo { margin: 0; }
.ga-photo img, .ga-photo__placeholder { width: 100%; aspect-ratio: 3/2; object-fit: cover; border-radius: var(--ga-radius); box-shadow: var(--ga-shadow); }
.ga-photo__placeholder { display: grid; place-items: center; background: var(--ga-green-soft); color: var(--ga-green); }
.ga-photo__placeholder svg { width: 28%; opacity: .35; }
.ga-photo__placeholder svg { width: 38%; height: auto; opacity: .45; }
.ga-photo figcaption { margin-top: 10px; font-size: .85rem; color: var(--ga-muted); }
.ga-list-title { font-size: 1.25rem; margin-top: 28px; }
@@ -416,7 +430,8 @@ body { overflow-x: clip; }
.ga-species__tile img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .6s; z-index: -1; }
.ga-species__tile::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 45%, rgba(0, 0, 0, .55)); z-index: -1; }
.ga-species__tile:hover img { transform: scale(1.05); }
.ga-species__paw { position: absolute; right: 8%; top: 12%; width: 32%; opacity: .2; }
.ga-species__paw { position: absolute; right: 8%; top: 12%; width: 34%; opacity: .35; }
.ga-species__paw svg { display: block; width: 100%; height: auto; }
.ga-species__label { position: absolute; left: 24px; bottom: 22px; right: 24px; font: var(--ga-heading-weight) clamp(1.4rem, 3vw, 2.1rem)/1.1 var(--ga-serif); color: #fff; }
@media (max-width: 640px) { .ga-species { grid-template-columns: 1fr; } .ga-species__tile { aspect-ratio: 2/1; } }
@@ -442,7 +457,7 @@ body { overflow-x: clip; }
.ga-card__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.ga-card:hover .ga-card__img img { transform: scale(1.04); }
.ga-card__placeholder { width: 100%; height: 100%; display: grid; place-items: center; color: var(--ga-green); }
.ga-card__placeholder svg { width: 36%; opacity: .3; }
.ga-card__placeholder svg { width: 46%; height: auto; opacity: .45; }
.ga-card__body { padding: 16px 18px 18px; flex: 1; display: flex; flex-direction: column; }
.ga-card__title { margin: 0 0 4px; font-size: 1.45rem; }
.ga-card__title a { color: inherit; text-decoration: none; }
@@ -535,6 +550,67 @@ body { overflow-x: clip; }
.ga-animal__photo { position: static; }
}
/* Pestañas Perros / Gatos */
.ga-tabs { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 28px; }
.ga-tab { padding: 11px 26px; border-radius: 999px; border: 2px solid var(--ga-green); color: var(--ga-green); font-weight: 700; text-decoration: none; font-size: 1.05rem; }
.ga-tab:hover { background: var(--ga-green-soft); color: var(--ga-green-dark); }
.ga-tab.is-active { background: var(--ga-green); color: var(--ga-on-primary); }
/* Tarjeta detallada */
.ga-card__excerpt { margin: 0; font-size: .95rem; color: var(--ga-muted); }
.ga-card:not(.ga-card--detailed) .ga-card__body { padding: 14px 18px 16px; }
.ga-card:not(.ga-card--detailed) .ga-card__title { margin: 0; }
/* Proceso de adopción */
.ga-process { margin-top: 48px; padding: clamp(22px, 3vw, 32px); background: var(--ga-sand); border-radius: var(--ga-radius); }
.ga-process h2 { font-size: 1.5rem; }
.ga-process__steps { counter-reset: pr; list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.ga-process__steps li { counter-increment: pr; position: relative; padding-left: 46px; min-height: 32px; padding-top: 4px; }
.ga-process__steps li::before { content: counter(pr); position: absolute; left: 0; top: 0; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; background: var(--ga-green); color: var(--ga-on-primary); font: 800 .95rem var(--ga-serif); }
.ga-process__note { margin: 16px 0 0; font-weight: 600; color: var(--ga-green-dark); }
.ga-animal__info .ga-process { margin-top: 24px; }
/* Ficha: galería, vídeo, textos, formulario y compartir */
.ga-back { margin-bottom: 24px; }
.ga-back a { font-weight: 700; text-decoration: none; }
.ga-animal__media { position: sticky; top: 110px; }
.ga-animal__media .ga-animal__photo { position: static; }
.ga-thumbs { list-style: none; margin: 12px 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(72px, 1fr)); gap: 8px; }
.ga-thumbs button { display: block; width: 100%; padding: 0; border: 2px solid transparent; border-radius: 10px; overflow: hidden; cursor: pointer; background: none; aspect-ratio: 1; }
.ga-thumbs button[aria-current="true"] { border-color: var(--ga-green); }
.ga-thumbs img { width: 100%; height: 100%; object-fit: cover; }
.ga-video { margin-top: 16px; border-radius: var(--ga-radius); overflow: hidden; }
.ga-video iframe, .ga-video video { display: block; width: 100%; aspect-ratio: 16/9; height: auto; border: 0; }
.ga-animal__info h1 { margin-top: 10px; }
.ga-animal__story { font-size: 1.08rem; }
.ga-animal__block h2 { font-size: 1.3rem; margin: 1.4em 0 .4em; }
.ga-meet { margin-top: 32px; }
.ga-meet > summary { list-style: none; width: 100%; font-size: 1.08rem; padding: 1em 1.5em; }
.ga-meet > summary::-webkit-details-marker { display: none; }
.ga-meet[open] > summary { border-radius: var(--ga-radius) var(--ga-radius) 0 0; }
.ga-meet__panel { border: 2px solid var(--ga-green); border-top: 0; border-radius: 0 0 var(--ga-radius) var(--ga-radius); padding: 22px; background: #fff; }
.ga-meet__panel .ga-form { margin-top: 0; }
.ga-share { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 28px; padding-top: 20px; border-top: 1px solid var(--ga-line); font-weight: 600; }
.ga-share span { margin-right: 4px; }
.ga-share__btn { padding: 7px 14px; border-radius: 999px; border: 1.5px solid var(--ga-line); background: #fff; color: var(--ga-ink); font: 600 .9rem var(--ga-sans); text-decoration: none; cursor: pointer; }
.ga-share__btn:hover { border-color: var(--ga-green); color: var(--ga-green); }
@media (max-width: 860px) { .ga-animal__media { position: static; } }
/* Cita previa, enlaces y necesidades */
.ga-cita { display: flex; gap: 10px; align-items: flex-start; padding: 14px 18px; border-radius: calc(var(--ga-radius) * .7); background: var(--ga-red-soft); color: var(--ga-ink); font-weight: 600; }
.ga-cita--dark { background: rgba(255, 255, 255, .08); color: #fff; }
.ga-cita svg { margin-top: 3px; color: var(--ga-red); }
.ga-linklist { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.ga-linklist a { display: flex; justify-content: space-between; align-items: center; padding: 12px 0; border-bottom: 1px solid var(--ga-line); font-weight: 700; text-decoration: none; }
.ga-social-inline { display: flex; flex-wrap: wrap; gap: 10px 18px; margin-top: 26px; }
.ga-social-inline a { display: inline-flex; align-items: center; gap: 8px; font-weight: 700; }
.ga-needs-list { list-style: none; padding-left: 0 !important; display: grid; gap: 8px; }
.ga-needs-list li { position: relative; padding-left: 1.8em; }
.ga-needs-list li::before { content: "✓"; position: absolute; left: 0; font-weight: 800; color: var(--ga-red-dark); }
.ga-needs-note { font-weight: 600; color: var(--ga-green-dark); }
.ga-form__animal { margin: 0; font-weight: 700; }
.ga-footer__cita { color: #fff; font-weight: 600; }
/* =========================================================================
Formularios
========================================================================= */
@@ -617,7 +693,7 @@ ol.is-style-ga-pasos li::before {
.ga-footer { border-top: 1px solid rgba(255, 255, 255, .08); background: var(--ga-footer-bg); color: color-mix(in srgb, #fff 72%, var(--ga-footer-bg)); padding: 72px 0 28px; font-size: .95rem; }
.ga-footer a { color: #fff; text-decoration: none; }
.ga-footer a:hover { text-decoration: underline; color: #fff; }
.ga-footer__grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1.1fr; gap: 40px; }
.ga-footer__grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1fr 1.3fr; gap: 36px; }
.ga-footer h2 { color: #fff; font: 800 .76rem/1 var(--ga-sans); letter-spacing: .16em; text-transform: uppercase; margin-bottom: 1.4em; }
.ga-footer ul { list-style: none; margin: 0; padding: 0; }
.ga-footer li { margin-bottom: 10px; }
@@ -631,14 +707,15 @@ ol.is-style-ga-pasos li::before {
.ga-footer__bottom { margin-top: 56px; padding-top: 22px; border-top: 1px solid rgba(255, 255, 255, .14); display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; font-size: .85rem; }
.ga-footer__bottom ul { display: flex; gap: 18px; }
.ga-footer__bottom li { margin: 0; }
@media (max-width: 960px) { .ga-footer__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 1080px) { .ga-footer__grid { grid-template-columns: repeat(3, 1fr); } .ga-footer__about { grid-column: 1 / -1; } }
@media (max-width: 760px) { .ga-footer__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .ga-footer__grid { grid-template-columns: 1fr; } }
/* =========================================================================
Varios
========================================================================= */
.ga-404 { text-align: center; padding: 110px 0; }
.ga-404 svg { width: 90px; margin: 0 auto 20px; color: var(--ga-green); }
.ga-404 svg { width: 120px; height: auto; margin: 0 auto 24px; display: block; }
@media (prefers-reduced-motion: reduce) {
*, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }