fix(VDialog): Do not override typography defined for VCard #19688
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Description
VDialog overrides
line-height
andfont-size
forcing me to add very specific CSS overrides to make the UI consistent.inherit
in context of CSS does not mean "take previous value", but rather "pull value from parent element".In the example below, the effective
line-height
is1.5
defined on thehtml
level for the base font size16px
it then resolves to24px
.The same VCard outside of VDialog has smaller font size (14px) and line height
1.25rem
(20px).Variables
$card-text-font-size
and equivalent forline-height
date back to October 2019. Dialog got theseinheirt
before 3.0.0-alpha in June 2021 as part of a wider fix of styling inconsistencies and$dialog-card-title-font-size
was removed, while equivalent forline-height
supposedly never existed.I get why cards inside dialog should have larger text, but since I find normal cards unnecessarily small and already bump it up with dedicated variable, it would be nice to avoid this tricky override. The code below could be simplified, but reduction could bite me later and I don't like this feeling.
Another consideration is Material Design specification. I am not familiar with your sources for specification. A quick search reaveals that M2 is consistent with current approach [1] (font size 16px, line height 24px), but M3 looks like the text is smaller [2] and in line with Card.
A brief search did not reveal any issues that might cover this problem. I have skipped to PR, but I would be glad to discuss and adapt the changes.