OpenAI/labyricorn-site
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add homepage tag discovery matrix
Deploy production / deploy (push) Successful in 21s
Details

Browse Source
This commit is contained in:
Labyricorn
2026-08-23 16:51:54 -07:00
parent fe6025fa63
commit 623686590c
6 changed files with 244 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files
assets/static/style.css
+108
View File
@@ -780,6 +780,106 @@ h1 { max-width: 880px; margin: 0; font-size: clamp(30px, 4vw, 45px); font-style:
.featured-projects-empty { margin: 0; padding: 24px 0; color: var(--muted); }
.featured-projects-link { display: inline-block; margin-top: 22px; color: var(--teal); font: 500 10px var(--mono); letter-spacing: .12em; text-transform: uppercase; }
.homepage-tag-section {
border-top: 1px solid var(--rule);
padding: 52px 0 58px;
background: linear-gradient(180deg, rgba(201,168,76,.025), transparent 72%);
}
.homepage-tag-header {
display: grid;
grid-template-columns: minmax(0, 1fr) auto;
gap: 28px 48px;
align-items: end;
}
.homepage-tag-header .eyebrow { margin-bottom: 10px; color: var(--mustard); }
.homepage-tag-header h2 { margin: 0; font-size: clamp(27px, 3vw, 36px); line-height: 1.2; }
.homepage-tag-header > div > p:last-child { max-width: 680px; margin: 12px 0 0; color: var(--muted); }
.homepage-tag-readout {
display: flex;
align-items: center;
gap: 9px;
margin: 0 0 4px;
color: var(--dim);
font: 500 9px var(--mono);
letter-spacing: .1em;
white-space: nowrap;
text-transform: uppercase;
}
.homepage-tag-readout span {
width: 6px;
height: 6px;
border: 1px solid var(--mustard);
background: rgba(201,168,76,.28);
box-shadow: 0 0 8px rgba(201,168,76,.25);
}
.tag-matrix { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 30px; }
.tag-matrix-link {
--tag-border: rgba(201,168,76,.26);
--tag-copy: #b7b3aa;
--tag-node: rgba(201,168,76,.42);
--tag-fill: rgba(201,168,76,.018);
display: inline-flex;
min-height: 42px;
align-items: center;
gap: 9px;
border: 1px solid var(--tag-border);
background: var(--tag-fill);
padding: 9px 12px;
color: var(--tag-copy);
font: 500 11px/1.2 var(--mono);
letter-spacing: .055em;
text-transform: uppercase;
transition: border-color .16s ease, background-color .16s ease, color .16s ease, transform .16s ease;
}
.tag-matrix-link::before {
content: "";
width: 5px;
height: 5px;
flex: 0 0 auto;
border: 1px solid var(--tag-node);
background: var(--tag-node);
}
.tag-matrix-level-2 {
--tag-border: rgba(201,168,76,.38);
--tag-copy: #c6c1b5;
--tag-node: rgba(201,168,76,.58);
--tag-fill: rgba(201,168,76,.028);
}
.tag-matrix-level-3 {
--tag-border: rgba(201,168,76,.53);
--tag-copy: #d8d2c4;
--tag-node: rgba(201,168,76,.76);
--tag-fill: rgba(201,168,76,.045);
}
.tag-matrix-level-4 {
--tag-border: rgba(201,168,76,.7);
--tag-copy: var(--ink);
--tag-node: var(--mustard);
--tag-fill: rgba(201,168,76,.07);
}
.tag-matrix-link:hover,
.tag-matrix-link:focus-visible {
border-color: var(--mustard);
background: rgba(201,168,76,.1);
color: var(--ink);
transform: translateY(-1px);
}
.tag-matrix-link:focus-visible { outline: 2px solid var(--teal); outline-offset: 3px; }
.tag-matrix-count { color: var(--mustard); font-size: 9px; letter-spacing: .02em; opacity: .78; }
.tag-matrix-summary {
display: grid;
grid-template-columns: 112px minmax(0, 1fr);
gap: 18px;
align-items: start;
min-height: 62px;
margin-top: 26px;
padding-top: 18px;
border-top: 1px solid rgba(39,48,57,.72);
}
.tag-matrix-summary-label { color: var(--mustard); font: 500 9px var(--mono); letter-spacing: .12em; text-transform: uppercase; }
.tag-matrix-summary p { display: grid; gap: 3px; margin: 0; color: var(--muted); font-size: 13px; }
.tag-matrix-summary strong { color: var(--ink); font: 500 11px var(--mono); letter-spacing: .06em; text-transform: uppercase; }
.card-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 1px; background: var(--rule); border: 1px solid var(--rule); }
.entry-card { min-height: 245px; padding: 28px; background: var(--bg); }
.entry-tags { display: flex; flex-wrap: wrap; gap: 7px; margin: 16px 0; }
@@ -1247,6 +1347,11 @@ h1 { max-width: 880px; margin: 0; font-size: clamp(30px, 4vw, 45px); font-style:
.circuit-replay { left: 16px; bottom: 13px; }
h1 { font-size: 30px; }
.homepage-discovery-grid { grid-template-columns: 1fr; gap: 48px; }
.homepage-tag-header { grid-template-columns: 1fr; gap: 16px; }
.homepage-tag-readout { white-space: normal; }
.tag-matrix { gap: 7px; margin-top: 24px; }
.tag-matrix-link { min-height: 44px; padding-inline: 11px; }
.tag-matrix-summary { grid-template-columns: 1fr; gap: 7px; }
.featured-project-card { padding: 20px; }
.card-grid { grid-template-columns: 1fr; }
.tag-directory { grid-template-columns: 1fr; }
@@ -1315,6 +1420,9 @@ h1 { max-width: 880px; margin: 0; font-size: clamp(30px, 4vw, 45px); font-style:
}
@media (prefers-reduced-motion: reduce) {
.tag-matrix-link { transition: none; }
.tag-matrix-link:hover,
.tag-matrix-link:focus-visible { transform: none; }
.circuit-status span,
.circuit-node-main i,
.section-hero,