DAB: Fix some styling and spacing bugs

[FyreByrd]

Summary by CodeRabbit

• Style

  • Lexicon pages now apply theme colors consistently across backgrounds, text, tabs, navigation controls, separators, and word lists.
  • Improved styling for clickable word links and audio controls.
  • Preserved whitespace when displaying formatted dictionary entries.

• Bug Fixes

  • Vernacular word references are now rendered as accessible links, improving click behavior and navigation.
  • Theme changes are now reflected more reliably throughout lexicon and search views.

[coderabbitai]

Warning

Review limit reached

@FyreByrd, you've reached your PR review limit, so we couldn't start this review.

Next review available in: 19 minutes

Enable usage-based reviews in Billing to review now. Otherwise, wait until the next included review is available.
You're only billed for reviews past your plan's rate limits ($0.25/file).

How can I continue?

After more reviews become available, a review can be triggered using the @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

To avoid repeated limits, reduce automatic review volume by pausing incremental auto-reviews earlier, using label-based review opt-in, excluding WIP or generated PR titles, or requesting reviews manually when the PR is ready. If your team needs uninterrupted high-volume reviews, an organization admin can enable usage-based reviews.

How do review limits work?

CodeRabbit enforces per-developer PR review limits for each organization. Most developers receive the normal plan review availability.

For paid Pro and Pro+ PR reviews, CodeRabbit uses adaptive limits for sustained high-volume activity. When a developer's recent PR review activity reaches the 95th percentile or higher among CodeRabbit users, additional reviews become available more gradually as earlier reviews age out of the rolling window.

Please refer docs for additional details.

Review details

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: 275288cd-2214-47e7-a7e4-61f05e3749ab

📥 Commits

Reviewing files that changed from the base of the PR and between 535ed71 and 9429b1c.

📒 Files selected for processing (2)

• convert/convertStyles.ts
• src/lib/lexicon/components/EntryView.svelte

📝 Walkthrough

Walkthrough

Lexicon layouts, navigation, entry rendering, and search views now use reactive theme colors instead of CSS variables. Entry XML handling also preserves text whitespace, renders vernacular links as anchors, and moves audio-link styling into component styles.

Changes

Lexicon theme rendering

Layer / File(s)	Summary
Entry rendering and generated controls src/lib/lexicon/components/EntryView.svelte	Entry output preserves text-node whitespace, uses anchors for vernacular links, and applies theme-driven styling to separators, backgrounds, audio buttons, and clickable links.
Lexicon layout and navigation theming src/routes/lexicon/+layout.svelte, src/lib/lexicon/components/WordNavigationStrip.svelte, src/routes/lexicon/+page.svelte	The layout, navigation strip, tabs, alphabet buttons, and word list use reactive theme colors and language-specific style overrides.
Search page theme bindings src/routes/lexicon/search/+page.svelte	Search headers, containers, separators, and no-results text use theme store values.

Estimated code review effort: 3 (Moderate) | ~20 minutes

Suggested reviewers: chrisvire

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title matches the main theme of the PR: styling and spacing fixes across lexicon UI components.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch fix/dls-feedback

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}

[coderabbitai]

Actionable comments posted: 3

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@src/lib/lexicon/components/EntryView.svelte`:
- Around line 73-75: Update processNode to discard whitespace-only text nodes
before rendering inside <pre>, while preserving text nodes containing meaningful
mixed-content whitespace. Keep returning the original node value for
non-whitespace text and leave element processing unchanged.
- Around line 106-107: Update the generated anchor in the match/hash-link branch
to retain a sanitized href for normal and hash links, preserving navigation and
keyboard activation. For synthetic E-n links without a usable href, provide the
existing accessible activation behavior and prevent default navigation as
needed, while keeping the current link text and data attributes.
- Around line 187-188: Update the `$effect` that builds `xmlData` to
synchronously capture `$themeColors['SettingsSeparatorColor']` before the
asynchronous `queryXmlByWordId` call, then pass that captured value into
`updateXmlData`. Ensure the effect tracks theme changes so separator colors are
regenerated after the theme updates.

🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: ff25540c-6e46-487a-ad2f-6ce94828385b

📥 Commits

Reviewing files that changed from the base of the PR and between 33b2084 and 535ed71.

📒 Files selected for processing (5)

• src/lib/lexicon/components/EntryView.svelte
• src/lib/lexicon/components/WordNavigationStrip.svelte
• src/routes/lexicon/+layout.svelte
• src/routes/lexicon/+page.svelte
• src/routes/lexicon/search/+page.svelte

[chrisvire]

LGTM