fix(expansion-panel): let label flex without sublabel and follow MD s…

…pec better (#1068)
Teradata · Jan 5, 2018 · 251abb8 · 251abb8
1 parent f26bd4e
commit 251abb8
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 5 deletions.
diff --git a/src/platform/core/expansion-panel/expansion-panel.component.html b/src/platform/core/expansion-panel/expansion-panel.component.html
@@ -17,7 +17,6 @@
       <ng-template [cdkPortalHost]="expansionPanelSublabel"></ng-template>
       <ng-template [ngIf]="!expansionPanelSublabel">{{sublabel}}</ng-template>
     </div>
-    <span class="td-expansion-panel-spacer"></span>
     <mat-icon class="td-expand-icon" *ngIf="!disabled" [@tdRotate]="expand">keyboard_arrow_down</mat-icon>
   </div>
 </div>

diff --git a/src/platform/core/expansion-panel/expansion-panel.component.scss b/src/platform/core/expansion-panel/expansion-panel.component.scss
@@ -9,7 +9,7 @@
     }
     .td-expansion-panel-header-content {
       height: 48px;
-      padding: 0 16px;
+      padding: 0 24px;
       // layout
       box-sizing: border-box;
       display: flex;
@@ -23,7 +23,7 @@
       align-content: center;
       max-width: 100%;
       .td-expansion-label,
-      .td-expansion-panel-spacer {
+      .td-expansion-sublabel {
         // flex
         flex: 1;
       }
@@ -42,9 +42,9 @@
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
-  margin-right: 5px;
+  margin-right: 16px;
   ::ng-deep [dir='rtl'] & {
-    margin-left: 5px;
+    margin-left: 16px;
     margin-right: inherit;
   }
 }