Skip to content

Preview UI update#134

Merged
ericmj merged 7 commits into
hexpm:mainfrom
paulo-valim:main
May 18, 2026
Merged

Preview UI update#134
ericmj merged 7 commits into
hexpm:mainfrom
paulo-valim:main

Conversation

@paulo-valim
Copy link
Copy Markdown
Contributor

No description provided.

paulo-valim and others added 2 commits May 15, 2026 23:44
- preview_live.html.heex: drop `trim: true` so gutter lines match
  rendered code lines (regression: `"a\n\nb\n"` was counting 2 instead
  of 4).
- preview_web.ex: remove dead `Phoenix.LiveView.Helpers` import — those
  helpers moved to `Phoenix.Component` in LiveView 1.0.
- theme.js: drop unreachable `closest("[data-theme-toggle]")` branch in
  `closeAllMenus`; the menu is a sibling of the toggle, not a descendant.
- app.html.heex: remove redundant `role="main"` on `<main>`.
- Run `mix format` on HEEx/component files.
ericmj added 5 commits May 18, 2026 16:16
The header and footer wordmarks rendered the full "hexpreview" string
in bold. Move font-bold to just the "hex" prefix so the brand half
pops and the product name renders in normal weight.
Bump makeup to 1.2 and add makeup_gleam + makeup_syntect to match
hexpm's lexer coverage; drop makeup_html (hexpm doesn't ship it).
makeup_eex stays since preview specifically renders .heex/.eex files.

Replace the hand-rolled extension → lexer cond with
Makeup.Registry.fetch_lexer_by_extension/1 so syntect's grammars (Rust,
JS, TOML, JSON, YAML, …) light up automatically.

Swap the inline lovelace stylesheet rendered server-side per request
for hexpm's bundled GitHub Dark makeup.css, imported from app.css.
mix deps.unlock --check-unused (run in CI) flagged makeup_html as
no longer referenced from mix.exs after the previous commit removed
it from deps.
The bundled theme was hexpm's GitHub Dark colors (designed for hexpm's
forced dark .highlight background). On preview pages pre.highlight is
transparent so light-mode users saw #a5d6ff strings on white. Add
GitHub Light token colors as the default and gate the dark palette
behind [data-theme=dark].
- The solid Heroicons 24×24 sun has many tiny ray subpaths that render
  fuzzy at 20px. Swap both the navbar toggle and the dropdown 'Light'
  choice for the same outline (circle + 8 stroked rays) icon diff uses.
- The search form's phx-submit pointed at 'suggest', so pressing Enter
  on an exact package name just re-ran the suggestion list. Add a
  'submit' handler that, on an exact match against
  Preview.Package.Store.get_names/0, sends the same {:search, name}
  message used by the suggestion click handler — which loads versions
  and renders the version selector.
@ericmj ericmj merged commit df75b01 into hexpm:main May 18, 2026
12 checks passed
@ericmj
Copy link
Copy Markdown
Member

ericmj commented May 18, 2026

This is great! Thank you @paulo-valim 💜

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