Skip to content

fix(markdown-renderer): render callout icons as inline SVG instead of external asset#86

Open
julia-rabello wants to merge 1 commit into
mainfrom
fix/callout-icon-external-dependency
Open

fix(markdown-renderer): render callout icons as inline SVG instead of external asset#86
julia-rabello wants to merge 1 commit into
mainfrom
fix/callout-icon-external-dependency

Conversation

@julia-rabello

@julia-rabello julia-rabello commented Jul 9, 2026

Copy link
Copy Markdown
Contributor

Description

Callout/admonition icons (info, warning, danger, success) were loaded via a CSS :before background-image pointing at the DigitalOcean Space vtex-dev-portal-navigation.fra1.digitaloceanspaces.com. That bucket no longer exists (confirmed 404 NoSuchBucket on all four icon URLs), so icons silently disappeared while the colored background/border still rendered fine — since those don't depend on an external resource.

This PR replaces the external image dependency with an inline SVG icon bundled directly in the Callout component, so rendering no longer depends on that (or any) external asset host.

Also added Callout.stories.tsx covering all four variants (info/warning/danger/success), since there was previously no direct Storybook coverage for this component — it was only reachable indirectly through the MDX pipeline.

image

Types of changes

  • Bug fix (non-breaking change which fixes an issue)
  • New feature (non-breaking change which adds functionality)
  • Breaking change (fix or feature that would cause existing functionality to change)
  • Requires change to documentation, which has been updated accordingly.

Test plan

  • Verified in Storybook that all four callout variants (Info, Warning, Danger, Success) render their icons correctly with no network requests to the old bucket
  • Confirmed the Warning variant visually matches the expected design (orange circle with "!")

… external asset

The vtex-dev-portal-navigation DigitalOcean Space that callout icons (info,
warning, danger, success) were loaded from via CSS background-image no
longer exists (404 NoSuchBucket), so icons silently disappeared while the
colored background/border still rendered. Icons are now inline SVGs bundled
with the component, removing the external dependency entirely.

@github-actions github-actions Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This pull request does not contain a valid label. Please add one of the following labels: ['release-no', 'release-auto', 'release-patch', 'release-minor', 'release-major']

@julia-rabello julia-rabello added the release-patch Patch version bump label Jul 9, 2026
@julia-rabello julia-rabello self-assigned this Jul 9, 2026
@julia-rabello julia-rabello requested a review from brunoamui July 9, 2026 14:52
@julia-rabello

Copy link
Copy Markdown
Contributor Author

Tracked in Jira: EDU-19009

Related fix in the sibling repo: vtexdocs/RapiDoc#48

Related Slack thread: https://vtex.slack.com/archives/GM3C9C3QS/p1783599938129019

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

release-patch Patch version bump

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant