style(expansion): simplify vertical centering in header (#5950)

angular · Aug 4, 2017 · 73c6d8d · 73c6d8d
1 parent 787a8f0
commit 73c6d8d
Show file tree

Hide file tree

Showing 2 changed files with 3 additions and 11 deletions.
diff --git a/src/lib/expansion/expansion-panel-header.scss b/src/lib/expansion/expansion-panel-header.scss
@@ -1,19 +1,11 @@
-$mat-expansion-panel-header-height: 48px;
-$mat-expansion-panel-header-height-expanded: 64px;
 
 .mat-expansion-panel-header {
   cursor: pointer;
   display: flex;
   flex-direction: row;
-  height: $mat-expansion-panel-header-height;
-  line-height: $mat-expansion-panel-header-height;
+  align-items: center;
   padding: 0 24px;
 
-  &.mat-expanded {
-    height: $mat-expansion-panel-header-height-expanded;
-    line-height: $mat-expansion-panel-header-height-expanded;
-  }
-
   &:focus,
   &:hover {
     outline: none;

diff --git a/src/lib/expansion/expansion-panel-header.ts b/src/lib/expansion/expansion-panel-header.ts
@@ -64,8 +64,8 @@ import {Subscription} from 'rxjs/Subscription';
       transition('expanded <=> collapsed', animate(EXPANSION_PANEL_ANIMATION_TIMING)),
     ]),
     trigger('expansionHeight', [
-      state('collapsed', style({height: '48px', 'line-height': '48px'})),
-      state('expanded', style({height: '64px', 'line-height': '64px'})),
+      state('collapsed', style({height: '48px'})),
+      state('expanded', style({height: '64px'})),
       transition('expanded <=> collapsed', animate(EXPANSION_PANEL_ANIMATION_TIMING)),
     ]),
   ],