ceos/opencode
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix(stats): restore sticky comparison header

Browse source
This commit is contained in:
Adam 2026-07-10 07:30:00 -05:00
commit a84151e482
No known key found for this signature in database
GPG key ID: 9CB48779AF150E75
2 changed files with 30 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

17
packages/stats/app/src/routes/compare/[firstLab]/[firstModel]/[secondLab]/[secondModel].tsx
View file

@ -150,6 +150,8 @@ export default function ModelComparePair() {
const [themePreference, setThemePreference] = createSignal<ThemePreference>("system")
const [highlightBest, setHighlightBest] = createSignal(true)
const [addingModel, setAddingModel] = createSignal(false)
let comparisonHeadingScroll: HTMLDivElement | undefined
let comparisonBodyScroll: HTMLDivElement | undefined
const models = createMemo(
() =>
modelSelections().map((model, index) =>
@ -188,6 +190,9 @@ export default function ModelComparePair() {
if (typeof window === "undefined" || next.length < 2) return
window.location.href = comparisonModelsHref(next)
}
const syncComparisonScroll = (source: HTMLDivElement, target: HTMLDivElement | undefined) => {
if (target && target.scrollLeft !== source.scrollLeft) target.scrollLeft = source.scrollLeft
}
const structuredData = createMemo(() =>
JSON.stringify({
"@context": "https://schema.org",
@ -260,8 +265,18 @@ export default function ModelComparePair() {
data-model-count={models().length}
style={`--compare-detail-grid: ${comparisonDetailGridTemplate(models().length)}`}
>
<div data-component="compare-detail-scroll">
<div
data-component="compare-detail-heading-scroll"
ref={(element) => (comparisonHeadingScroll = element)}
onScroll={(event) => syncComparisonScroll(event.currentTarget, comparisonBodyScroll)}
>
<ComparisonPairSelector catalogModels={selectorModels()} models={models()} />
</div>
<div
data-component="compare-detail-body-scroll"
ref={(element) => (comparisonBodyScroll = element)}
onScroll={(event) => syncComparisonScroll(event.currentTarget, comparisonHeadingScroll)}
>
<Show
when={stats() !== undefined}
fallback={

16
packages/stats/app/src/routes/index.css
View file

@ -6089,9 +6089,21 @@
position: relative;
}
[data-page="stats"] [data-component="compare-detail-scroll"] {
[data-page="stats"] [data-component="compare-detail-heading-scroll"] {
position: sticky;
top: 72px;
z-index: 9;
overflow-x: auto;
background: var(--stats-bg);
scrollbar-width: none;
}
[data-page="stats"] [data-component="compare-detail-heading-scroll"]::-webkit-scrollbar {
display: none;
}
[data-page="stats"] [data-component="compare-detail-body-scroll"] {
overflow-x: auto;
overflow-y: hidden;
}
[data-page="stats"] [data-section="compare-detail-selector"],