openvibers/openvibe.reviews Commits

Reviews' front page on a phone: the lists show their first rows, what every page shows folds, the repeated links go (#139)

OP OpenVibers committed 15 days ago · ab1d0f2e6e · 3 files, +16 −12

On a phone the scores from sources show six of their twenty, and the inspections, buildings and companies four each (every list keeps its link to the rest); What every page shows is a fold; Find your way around, which repeated the navbar, is gone; the hero has two actions. CSS brotli budget 8.2 -> 8.6 (8.4 measured).

Changes

ddiff --git a/public/css/reviews.css b/public/css/reviews.css
iindex 182bc9b..c699737 100644
---- a/public/css/reviews.css
++++ b/public/css/reviews.css
@@@ -171,3 +171,14 @@ main .rv-h-panel-h { margin: 0 0 12px; padding: 0; border: 0; font-size: 1rem; }
.rv-h-links b { display: block; }
.rv-h-links small { display: block; color: var(--rv-muted); font-size: 13.5px; }
@media (max-width: 560px) { .rv-h-stats dd { font-size: 1.3rem; } }
++
++/* Phones (2026-10-29): a taste and a door. Each list on the home shows its first rows; every list is a link away. */
++.rv-h-fold { margin: 22px 0 0; border: 1px solid var(--border, #1f2d47); border-radius: 14px; background: var(--bg-card, #131c2e); }
++.rv-h-fold > summary { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 48px; padding: 0 16px; cursor: pointer; font-weight: 700; list-style: none; }
++.rv-h-fold > summary::-webkit-details-marker { display: none; }
++.rv-h-fold > summary span { color: var(--text-muted, #7386a3); font-weight: 600; font-size: .86rem; }
++.rv-h-fold .sc-sec { margin: 0; padding: 0 16px 14px; }
++@media (max-width: 599px) {
++ .rv-board > li:nth-child(n+7) { display: none; }
++ .rv-h-list > li:nth-child(n+5), .rv-h-rank > li:nth-child(n+5) { display: none; }
++}
ddiff --git a/server/render/views.js b/server/render/views.js
iindex 6d7020b..93f9319 100644
---- a/server/render/views.js
++++ b/server/render/views.js
@@@ -98,7 +98,8 @@ function reviewsHero(aside = null) {
eyebrow: 'OpenVibe.Reviews',
title: 'Employers, landlords, restaurants, hosts.', accent: 'Every review in one place.',
lede: 'Read and write reviews of where you work, rent, eat and host, beside the scores other sites publish and every review site\'s own page for it. Every number says where it came from.',
-- actions: [{ label: 'Write a review', href: '/review', primary: true }, { label: 'Search every review site', href: '/everywhere' }, { label: 'How it works', href: '/about' }],
++ // Two, so they sit side by side on a phone; how it works is the steps below and /about.
++ actions: [{ label: 'Write a review', href: '/review', primary: true }, { label: 'Search every review site', href: '/everywhere' }],
});
}
function reviewsFeatures() {
@@@ -334,7 +335,7 @@ ${complaints.length ? html`<section class="sc-sec" aria-labelledby="rv-cfpb-h"><
<p class="sc-lede">Complaints consumers sent the Consumer Financial Protection Bureau about financial products. They are not findings: the CFPB does not verify them, and a company with more customers gets more.</p>
<ol class="rv-h-rank">${complaints.map((x) => html`<li><a href="/e/${e(x.slug)}"><b>${x.name}</b><span>${n(x.complaints)} complaints</span></a></li>`)}</ol>
<p><a href="/k/organization">Every company (${n(kinds.organization || 0)})</a></p></section>` : ''}
--${raw(reviewsFeatures())}
++<details class="rv-h-fold"><summary>What every page shows<span>sources, checks, changes, corrections, feeds</span></summary>${raw(reviewsFeatures())}</details>
${raw(showcase.steps({
title: 'How it works',
items: [
@@@ -344,15 +345,7 @@ ${raw(showcase.steps({
{ title: 'Every review site is one click away', text: 'Each page links the review sites that cover its kind (Google, Yelp, Glassdoor, the BBB, Trustpilot, Reddit and more), searched for that name.', href: '/everywhere' },
],
}))}
--<section class="sc-sec rv-h-faq" aria-labelledby="rv-faq-h"><h2 id="rv-faq-h">Questions</h2>${HOME_FAQ.map((f) => html`<details><summary>${f.q}</summary><p>${f.a}</p></details>`)}</section>
--<section class="sc-sec" aria-labelledby="rv-links-h"><h2 id="rv-links-h">Find your way around</h2><ul class="rv-h-links">
--<li><a href="/review"><b>Write a review</b><small>Employers, landlords, restaurants, hosts and more.</small></a></li>
--<li><a href="/everywhere"><b>Every review site, one search</b><small>${n(sites)} sites, each searched for the name you type.</small></a></li>
--<li><a href="/about"><b>How it works</b><small>Signals, the aggregate, summaries and corrections.</small></a></li>
--<li><a href="/k/restaurant"><b>Restaurants</b><small>NYC inspections, grades and critical violations.</small></a></li>
--<li><a href="/k/landlord"><b>Landlords</b><small>Buildings by their open HPD violations.</small></a></li>
--<li><a href="/updates"><b>What shipped</b><small>Every change to OpenVibe.Reviews itself.</small></a></li>
--</ul></section>`;
++<section class="sc-sec rv-h-faq" aria-labelledby="rv-faq-h"><h2 id="rv-faq-h">Questions</h2>${HOME_FAQ.map((f) => html`<details><summary>${f.q}</summary><p>${f.a}</p></details>`)}</section>`;
}
/** The front page's structured data: the site and its search, the scored pages as an ItemList, the questions shown. */
ddiff --git a/test/perf-budget.test.js b/test/perf-budget.test.js
iindex 8272f04..5a1c0c4 100644
---- a/test/perf-budget.test.js
++++ b/test/perf-budget.test.js
@@@ -19,7 +19,7 @@ const BUDGETS = {
jsBrotliKB: 76, // 74.2 openvibe-shared 4.25.0: the menu's orb beside the brand, both balances on phones, messages, the account sheet on phones and the bar stepping away on phones; 70.5 Shared 4.17.0: OpenCoins and Vibes chips (wallet: true) in the navbar; 67.9 openvibe-shared 4.15 footer: the compact footer opens into the whole one, and the pulse line; 65.3 Shared 4.12.0: the light/dark switch, the seasonal mark and the theme pairs; 61.7 with shared 4.11.0's seasonal navbar; 56.3 (49.9 before web-runtime.js)
cssFiles: 2, // 2 (reviews.css, openvibe-shared showcase.css)
cssRawKB: 41, // 36.8 openvibe-shared 4.26.1 (hero visual); 31.3 with Shared 4.13.0 (2026-10-26); 25.4 on 2026-10-22 (the front page's numbers, inspections, ranked records, questions and links); 22.1 with members' reviews, kinds and other review sites (2026-10-17); 19.4 (18.2 before 2026-10-15's scoreboard, 6.7 before showcase.css)
-- cssBrotliKB: 8.2, // 6.7 with Shared 4.13.0; raised from 8 for openvibe-shared v4.39.0 (+1.5 KB raw of kit/room/showcase CSS); measured 8.2
++ cssBrotliKB: 8.6, // 8.4 with the home's fold and phone list rules (2026-10-29); 6.7 with Shared 4.13.0; raised from 8 for openvibe-shared v4.39.0 (+1.5 KB raw of kit/room/showcase CSS); measured 8.2
externalFiles: 1, // 0
};