Fix missing input class styling from FieldBase component#859
Conversation
| :id="autosuggestContainerId" | ||
| ref="values" | ||
| class="pkpAutosuggest__inputWrapper pkpFormField__input" | ||
| class="flex h-auto flex-wrap items-center rounded-[2px] border border-light bg-secondary px-4 py-1 text-lg-normal hover:border-dark" |
There was a problem hiding this comment.
Not sure whats the good approach here. Duplicating the input/wrapper styling here does not feel as good fit, especially with these bespoke values (2px, inset_-3px...).
Ultimately any more complex styling which is being repeated we probably should not duplicate. But we also don't want to using classes from others components.
Which basically leaves us with option to abstract that styling to separate component, which here feels like overkill.
I think the answer will arise when working on the next gen form fields, with composition api and tailwindcss. Maybe it will make sense to create set of classes that could be reused across the form elements. Or maybe just adding some primitives (like new shadow class).
So unless you have better idea, lets just add comment as reminder that this is to be cleaned up on the next gen form refactor.
There was a problem hiding this comment.
Hi Jarda, thanks for your inputs. Yes, in my earlier commits I tried to make a shared less file for the class to avoid duplication, but it still didn't resolve the issue as it turns out to have bigger css scope to make it work.
As this was only problematic in this section and only in Storybook, I decided to just duplicate the classes here, but you're right that we should make a note for future clean up. Added that now, merging this.
…tosuggest components
…ield__input for FieldAffiliationsRorAutoSuggest component
acf9cc3 to
69914d3
Compare
No description provided.