Skip to content

feat: dark-mode carousel code blocks, Linear connector demo, icon fixes#395

Merged
steve-calvert-glean merged 3 commits intomainfrom
feat/homepage-carousel-dark-code-icon-fixes
Mar 16, 2026
Merged

feat: dark-mode carousel code blocks, Linear connector demo, icon fixes#395
steve-calvert-glean merged 3 commits intomainfrom
feat/homepage-carousel-dark-code-icon-fixes

Conversation

@steve-calvert-glean
Copy link
Contributor

Summary

  • Carousel dark mode: Replaced Docusaurus CodeBlock with prism-react-renderer Highlight + themes.dracula directly. CodeBlock bakes inline styles at render time from the site's current theme — the only way to force dark is to pass a dark theme object at the component level.
  • Linear connector slide: Updated the "Bring Every Data Source" carousel slide (slide 4) to show a real glean-indexing-sdk connector class (LinearConnector extending BaseDatasourceConnector) instead of the generic SDK usage example.
  • Carousel layout fixes:
    • Code panels capped at 340px height with overflow: auto so long snippets don't blow out the slide height
    • Swiper overflow: visiblehidden to prevent the dark gradient container from bleeding into adjacent image slides during autoplay transitions
  • Icon rendering fix (theme package): GleanIcon SVG cleanup was adding fill="currentColor" to ALL paths without an explicit fill attribute — including stroke-only paths, which turned them into solid filled shapes. The code-block icon was rendering as a solid blue wedge instead of the </> bracket shape. Fix: paths with stroke= but no fill= now get fill="none", preserving the designer's stroke-only intent.
  • Invalid icon names: icon="Brain"icon="Cpu" and icon="Sparkles"icon="sparkles" iconSet="glean" in deep-linked-citations.mdxBrain and Sparkles don't exist in react-feather or the Glean icon manifest, causing silent empty renders.

Test plan

  • Homepage carousel: slides 3 and 4 show dark code blocks (Dracula theme) regardless of site light/dark mode toggle
  • Slide 4 shows LinearConnector class with BaseDatasourceConnector, CustomDatasourceConfig, and transform() — scrollable if taller than 340px
  • Toggling between carousel slides shows clean transitions with no dark gradient bleeding onto image slides
  • "Build with Our APIs" feature card shows a </> code-block icon, not a solid filled triangle
  • /guides/chat/deep-linked-citations page renders Cpu and sparkles icons correctly (no empty icon slots)

🤖 Generated with Claude Code

…dering fixes

- Replace Docusaurus CodeBlock with prism-react-renderer Highlight + themes.dracula
  in carousel slides, forcing dark mode regardless of site theme toggle
- Add LinearConnector code sample (glean-indexing-sdk) to "Bring Every Data Source"
  carousel slide — shows BaseDatasourceConnector pattern with real connector fields
- Constrain carousel code panels with max-height + overflow to prevent height blowout
- Fix carousel Swiper overflow: visible → hidden to stop dark gradient from bleeding
  into adjacent image slides during transitions
- Fix GleanIcon SVG cleanup: stroke-only paths now get fill="none" instead of
  fill="currentColor", correcting the solid-filled wedge on the code-block icon
- Fix invalid icon names in deep-linked-citations.mdx: Brain → Cpu, Sparkles →
  sparkles (glean iconSet)

Co-Authored-By: Claude Sonnet 4.6 (1M context) <noreply@anthropic.com>
@steve-calvert-glean steve-calvert-glean requested a review from a team as a code owner March 15, 2026 00:17
@vercel
Copy link

vercel bot commented Mar 15, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
glean-developer-site Ready Ready Preview, Comment Mar 16, 2026 4:37pm

Request Review

steve-calvert-glean and others added 2 commits March 16, 2026 09:34
…brand.css

- Bump --ifm-heading-font-weight from 400 to 600; add weight token variables
  (--ifm-font-weight-medium/semibold/bold) from Glean design system
- Add per-level heading rules: h2-h3 semibold, h4-h6 medium, h1 bold
- Add strong/b element weight rule (semibold, matching Glean DS pattern)
- Add full Glean design token set: border-radius scale (sm→2xl), shadow scale
  (sm→xl), semantic colors (success/warning/danger/info), brand accent palette
- Add sidebar background (#f6f6f6) and dark-mode reset to match Glean product
- Add admonition cleanup: remove Infima default border, apply radius token
- Use --glean-border-radius-sm token in scrollbar rules

Co-Authored-By: Claude Sonnet 4.6 (1M context) <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 (1M context) <noreply@anthropic.com>
@steve-calvert-glean steve-calvert-glean merged commit 6cd9f18 into main Mar 16, 2026
3 checks passed
@steve-calvert-glean steve-calvert-glean deleted the feat/homepage-carousel-dark-code-icon-fixes branch March 16, 2026 17:37
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants