Fix Contact Type Select Styles Issue #5759 #5830
Conversation
logtay
requested review from
compwron,
FireLemons,
littleforest and
elasticspoon
as code owners
There was a problem hiding this comment.
Thanks for the fix! The styles work great! 🙂
The only change I would like to see is to place this behavior in a slightly different place.
Currently we are using tomselect as a component so ideally we want to be able to reuse it on other pages so we should but the styles somewhere in /app/assets/stylesheets/shared to reflect that the styles are not page specific. Maybe similar to how the select2 styles live there.
Also in that situation we should also use a selector more tailored to the tom-select drop down maybe .ts-dropdown [data-selectable] .highlight which is what tomselect already uses.
|
Thank you for the feedback! I will make those changes |
There was a problem hiding this comment.
Since you added app/assets/stylesheets/shared/tomselect_additional_styles.scss. We no longer need app/assets/stylesheets/pages/casa_cases.scss or app/assets/stylesheets/pages/case_contacts_form.scss.
Although those files sound like they might only be loaded on those pages, they actually get loaded on all pages so the styling from app/assets/stylesheets/shared/tomselect_additional_styles.scss is enough.
|
@logtay hey, sorry I explained really poorly. I'm not tryna jerk you around or anything. 🙁 when i said
I didn't mean for you to delete the entire files, I meant just the changes you made to them. So basically all this PR needs to contain is the line that imports the new stylesheet + the new stylesheet. |
|
@elasticspoon It's okay, I think I misread. I thought I got rid of those first changes, but had some issues on my end, so probably overlooked it. Let me go ahead and do that. Thank you for your patience, I appreciate it. |
What github issue is this PR for, if any?
Resolves #5759
What changed, and why?
The first letter in the dropdown is now in line with the rest of the word so that options are properly selected. Only the first letter of the searched contact type was getting selected, which would make it difficult for users to read. These changes affect the casa_cases and case_contacts pages
How is this tested? (please write tests!) 💖💪
Note: if you see a flake in your test build in github actions, please post in slack #casa "Flaky test: " :) 💪
Note: We love capybara tests! If you are writing both haml/js and ruby, please try to test your work with tests at every level including system tests like https://github.com/rubyforgood/casa/tree/main/spec/system
Changes were only made to CSS, so I did not create any new tests.
Screenshots please :)
Run your local server and take a screenshot of your work! Try to include the URL of the page as well as the contents of the page.
Feelings gif (optional)
What gif best describes your feeling working on this issue? https://giphy.com/
How to embed: