[LIVE-8419] Update SourceBadge colours and vertically centre text#277
[LIVE-8419] Update SourceBadge colours and vertically centre text#277
SourceBadge colours and vertically centre text#277Conversation
|
@maheengill I've started a release workflow from this branch. When the preview release is available, could you test it with your PR? The style names have changed so you'll need to update that in your PR. |
adi-gnm
changed the title
SourceBadge colours and vertically centre text
…3T1043.71580d4d published by ab-gnm ab-gnm published release version 5.0.0-PREVIEW.ablive8419-source-badge-offset-colour-update.2025-10-13T1043.71580d4d using gha-gradle-library-release-workflow: https://github.com/guardian/gha-gradle-library-release-workflow Release-Version: 5.0.0-PREVIEW.ablive8419-source-badge-offset-colour-update.2025-10-13T1043.71580d4d Release-Initiated-By: https://github.com/ab-gnm Release-Workflow-Run: https://github.com/guardian/source-apps/actions/runs/18463181414 Release-Notes: #277
There was a problem hiding this comment.
Pull Request Overview
This PR updates the SourceBadge component to align with new design specifications, including color updates, improved text positioning, and more generic style naming.
- Updated badge colors for light and dark modes across all styles
- Fixed badge heights to 16px and 24px with centered text positioning
- Renamed style enums from color-specific names to semantic names (Gray→Info, LightBlue→Info, etc.)
Reviewed Changes
Copilot reviewed 3 out of 7 changed files in this pull request and generated 1 comment.
| File | Description |
|---|---|
| SourceBadge.kt | Core component updates with new colors, heights, text centering, and renamed style enums |
| detekt-baseline-debug.xml | Updated baseline to reflect renamed style enum properties |
| libs.versions.toml | Dependency version updates for Compose BOM and Licensee |
Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.
| style = size.textStyle, | ||
| maxLines = maxLines, | ||
| overflow = textOverflow, | ||
| modifier = Modifier.offset(y = (-0.5).dp), |
There was a problem hiding this comment.
The hardcoded -0.5dp offset should be a named constant or calculated based on text metrics to ensure it works correctly across different font sizes and scaling factors.
|
@ab-gnm has published a preview version of this PR with release workflow run #226, based on commit 71580d4: 5.0.0-PREVIEW.ablive8419-source-badge-offset-colour-update.2025-10-13T1043.71580d4d Want to make another preview release?Click 'Run workflow' in the GitHub UI, specifying the ab/live/8419-source-badge-offset-colour-update branch, or use the GitHub CLI command: gh workflow run release.yml --ref ab/live/8419-source-badge-offset-colour-update Want to make a full release after this PR is merged?Click 'Run workflow' in the GitHub UI, leaving the branch as the default, or use the GitHub CLI command: gh workflow run release.yml |
maheengill
left a comment
maheengill
left a comment
There was a problem hiding this comment.
Tested with my new badge pr and the badge is displayed correctly and appears centre aligned vertically. Also compared new colours with designs and they match the designs.
2 participants
Description
Figma: https://www.figma.com/design/AzlT1ayOb0mv4peLWc6Ccu/My-Guardian-2.0?node-id=11801-41148&m=dev
Ticket: https://theguardian.atlassian.net/browse/LIVE-8419
Small tweaks to the
SourceBadgecomponent:Testing notes/instructions:
@maheengill to integrate the preview release in her news app PR and confirm changes with Luke
Checklist
For pull requests introducing UI changes:
Screenshots or videos:
BeforeAfter