material action menu updates

This commit is contained in:
Adam Bradley
2015-08-12 20:39:30 -05:00
parent 369e02bb7e
commit 17c3edd2a8
3 changed files with 8 additions and 5 deletions

View File

@@ -43,6 +43,7 @@ action-menu-wrapper {
display: block;
padding: 1px;
width: 100%;
margin: 0;
border-radius: 0;
border-color: $action-menu-options-border-color;
background-color: transparent;

View File

@@ -110,7 +110,7 @@ class ActionMenuAnimation extends Animation {
class ActionMenuSlideIn extends ActionMenuAnimation {
constructor(element) {
super(element);
this.backdrop.fromTo('opacity', 0, 0.4);
this.backdrop.fromTo('opacity', 0, 0.26);
this.wrapper.fromTo('translateY', '100%', '0%');
}
}
@@ -119,7 +119,7 @@ Animation.register('action-menu-slide-in', ActionMenuSlideIn);
class ActionMenuSlideOut extends ActionMenuAnimation {
constructor(element) {
super(element);
this.backdrop.fromTo('opacity', 0.4, 0);
this.backdrop.fromTo('opacity', 0.26, 0);
this.wrapper.fromTo('translateY', '0%', '100%');
}
}

View File

@@ -8,12 +8,14 @@ $action-menu-md-height: 4.8rem !default;
$action-menu-md-title-color: #757575 !default;
$action-menu-md-title-font-size: 1.6rem !default;
$action-menu-md-title-padding: 1.9rem 1.6rem 1.7rem !default;
$action-menu-md-button-text-color: #222 !default;
$action-menu-md-button-font-size: 1.6rem !default;
$action-menu-md-background-active: #f1f1f1 !default;
$action-menu-md-icon-font-size: 2.4rem !default;
$action-menu-md-icon-margin: 0 28px 0 0 !default;
.action-menu[mode=md] {
@@ -36,18 +38,17 @@ $action-menu-md-icon-font-size: 2.4rem !default;
.icon {
display: inline-block;
margin: $action-menu-md-icon-margin;
min-width: 24px;
text-align: center;
vertical-align: middle;
font-size: $action-menu-md-icon-font-size;
margin: 0 32px 0 0; // gap on right, standard left padding
}
}
.action-menu-title {
padding: $action-menu-md-title-padding;
font-size: $action-menu-md-title-font-size;
padding: $action-menu-md-title-font-size;
color: $action-menu-md-title-color;
}
@@ -57,6 +58,7 @@ $action-menu-md-icon-font-size: 2.4rem !default;
&.activated {
background: $action-menu-md-background-active;
border-radius: 0;
}
}