aboutsummaryrefslogtreecommitdiff
path: root/website/css
diff options
context:
space:
mode:
Diffstat (limited to 'website/css')
-rw-r--r--website/css/style.css238
1 files changed, 130 insertions, 108 deletions
diff --git a/website/css/style.css b/website/css/style.css
index 06aae519..545b9123 100644
--- a/website/css/style.css
+++ b/website/css/style.css
@@ -3,10 +3,12 @@
font-style: normal;
font-weight: 400 700;
font-display: swap;
- src: url("/assets/jbm.woff2") format("woff2");
+ src: url("/assets/jbm.woff2?v=2") format("woff2");
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC,
U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F,
- U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+ U+20AC, U+2122, U+2190-2193, U+2212, U+2215, U+2500-2503,
+ U+2514, U+2580-259F, U+25C9, U+25CF, U+2713, U+276F,
+ U+FEFF, U+FFFD;
}
:root {
@@ -1510,92 +1512,43 @@ samp {
border: 1px solid var(--line-strong);
}
-.logo-cloud {
- max-width: var(--max);
- margin: 0 auto;
- padding: 2.5rem 1.25rem 3rem;
- overflow: hidden;
-}
-
-.logo-cloud-heading {
- margin-bottom: 0.8rem;
- text-align: center;
-}
-
-.logo-cloud-heading .section-kicker {
- margin-bottom: 0.4rem;
+.nav-icon-link.has-count {
+ width: auto;
+ padding-inline: 0.55rem;
+ gap: 0.35rem;
}
-.logo-cloud-heading h2 {
- margin: 0;
- color: var(--muted);
- font-size: clamp(1rem, 2vw, 1.25rem);
- line-height: 1.25;
- letter-spacing: -0.02em;
- font-family: var(--body);
- font-weight: 400;
+.nav-icon-link.has-count:has(.nav-star-count:empty) {
+ width: 2.1rem;
+ padding-inline: 0;
+ gap: 0;
}
-.logo-cloud-note {
- margin: 0.35rem 0 0;
- color: var(--muted-2);
+.nav-star-count {
font-family: var(--mono);
- font-size: 0.68rem;
- line-height: 1.4;
-}
-
-.logo-marquee {
- position: relative;
- overflow: hidden;
- border-top: 1px solid var(--line);
- border-bottom: 1px solid var(--line);
- padding: 0.5rem 0;
-}
-
-.logo-track {
- display: flex;
- width: max-content;
- animation: logo-marquee 24s linear infinite;
-}
-
-.logo-row {
- display: flex;
- flex: 0 0 auto;
- gap: 0.5rem;
- padding: 0.25rem 0.25rem;
-}
-
-.logo-card {
- width: 140px;
- height: 50px;
- display: grid;
- place-items: center;
- padding: 0.4rem 0.75rem;
- color: var(--muted);
-}
-
-.logo-card img {
- width: auto;
- height: 26px;
- max-width: 110px;
- object-fit: contain;
- opacity: var(--logo-opacity);
- filter: var(--logo-filter);
- transition: opacity 0.2s, filter 0.2s;
+ font-size: 0.78rem;
+ line-height: 1;
}
-.logo-card img:hover {
- opacity: 0.95;
+.hero-note a {
+ color: inherit;
+ text-decoration: underline;
+ text-underline-offset: 2px;
+ transition: color 0.12s ease;
}
-.logo-card span {
- display: none;
+.hero-note a:hover {
+ color: var(--accent);
}
.community-section {
padding-top: 4.25rem;
}
+.section.community-section {
+ border-top: none;
+}
+
.community-video-grid {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
@@ -1702,12 +1655,6 @@ samp {
line-height: 1.55;
}
-@keyframes logo-marquee {
- to {
- transform: translateX(-50%);
- }
-}
-
@keyframes theme-hint-pulse {
0%, 70%, 100% {
opacity: 0;
@@ -2540,7 +2487,6 @@ td:last-child {
.section,
.demo-section,
- .logo-cloud,
.footer,
.final-cta {
padding-inline: 1rem;
@@ -2584,20 +2530,6 @@ td:last-child {
border-radius: var(--radius-md);
}
- .logo-cloud {
- padding-bottom: 2.5rem;
- }
-
- .logo-card {
- width: 120px;
- height: 46px;
- }
-
- .logo-card img {
- height: 24px;
- max-width: 92px;
- }
-
.section {
padding-top: 3rem;
padding-bottom: 3rem;
@@ -2711,11 +2643,16 @@ td:last-child {
.footer {
flex-direction: column;
align-items: flex-start;
+ padding-bottom: 4.5rem;
}
.footer div {
justify-content: flex-start;
}
+
+ .footer .footer-social {
+ justify-content: flex-start;
+ }
}
@media (max-width: 440px) {
@@ -2795,15 +2732,6 @@ td:last-child {
margin: 0.35rem 0 0.45rem;
}
- .logo-card {
- width: 110px;
- }
-
- .logo-card img {
- height: 22px;
- max-width: 88px;
- }
-
.mobile-proof,
.mobile-shots {
gap: 0.55rem;
@@ -3370,6 +3298,57 @@ td:last-child {
color: #d97757;
}
+/* Claude Code header logo + status footer — colors hardcoded to match the
+ real agent UI, not the site theme (the pane renders the agent, not herdr) */
+.cc-header {
+ display: flex;
+ gap: 0.6em;
+ align-items: center;
+}
+
+.herdr-ui-mock .cc-logo-art {
+ margin: 0;
+ color: #d97757;
+ line-height: 1;
+ white-space: pre;
+ font-family: var(--mono);
+}
+
+.cc-header-text {
+ min-width: 0;
+}
+
+.cc-header-text > div {
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+}
+
+.cc-status {
+ white-space: nowrap;
+ overflow: hidden;
+}
+
+.cc-file {
+ color: #b1b9f9;
+}
+
+.cc-cyan {
+ color: #4ec9d4;
+}
+
+.cc-yellow {
+ color: #d7ba7d;
+}
+
+.cc-coral {
+ color: #ff6b80;
+}
+
+.cc-gy {
+ color: var(--term-dim);
+}
+
.cx-bullet {
color: var(--accent);
}
@@ -3507,12 +3486,45 @@ td:last-child {
/* Homepage marketplace teaser */
.marketplace-teaser {
+ display: block;
+ padding-block: 4.5rem;
+ border-bottom: 1px solid var(--line);
+}
+
+.marketplace-teaser-top {
display: grid;
- grid-template-columns: 1fr 1fr;
+ grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
gap: 3rem;
align-items: center;
- padding-block: 4.5rem;
- border-bottom: 1px solid var(--line);
+}
+
+.marketplace-teaser-install {
+ display: grid;
+ gap: 0.55rem;
+ align-content: center;
+}
+
+.marketplace-install-output {
+ margin: 0;
+ padding-inline: 0.9rem;
+ color: var(--muted);
+ font-family: var(--mono);
+ font-size: 0.82rem;
+}
+
+.marketplace-install-note {
+ margin: 0;
+ padding-inline: 0.9rem;
+ color: var(--muted-2);
+ font-family: var(--mono);
+ font-size: 0.75rem;
+}
+
+@media (max-width: 50rem) {
+ .marketplace-teaser-top {
+ grid-template-columns: 1fr;
+ gap: 2rem;
+ }
}
.marketplace-teaser-copy h2 {
@@ -3535,7 +3547,15 @@ td:last-child {
.marketplace-teaser-grid {
display: grid;
+ grid-template-columns: repeat(3, 1fr);
gap: 0.75rem;
+ margin-top: 2.5rem;
+}
+
+@media (max-width: 68rem) {
+ .marketplace-teaser-grid {
+ grid-template-columns: 1fr 1fr;
+ }
}
.mp-chip {
@@ -3575,10 +3595,12 @@ td:last-child {
@media (max-width: 50rem) {
.marketplace-teaser {
- grid-template-columns: 1fr;
- gap: 2rem;
padding-block: 3.5rem;
}
+
+ .marketplace-teaser-grid {
+ grid-template-columns: 1fr;
+ }
}
/* What you get: balanced capability grid + code card */
generated by cgit v1.2.3 (git 2.39.1) at 2026-11-09 17:56:23 +0000