fsolla/teqo-backup
1
0
Fork 0
mirror of https://github.com/fsolla/teqo.git synced 2026-11-12 22:13:05 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

style(plan): prettier no rascunho UI do PUB5

Browse source
This commit is contained in:
Francisco Solla 2026-08-17 21:34:27 -03:00
parent 220142cc75
commit 346da3896e
1 changed files with 33 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

43
docs/plans/slogan-mais-saude-mais-futuro-ui-draft.html
View file

@ -14,10 +14,15 @@
uppercase). Cenas abaixo: hero desktop, hero mobile, rodapé desktop.
</p>
<section data-shot="hero-desktop" class="mt-6 overflow-hidden rounded-xl ring-1 ring-zinc-700">
<section
data-shot="hero-desktop"
class="mt-6 overflow-hidden rounded-xl ring-1 ring-zinc-700"
>
<div class="relative bg-zinc-900 px-8 py-14">
<div class="max-w-xl">
<h1 class="font-sans text-5xl font-black leading-[1.12] tracking-tight uppercase text-zinc-100">
<h1
class="font-sans text-5xl font-black leading-[1.12] tracking-tight uppercase text-zinc-100"
>
<span class="block font-semibold">Mais saúde</span>
<span class="block font-black">Mais futuro</span>
</h1>
@ -27,24 +32,35 @@
saúde à educação.
</p>
<div class="mt-6 flex gap-3">
<a class="inline-flex min-h-11 items-center justify-center rounded-[10px] border-2 border-zinc-400 px-3 text-center text-sm font-extrabold text-zinc-100">
<a
class="inline-flex min-h-11 items-center justify-center rounded-[10px] border-2 border-zinc-400 px-3 text-center text-sm font-extrabold text-zinc-100"
>
Conhecer bandeiras
</a>
<a class="inline-flex min-h-11 items-center justify-center rounded-[10px] bg-zinc-100 px-3 text-center text-sm font-black text-zinc-900">
<a
class="inline-flex min-h-11 items-center justify-center rounded-[10px] bg-zinc-100 px-3 text-center text-sm font-black text-zinc-900"
>
Quero apoiar — 30 segundos
</a>
</div>
<div class="mt-8 text-xs leading-relaxed text-zinc-400">
<p><strong class="text-zinc-200">DIAP</strong> entre os 40 melhores da Câmara</p>
<p class="mt-1"><strong class="text-zinc-200">Mais votado</strong> do PT-BA em 2022</p>
<p class="mt-1">
<strong class="text-zinc-200">Mais votado</strong> do PT-BA em 2022
</p>
</div>
</div>
</div>
</section>
<section data-shot="hero-mobile" class="mt-6 w-[390px] overflow-hidden rounded-xl ring-1 ring-zinc-700">
<section
data-shot="hero-mobile"
class="mt-6 w-[390px] overflow-hidden rounded-xl ring-1 ring-zinc-700"
>
<div class="relative bg-zinc-900 px-6 py-12">
<h1 class="font-sans text-3xl font-black leading-[1.12] tracking-tight uppercase text-zinc-100">
<h1
class="font-sans text-3xl font-black leading-[1.12] tracking-tight uppercase text-zinc-100"
>
<span class="block font-semibold">Mais saúde</span>
<span class="block font-black">Mais futuro</span>
</h1>
@ -54,10 +70,14 @@
saúde à educação.
</p>
<div class="mt-6 grid grid-cols-2 gap-3">
<a class="inline-flex min-h-11 items-center justify-center rounded-[10px] border-2 border-zinc-400 px-3 text-center text-sm font-extrabold text-zinc-100">
<a
class="inline-flex min-h-11 items-center justify-center rounded-[10px] border-2 border-zinc-400 px-3 text-center text-sm font-extrabold text-zinc-100"
>
Conhecer bandeiras
</a>
<a class="inline-flex min-h-11 items-center justify-center rounded-[10px] bg-zinc-100 px-3 text-center text-sm font-black text-zinc-900">
<a
class="inline-flex min-h-11 items-center justify-center rounded-[10px] bg-zinc-100 px-3 text-center text-sm font-black text-zinc-900"
>
Quero apoiar
</a>
</div>
@ -68,7 +88,10 @@
</div>
</section>
<section data-shot="footer-desktop" class="mt-6 overflow-hidden rounded-xl ring-1 ring-zinc-700">
<section
data-shot="footer-desktop"
class="mt-6 overflow-hidden rounded-xl ring-1 ring-zinc-700"
>
<footer class="bg-zinc-900 px-8 py-10">
<div class="grid gap-6 md:grid-cols-[2fr_1fr_1fr]">
<div>