Fix input file styles #8574
Fix input file styles #8574
Conversation
plugin.js
Outdated
| width: '100%', | ||
| cursor: 'pointer', | ||
| overflow: 'hidden', | ||
| 'border-radius': '.5rem', |
There was a problem hiding this comment.
Hi and thanks for this PR.
The border-radius seems off to me by taking a look at the screenshot, and it's confirmed because of .375rem in the other buttons
Can you please use the settings from the theme?
I can see
'border-width': borderWidth['DEFAULT'],in this file. Don't know exactly how. flowbite works. It looks like it is using rounded-md class
There was a problem hiding this comment.
@tagliala Thanks, done! I've updated the PR to use theme config as much as possible. I reviewed the file again and I've realised I could replace all those styles with just one big @apply:
[`[type='file']`]: {
@apply block w-full text-sm text-gray-900 border border-gray-300 rounded-lg cursor-pointer bg-gray-50 dark:text-gray-400 focus:outline-none dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 overflow-hidden;
}
Do you have preferred style? I've seen both inlines and applies in this file.
There was a problem hiding this comment.
Thanks
Do you have preferred style?
Can't tell exactly, not my expertise, let's wait for @javierjulio 's review, I guess it should be a mix of both but I can't tell exactly what should be in a class and what in that definition
Codecov ReportAll modified and coverable lines are covered by tests ✅
Additional details and impacted files@@ Coverage Diff @@
## master #8574 +/- ##
=======================================
Coverage 99.11% 99.11%
=======================================
Files 141 141
Lines 4076 4076
=======================================
Hits 4040 4040
Misses 36 36 ☔ View full report in Codecov by Sentry. |
|
@javierjulio Did you have a chance to take a look at this PR? What do you think? |
|
Is there anything I can help with to get this PR merged? @tagliala @javierjulio |
|
I'm sorry, the result looks good to me, but I can't approve this PR |
This PR imports file input styles from Flowbite and fixes display issue in Safari.
Current look of file inputs:
File inputs after fix:
