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

Update color variables for rgb. Remove unused color variables #83

Merged
merged 1 commit into from
Jun 30, 2021

Conversation

KaichenWang
Copy link
Contributor

@KaichenWang KaichenWang commented Jun 30, 2021

Why are these changes introduced?

  • Update definition of CSS RGB color variables in Liquid to leverage updated ColorDrop
  • Fix issue with invalidated CSS when setting a theme color setting to none

Fixes #52

What approach did you take?

  • Define RGB colors using ColorDrop red, green and blue properties:
--color-base-text-rgb: {{ settings.colors_text.red }}, {{ settings.colors_text.green }}, {{ settings.colors_text.blue }};
  • Remove any unreferenced CSS color variables (clean up)

Other considerations

⚠️

  • RGB colors defined using ColorDrop properties do not update in the editor until saved
  • When color setting is set to none the R,G,B property values are 0,0,0, which is "black". Some additional logic in the theme will be required to incorporate alpha value to correctly reflect the none color

Demo links

Checklist

Copy link
Contributor

@Thibaut Thibaut left a comment

Choose a reason for hiding this comment

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

🍿

@KaichenWang
Copy link
Contributor Author

RGB colors defined using ColorDrop properties do not update in the editor until saved

@Thibaut With usage of rgb properties, curious if there is a way to have the RGB colors update in editor after every setting change?

@Thibaut
Copy link
Contributor

Thibaut commented Jun 30, 2021

@Thibaut With usage of rgb properties, curious if there is a way to have the RGB colors update in editor after every setting change?

It's possible but not trivial. We would need to detect when a setting is only used as the value of a CSS variable.

@KaichenWang KaichenWang merged commit dd65d3e into main Jun 30, 2021
@KaichenWang KaichenWang deleted the fix-setting-color-none branch June 30, 2021 18:51
phapsidesGT pushed a commit to Gravytrain-UK/gt-shopify-dawn-theme that referenced this pull request Sep 3, 2024
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.

Removing the text color value removes mostly all CSS
3 participants