Skip to content

Fix pseudo paddings and height#30269

Merged
MartijnCuppens merged 3 commits intomasterfrom
master-mc-fix-date-height
Mar 14, 2020
Merged

Fix pseudo paddings and height#30269
MartijnCuppens merged 3 commits intomasterfrom
master-mc-fix-date-height

Conversation

@MartijnCuppens
Copy link
Member

@MartijnCuppens MartijnCuppens commented Feb 22, 2020

It turns out the height of date inputs (#18842) are increased by the padding on the pseudo elements and the fixed height of 1.5rem of the ::-webkit-inner-spin-button.

I've now reset these paddings and height instead of hacking with the line-height.

Codepen to play with: https://codepen.io/MartijnCuppens/pen/wvBLzvb?editors=1100

@MartijnCuppens MartijnCuppens requested a review from a team as a code owner February 22, 2020 21:02
@mdo
Copy link
Member

mdo commented Feb 23, 2020

Holy shit, is this really the cause of all that pain? No requirement for fixed heights on form controls now? :D

@ysds
Copy link
Contributor

ysds commented Feb 24, 2020

On iOS (Chrome/Safari) there still seems to be a problem.

@MartijnCuppens
Copy link
Member Author

MartijnCuppens commented Mar 6, 2020

@ysds, do you mean this: #30353?

@ysds
Copy link
Contributor

ysds commented Mar 9, 2020

@ysds, do you mean this: #30353?

yep :)

@MartijnCuppens
Copy link
Member Author

MartijnCuppens commented Mar 10, 2020 •
edited
Loading

FYI, this patch is unrelated to #30353.

Holy shit, is this really the cause of all that pain? No requirement for fixed heights on form controls now? :D

Not sure about that, we got to check that in #30353. We added min-height in the end to make sure textareas don't shrink too much when the native resizer is used (#29124). This patch just resets the right properties that cause the unequal heights for text & date inputs instead of the hack I used before which worked while I had no clue why it did 😛

@ysds
Copy link
Contributor

ysds commented Mar 14, 2020 •
edited
Loading

BTW should add date input example on our docs like color if we support those.

Updated: Oops I intended to comment this on #30353.

ysds
ysds approved these changes Mar 14, 2020
View reviewed changes
Copy link
Contributor

@ysds ysds left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

@MartijnCuppens MartijnCuppens merged commit 4d4400e into master Mar 14, 2020
@MartijnCuppens MartijnCuppens deleted the master-mc-fix-date-height branch March 14, 2020 16:09
ashfahan added a commit to fluid-framework/Fluid that referenced this pull request Apr 23, 2020
@ashfahan
🆙 📦 Updates from bootstrap reboot
a7bdca7 
twbs/bootstrap#30323
twbs/bootstrap#30340
twbs/bootstrap#30345
twbs/bootstrap#30353
twbs/bootstrap#30269
@MartijnCuppens MartijnCuppens mentioned this pull request Oct 27, 2020
Merged
@Turbo87 Turbo87 mentioned this pull request Jun 16, 2023
Merged
10 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

1 more reviewer

@ysds ysds ysds approved these changes

Reviewers whose approvals may not affect merge requirements

Assignees

No one assigned

Labels

css v5

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

3 participants

@MartijnCuppens @mdo @ysds