Conversation
|
Thanks for your pull request! It looks like this may be your first contribution to a Google open source project. Before we can look at your pull request, you'll need to sign a Contributor License Agreement (CLA). View this failed invocation of the CLA check for more information. For the most up to date status, view the checks section at the bottom of the pull request. |
9ad657b to
ddd97d7
Compare
|
Update: I have already signed the Google CLA with fischerszavarduard@gmail.com, and I have now rewritten this PR commit so the author/committer email matches that signed address. The cla/google check is still failing. Could a maintainer please re-run or investigate? |
ddd97d7 to
d41d7b7
Compare
|
Ah, the \cla/google\ check is still failing despite my earlier re-write to match my signed CLA email. I'll wait for a maintainer to investigate or manually approve. Thank you! |
d41d7b7 to
41cdd0a
Compare
|
@googlebot I signed it! |
Heading elements (h1-h6) placed inside mat-toolbar were inheriting mat-typography margins and font sizes, which overrode the toolbar's intended styles. Reset the heading margin to 0 and inherit the toolbar font using a doubled `.mat-toolbar` selector so the styles take precedence over `.mat-typography` heading rules. Fixes angular#26261
41cdd0a to
40839d0
Compare
Fixes #26261
Summary
Headings (
h1toh6) placed insidemat-toolbarinherit the.mat-typographyheading styles instead of the toolbar's own title typography, so they get the hierarchy font size and a bottom margin. The toolbar rule.mat-toolbar h1and the typography rule.mat-typography h1have the same specificity (0-1-1), so the winner depends on CSS load order, and in the common setup (mat-typographyonbody, component styles loaded earlier) the typography rule wins.Change
src/material/toolbar/toolbar.scss:font-family,font-size,line-height,font-weight,letter-spacing) now live on.mat-toolbaritself..mat-toolbar.mat-toolbar h1, ... h6(specificity 0-2-1), withfont: inherit,letter-spacing: inheritandmargin: 0, so they always take the toolbar typography regardless of stylesheet order.Before / after
mat-typographyonbody,<h1>inside<mat-toolbar>): the heading renders at the.mat-typography h1size with a bottom margin.Compatibility note
The heading selector moves from specificity 0-1-1 to 0-2-1. Application styles that override heading typography inside a toolbar with a single-class selector (for example
.app-header h1 { font-size: 24px }) will need a stronger selector or the--mat-toolbar-title-text-sizetoken override. There is no API change.Validation
pnpm exec stylelint "src/material/toolbar/toolbar.scss" --config .stylelintrc.jsonpnpm exec sass --load-path=node_modules src/material/toolbar/toolbar.scsspnpm exec prettier --check src/material/toolbar/toolbar.scsssrc/dev-app/toolbarwithmat-typographyapplied tobody.