amorfo77/sogo
1
0
Fork 0
mirror of https://github.com/inverse-inc/sogo.git synced 2026-07-06 00:45:09 +00:00
Code Issues Projects Releases Wiki Activity

Fix fab-button positionning

Browse Source
This commit is contained in:
Benoit Favreault
2015-04-02 02:53:21 -04:00
committed by Francis Lachapelle
parent a5c9f41375
commit a75719e151
6 changed files with 41 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files
UI/WebServerResources/scss/components/button/_button.scss
+23
View File
@@ -152,11 +152,15 @@ md-toolbar .md-toolbar-tools .iconButton:last-child,
// angular-material is overspecifying so we are
.md-button.iconButton.md-fab.md-default-theme:not([disabled]) {
z-index: $z-index-fab;
// flex might stretch or squize fab bottons
min-width: $button-fab-width;
min-height: $button-fab-height;
// this is a temporary fix, see comment in variables
padding: $mg;
margin-right: $mg;
// this is to positioned the button on the toolbar's edge
transform: translate3d(0, -50%, 0);
&:hover {
transform: translate3d(0, -49%, 0);
[class ^= md-icon],
@@ -179,6 +183,25 @@ md-toolbar .md-toolbar-tools .iconButton:last-child,
}
}
.md-button.iconButton.md-fab.md-fab--bottom {
align-self: flex-end;
// this is to positioned the button on the container's edge
transform: translate3d(-50%, -50%, 0) !important; // at this point important is not worst than long selector
&:hover {
transform: translate3d(-50%, -49%, 0) !important;
}
}
.md-button.iconButton.md-fab.md-fab--bottom-inside {
transform: translate3d(0, (($button-fab-height + $mg) * -1), 0) !important; // at this point important is not worst than long selector
// to prevent empty space at bottom of container
position: absolute;
right: 0;
&:hover {
transform: translate3d(0, (($button-fab-height + $mg - 1) * -1) 0) !important; // at this point important is not worst than long selector
}
}
.sg-button-navicon {
//top: ($mg * -1);
//margin-left: ($mg * -1);