Vista prèvia estàtica (HTML sense JS): els botons d'aquí no responen. El component real sí que és interactiu.
-
Medicina, Odontologia, Administració i Direcció d'Empreses i Psicologia, entre les preferides per l'alumnat nou.
-
S'ha publicat avui al Diari Oficial de la Generalitat de Catalunya, després del vistiplau del Govern.
-
El rector, Joan Guàrdia, va qualificar de prioritària la relació amb aquesta xarxa hospitalària, on fan pràctiques 4.400 alumnes de la UB.
-
L'aliança universitària CHARM-EU ha obtingut 7,2 milions d'euros de finançament en la convocatòria Erasmus+ European Universities 2026, que li permetran consolidar i ampliar les activitats fins al 2028.
Correcció aplicada: `UbNewsList` amb `title`/`titleAction` cobreix el bloc "Actualitat" complet de la portada: capçalera (títol + enllaç "Tota l'actualitat" + paginador) i graella de 4 columnes amb imatge, categoria, data i resum (`summary`). A la pàgina real, el títol, l'enllaç i el paginador comparteixen la mateixa fila — per això viuen dins de `UbNewsList`, no en un `UbSectionHeaderWithAction` separat. Les 4 notícies, imatges i resums són els reals publicats a `web.ub.edu` en el moment de generar aquest exemple. La vora de la card (`border-ub-line`) coincideix amb la real (`#EBEBEB` a `web.ub.edu`, molt propera al nostre token `ub-line` `#DEDEDE`).
Codi HTML + Tailwind
<div class="">
<div class="mb-[31px] flex flex-wrap items-center justify-between gap-4">
<div class="flex flex-wrap items-center gap-x-5 gap-y-1">
<h2 class="text-pretty text-[45px] font-bold leading-[54px] text-black">Actualitat</h2>
<span aria-hidden="true" class="h-[30px] w-px bg-black">
</span>
<a href="https://web.ub.edu/ca/web/actualitat" class="inline-flex items-center gap-1 text-[20px] font-medium leading-6 text-black hover:text-ub-blue">Tota l'actualitat<svg aria-hidden="true" viewBox="0 0 10 17.49" class="h-[18px] w-[10.3px] shrink-0 fill-current">
<path d="M18.232,14.938,11.614,8.325a1.245,1.245,0,0,1,0-1.765,1.26,1.26,0,0,1,1.77,0l7.5,7.493a1.248,1.248,0,0,1,.036,1.724l-7.53,7.545a1.25,1.25,0,0,1-1.77-1.765Z" transform="translate(-11.246 -6.196)">
</path>
</svg>
</a>
</div>
<div class="flex gap-2">
<button type="button" disabled="" aria-label="Anterior" class="flex h-10 w-10 items-center justify-center rounded-full border-[3px] border-black/80 bg-white text-black disabled:cursor-not-allowed disabled:border-ub-line disabled:text-ub-muted disabled:opacity-40">
<span aria-hidden="true" class="block h-[10px] w-[10px] border-r-[3px] border-b-[3px] border-current translate-x-[2px] rotate-[135deg]">
</span>
</button>
<button type="button" aria-label="Següent" class="flex h-10 w-10 items-center justify-center rounded-full border-[3px] border-black/80 bg-white text-black disabled:cursor-not-allowed disabled:border-ub-line disabled:text-ub-muted disabled:opacity-40">
<span aria-hidden="true" class="block h-[10px] w-[10px] border-r-[3px] border-b-[3px] border-current -translate-x-[2px] -rotate-45">
</span>
</button>
</div>
</div>
<ul class="grid grid-cols-1 gap-5 sm:grid-cols-2 lg:grid-cols-4">
<li>
<article class="group relative flex h-full flex-col border border-ub-line bg-white transition-shadow hover:shadow-[0_3px_6px_rgba(0,0,0,0.36)]">
<img src="https://web.ub.edu/documents/2685349/6785461/notes-tall-2026.jpg/5a2dc888-ee0b-6064-4c63-cdc42b8090b3?t=1783678770145" alt="Set de les nou titulacions més demanades a Catalunya són de la Universitat de Barcelona" loading="lazy" class="aspect-[16/9] w-full object-cover"/>
<div class="flex flex-1 flex-col p-6">
<div class="flex items-center justify-between gap-3">
<p class="text-[19px] font-bold uppercase leading-[28.5px] text-ub-research">Acadèmic</p>
<p class="text-[19px] font-medium leading-[28.5px] text-ub-muted">10-07-2026</p>
</div>
<h3 class="mt-2 text-pretty text-[22px] font-bold leading-[26.4px] text-ub-text group-hover:text-ub-blue">
<a href="https://web.ub.edu/ca/web/actualitat/w/universitat-mes-solicitada-primera-opcio-2026" class="after:absolute after:inset-0 after:content-[''] focus:outline-none focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ub-blue">La Universitat de Barcelona torna a ser la universitat catalana més sol·licitada en primera opció</a>
</h3>
<p class="mt-3 text-base leading-6 text-ub-text">Medicina, Odontologia, Administració i Direcció d'Empreses i Psicologia, entre les preferides per l'alumnat nou.</p>
</div>
</article>
</li>
<li>
<article class="group relative flex h-full flex-col border border-ub-line bg-white transition-shadow hover:shadow-[0_3px_6px_rgba(0,0,0,0.36)]">
<img src="https://web.ub.edu/documents/2685349/6785461/estatut-ub-2025.jpg/70cc4dee-0542-56b1-e438-78172d6e5e23?t=1783601510533" alt="El nou Estatut de la Universitat de Barcelona, en vigor a partir de demà, 10 de juliol" loading="lazy" class="aspect-[16/9] w-full object-cover"/>
<div class="flex flex-1 flex-col p-6">
<div class="flex items-center justify-between gap-3">
<p class="text-[19px] font-bold uppercase leading-[28.5px] text-ub-research">Institucional</p>
<p class="text-[19px] font-medium leading-[28.5px] text-ub-muted">09-07-2026</p>
</div>
<h3 class="mt-2 text-pretty text-[22px] font-bold leading-[26.4px] text-ub-text group-hover:text-ub-blue">
<a href="https://web.ub.edu/ca/web/actualitat/w/nou-estatut-entra-en-vigor" class="after:absolute after:inset-0 after:content-[''] focus:outline-none focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ub-blue">El nou Estatut de la Universitat de Barcelona, en vigor a partir de demà, 10 de juliol</a>
</h3>
<p class="mt-3 text-base leading-6 text-ub-text">S'ha publicat avui al Diari Oficial de la Generalitat de Catalunya, després del vistiplau del Govern.</p>
</div>
</article>
</li>
<li>
<article class="group relative flex h-full flex-col border border-ub-line bg-white transition-shadow hover:shadow-[0_3px_6px_rgba(0,0,0,0.36)]">
<img src="https://web.ub.edu/documents/2685349/6785461/trobada-institucions-sanitaries-2026.jpg/b229b6a9-f56e-bfad-83b8-ea5688e12d79?t=1783593314831" alt="La salut planetària i la medicina de precisió, temes de la trobada anual entre la UB i les institucions sanitàries amb què està vinculada" loading="lazy" class="aspect-[16/9] w-full object-cover"/>
<div class="flex flex-1 flex-col p-6">
<div class="flex items-center justify-between gap-3">
<p class="text-[19px] font-bold uppercase leading-[28.5px] text-ub-research">Institucional</p>
<p class="text-[19px] font-medium leading-[28.5px] text-ub-muted">09-07-2026</p>
</div>
<h3 class="mt-2 text-pretty text-[22px] font-bold leading-[26.4px] text-ub-text group-hover:text-ub-blue">
<a href="https://web.ub.edu/ca/web/actualitat/w/trobada-anual-institucions-sanitaries-2026" class="after:absolute after:inset-0 after:content-[''] focus:outline-none focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ub-blue">La salut planetària i la medicina de precisió, temes de la trobada anual entre la UB i les institucions sanitàries amb què està vinculada</a>
</h3>
<p class="mt-3 text-base leading-6 text-ub-text">El rector, Joan Guàrdia, va qualificar de prioritària la relació amb aquesta xarxa hospitalària, on fan pràctiques 4.400 alumnes de la UB.</p>
</div>
</article>
</li>
<li>
<article class="group relative flex h-full flex-col border border-ub-line bg-white transition-shadow hover:shadow-[0_3px_6px_rgba(0,0,0,0.36)]">
<img src="https://web.ub.edu/documents/2710030/46107409/charmeu-20260706.jpg/116d97ab-582e-99a6-849a-11d9ab701631?t=1783329840706" alt="La CHARM-EU obté set milions d'euros de finançament europeu per créixer fins al 2028" loading="lazy" class="aspect-[16/9] w-full object-cover"/>
<div class="flex flex-1 flex-col p-6">
<div class="flex items-center justify-between gap-3">
<p class="text-[19px] font-bold uppercase leading-[28.5px] text-ub-research">Internacional</p>
<p class="text-[19px] font-medium leading-[28.5px] text-ub-muted">09-07-2026</p>
</div>
<h3 class="mt-2 text-pretty text-[22px] font-bold leading-[26.4px] text-ub-text group-hover:text-ub-blue">
<a href="https://web.ub.edu/ca/web/actualitat/w/charmeu-financament-europeu" class="after:absolute after:inset-0 after:content-[''] focus:outline-none focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ub-blue">La CHARM-EU obté set milions d'euros de finançament europeu per créixer fins al 2028</a>
</h3>
<p class="mt-3 text-base leading-6 text-ub-text">L'aliança universitària CHARM-EU ha obtingut 7,2 milions d'euros de finançament en la convocatòria Erasmus+ European Universities 2026, que li permetran consolidar i ampliar les activitats fins al 2028.</p>
</div>
</article>
</li>
</ul>
</div>
Exemple JSON (public/data/pages/*.json)
{
"type": "ub.newsList",
"id": "actualitat",
"title": "Actualitat",
"action": {
"label": "Tota l'actualitat",
"href": "https://web.ub.edu/ca/web/actualitat"
},
"variant": "grid",
"columns": 4,
"itemsPerPage": 4,
"items": [
{
"title": "La Universitat de Barcelona torna a ser la universitat catalana més sol·licitada en primera opció",
"href": "https://web.ub.edu/ca/web/actualitat/w/universitat-mes-solicitada-primera-opcio-2026",
"category": "Acadèmic",
"date": "10-07-2026",
"summary": "Medicina, Odontologia, Administració i Direcció d'Empreses i Psicologia, entre les preferides per l'alumnat nou.",
"image": {
"src": "https://web.ub.edu/documents/2685349/6785461/notes-tall-2026.jpg/5a2dc888-ee0b-6064-4c63-cdc42b8090b3?t=1783678770145",
"alt": "Set de les nou titulacions més demanades a Catalunya són de la Universitat de Barcelona"
}
},
{
"title": "El nou Estatut de la Universitat de Barcelona, en vigor a partir de demà, 10 de juliol",
"href": "https://web.ub.edu/ca/web/actualitat/w/nou-estatut-entra-en-vigor",
"category": "Institucional",
"date": "09-07-2026",
"summary": "S'ha publicat avui al Diari Oficial de la Generalitat de Catalunya, després del vistiplau del Govern.",
"image": {
"src": "https://web.ub.edu/documents/2685349/6785461/estatut-ub-2025.jpg/70cc4dee-0542-56b1-e438-78172d6e5e23?t=1783601510533",
"alt": "El nou Estatut de la Universitat de Barcelona, en vigor a partir de demà, 10 de juliol"
}
},
{
"title": "La salut planetària i la medicina de precisió, temes de la trobada anual entre la UB i les institucions sanitàries amb què està vinculada",
"href": "https://web.ub.edu/ca/web/actualitat/w/trobada-anual-institucions-sanitaries-2026",
"category": "Institucional",
"date": "09-07-2026",
"summary": "El rector, Joan Guàrdia, va qualificar de prioritària la relació amb aquesta xarxa hospitalària, on fan pràctiques 4.400 alumnes de la UB.",
"image": {
"src": "https://web.ub.edu/documents/2685349/6785461/trobada-institucions-sanitaries-2026.jpg/b229b6a9-f56e-bfad-83b8-ea5688e12d79?t=1783593314831",
"alt": "La salut planetària i la medicina de precisió, temes de la trobada anual entre la UB i les institucions sanitàries amb què està vinculada"
}
},
{
"title": "La CHARM-EU obté set milions d'euros de finançament europeu per créixer fins al 2028",
"href": "https://web.ub.edu/ca/web/actualitat/w/charmeu-financament-europeu",
"category": "Internacional",
"date": "09-07-2026",
"summary": "L'aliança universitària CHARM-EU ha obtingut 7,2 milions d'euros de finançament en la convocatòria Erasmus+ European Universities 2026, que li permetran consolidar i ampliar les activitats fins al 2028.",
"image": {
"src": "https://web.ub.edu/documents/2710030/46107409/charmeu-20260706.jpg/116d97ab-582e-99a6-849a-11d9ab701631?t=1783329840706",
"alt": "La CHARM-EU obté set milions d'euros de finançament europeu per créixer fins al 2028"
}
},
{
"title": "La UB obre les inscripcions de la segona edició d'UB Alma Mater, el torneig universitari de League of Legends",
"href": "https://web.ub.edu/ca/web/actualitat/w/inscripcions-segona-edicio-ub-alma-mater",
"category": "Esport",
"date": "06-07-2026",
"summary": "La Universitat de Barcelona ha obert les inscripcions per participar en la segona edició d'UB Alma Mater, el torneig de League of Legends adreçat a tota la comunitat universitària.",
"image": {
"src": "https://web.ub.edu/documents/2710030/46107409/alma-mater-202607_1.png/22a41daa-f436-7513-9929-c0a9f0bf5254?t=1783337606354",
"alt": "La UB obre les inscripcions de la segona edició d'UB Alma Mater, el torneig universitari de League of Legends"
}
}
]
}
-
S'ha publicat avui al Diari Oficial de la Generalitat de Catalunya, després del vistiplau del Govern.
-
Medicina, Odontologia, Administració i Direcció d'Empreses i Psicologia, entre les preferides per l'alumnat nou.
-
L'aliança universitària CHARM-EU ha obtingut 7,2 milions d'euros de finançament en la convocatòria Erasmus+ European Universities 2026.
Correcció aplicada: El bloc "Destaquem" real (un carrusel Glider.js amb fletxes anterior/següent) mostra imatge + categoria + títol + resum per targeta, però NO data - a diferència del bloc "Actualitat" de portada. `variant="compact"` sí admet `image` (reserva la mateixa caixa `aspect-[16/9]` amb `bg-ub-panel` si no se'n passa cap) - no s'ha de confondre amb "sense imatge".
Codi HTML + Tailwind
<ul class="grid grid-cols-1 divide-y divide-ub-line sm:gap-y-10 sm:divide-y-0 sm:divide-x sm:grid-cols-2 lg:grid-cols-4 ">
<li class="py-6 first:pt-0 sm:py-0 sm:px-8 sm:first:pl-0">
<article class="group relative flex h-full flex-col">
<img src="https://web.ub.edu/documents/2710030/41751574/aprovaci%C3%B3estatutslider.jpg/a09c30c7-114f-01fb-bd17-427bba5f10f6?t=1764158670306" alt="El nou Estatut de la Universitat de Barcelona, en vigor a partir de demà, 10 de juliol" loading="lazy" class="aspect-[16/9] w-full object-cover"/>
<div class="mt-4">
<div class="flex items-center justify-between gap-3">
<p class="text-[19px] font-bold uppercase leading-[28.5px] text-ub-research">Institucional</p>
</div>
<h3 class="mt-2 text-pretty text-[22px] font-bold leading-[26.4px] text-ub-text group-hover:text-ub-blue">
<a href="https://web.ub.edu/ca/web/actualitat/w/nou-estatut-entra-en-vigor" class="after:absolute after:inset-0 after:content-[''] focus:outline-none focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ub-blue">El nou Estatut de la Universitat de Barcelona, en vigor a partir de demà, 10 de juliol</a>
</h3>
<p class="mt-2 text-base leading-6 text-ub-text">S'ha publicat avui al Diari Oficial de la Generalitat de Catalunya, després del vistiplau del Govern.</p>
</div>
</article>
</li>
<li class="py-6 first:pt-0 sm:py-0 sm:px-8 sm:first:pl-0">
<article class="group relative flex h-full flex-col">
<img src="https://web.ub.edu/documents/2710030/46107409/notes-tall-2026.jpg/c687cac3-bb50-90c3-94af-c5f7da4d0212?t=1783673239311" alt="La Universitat de Barcelona torna a ser la universitat catalana més sol·licitada en primera opció" loading="lazy" class="aspect-[16/9] w-full object-cover"/>
<div class="mt-4">
<div class="flex items-center justify-between gap-3">
<p class="text-[19px] font-bold uppercase leading-[28.5px] text-ub-research">Acadèmic</p>
</div>
<h3 class="mt-2 text-pretty text-[22px] font-bold leading-[26.4px] text-ub-text group-hover:text-ub-blue">
<a href="https://web.ub.edu/ca/web/actualitat/w/universitat-mes-solicitada-primera-opcio-2026" class="after:absolute after:inset-0 after:content-[''] focus:outline-none focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ub-blue">La Universitat de Barcelona torna a ser la universitat catalana més sol·licitada en primera opció</a>
</h3>
<p class="mt-2 text-base leading-6 text-ub-text">Medicina, Odontologia, Administració i Direcció d'Empreses i Psicologia, entre les preferides per l'alumnat nou.</p>
</div>
</article>
</li>
<li class="py-6 first:pt-0 sm:py-0 sm:px-8 sm:first:pl-0">
<article class="group relative flex h-full flex-col">
<img src="https://web.ub.edu/documents/2710030/46107409/charmeu-20260706.jpg/116d97ab-582e-99a6-849a-11d9ab701631?t=1783329840706" alt="La CHARM-EU obté set milions d'euros de finançament europeu per créixer fins al 2028" loading="lazy" class="aspect-[16/9] w-full object-cover"/>
<div class="mt-4">
<div class="flex items-center justify-between gap-3">
<p class="text-[19px] font-bold uppercase leading-[28.5px] text-ub-research">Internacional</p>
</div>
<h3 class="mt-2 text-pretty text-[22px] font-bold leading-[26.4px] text-ub-text group-hover:text-ub-blue">
<a href="https://web.ub.edu/ca/web/actualitat/w/charmeu-financament-europeu" class="after:absolute after:inset-0 after:content-[''] focus:outline-none focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ub-blue">La CHARM-EU obté set milions d'euros de finançament europeu per créixer fins al 2028</a>
</h3>
<p class="mt-2 text-base leading-6 text-ub-text">L'aliança universitària CHARM-EU ha obtingut 7,2 milions d'euros de finançament en la convocatòria Erasmus+ European Universities 2026.</p>
</div>
</article>
</li>
</ul>
Exemple JSON (public/data/pages/*.json)
{
"type": "ub.newsList",
"id": "destaquem-compacte",
"title": "Destaquem",
"hideTitle": true,
"variant": "compact",
"columns": 4,
"items": [
{
"category": "Institucional",
"title": "El nou Estatut de la Universitat de Barcelona, en vigor a partir de demà, 10 de juliol",
"href": "https://web.ub.edu/ca/web/actualitat/w/nou-estatut-entra-en-vigor",
"summary": "S'ha publicat avui al Diari Oficial de la Generalitat de Catalunya, després del vistiplau del Govern.",
"image": {
"src": "https://web.ub.edu/documents/2710030/41751574/aprovaci%C3%B3estatutslider.jpg/a09c30c7-114f-01fb-bd17-427bba5f10f6?t=1764158670306",
"alt": "El nou Estatut de la Universitat de Barcelona, en vigor a partir de demà, 10 de juliol"
}
},
{
"category": "Acadèmic",
"title": "La Universitat de Barcelona torna a ser la universitat catalana més sol·licitada en primera opció",
"href": "https://web.ub.edu/ca/web/actualitat/w/universitat-mes-solicitada-primera-opcio-2026",
"summary": "Medicina, Odontologia, Administració i Direcció d'Empreses i Psicologia, entre les preferides per l'alumnat nou.",
"image": {
"src": "https://web.ub.edu/documents/2710030/46107409/notes-tall-2026.jpg/c687cac3-bb50-90c3-94af-c5f7da4d0212?t=1783673239311",
"alt": "La Universitat de Barcelona torna a ser la universitat catalana més sol·licitada en primera opció"
}
},
{
"category": "Internacional",
"title": "La CHARM-EU obté set milions d'euros de finançament europeu per créixer fins al 2028",
"href": "https://web.ub.edu/ca/web/actualitat/w/charmeu-financament-europeu",
"summary": "L'aliança universitària CHARM-EU ha obtingut 7,2 milions d'euros de finançament en la convocatòria Erasmus+ European Universities 2026.",
"image": {
"src": "https://web.ub.edu/documents/2710030/46107409/charmeu-20260706.jpg/116d97ab-582e-99a6-849a-11d9ab701631?t=1783329840706",
"alt": "La CHARM-EU obté set milions d'euros de finançament europeu per créixer fins al 2028"
}
}
]
}
-
Consulta les properes defenses de tesis doctorals i les novetats de l’Escola de Doctorat.
-
Informació sobre terminis, beques, ajuts i gestions acadèmiques vinculades al doctorat.
-
Sessions i recursos adreçats a estudiants de doctorat de tots els àmbits de coneixement.
Codi HTML + Tailwind
<div class="">
<div class="mb-[31px] flex flex-wrap items-center justify-between gap-4">
<div class="flex flex-wrap items-center gap-x-5 gap-y-1">
<h2 class="text-pretty text-[45px] font-bold leading-[54px] text-black">Destaquem</h2>
<span aria-hidden="true" class="h-[30px] w-px bg-black">
</span>
<a href="https://web.ub.edu/ca/web/escola-doctorat/actualitat" class="inline-flex items-center gap-1 text-[20px] font-medium leading-6 text-black hover:text-ub-blue">Tota l'actualitat<svg aria-hidden="true" viewBox="0 0 10 17.49" class="h-[18px] w-[10.3px] shrink-0 fill-current">
<path d="M18.232,14.938,11.614,8.325a1.245,1.245,0,0,1,0-1.765,1.26,1.26,0,0,1,1.77,0l7.5,7.493a1.248,1.248,0,0,1,.036,1.724l-7.53,7.545a1.25,1.25,0,0,1-1.77-1.765Z" transform="translate(-11.246 -6.196)">
</path>
</svg>
</a>
</div>
</div>
<ul class="grid grid-cols-1 gap-5 sm:grid-cols-2 lg:grid-cols-3">
<li>
<article class="group relative flex h-full flex-col border border-ub-line bg-white p-6 transition-shadow hover:shadow-[0_3px_6px_rgba(0,0,0,0.18)]">
<div class="flex items-center justify-between gap-3">
<p class="text-[19px] font-bold uppercase leading-[28.5px] text-ub-research">Doctorat</p>
</div>
<h3 class="mt-2 text-pretty text-[22px] font-bold leading-[26.4px] text-ub-text group-hover:text-ub-blue">
<a href="https://web.ub.edu/ca/web/escola-doctorat/actualitat" class="after:absolute after:inset-0 after:content-[''] focus:outline-none focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ub-blue">Defensa de tesis doctorals</a>
</h3>
<p class="mt-3 text-base leading-6 text-ub-text">Consulta les properes defenses de tesis doctorals i les novetats de l’Escola de Doctorat.</p>
</article>
</li>
<li>
<article class="group relative flex h-full flex-col border border-ub-line bg-white p-6 transition-shadow hover:shadow-[0_3px_6px_rgba(0,0,0,0.18)]">
<div class="flex items-center justify-between gap-3">
<p class="text-[19px] font-bold uppercase leading-[28.5px] text-ub-research">Convocatòries</p>
</div>
<h3 class="mt-2 text-pretty text-[22px] font-bold leading-[26.4px] text-ub-text group-hover:text-ub-blue">
<a href="https://web.ub.edu/ca/web/escola-doctorat/actualitat" class="after:absolute after:inset-0 after:content-[''] focus:outline-none focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ub-blue">Ajuts i tràmits per a doctorands</a>
</h3>
<p class="mt-3 text-base leading-6 text-ub-text">Informació sobre terminis, beques, ajuts i gestions acadèmiques vinculades al doctorat.</p>
</article>
</li>
<li>
<article class="group relative flex h-full flex-col border border-ub-line bg-white p-6 transition-shadow hover:shadow-[0_3px_6px_rgba(0,0,0,0.18)]">
<div class="flex items-center justify-between gap-3">
<p class="text-[19px] font-bold uppercase leading-[28.5px] text-ub-research">Recerca</p>
</div>
<h3 class="mt-2 text-pretty text-[22px] font-bold leading-[26.4px] text-ub-text group-hover:text-ub-blue">
<a href="https://web.ub.edu/ca/web/escola-doctorat/actualitat" class="after:absolute after:inset-0 after:content-[''] focus:outline-none focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ub-blue">Activitats formatives transversals</a>
</h3>
<p class="mt-3 text-base leading-6 text-ub-text">Sessions i recursos adreçats a estudiants de doctorat de tots els àmbits de coneixement.</p>
</article>
</li>
</ul>
</div>
Exemple JSON (public/data/pages/*.json)
{
"type": "ub.newsList",
"id": "destaquem",
"title": "Destaquem",
"action": {
"label": "Tota l'actualitat",
"href": "https://web.ub.edu/ca/web/escola-doctorat/actualitat"
},
"variant": "textCards",
"columns": 3,
"itemsPerPage": 3,
"items": [
{
"category": "Doctorat",
"title": "Defensa de tesis doctorals",
"href": "https://web.ub.edu/ca/web/escola-doctorat/actualitat",
"summary": "Consulta les properes defenses de tesis doctorals i les novetats de l’Escola de Doctorat."
},
{
"category": "Convocatòries",
"title": "Ajuts i tràmits per a doctorands",
"href": "https://web.ub.edu/ca/web/escola-doctorat/actualitat",
"summary": "Informació sobre terminis, beques, ajuts i gestions acadèmiques vinculades al doctorat."
},
{
"category": "Recerca",
"title": "Activitats formatives transversals",
"href": "https://web.ub.edu/ca/web/escola-doctorat/actualitat",
"summary": "Sessions i recursos adreçats a estudiants de doctorat de tots els àmbits de coneixement."
}
]
}
-
Notícia
|Institucional
|Esport
La competició començarà el 9 d’octubre i reunirà alumnat, PDI, PTGAS i Alumni en equips mixtos formats per membres de tota la comunitat UB.
-
Notícia
|Institucional
El Consell de Govern de la Universitat de Barcelona es reunirà en sessió ordinària dimarts 14 de juliol.
Correcció aplicada: A la pàgina real de "Notícies", el llistat principal és una columna única separada per línies horitzontals: títol en 26px amb subratllat blau, data inline, categories sota el títol i resum en gris. Algunes entrades porten miniatura quadrada de 118px i altres no; el component admet totes dues formes.
Codi HTML + Tailwind
<ul class="flex flex-col divide-y divide-ub-line ">
<li class="pb-5 pt-[25px]">
<article class="group relative flex flex-col gap-6 sm:flex-row">
<img src="https://web.ub.edu/documents/2710030/46107409/alma-mater-202607_1.png/22a41daa-f436-7513-9929-c0a9f0bf5254?t=1783337606354" alt="Imatge de la primera edició d’UB Alma Mater." loading="lazy" class="h-[118px] w-[118px] shrink-0 object-cover"/>
<div class="flex-1">
<h3 class="text-pretty text-[26px] font-medium leading-8 text-black">
<a href="https://web.ub.edu/ca/web/actualitat/w/inscripcions-segona-edicio-ub-alma-mater?referer=noticies" class="bg-[linear-gradient(rgba(0,0,0,0)_calc(100%-2px),#0072BC_0px)] bg-no-repeat after:absolute after:inset-0 after:content-[''] focus:outline-none focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ub-blue">La UB obre les inscripcions de la segona edició d’UB Alma Mater, el torneig universitari de League of Legends</a>
<span class="ml-4 text-[18px] font-medium text-ub-muted">06/07/2026</span>
</h3>
<p class="mt-2 flex flex-wrap gap-x-3 text-lg font-normal text-[#484848]">
<span class="flex items-center gap-x-3">Notícia</span>
<span class="flex items-center gap-x-3">
<span aria-hidden="true" class="text-ub-muted">|</span>Institucional</span>
<span class="flex items-center gap-x-3">
<span aria-hidden="true" class="text-ub-muted">|</span>Esport</span>
</p>
<p class="mt-2 text-lg font-normal leading-8 text-ub-muted">La competició començarà el 9 d’octubre i reunirà alumnat, PDI, PTGAS i Alumni en equips mixtos formats per membres de tota la comunitat UB.</p>
</div>
</article>
</li>
<li class="pb-5 pt-[25px]">
<article class="group relative flex flex-col gap-6 sm:flex-row">
<div class="flex-1">
<h3 class="text-pretty text-[26px] font-medium leading-8 text-black">
<a href="https://web.ub.edu/ca/web/actualitat/w/consell-govern-14-juliol" class="bg-[linear-gradient(rgba(0,0,0,0)_calc(100%-2px),#0072BC_0px)] bg-no-repeat after:absolute after:inset-0 after:content-[''] focus:outline-none focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ub-blue">Consell de Govern de la UB: dimarts 14 de juliol</a>
<span class="ml-4 text-[18px] font-medium text-ub-muted">13/07/2026</span>
</h3>
<p class="mt-2 flex flex-wrap gap-x-3 text-lg font-normal text-[#484848]">
<span class="flex items-center gap-x-3">Notícia</span>
<span class="flex items-center gap-x-3">
<span aria-hidden="true" class="text-ub-muted">|</span>Institucional</span>
</p>
<p class="mt-2 text-lg font-normal leading-8 text-ub-muted">El Consell de Govern de la Universitat de Barcelona es reunirà en sessió ordinària dimarts 14 de juliol.</p>
</div>
</article>
</li>
</ul>
Exemple JSON (public/data/pages/*.json)
{
"type": "ub.newsList",
"id": "resultats",
"title": "Resultats",
"hideTitle": true,
"variant": "list",
"items": [
{
"title": "La UB obre les inscripcions de la segona edició d’UB Alma Mater, el torneig universitari de League of Legends",
"href": "https://web.ub.edu/ca/web/actualitat/w/inscripcions-segona-edicio-ub-alma-mater?referer=noticies",
"category": "Notícia | Institucional | Esport",
"date": "06/07/2026",
"summary": "La competició començarà el 9 d’octubre i reunirà alumnat, PDI, PTGAS i Alumni en equips mixtos formats per membres de tota la comunitat UB.",
"image": {
"src": "https://web.ub.edu/documents/2710030/46107409/alma-mater-202607_1.png/22a41daa-f436-7513-9929-c0a9f0bf5254?t=1783337606354",
"alt": "Imatge de la primera edició d’UB Alma Mater."
}
},
{
"title": "Consell de Govern de la UB: dimarts 14 de juliol",
"href": "https://web.ub.edu/ca/web/actualitat/w/consell-govern-14-juliol",
"category": "Notícia | Institucional",
"date": "13/07/2026",
"summary": "El Consell de Govern de la Universitat de Barcelona es reunirà en sessió ordinària dimarts 14 de juliol."
}
]
}
Directori
PTGAS i PDI
Directori
PTGAS i PDI
