-
Notifications
You must be signed in to change notification settings - Fork 18
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: align the chip component [MDS-109] #289
Conversation
@@ -1,5 +1,15 @@ | |||
const plugin = require('tailwindcss/plugin') | |||
|
|||
//as Variant of using rgba color with opacity | |||
const withOpacityValue = (rgbColor) => { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Why colors are not rgba?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I patterned this on the React implementation.
They got it from the tailwind codebase.
This separate function is needed when passing a custom opacity value. For example bg-bulma-100/[.12]
I think @yarema184 can explain more 😊
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Ok, thank you for explanation. It seems complex, but I guess, if it works well, then it is correct way to go. :)
@@ -88,7 +88,7 @@ defmodule MoonWeb.Pages.Components.ChipPage do | |||
<Heading size={32}>Chip</Heading> | |||
|
|||
<Context put={theme_class: @theme_name}> | |||
<ExampleAndCode title="Sizes" id="chip_1"> | |||
<ExampleAndCode title="Sizes" id="chip_1" is_gray_bg> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
If it is always gray bg, why this is a new flag instead of default behaviour?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The gray background was new. It was just added this morning. It was white before so this prop was needed before. I will remove this now.
No description provided.