Repository navigation
feat(select): prepend support on textfield & select - #82
Conversation
|
@i8ramin Interesting contribution, however, this will need to be audited by design. Can you please confer with Dana Ballasy about this change? |
|
What is the breaking change for? |
No longer breaking change. |
|
hmmm.. so the idea is you would prepend a select to the text field in order to solve for phone field? Might be useful to provide an example of this specific use case (with a dummy select), since that is the reason for adding? like |
|
doesn't look like disabled behaves the same way with |
That was a bad copy/paste job. It was missing the |
This is just the first step towards that end goal. Adding a phone select in there is gonna be tricky, so didn't want to create a huge PR. This one just makes it so we can "prepend" things to textfield & selects |
|
@cmugla added a simple flag dropdown (no functionality, just visuals)
|
| } | ||
| } | ||
|
|
||
| &--simple { |
There was a problem hiding this comment.
new addition to ray-select to support things like the flag dropdown
| border-radius: 0; | ||
|
|
||
| &__input { | ||
| font-size: ($ray-field-label-size * 1.2); |
There was a problem hiding this comment.
this is specifically to make the flags a bit larger .. not sure if we should set this font size here
i8ramin
changed the title
|
@i8ramin Is there any way to avoid the breaking change? We just released 1.0.0 lol |
No longer breaking changes. New wrapper div is only required for the new |
cmugla
left a comment
cmugla
left a comment
There was a problem hiding this comment.
This looks good to me. Please go through the chromatic failures
d18ca98 to
630a200
Compare
BREAKING CHANGE: textfields and selects that have icons (and not prepends) need to be wrapped in an
extra div with a class name of "#{$ray-class-prefix}#{$class}__wrapper"
re #81
| [dir='rtl'] & { | ||
| position: unset; | ||
| margin-left: $ray-field-h-spacing; | ||
| right: calc(100% - (2 * #{$ray-field-h-spacing})); |
There was a problem hiding this comment.
This is a slight change in how we handle the arrow on RTL. Instead of unsetting position, we calculate it so that the behavior is similar to how it is done with LTR
adamraider
left a comment
adamraider
left a comment
There was a problem hiding this comment.
LGTM, so long as this was approved by Dana feel free to merge
|
|
textfields and selects that have icons (and not prepends) need to be wrapped in an
extra div with a class name of "#{$ray-class-prefix}#{$class}__wrapper"
re #81
No longer breaking change. Decided to not touch the current
with-iconimplementation and create new styles to supportprepend.Main motivation (re #81)
Screenshots