fix: polish homepage app and publish sections

This commit is contained in:
vyctorbrzezowski
2026-07-11 12:53:01 -03:00
committed by Vyctor H. Brzezowski
parent 423003968c
commit 726e734287
3 changed files with 12 additions and 15 deletions
+1 -1
View File
@@ -292,7 +292,7 @@ describe("restored UI design contract", () => {
expect(homeSource).toContain("home-v2-headline oc-hero-title");
expect(listingSource).toContain("home-v2-listing-card oc-card oc-card-interactive");
expect(listingSource).toContain("home-v2-listing-kind clawhub-segmented");
expect(appsSource).toContain("home-v2-apps-tile oc-card oc-card-interactive");
expect(appsSource).toContain('className="home-v2-apps-tile"');
expect(appsSource).toContain('className="home-v2-apps-workflow-header"');
expect(appsSource).not.toContain('className="home-v2-apps-workflow-header oc-card"');
expect(publishersSource).toContain(
+4 -8
View File
@@ -60,7 +60,7 @@ function HomeAppsCompactSkill({ app }: { app: HomeSkillApp }) {
<Link
to="/skills"
search={{ ...SKILLS_BROWSE_SEARCH, q: app.browseQuery }}
className="home-v2-apps-tile oc-card oc-card-interactive"
className="home-v2-apps-tile"
title={app.description}
>
<span className="home-v2-apps-tile-icon" aria-hidden="true">
@@ -79,7 +79,7 @@ function HomeAppsCompactPlugin({ plugin: shortcut }: { plugin: HomePluginShortcu
return (
<Link
to={buildPluginDetailHref(shortcut.packageName)}
className="home-v2-apps-tile oc-card oc-card-interactive"
className="home-v2-apps-tile"
title={shortcut.description}
>
<span className="home-v2-apps-tile-icon" aria-hidden="true">
@@ -277,11 +277,7 @@ export function HomeAppsSection() {
</div>
</div>
<div
className="home-v2-apps-categories oc-segmented"
role="tablist"
aria-label="App categories"
>
<div className="home-v2-apps-categories" role="tablist" aria-label="App categories">
{appCategories.map((category) => {
const Icon = category.icon;
return (
@@ -290,7 +286,7 @@ export function HomeAppsSection() {
type="button"
role="tab"
aria-selected={category.id === activeCategoryId}
className="home-v2-apps-category-tab oc-segmented-item"
className="home-v2-apps-category-tab"
onClick={() => setActiveCategoryId(category.id)}
>
<Icon className="home-v2-apps-category-tab-icon" size={14} aria-hidden="true" />
+7 -6
View File
@@ -26635,6 +26635,7 @@ a.search-empty-action {
position: relative;
z-index: 2;
display: flex;
width: fit-content;
gap: 8px;
flex-wrap: wrap;
margin-top: 2px;
@@ -26683,14 +26684,14 @@ a.search-empty-action {
}
.home-v2-apps-category-tab[aria-selected="true"] {
border-color: color-mix(in srgb, var(--hv2-text) 18%, transparent);
background: var(--hv2-text);
color: var(--hv2-bg);
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.16);
border-color: var(--hv2-border-hover);
background: var(--hv2-surface-hover);
color: var(--hv2-text);
box-shadow: none;
}
.home-v2-apps-category-tab[aria-selected="true"] .home-v2-apps-category-tab-icon {
color: var(--hv2-bg);
color: var(--hv2-text);
}
.home-v2-apps-tile-grid {
@@ -27574,7 +27575,7 @@ a.home-v2-apps-see-all:focus-visible svg {
inset: 0;
background-position: var(--byos-art-x, 50%) var(--byos-art-y, 50%);
background-repeat: no-repeat;
background-size: var(--byos-art-size, 112%) auto;
background-size: cover;
pointer-events: none;
}