containers/marketplace/resources/site/index.html

@@ -59,8 +59,7 @@
     background-size: 200px 200px;
   }
   body {
-    /* Exact App Center font stack (core/theme/css/base.css). */
+    font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
-    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
     color: var(--text-primary); min-height: 100vh; background: transparent;
   }
 
@@ -85,7 +84,7 @@
     border-right: 1px solid var(--sidebar-border);
     backdrop-filter: blur(12px) saturate(140%); -webkit-backdrop-filter: blur(12px) saturate(140%);
   }
-  .sidebar { position: sticky; top: 60px; display: flex; flex-direction: column; background: var(--sidebar-bg); color: var(--sidebar-text); }
+  .sidebar { position: sticky; top: 60px; display: flex; flex-direction: column; }
   .apps-search { position: relative; padding: 14px 20px; border-bottom: 1px solid var(--sidebar-border); }
   .apps-search-icon { position: absolute; left: 32px; top: 50%; transform: translateY(-50%); color: rgba(var(--text-rgb),0.55); pointer-events: none; }
   .apps-search input {
@@ -98,11 +97,11 @@
   .cat-list { display: flex; flex-direction: column; }
   .category {
     display: flex; align-items: center; gap: 10px; padding: 15px 20px;
-    cursor: pointer; color: var(--text-secondary); font-size: 16px; text-transform: capitalize;
+    cursor: pointer; color: var(--text-secondary); font-size: 14px; text-transform: capitalize;
     border-bottom: 1px solid var(--sidebar-border); transition: background 0.2s, color 0.2s;
   }
   .category:hover, .category.active { background: var(--surface-hover); color: var(--text-primary); }
-  .category img, .category svg { width: 20px; height: 20px; flex-shrink: 0; }
+  .category img { width: 20px; height: 20px; flex-shrink: 0; }
 
   .main-content { flex: 1; min-width: 0; }
   .status-strip {
@@ -235,24 +234,17 @@
     return by;
   }
 
-  // Inline glyphs for the special rows (currentColor, so they follow the row's
+  function catRow(id, label) {
-  // text colour — the App Center renders All/Recommended inline for this reason;
+    // Real App Center category glyphs (bundled into the site by the install
-  // the category .svg files carry their own fixed blue, so those stay as <img>).
+    // hook); misc.svg is the fallback for an unknown category.
-  var GRID_SVG = '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="7" height="7"/><rect x="14" y="3" width="7" height="7"/><rect x="14" y="14" width="7" height="7"/><rect x="3" y="14" width="7" height="7"/></svg>';
-  var STAR_SVG = '<svg viewBox="0 0 24 24" fill="none" stroke="#fbbf24" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"/></svg>';
-
-  function catRow(id, label, glyph) {
     return '<div class="category' + (state.cat === id ? ' active' : '') + '" data-cat="' + esc(id) + '">' +
-      glyph + '<span>' + esc(label) + '</span></div>';
+      '<img src="categories/' + esc(id) + '.svg" alt="" onerror="this.src=\'categories/misc.svg\'">' +
-  }
+      '<span>' + esc(label) + '</span></div>';
-  function catImg(id) {
-    return '<img src="categories/' + esc(id) + '.svg" alt="" onerror="this.src=\'categories/misc.svg\'">';
   }
   function renderCats() {
     var list = Object.keys(counts()).sort();
-    var rows = [catRow('all', 'All', GRID_SVG)];
+    var rows = [catRow('all', 'All')];
-    if (state.apps.some(function (a) { return a.featured; })) rows.push(catRow('__featured__', 'Featured', STAR_SVG));
+    list.forEach(function (c) { rows.push(catRow(c, c)); });
-    list.forEach(function (c) { rows.push(catRow(c, c, catImg(c))); });
     cats.innerHTML = rows.join('');
   }
 
@@ -292,8 +284,7 @@
     var focus = state.focus;   // #<slug> deep-link → show just that app
     var shown = state.apps.filter(function (a) {
       if (focus) return a.slug === focus;
-      if (state.cat === '__featured__') { if (!a.featured) return false; }
+      if (state.cat !== 'all' && a.category !== state.cat) return false;
-      else if (state.cat !== 'all' && a.category !== state.cat) return false;
       if (q && (a.title + ' ' + a.description + ' ' + a.long_description + ' ' + a.slug).toLowerCase().indexOf(q) < 0) return false;
       return true;
     });
@@ -346,7 +337,7 @@
             slug: a.applies_when.app, title: a.title || a.applies_when.app,
             description: m.description || a.why || '', long_description: m.long_description || '',
             category: (m.category || '').toLowerCase(), trust: a.trust || 'official',
-            version: a.version || 1, installed: false, featured: !!m.featured,
+            version: a.version || 1, installed: false,
             icon: m.icon ? ch + '/payloads/icons/' + a.applies_when.app + '.' + m.icon.split('.').pop() : null
           };
         });