From 573bf4bdf69d86d02b6c55c74eeab27fe96b1898 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=9B=B7=E7=94=B5=E8=8A=BD=E8=A1=A3?= Date: Sat, 9 May 2026 20:45:18 -0400 Subject: [PATCH] Diversify plugin cover gradients MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Match plugins.jsx, where every card cover gets a different pastel→bold gradient (Pink+Blue, Mint+Violet, Cream+Coral, etc). Previously every card painted the same Pink→Blue ramp, making the marketplace grid feel uniform. `plugin_cover_gradient(name)` hashes the plugin name into the design's 8-stop palette so the same plugin always lands on the same ramp without needing any new manifest fields. cargo test --workspace: 440 passed, 0 failed. --- .../shell/internal_pages/plugin_catalog.rs | 31 +++++++++++++++++-- 1 file changed, 29 insertions(+), 2 deletions(-) diff --git a/crates/ely_app/src/shell/internal_pages/plugin_catalog.rs b/crates/ely_app/src/shell/internal_pages/plugin_catalog.rs index 4d81128..e8fc0df 100644 --- a/crates/ely_app/src/shell/internal_pages/plugin_catalog.rs +++ b/crates/ely_app/src/shell/internal_pages/plugin_catalog.rs @@ -303,6 +303,7 @@ fn render_plugin_card( let high_risk = plugin.manifest().high_risk_permissions().count(); let glyph = plugin.manifest().name().chars().next().unwrap_or('◇').to_string(); let initial = glyph.to_uppercase().to_string(); + let (cover_a, cover_b) = plugin_cover_gradient(plugin.manifest().name()); div() .id(SharedString::from(format!("plugin-card-{index}"))) @@ -324,8 +325,8 @@ fn render_plugin_card( .rounded(px(10.0)) .bg(linear_gradient( 135.0, - linear_color_stop(hsla(341.0 / 360.0, 0.78, 0.85, 1.0), 0.0), - linear_color_stop(hsla(228.0 / 360.0, 1.0, 0.86, 1.0), 1.0), + linear_color_stop(cover_a, 0.0), + linear_color_stop(cover_b, 1.0), )) .flex() .items_center() @@ -436,3 +437,29 @@ const INSTALL_BG: u32 = 0x1d1c1aff; const CARD_BG: u32 = 0xffffffc7; const CARD_BG_HOVER: u32 = 0xffffffeb; const STATUS_BG: u32 = 0xffffffd9; + +/// Pick a deterministic gradient pair for a plugin cover. Mirrors the +/// design's palette of 8 pastel-to-bold ramps used across `plugins.jsx`, +/// hashed by plugin name so the same plugin always lands on the same +/// ramp without needing any new manifest fields. +fn plugin_cover_gradient(name: &str) -> (gpui::Hsla, gpui::Hsla) { + const PALETTE: &[(f32, f32, f32, f32, f32, f32)] = &[ + (341.0, 0.78, 0.85, 228.0, 1.00, 0.86), + (148.0, 0.65, 0.85, 252.0, 0.85, 0.71), + (251.0, 0.85, 0.71, 341.0, 0.78, 0.85), + (20.0, 1.00, 0.95, 17.0, 0.71, 0.84), + (263.0, 1.00, 0.88, 341.0, 0.78, 0.85), + (33.0, 1.00, 0.86, 343.0, 0.78, 0.67), + (162.0, 0.43, 0.51, 30.0, 0.04, 0.04), + (343.0, 0.78, 0.67, 251.0, 0.85, 0.71), + ]; + + let bucket = name.bytes().fold(0u32, |acc, b| acc.wrapping_add(b as u32)) + as usize + % PALETTE.len(); + let (h1, s1, l1, h2, s2, l2) = PALETTE[bucket]; + ( + hsla(h1 / 360.0, s1, l1, 1.0), + hsla(h2 / 360.0, s2, l2, 1.0), + ) +}