Refactor component styles: Update various components to use rounded-lg instead of rounded-2xl for a more consistent design, and adjust button styles for improved visual coherence across the application.

This commit is contained in:
2026-01-06 14:12:00 -03:00
parent a478c834e3
commit 0fbd56d39e
10 changed files with 86 additions and 74 deletions

View File

@@ -36,7 +36,7 @@
<div class="hidden items-center gap-3 sm:flex">
<span
class="rounded-full bg-(--surface-muted) px-3 py-1 text-xs font-semibold text-(--text-muted) ring-1 ring-black/5"
class="rounded-lg bg-(--surface-muted) px-3 py-1 text-xs font-semibold text-(--text-muted) ring-1 ring-black/5"
>
SESP-PE
</span>
@@ -49,7 +49,7 @@
<section class="space-y-8">
<NewsCarousel items={featuredNews} title="Notícias em destaque" />
<section class="rounded-3xl bg-white/80 p-6 shadow-sm ring-1 ring-black/5 sm:p-8">
<section class="rounded-lg bg-white/80 p-6 shadow-sm ring-1 ring-black/5 sm:p-8">
<div class="flex flex-col gap-2 sm:flex-row sm:items-end sm:justify-between">
<div>
<h2 class="text-lg font-extrabold tracking-tight text-(--text-strong)">Notícias</h2>
@@ -64,17 +64,17 @@
{#each news as item (item.slug)}
<a
href={`/noticias/${item.slug}`}
class="group block rounded-2xl bg-white/80 p-5 shadow-sm ring-1 ring-black/5 transition hover:bg-white hover:shadow-md focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-(--focus-ring)"
class="group block rounded-lg bg-white/80 p-5 shadow-sm ring-1 ring-black/5 transition hover:bg-white hover:shadow-md focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-(--focus-ring)"
aria-label={`Abrir notícia: ${item.title}`}
>
<div class="flex flex-wrap items-center gap-2">
<span
class="rounded-full bg-(--surface-muted) px-3 py-1 text-xs font-semibold text-(--text-muted) ring-1 ring-black/5"
class="rounded-lg bg-(--surface-muted) px-3 py-1 text-xs font-semibold text-(--text-muted) ring-1 ring-black/5"
>
{item.category}
</span>
<span
class="rounded-full bg-white/80 px-3 py-1 text-xs font-semibold text-(--text-muted) ring-1 ring-black/5"
class="rounded-lg bg-white/80 px-3 py-1 text-xs font-semibold text-(--text-muted) ring-1 ring-black/5"
>
{new Date(item.date).toLocaleDateString('pt-BR')}
</span>
@@ -96,7 +96,7 @@
</section>
<aside class="space-y-6">
<section class="rounded-3xl bg-white/80 p-6 shadow-sm ring-1 ring-black/5 sm:p-8">
<section class="rounded-lg bg-white/80 p-6 shadow-sm ring-1 ring-black/5 sm:p-8">
<h2 class="text-lg font-extrabold tracking-tight text-(--text-strong)">Programas</h2>
<p class="mt-1 text-sm text-(--text)">
Acesso rápido aos links oficiais de inscrição e edital.