Skip to content

docs: trim transparent padding from v22 event hero image#69156

Open
erkamyaman wants to merge 1 commit into
angular:mainfrom
erkamyaman:docs-v22-event-hero-image-order
Open

docs: trim transparent padding from v22 event hero image#69156
erkamyaman wants to merge 1 commit into
angular:mainfrom
erkamyaman:docs-v22-event-hero-image-order

Conversation

@erkamyaman
Copy link
Copy Markdown
Contributor

@erkamyaman erkamyaman commented Jun 4, 2026

The v22 event hero PNG shipped with a wide transparent margin baked into its 960x540 canvas. Under the shared img { width: 100% } rule that empty border stretched along with the artwork, leaving visible space around the image that the v21 hero does not have. Trims the canvas to the artwork bounds (831x473) so it renders flush; the retained pixels are unchanged.

PR Checklist

Please check that your PR fulfills the following requirements:

PR Type

What kind of change does this PR introduce?

  • Bugfix
  • Feature
  • Code style update (formatting, local variables)
  • Refactoring (no functional changes, no api changes)
  • Build related changes
  • CI related changes
  • Documentation content changes
  • Other

What is the current behavior?

The v22 event hero PNG (angular-v22-hero.png) ships as a 960x540 canvas with a wide transparent margin baked around the artwork. Because content images render at width: 100%, that empty border stretches with the image and shows up as visible space around the hero.

image image

What is the new behavior?

The hero PNG is trimmed to the artwork bounds (831x473), so it renders flush with no surrounding gap. The retained pixels are unchanged (verified identical, lossless crop), and file size drops from ~795 KB to ~568 KB.

image

Does this PR introduce a breaking change?

  • Yes
  • No

@angular-robot angular-robot Bot added the area: docs Related to the documentation label Jun 4, 2026
@erkamyaman erkamyaman marked this pull request as ready for review June 4, 2026 18:04
@ngbot ngbot Bot added this to the Backlog milestone Jun 4, 2026
@pullapprove pullapprove Bot requested a review from atscott June 4, 2026 18:04
@erkamyaman
Copy link
Copy Markdown
Contributor Author

We saved 222kb so not too bad I suppose, every byte counts :)

@erkamyaman
Copy link
Copy Markdown
Contributor Author

erkamyaman commented Jun 4, 2026

Mobile

before:
image

after:
image

@atscott atscott requested review from MarkTechson and removed request for atscott June 4, 2026 18:19
Copy link
Copy Markdown
Contributor

@MarkTechson MarkTechson left a comment

Choose a reason for hiding this comment

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

We can keep the image change, but remove the text change.

Comment thread adev/src/content/events/v22.md
Comment thread adev/src/assets/images/v22-event/angular-v22-hero.png
The v22 event hero PNG shipped with a wide transparent margin baked into
its 960x540 canvas. Under the shared `img { width: 100% }` rule that empty
border stretched along with the artwork, leaving visible space around the
image. Trims the canvas to the artwork bounds (831x473) so it renders
flush; the retained pixels are unchanged and the file shrinks from about
795 KB to 568 KB.
@erkamyaman erkamyaman force-pushed the docs-v22-event-hero-image-order branch from 1222cc5 to 6725608 Compare June 4, 2026 18:47
@erkamyaman erkamyaman changed the title docs: trim v22 event hero padding and place it before the title docs: trim transparent padding from v22 event hero image Jun 4, 2026
@erkamyaman erkamyaman requested a review from MarkTechson June 4, 2026 18:52
@erkamyaman
Copy link
Copy Markdown
Contributor Author

Updated everything as you suggested. Thank you! @MarkTechson

Copy link
Copy Markdown
Contributor

@MarkTechson MarkTechson left a comment

Choose a reason for hiding this comment

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

LGTM

Thanks for taking the time

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

Labels

area: docs Related to the documentation

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants