[WEB-4164] Tweak pricing card colours

[kennethkalmer]

Jira Ticket Link / Motivation

Following on from #582, some additional tweaks to move us closer to the designs:

See the comments on WEB-4164 for the discussion that lead to this PR

Summary of changes

This pull request includes updates to the package.json file and changes to the planData in src/core/Pricing/data.tsx to modify the icon colors for different CTA buttons.

Version update:

• package.json: Updated the version number from 15.1.13 to 15.1.14.

Icon color adjustments:

• src/core/Pricing/data.tsx: Changed iconColor for the "Start for free" CTA button to text-neutral-600 dark:text-neutral-700.
• src/core/Pricing/data.tsx: Updated iconColor for the "Get started" CTA button for the standard package to text-gui-blue-default-dark dark:text-gui-blue-default-light.
• src/core/Pricing/data.tsx: Updated iconColor for the "Get started" CTA button for the pro package to text-gui-blue-default-dark dark:text-gui-blue-default-light.

How do you manually test this?

📖

Merge/Deploy Checklist

• Written automated tests for implemented features/fixed bugs
• Rebased and squashed commits
• Commits have clear descriptions of their changes
• Checked for any performance regressions

Frontend Checklist

• No frontend changes in this PR
• Added before/after screenshots for changes
• Tested on different platforms/browsers with Browserstack
• Compared with the initial design / our brand guidelines
• Checked the code for accessibility issues (VoiceOver User Guide)?

Summary by CodeRabbit

• Version Update

  • Updated package version to 15.1.14-dev.13b70ad

• Style

  • Adjusted icon colors for pricing plan cards:
    • Free plan: Swapped light/dark mode color values
    • Standard and Pro plans: Updated to new color scheme

[coderabbitai]

Important

Review skipped

Auto incremental reviews are disabled on this repository.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Walkthrough

This pull request involves two primary changes: updating the package version in package.json from "15.1.13" to a development version "15.1.14-dev.13b70ad", and modifying icon color properties in the pricing plan data within src/core/Pricing/data.tsx. The color changes affect the "Free", "Standard", and "Pro" pricing plans, swapping or updating their icon color values.

Changes

File	Change Summary
package.json	Version updated from "15.1.13" to "15.1.14-dev.13b70ad"
src/core/Pricing/data.tsx	Updated iconColor for pricing plans: - Free plan: Swapped color values - Standard and Pro plans: Changed to new color scheme

Assessment against linked issues

Objective	Addressed	Explanation
WEB-4164: Add Arrow Icon on the right side of Pricing Card CTA	❓	Unable to determine from the provided diff if arrow icon was added

Possibly related PRs

• [WEB-4078] App, account, & org Heroicons #584: Similar package version update to a development version
• [WEB-3929] Add account owner icon #588: Package version increment
• [WEB-4100] Add description labels to Status, fix PricingCard pill bg #589: Related UI changes for PricingCard component

Suggested reviewers

• jamiehenson

Poem

🐰 A rabbit's tale of code so bright,
Colors dancing left and right,
Version bumped with gentle care,
Pricing plans now fresh and fair!
Hop along, sweet changes dear! 🌈

Finishing Touches

• 📝 Generate Docstrings

---

🪧 Tips

Chat

There are 3 ways to chat with CodeRabbit:

• Review comments: Directly reply to a review comment made by CodeRabbit. Example:
  • I pushed a fix in commit <commit_id>, please review it.
  • Generate unit testing code for this file.
  • Open a follow-up GitHub issue for this discussion.
• Files and specific lines of code (under the "Files changed" tab): Tag @coderabbitai in a new review comment at the desired location with your query. Examples:
  • @coderabbitai generate unit testing code for this file.
  • @coderabbitai modularize this function.
• PR comments: Tag @coderabbitai in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
  • @coderabbitai gather interesting stats about this repository and render them as a table. Additionally, render a pie chart showing the language distribution in the codebase.
  • @coderabbitai read src/utils.ts and generate unit testing code.
  • @coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.
  • @coderabbitai help me debug CodeRabbit configuration file.

Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments.

CodeRabbit Commands (Invoked using PR comments)

• @coderabbitai pause to pause the reviews on a PR.
• @coderabbitai resume to resume the paused reviews.
• @coderabbitai review to trigger an incremental review. This is useful when automatic reviews are disabled for the repository.
• @coderabbitai full review to do a full review from scratch and review all the files again.
• @coderabbitai summary to regenerate the summary of the PR.
• @coderabbitai generate docstrings to generate docstrings for this PR. (Beta)
• @coderabbitai resolve resolve all the CodeRabbit review comments.
• @coderabbitai configuration to show the current CodeRabbit configuration for the repository.
• @coderabbitai help to get help.

Other keywords and placeholders

• Add @coderabbitai ignore anywhere in the PR description to prevent this PR from being reviewed.
• Add @coderabbitai summary to generate the high-level summary at a specific location in the PR description.
• Add @coderabbitai anywhere in the PR title to generate the title automatically.

CodeRabbit Configuration File (.coderabbit.yaml)

• You can programmatically configure CodeRabbit by adding a .coderabbit.yaml file to the root of your repository.
• Please see the configuration documentation for more information.
• If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: # yaml-language-server: $schema=https://coderabbit.ai/integrations/schema.v2.json

Documentation and Community

• Visit our Documentation for detailed information on how to use CodeRabbit.
• Join our Discord Community to get help, request features, and share feedback.
• Follow us on X/Twitter for updates and announcements.

[jamiehenson]

Just a note to update the package version before merging

[jamiehenson]

It's a bit weird we still have these non-numerical colour variants that sit outside of the numerical palettes, seems like a mix of approaches - but if this is the request, this is the request (these aren't aliases of existing numerical palette colours).

[kennethkalmer]

@jamiehenson I thought the same, but these are the colours in Figma ¯\_(ツ)_/¯