fix(ui): mobile command picker and DiscordEmbed label spacing

[RedStar071]

🔗 Linked issue

N/A — UI polish from Discord mobile/embed screenshots.

🧭 Context

Two showcase regressions on /wolfstar:

1. The slash-command picker on small viewports still used the desktop left rail instead of Discord mobile’s horizontal app bar under the list.
2. Bold embed labels (Type, User, Reason, logging fields) jammed into their values because Vue’s whitespace condensation drops spaces between tags, and DiscordMention/DiscordRole are components rather than text nodes.

📚 Description

• Command picker: desktop styles stay the default; Discord mobile layout (column + bottom rail, uppercase labels, pill input) is applied only below md via max-md: / md: — no inverted mobile-first base cascade.
• DiscordEmbed spacing: unscoped strong::after space plus explicit template spaces so every embed caller keeps a gap before text and mention/role chips.
• DiscordMention / DiscordRole: small leading margin so chip components don’t sit flush against prior text when whitespace is stripped.
• Showcase templates + Nuxt SSR tests updated.

Mobile command picker
Embed label spacing
Desktop command picker

Test plan

• Below md: list on top, horizontal app rail below, pill input + send
• md+: original vertical left rail and desktop input tools
• Embeds: space after Type/User/Reason and logging labels next to mentions
• pnpm lint:fix, pnpm typecheck, pnpm build:test, pnpm test:unit, pnpm test:nuxt

_{To show artifacts inline, enable in settings.}

  

---

^{Need help on this PR? Tag /codesmith with what you need. Autofix is disabled.}

Confidence Score: 5/5

Safe to merge with minimal risk.

The changes are confined to showcase UI, display helpers, styling, and tests. No verified runtime, accessibility, contract, or security issue was found.

No files require special attention.

T-Rex Logs

What T-Rex did

• Generated the Prisma client with pnpm prisma:generate after Nuxt initially failed to load the Prisma client.
• Started the development server on 127.0.0.1:3000 with NODE_ENV=test and the NUXT_BETTER_AUTH_SECRET and BETTER_AUTH_SECRET environment variables.
• Playwright's Chromium run attempted to navigate to the /wolfstar route but page.goto timed out after 30 seconds.
• Direct curl checks to 127.0.0.1:3000 timed out after 20 seconds with 0 bytes received, confirming the blocker was the app response readiness rather than a UI-only issue.

_{Ran code and verified through T-Rex}

_{Reviews (11): Last reviewed commit: "fix(discord): update scrollbar styles an..." | Re-trigger Greptile}

[codspeed-hq]

Merging this PR will not alter performance

✅ 44 untouched benchmarks

---

_{Comparing cursor/mobile-command-picker-embed-spacing-1354 (fb950af) with main (8babfde)}

[codecov]

Codecov Report

❌ Patch coverage is 82.29167% with 17 lines in your changes missing coverage. Please review.
✅ Project coverage is 71.80%. Comparing base (8babfde) to head (fb950af).
✅ All tests successful. No failed tests found.

Files with missing lines	Patch %	Lines
...rketing)/wolfstar/@components/CommandsShowcase.vue	83.33%	3 Missing and 3 partials ⚠️
shared/utils/chat-input-command.ts	33.33%	0 Missing and 6 partials ⚠️
app/components/discord/member-list.vue	87.50%	0 Missing and 2 partials ⚠️
app/components/discord/scrollbar.vue	33.33%	1 Missing and 1 partial ⚠️
app/components/discord/chat-message-composer.vue	83.33%	0 Missing and 1 partial ⚠️

Additional details and impacted files

@@            Coverage Diff             @@
##             main     #304      +/-   ##
==========================================
+ Coverage   71.53%   71.80%   +0.27%     
==========================================
  Files         167      170       +3     
  Lines        3302     3345      +43     
  Branches      702      705       +3     
==========================================
+ Hits         2362     2402      +40     
  Misses        447      447              
- Partials      493      496       +3     

Flag	Coverage Δ
component	66.33% <79.16%> (+0.23%)	⬆️
unit	67.67% <33.33%> (ø)

Flags with carried forward coverage won't be shown. Click here to find out more.

Files with missing lines	Coverage Δ
app/components/discord/channel/header.vue	100.00% <100.00%> (ø)
app/components/discord/channel/welcome.vue	100.00% <100.00%> (ø)
...components/discord/chat-input-command/app-icon.vue	100.00% <ø> (ø)
...pp/components/discord/chat-input-command/group.vue	50.00% <ø> (ø)
...pp/components/discord/chat-input-command/index.vue	93.33% <ø> (ø)
.../components/discord/chat-input-command/matched.vue	72.72% <ø> (ø)
...mponents/discord/chat-input-command/suggestion.vue	68.75% <100.00%> (ø)
...ponents/discord/chat-input-command/suggestions.vue	69.23% <100.00%> (ø)
app/components/discord/chat.vue	100.00% <100.00%> (ø)
app/components/discord/embed.vue	100.00% <ø> (ø)
... and 11 more

🚀 New features to boost your workflow:

• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.