Skip to content

Commit 64c3841

Browse files
authored
Make model descriptions expandable
Summary: - render compact catalog descriptions as expandable details - keep row height compact by default while exposing full text on click - add template coverage for expandable descriptions Tests: - go test -count=1 ./internal/adminapi - go test -count=1 ./...
1 parent f86f1af commit 64c3841

3 files changed

Lines changed: 16 additions & 3 deletions

File tree

internal/adminapi/adminapi_test.go

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -209,6 +209,9 @@ func TestModelsBrowserRendersCardAndTableModes(t *testing.T) {
209209
if !strings.Contains(html, "Balanced multilingual model") {
210210
t.Fatalf("compact view missing model description: %s", html)
211211
}
212+
if !strings.Contains(html, "<details class=\"catalog-row__description\">") || !strings.Contains(html, "catalog-row__description-full") {
213+
t.Fatalf("compact view should render expandable full description: %s", html)
214+
}
212215
if strings.Contains(html, "catalog-audit-table") {
213216
t.Fatalf("compact view should not render audit table")
214217
}

internal/adminapi/templates/partials_layout.html

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -42,7 +42,12 @@
4242
.catalog-row__title { display: grid; gap: 0.35rem; }
4343
.catalog-row__name { margin-top: 0.12rem; color: var(--text-secondary); font-size: 0.78rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
4444
.catalog-row__chips { display: flex; gap: 0.3rem; flex-wrap: wrap; }
45-
.catalog-row__description { margin-top: 0.4rem; color: var(--text-secondary); font-size: 0.8rem; line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
45+
.catalog-row__description { margin-top: 0.4rem; color: var(--text-secondary); font-size: 0.8rem; line-height: 1.35; }
46+
.catalog-row__description summary { cursor: pointer; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; list-style: none; }
47+
.catalog-row__description summary::-webkit-details-marker { display: none; }
48+
.catalog-row__description summary::after { content: " More"; color: var(--accent); font-weight: 600; white-space: nowrap; }
49+
.catalog-row__description[open] summary { display: none; }
50+
.catalog-row__description-full { color: var(--text-secondary); }
4651
.catalog-row__why { font-size: 0.86rem; color: var(--text); }
4752
.catalog-row__reasons, .catalog-row__warnings { display: flex; gap: 0.35rem; flex-wrap: wrap; margin-top: 0.4rem; font-size: 0.78rem; }
4853
.catalog-row__reasons { color: var(--text-secondary); }
@@ -112,7 +117,7 @@
112117
.catalog-view-toggle .btn, .catalog-tabs .btn { flex: 1 1 auto; }
113118
.catalog-sort, .catalog-sort-dir { flex: 1 1 8rem; width: auto; }
114119
.catalog-row { grid-template-columns: 1fr; gap: 0.65rem; }
115-
.catalog-row__description { -webkit-line-clamp: 3; }
120+
.catalog-row__description summary { -webkit-line-clamp: 3; }
116121
.catalog-grid { grid-template-columns: 1fr; }
117122
.catalog-card { padding: 0.75rem; }
118123
.catalog-card__header { flex-direction: column; gap: 0.5rem; }

internal/adminapi/templates/partials_models_row.html

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -75,7 +75,12 @@
7575
{{if .Free}}<span class="badge badge--success" title="Free tier">FREE</span>{{end}}
7676
</div>
7777
</div>
78-
{{if .Description}}<div class="catalog-row__description" title="{{.Description}}">{{.Description}}</div>{{end}}
78+
{{if .Description}}
79+
<details class="catalog-row__description">
80+
<summary>{{.Description}}</summary>
81+
<div class="catalog-row__description-full">{{.Description}}</div>
82+
</details>
83+
{{end}}
7984
</div>
8085

8186
<div class="catalog-row__decision">

0 commit comments

Comments
 (0)