diff --git a/public/css/main.css b/public/css/main.css index 92f92a9a8..de143cc01 100644 --- a/public/css/main.css +++ b/public/css/main.css @@ -304,11 +304,25 @@ code { display: flex; flex-direction: column; align-items: center; - gap: var(--spacing-lg); + gap: var(--spacing-md); text-align: center; pointer-events: none; } +.hero-badge { + display: inline-block; + padding: 0.35em 1em; + font-family: var(--font-body); + font-size: 0.75rem; + font-weight: 500; + letter-spacing: 0.1em; + text-transform: uppercase; + color: var(--color-ink); + background: rgba(255, 255, 255, 0.85); + border: 1px solid var(--color-ink); + backdrop-filter: blur(4px); +} + .hero-title-overlay { font-family: var(--font-display); font-size: clamp(3.5rem, 12vw, 8rem); @@ -365,6 +379,15 @@ code { background: var(--color-paper); } +.hero-section-title { + font-family: var(--font-display); + font-size: clamp(1.5rem, 4vw, 2rem); + font-weight: 400; + font-style: italic; + color: var(--color-ink); + margin: 0 0 var(--spacing-lg) 0; +} + .hero-content { display: flex; flex-direction: column; @@ -1785,6 +1808,36 @@ code { font-weight: 600; } +/* Contribution CTA */ +.contribute-cta { + display: flex; + flex-direction: column; + align-items: center; + gap: var(--spacing-md); + margin-top: var(--spacing-xl); + padding-top: var(--spacing-xl); + border-top: 1px solid var(--color-mist); + text-align: center; +} + +.contribute-text { + font-family: var(--font-display); + font-size: 1.125rem; + font-style: italic; + color: var(--color-charcoal); + margin: 0; +} + +.btn-small { + padding: var(--spacing-xs) var(--spacing-md); + font-size: 0.8rem; + gap: var(--spacing-xs); +} + +.btn-small svg { + flex-shrink: 0; +} + /* ============================================ SOLUTION SECTION ENHANCEMENTS ============================================ */ diff --git a/public/index.html b/public/index.html index 9e46f7cdb..a76707536 100644 --- a/public/index.html +++ b/public/index.html @@ -23,7 +23,7 @@
Know a pattern we're missing? Help us grow the collection.
+ + + Suggest a Pattern + +