infrastructure/plunk
2
0
Fork 0
Code Pull Requests Activity

ui: Polish details

Browse Source
This commit is contained in:
Dries Augustyns
2026-04-19 09:03:50 +02:00
parent 6fdc29fc0f
commit 19ea8b0122
35 changed files with 478 additions and 462 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/landing/src/components/ComparisonTable.tsx
+2 -2
View File
@@ -39,9 +39,9 @@ export function ComparisonTable({competitorName, rows}: ComparisonTableProps) {
className={'grid grid-cols-3 gap-px bg-neutral-200'}
>
<div className={'bg-white p-6'}>
<span className={'text-sm text-neutral-600'}>{row.feature}</span>
<span className={'text-sm text-neutral-700'}>{row.feature}</span>
</div>
<div className={'bg-white p-6'}>
<div className={'bg-neutral-50/70 p-6'}>
<div className={'flex justify-center'}>
{typeof row.plunk === 'boolean' ? (
row.plunk ? (
apps/landing/src/components/FAQSection.tsx
+2 -2
View File
@@ -35,13 +35,13 @@ export function FAQSection({faqs, schemaId = 'faq-schema'}: FAQSectionProps) {
/>
<section className={'border-t border-neutral-200'}>
<div className={'mx-auto max-w-[88rem] px-6 py-20 sm:px-10'}>
<div className={'mx-auto max-w-[88rem] px-6 py-16 sm:px-10 sm:py-20'}>
<motion.div
initial={{opacity: 0, y: 20}}
whileInView={{opacity: 1, y: 0}}
viewport={{once: true}}
transition={{duration: 0.7, ease: [0.22, 1, 0.36, 1]}}
className={'mb-16'}
className={'mb-12'}
>
<h2
style={{fontFamily: 'var(--font-display)'}}
apps/landing/src/components/guides/GuideLayout.tsx
+12 -9
View File
@@ -148,7 +148,10 @@ export function GuideLayout({
transition={{duration: 0.7, ease: [0.22, 1, 0.36, 1]}}
className={'mb-8 sm:mb-12 w-full'}
>
<h1 className={'text-2xl sm:text-4xl font-bold tracking-tight text-neutral-900 break-words max-w-full'}>
<h1
style={{fontFamily: 'var(--font-display)'}}
className={'text-3xl sm:text-4xl font-bold tracking-[-0.02em] text-neutral-900 break-words max-w-full'}
>
{title}
</h1>
<p
@@ -199,16 +202,16 @@ export function GuideLayout({
<div className={'rounded-xl border border-neutral-200 bg-white p-6 shadow-sm'}>
<h2 className={'text-sm font-semibold text-neutral-900 mb-4 uppercase tracking-wide'}>On this page</h2>
<nav>
<ul className={'space-y-1'}>
<ul className={'space-y-0.5'}>
{headings.map(heading => (
<li key={heading.id} className={heading.level === 3 ? 'ml-4 mt-0.5' : 'mt-2 first:mt-0'}>
<li key={heading.id} className={heading.level === 3 ? 'ml-3' : ''}>
<a
href={`#${heading.id}`}
onClick={e => {
e.preventDefault();
const element = document.getElementById(heading.id);
if (element) {
const offset = 100; // Account for fixed header
const offset = 100;
const elementPosition = element.getBoundingClientRect().top + window.scrollY;
window.scrollTo({
top: elementPosition - offset,
@@ -216,14 +219,14 @@ export function GuideLayout({
});
}
}}
className={`block py-1 border-l-2 -ml-px pl-3 transition-all duration-200 ${
className={`block rounded px-2 py-1.5 transition-all duration-200 ${
heading.level === 2
? activeId === heading.id
? 'border-neutral-900 text-neutral-900 font-semibold text-sm'
: 'border-transparent text-neutral-600 hover:text-neutral-900 hover:border-neutral-300 font-medium text-sm'
? 'bg-neutral-100 text-sm font-semibold text-neutral-900'
: 'text-sm font-medium text-neutral-600 hover:bg-neutral-50 hover:text-neutral-900'
: activeId === heading.id
? 'border-neutral-700 text-neutral-800 font-medium text-xs'
: 'border-transparent text-neutral-500 hover:text-neutral-700 hover:border-neutral-200 text-xs'
? 'bg-neutral-50 text-xs font-medium text-neutral-800'
: 'text-xs text-neutral-500 hover:bg-neutral-50 hover:text-neutral-700'
}`}
>
{heading.text}