Normalize more-info bottom padding (#1682)

src/components/ha-labeled-slider.js

@@ -10,7 +10,6 @@ class HaLabeledSlider extends PolymerElement {
     <style>
       :host {
         display: block;
-        padding-bottom: 16px;
       }
 
       .title {

src/dialogs/more-info/controls/more-info-light.js

@@ -29,9 +29,6 @@ class MoreInfoLight extends LocalizeMixin(EventsMixin(PolymerElement)) {
     return html`
   <style include="iron-flex"></style>
   <style>
-    .effect_list {
-      padding-bottom: 16px;
-    }
 
     .effect_list, .brightness, .color_temp, .white_value {
       max-height: 0px;
@@ -61,6 +58,18 @@ class MoreInfoLight extends LocalizeMixin(EventsMixin(PolymerElement)) {
       max-height: 84px;
     }
 
+    .has-brightness
+    .has-color_temp.is-on,
+    .has-white_value.is-on {
+      margin-top: -16px;
+    }
+
+    .has-brightness .brightness,
+    .has-color_temp.is-on .color_temp,
+    .has-white_value.is-on .white_value {
+      padding-top: 16px;
+    }
+
     .has-color.is-on ha-color-picker {
       max-height: 500px;
       overflow: visible;
@@ -78,6 +87,7 @@ class MoreInfoLight extends LocalizeMixin(EventsMixin(PolymerElement)) {
     paper-item {
       cursor: pointer;
     }
+
   </style>
 
   <div class$="[[computeClassNames(stateObj)]]">

src/dialogs/more-info/more-info-controls.js

@@ -55,8 +55,12 @@ class MoreInfoControls extends EventsMixin(PolymerElement) {
       }
     }
 
+    paper-dialog-scrollable {
+      padding-bottom: 16px;
+    }
+
     :host([domain=camera]) paper-dialog-scrollable {
-      margin: 0 -24px -5px;
+      margin: 0 -24px -21px;
     }
   </style>