Conversation
Localize remote mume.org images (including historical maps and High-DPI variants) so page rendering does not depend on external servers. Standardize top-page banners across landing pages with unified responsive CSS (.page-banner and .banner-img) and High-DPI support. Update homepage interactive tutorial link for subpath base compatibility.
…anner UX Localize remote mume.org images (including historical maps and High-DPI variants) so page rendering does not depend on external servers. Consolidate image storage to docs/public/assets/images/ with root-relative paths (/assets/images/). Standardize top-page banners across landing pages with unified responsive CSS (.page-banner and .banner-img) and High-DPI support. Update homepage interactive tutorial link for subpath base compatibility.
Reviewer's GuideThis PR fixes documentation asset resolution for deployed paths, standardizes page banner markup and styling, adds responsive high-resolution imagery, and updates homepage, resource, and embeddable-banner links. File-Level Changes
Tips and commandsInteracting with Sourcery
Customizing Your ExperienceAccess your dashboard to:
Getting Help
|
There was a problem hiding this comment.
Hey - I've found 2 issues
Prompt for AI Agents
Please address the comments from this code review:
## Individual Comments
### Comment 1
<location path="docs/.vitepress/theme/mume.css" line_range="276" />
<code_context>
text-align: center;
background: #0a0d15;
- background-image: url(../../assets/images/play-now-banner.jpg);
+ background-image: url(/assets/images/play-now-banner.jpg);
background-position: center;
background-size: cover;
</code_context>
<issue_to_address>
**issue (bug_risk):** The new root-relative asset URLs ignore the VitePress `base` configured from `VITE_BASE`, so every image and CSS background resolves from the domain root instead of the deployed documentation subpath. A deployment such as `/mume/` therefore requests `/assets/images/...` rather than `/mume/assets/images/...` and renders broken images.
**Triggers:** When the documentation is built or hosted with a non-root `VITE_BASE`.
**Suggested fix:** Use VitePress-aware asset URLs, such as `withBase()` for component code or base-prefixed paths generated at build time, instead of hard-coded root-relative URLs.
</issue_to_address>
### Comment 2
<location path="docs/links.md" line_range="24" />
<code_context>
<h3>Use this banner on your site</h3>
<p>Help spread the word about MUME. Copy the code below to link to us:</p>
- <pre><code><a href="https://mume.org"><img src="https://mume.org/Images/mume_banner.gif" alt="MUME"></a></code></pre>
+ <pre><code><a href="https://docs.mume.org"><img src="https://docs.mume.org/assets/images/mume_banner.gif" alt="MUME"></a></code></pre>
</div>
</div>
</code_context>
<issue_to_address>
**issue (bug_risk):** The copyable banner snippet now links visitors to `https://docs.mume.org` instead of the MUME website at `https://mume.org`, so third-party sites using the supplied snippet send users to the documentation site rather than the advertised main game/community site.
**Triggers:** When an external site copies the new snippet from the Community Links page.
**Suggested fix:** Keep the anchor target as `https://mume.org` unless redirecting banner traffic to the documentation site is explicitly intended.
```suggestion
<pre><code><a href="https://mume.org"><img src="https://docs.mume.org/assets/images/mume_banner.gif" alt="MUME"></a></code></pre>
```
</issue_to_address>Sourcery assessment
Approval pending. 2 findings to address first.
Blocking findings: docs/.vitepress/theme/mume.css:276, docs/links.md:24
| text-align: center; | ||
| background: #0a0d15; | ||
| background-image: url(../../assets/images/play-now-banner.jpg); | ||
| background-image: url(/assets/images/play-now-banner.jpg); |
There was a problem hiding this comment.
issue (bug_risk): The new root-relative asset URLs ignore the VitePress base configured from VITE_BASE, so every image and CSS background resolves from the domain root instead of the deployed documentation subpath. A deployment such as /mume/ therefore requests /assets/images/... rather than /mume/assets/images/... and renders broken images.
Triggers: When the documentation is built or hosted with a non-root VITE_BASE.
Suggested fix: Use VitePress-aware asset URLs, such as withBase() for component code or base-prefixed paths generated at build time, instead of hard-coded root-relative URLs.
Co-authored-by: sourcery-ai[bot] <58596630+sourcery-ai[bot]@users.noreply.github.com>
|
@sourcery-ai review |
There was a problem hiding this comment.
Hey - I've found 2 issues
Prompt for AI Agents
Please address the comments from this code review:
## Individual Comments
### Comment 1
<location path="docs/.vitepress/theme/mume.css" line_range="276-279" />
<code_context>
text-align: center;
background: #0a0d15;
- background-image: url(../../assets/images/play-now-banner.jpg);
+ background-image: url(../../public/assets/images/play-now-banner.jpg);
background-position: center;
background-size: cover;
</code_context>
<issue_to_address>
**issue (bug_risk):** The stylesheet points at files under `../../public/assets/images`, treating the Vite public directory as a URL-relative source path. Vite public assets are served from `/assets/...`, so these background URLs fail to resolve or cause the production build to reject the public-directory import, leaving every `.playnow` banner without its background.
**Triggers:** When the VitePress site is built or the `.playnow` component is rendered.
**Suggested fix:** Reference the public assets with root URLs such as `/assets/images/play-now-banner.jpg` and `/assets/images/play-now-banner@2x.jpg`, or import the files from a source asset directory.
</issue_to_address>
### Comment 2
<location path="docs/index.md" line_range="16-19" />
<code_context>
-<div class="center-img">
-<img src="./assets/images/fellowship_bw.jpg" alt="The Fellowship of the Ring" class="banner-img">
+<div class="page-banner">
+<img src="/assets/images/fellowship_bw.jpg" srcset="/assets/images/fellowship_bw.jpg 1x, /assets/images/fellowship_bw@2x.jpg 2x" alt="The Fellowship of the Ring" class="banner-img">
</div>
</code_context>
<issue_to_address>
**issue (bug_risk):** The changed image URLs are root-relative (`/assets/images/...`) and therefore ignore VitePress's configured `base` path. When the site is deployed under a non-root base such as `/community/`, these images and their `srcset` variants request `/assets/...` from the domain root instead of `/community/assets/...`, so the localized assets are broken.
**Triggers:** When `VITE_BASE` configures deployment below the domain root.
**Suggested fix:** Generate asset URLs through the configured base path, use VitePress's base-aware helpers, or keep the references in a form that VitePress rewrites for the configured base.
</issue_to_address>Sourcery assessment
Approval pending. 2 findings to address first.
Blocking findings: docs/.vitepress/theme/mume.css:279, docs/index.md:19
| <img src="/assets/images/fellowship_bw.jpg" srcset="/assets/images/fellowship_bw.jpg 1x, /assets/images/fellowship_bw@2x.jpg 2x" alt="The Fellowship of the Ring" class="banner-img"> | ||
| </div> | ||
|
|
||
| <div class="quote"> |
There was a problem hiding this comment.
issue (bug_risk): The changed image URLs are root-relative (/assets/images/...) and therefore ignore VitePress's configured base path. When the site is deployed under a non-root base such as /community/, these images and their srcset variants request /assets/... from the domain root instead of /community/assets/..., so the localized assets are broken.
Triggers: When VITE_BASE configures deployment below the domain root.
Suggested fix: Generate asset URLs through the configured base path, use VitePress's base-aware helpers, or keep the references in a form that VitePress rewrites for the configured base.
|
@sourcery-ai review |
There was a problem hiding this comment.
Hey - I've found 1 issue
Prompt for AI Agents
Please address the comments from this code review:
## Individual Comments
### Comment 1
<location path="docs/index.md" line_range="16" />
<code_context>
-<div class="center-img">
-<img src="./assets/images/fellowship_bw.jpg" alt="The Fellowship of the Ring" class="banner-img">
+<div class="page-banner">
+<img src="/assets/images/fellowship_bw.jpg" srcset="/assets/images/fellowship_bw.jpg 1x, /assets/images/fellowship_bw@2x.jpg 2x" alt="The Fellowship of the Ring" class="banner-img">
</div>
</code_context>
<issue_to_address>
**issue (broader_impact):** The new root-relative image URLs ignore VitePress's configured `base`, so images resolve from the domain root instead of the deployed documentation subpath. In preview deployments and any deployment using a non-root `VITE_BASE`, these banners, cards, tutorial screenshots, and historical map links return 404.
**Triggers:** When the site is built with a non-root `VITE_BASE`, such as the pull-request preview configuration.
**Suggested fix:** Use base-aware asset URL generation or paths relative to each Markdown page instead of hard-coded `/assets/images/...` URLs.
```suggestion
<img src="./assets/images/fellowship_bw.jpg" srcset="./assets/images/fellowship_bw.jpg 1x, ./assets/images/fellowship_bw@2x.jpg 2x" alt="The Fellowship of the Ring" class="banner-img">
```
</issue_to_address>Sourcery assessment
Approval pending. 1 finding to address first.
Blocking findings: docs/index.md:16
| <div class="center-img"> | ||
| <img src="./assets/images/fellowship_bw.jpg" alt="The Fellowship of the Ring" class="banner-img"> | ||
| <div class="page-banner"> | ||
| <img src="/assets/images/fellowship_bw.jpg" srcset="/assets/images/fellowship_bw.jpg 1x, /assets/images/fellowship_bw@2x.jpg 2x" alt="The Fellowship of the Ring" class="banner-img"> |
There was a problem hiding this comment.
issue (broader_impact): The new root-relative image URLs ignore VitePress's configured base, so images resolve from the domain root instead of the deployed documentation subpath. In preview deployments and any deployment using a non-root VITE_BASE, these banners, cards, tutorial screenshots, and historical map links return 404.
Triggers: When the site is built with a non-root VITE_BASE, such as the pull-request preview configuration.
Suggested fix: Use base-aware asset URL generation or paths relative to each Markdown page instead of hard-coded /assets/images/... URLs.
| <img src="/assets/images/fellowship_bw.jpg" srcset="/assets/images/fellowship_bw.jpg 1x, /assets/images/fellowship_bw@2x.jpg 2x" alt="The Fellowship of the Ring" class="banner-img"> | |
| <img src="./assets/images/fellowship_bw.jpg" srcset="./assets/images/fellowship_bw.jpg 1x, ./assets/images/fellowship_bw@2x.jpg 2x" alt="The Fellowship of the Ring" class="banner-img"> |
|
@sourcery-ai review |
There was a problem hiding this comment.
Hey - I've found 2 issues
Prompt for AI Agents
Please address the comments from this code review:
## Individual Comments
### Comment 1
<location path="docs/.vitepress/theme/mume.css" line_range="276" />
<code_context>
text-align: center;
background: #0a0d15;
- background-image: url(../../assets/images/play-now-banner.jpg);
+ background-image: url(/assets/images/play-now-banner.jpg);
background-position: center;
background-size: cover;
</code_context>
<issue_to_address>
**issue (bug_risk):** These root-relative asset URLs ignore VitePress's configured `base`. When the site is built with a non-root `VITE_BASE` (as in the PR-preview and GitHub Pages workflows), browsers request `/assets/images/...` from the domain root instead of `<base>/assets/images/...`, so the changed images and play-now backgrounds return 404.
**Triggers:** When the site is deployed under a non-root base path such as a PR-preview prefix.
**Suggested fix:** Use VitePress base-aware asset URLs, such as `withBase(...)` for generated markup or base-prefixed paths injected at build time, rather than hard-coded leading-slash URLs.
</issue_to_address>
### Comment 2
<location path="docs/about/index.md" line_range="6" />
<code_context>
-<div style="text-align: center; margin-bottom: 2rem;">
- <img src="/assets/images/fellowship_bw.jpg" srcset="/assets/images/fellowship_bw.jpg 1x, /assets/images/fellowship_bw@2x.jpg 2x" alt="A short explanation on what Multi-Users in Middle-earth is" style="width: 100%; max-width: 654px; height: auto;" />
+<div class="page-banner">
+ <img src="/assets/images/fellowship_bw.jpg" srcset="/assets/images/fellowship_bw.jpg 1x, /assets/images/fellowship_bw@2x.jpg 2x" alt="A short explanation on what Multi-Users in Middle-earth is" class="banner-img" />
</div>
# About MUME
</code_context>
<issue_to_address>
**issue (bug_risk):** The new `page-banner` wrapper has no corresponding CSS rule in `mume.css`; the existing `.center-img` rule that supplied centering and bottom spacing is removed from these banners. Consequently, these pages lose the shared banner layout spacing and centering behavior, so the claimed standardized presentation is not applied.
**Suggested fix:** Add a `.page-banner` rule carrying the former centering and spacing behavior, or retain the `center-img` class alongside the new class.
```suggestion
<div class="page-banner center-img">
```
</issue_to_address>Sourcery assessment
Approval pending. 2 findings to address first.
Blocking findings: docs/.vitepress/theme/mume.css:276, docs/about/index.md:6
| text-align: center; | ||
| background: #0a0d15; | ||
| background-image: url(../../assets/images/play-now-banner.jpg); | ||
| background-image: url(/assets/images/play-now-banner.jpg); |
There was a problem hiding this comment.
issue (bug_risk): These root-relative asset URLs ignore VitePress's configured base. When the site is built with a non-root VITE_BASE (as in the PR-preview and GitHub Pages workflows), browsers request /assets/images/... from the domain root instead of <base>/assets/images/..., so the changed images and play-now backgrounds return 404.
Triggers: When the site is deployed under a non-root base path such as a PR-preview prefix.
Suggested fix: Use VitePress base-aware asset URLs, such as withBase(...) for generated markup or base-prefixed paths injected at build time, rather than hard-coded leading-slash URLs.
|
@sourcery-ai review |
There was a problem hiding this comment.
Hey - I've found 1 issue
Prompt for AI Agents
Please address the comments from this code review:
## Individual Comments
### Comment 1
<location path="docs/.vitepress/theme/mume.css" line_range="276" />
<code_context>
text-align: center;
background: #0a0d15;
- background-image: url(../../assets/images/play-now-banner.jpg);
+ background-image: url(/assets/images/play-now-banner.jpg);
background-position: center;
background-size: cover;
</code_context>
<issue_to_address>
**issue (bug_risk):** The newly standardized image URLs are root-relative, so they request `/assets/images/...` instead of the configured VitePress base path. When the site is deployed with a non-root `VITE_BASE` such as `/community/`, banners, card artwork, tutorial images, and CSS background images return 404s.
**Triggers:** When the documentation is deployed under a subpath via `VITE_BASE`.
**Suggested fix:** Generate asset URLs with VitePress `withBase()` or use base-aware relative/imported asset paths instead of hard-coded root-relative URLs.
</issue_to_address>Sourcery assessment
Approval pending. 1 finding to address first.
Blocking findings: docs/.vitepress/theme/mume.css:276
| text-align: center; | ||
| background: #0a0d15; | ||
| background-image: url(../../assets/images/play-now-banner.jpg); | ||
| background-image: url(/assets/images/play-now-banner.jpg); |
There was a problem hiding this comment.
issue (bug_risk): The newly standardized image URLs are root-relative, so they request /assets/images/... instead of the configured VitePress base path. When the site is deployed with a non-root VITE_BASE such as /community/, banners, card artwork, tutorial images, and CSS background images return 404s.
Triggers: When the documentation is deployed under a subpath via VITE_BASE.
Suggested fix: Generate asset URLs with VitePress withBase() or use base-aware relative/imported asset paths instead of hard-coded root-relative URLs.
|
@sourcery-ai review |
Summary by Sourcery
Fix documentation image paths and standardize banner presentation across the site.
Bug Fixes:
Enhancements:
Documentation: