slide_box.scss in tao_ui-0.2.10

- old
+ new
@@ -1,40 +1,56 @@
 @import 'tao/ui/mobile/globals';
 @import 'tao/ui/shared/slide_box';
 
-tao-slide-box {
-  .header {
-    height: 3rem;
-    background: $white-color;
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    border-bottom: 1px solid $border-color;
+.tao-slide-box {
+  .slide-box-content {
+    & > header,
+    & > .header {
+      height: 3rem;
+      background: $white-color;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      border-bottom: 1px solid $border-color;
 
-    .left {
-      width: 6rem;
-      flex: 1 1 auto;
-      text-align: left;
-      margin: 0 0 0 0.75rem;
-    }
+      .left {
+        width: 6rem;
+        flex: 1 1 auto;
+        text-align: left;
+        margin: 0 0 0 0.75rem;
+      }
 
-    .right {
-      width: 6rem;
-      flex: 1 1 auto;
-      text-align: right;
-      margin: 0 0.75rem 0 0;
-    }
+      .right {
+        width: 6rem;
+        flex: 1 1 auto;
+        text-align: right;
+        margin: 0 0.75rem 0 0;
+      }
 
-    .title {
-      flex: 0 0 auto;
-      text-align: center;
+      .title {
+        flex: 0 0 auto;
+        text-align: center;
+      }
+
+      .link-close {
+        fill: $lighter-grey-color;
+
+        &:active {
+          fill: $grey-color;
+        }
+      }
     }
 
-    .link-close {
-      fill: $lighter-grey-color;
+    & > .buttons {
+      border-top: 1px solid $border-color;
 
-      &:active {
-        fill: $grey-color;
+      .button {
+        border-radius: 0;
+        border-width: 0 1px 0 0;
+
+        &:last-child {
+          border-right-width: 0;
+        }
       }
     }
   }
 }