Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix custom logos taking up full width #3322

Merged
merged 1 commit into from
Sep 5, 2024
Merged

Fix custom logos taking up full width #3322

merged 1 commit into from
Sep 5, 2024

Conversation

AshGDS
Copy link
Contributor

@AshGDS AshGDS commented Sep 5, 2024

What / Why

  • HTML publications have some custom organisation logo styles, which were modified in Style organisation logos with inline-block instead of flexbox #3308
  • Examples: 1 / 2 / 3 / 4
  • It looks like the student loans company logo has been uploaded at a large resolution, and the style change made previously did not account for situations where the custom image was this large.
  • Therefore I have added a 240px max-width for images on desktop, and 140px width for images on mobile/tablet - to try and have a similar resizing behaviour as the logo before the bug was introduced (see archived page here)
  • I thought it may be better to use the govuk media queries to resize here rather than a percentage width value like previous behaviour, so that the image size is more deterministic.

Visual Changes

Before (Desktop)

image

After (Desktop)

image

Before (Mobile/Tablet)

image

After (Mobile/Tablet)

image

@AshGDS AshGDS self-assigned this Sep 5, 2024
@govuk-ci govuk-ci temporarily deployed to government-frontend-pr-3322 September 5, 2024 12:14 Inactive
@govuk-ci govuk-ci temporarily deployed to government-frontend-pr-3322 September 5, 2024 12:24 Inactive
@AshGDS AshGDS merged commit ea6a5ae into main Sep 5, 2024
11 checks passed
@AshGDS AshGDS deleted the logo-fix-sep-2024 branch September 5, 2024 12:40
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.

3 participants