This repository has been archived by the owner on Sep 5, 2024. It is now read-only.
md-fab-toolbar height is not set properly with the default Angular Material styles #3384
Assignees
Milestone
Comments
|
This could be solved for vanilla Angular Material by setting the |
|
@chrislambe Sorry for the delay, I recall there being a reason to set the height, but if I'm basing it off of something in the docs, that's definitely wrong. I will take a look and figure out how to fix this :-) |
|
Awesome! Thanks, @topherfangio! |
topherfangio
added
in progress
topherfangio
added a commit
that referenced
this issue
Aug 3, 2015
Fab Toolbar incorrectly used 6.8rem instead of the rem(6.8) SCSS function. Also updated it to use button.scss variables instead of hard-coded values. closes #3384
kennethcachia
pushed a commit
to kennethcachia/material
that referenced
this issue
Sep 23, 2015
Fab Toolbar incorrectly used 6.8rem instead of the rem(6.8) SCSS function.
Also updated it to use button.scss variables instead of hard-coded values.
BREAKING CHANGE: md-fab-toolbar now uses variables for height
```css
md-fab-toolbar {
height: $button-fab-width + ($icon-button-margin * 2);
}
```
closes angular#3384. closes angular#4007.
ThomasBurleson
removed
the
in progress
Sign up for free
to subscribe to this conversation on GitHub.
Already have an account?
Sign in.
The
md-fab-toolbarcomponent seems to work well enough in the docs demo, but in a vanilla Angular Material app it's strangely tall. Turns out it relies on thefont-sizebeing set to62.5%on thehtmlelement of the docs demo. Thatfont-sizeis set bydocs.cssand so can't be relied upon in a normal Angular Material app.The height of the FAB toolbar is determined by the
md-fab-toolbar-wrapperclass which has a height of6.8rem.You can see the abnormal height in the codepen demo provided in the docs: http://codepen.io/anon/pen/eNGXpb
The text was updated successfully, but these errors were encountered: