[Woo POS] [Design System] Create a color palette for POS and corresponding SwiftUI colors #15063
+1,254
−0
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Part of #15061
Description
This pull request introduces a new color palette for POS based on the Design System table 1qcjzXitBHU7xPnpCOWnNM-fi-19_19221 / color roles 1qcjzXitBHU7xPnpCOWnNM-fi-437_20681. The changes include the addition of new color definitions in Swift and corresponding color assets as an Xcode color asset catalog. The new colors are not used in the code yet, they will replace existing POS colors in future PRs to keep reasonably sized PRs.
I decided to go with a color palette instead of all code, for easier visualization of both light and dark mode colors and because these colors are not meant to be dynamic (at least for now). We can easily compare the colors with the design system and update them in the future.
New color definitions:
WooCommerce/Classes/POS/Colors/Color+POSColorPalette.swift
: Added an extension to theColor
class defining various POS-specific colors such as primary, secondary, surface, and status colors.New color assets:
WooCommerce/Classes/POS/Colors/POSColorPalette.xcassets
: Added the main contents file for the color assets. There are 31 colors from the design system table.Steps to reproduce
I'd recommend testing the PR by reviewing the
POSColorPalette
color catalog, where most of the diffs are from. You can compare each color with the corresponding one in 1qcjzXitBHU7xPnpCOWnNM-fi-19_19221 / color roles 1qcjzXitBHU7xPnpCOWnNM-fi-437_20681 (the names in the catalog are lowerCamelCase but I'm open to changing it if it helps with readability). I also named the colors with apos
prefix to avoid potential conflicts with future color palettes.Testing information
If you'd like to try any of the new colors, feel free to try returning
.posTextPrimary
forposPrimaryText
color for example.Screenshots
RELEASE-NOTES.txt
if necessary.Reviewer (or Author, in the case of optional code reviews):
Please make sure these conditions are met before approving the PR, or request changes if the PR needs improvement: