-
Notifications
You must be signed in to change notification settings - Fork 13.4k
feat(textarea): add styles for textarea solid fill #30685
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
base: next
Are you sure you want to change the base?
Conversation
- fix some textarea ionic css vars usage; - create sheet for ionic.solid;
The latest updates on your projects. Learn more about Vercel for GitHub.
|
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.
Great work! A few questions on some styles & a requested change for a variable that appears different in Figma. 👍
|
||
:host(.textarea-readonly) { | ||
--background: #{globals.$ion-primitives-neutral-100}; | ||
--background: #{globals.$ion-border-input-read-only}; |
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.
--background: #{globals.$ion-border-input-read-only}; | |
--background: #{globals.$ion-bg-input-read-only}; |
:host(.textarea-fill-solid) .textarea-bottom { | ||
--border-width: #{globals.$ion-scale-0}; | ||
} |
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.
:host(.textarea-fill-solid) .textarea-bottom { | |
--border-width: #{globals.$ion-scale-0}; | |
} |
This doesn't appear to do anything
} | ||
|
||
:host(.textarea-fill-solid) .textarea-wrapper-inner { | ||
--border-width: #{globals.$ion-border-size-050}; |
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.
Can we move this --border-width
to the host element?
// ---------------------------------------------------------------- | ||
|
||
:host(.textarea-fill-solid.has-focus) { | ||
--border-width: #{globals.$ion-border-size-050}; |
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.
Do we need to define --border-width
here if it is defined on the host?
--color: #{globals.$ion-text-disabled}; | ||
--background: #{globals.$ion-bg-input-bold-disabled}; | ||
--border-color: #{globals.$ion-bg-input-bold-disabled}; | ||
--placeholder-color: #{globals.$ion-text-disabled}; |
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.
Shouldn't this be defined in textarea.ionic.scss
since it is shared by both fills?
Issue number: internal
What is the new behavior?
Does this introduce a breaking change?
Other information
fill
color
states