Update

5 files changed, 31 insertions, 40 deletions

diff --git a/tpl/objects/bubble.pug b/tpl/objects/bubble.pug
index 1e0df38..fad7242 100644
--- a/tpl/objects/bubble.pug
+++ b/tpl/objects/bubble.pug
@@ -31,11 +31,11 @@ mixin bubble(user)
         else if user
             header(class=headerClasses)
                 strong= user
-        div.o-bubble__body.s-colored-links
+        span.s-colored-links
             - slots.body()
-            if slots.time
-                small.o-bubble__time
-                    - slots.time()
+        if slots.time
+            small.o-bubble__time
+                - slots.time()
         if slots.footer
             footer.o-bubble__footer
                 - slots.footer()
diff --git a/tpl/objects/dialog.pug b/tpl/objects/dialog.pug
index 2474cc3..91b99d9 100644
--- a/tpl/objects/dialog.pug
+++ b/tpl/objects/dialog.pug
@@ -1,6 +1,4 @@
 include heading.pug
-include header.pug
-include sidebar.pug
 
 mixin dialog(title)
     - const slots = {}
@@ -12,9 +10,23 @@ mixin dialog(title)
         block ? block() : undefined 
 
         let classes = {
-            'o-dialog': true,
+            'o-dialog':       true,
+            'o-dialog--flat': attributes.flat,
         }
 
+        let headerClass = {
+            'o-dialog__header': true,
+            'u-themed':         !attributes.flat,
+            't-lowered':        !attributes.flat,
+            'l-card':           true,
+        }
+
+        let sidebarHeaderClass = {
+            'o-dialog__header--sidebar': true,
+        }
+
+        Object.assign(sidebarHeaderClass, headerClass);
+
         let bodyClass = {
             'o-dialog__body': true
         }
@@ -23,21 +35,24 @@ mixin dialog(title)
         }
 
     div(class=classes)
-        if slots['sidebar-header']
-            +header(class='o-dialog__sidebar-header')
-                - slots['sidebar-header']()
+        if slots['sidebar-header'] || attributes.sidebarTitle
+            div(class=sidebarHeaderClass)
+                if slots['sidebar-header']
+                    - slots['sidebar-header']()
+                else
+                    +div-heading('sm')(class='o-dialog__title l-card__block l-card__block--main')= attributes.sidebarTitle
 
         if slots.sidebar
-            +sidebar(class='o-dialog__sidebar')
+            .o-dialog__sidebar.l-overflow
                 - slots.sidebar()
 
-        +header(class='o-dialog__header')
+        div(class=headerClass)
             if slots.header
                 - slots.header()
             else
                 if title
-                    +div-heading('sm')(class='o-dialog__label')= title
-            +action-button(round=true quiet=true icon='x' class='o-dialog__close-btn')
+                    +div-heading('sm')(class='o-dialog__title l-card__block l-card__block--main')= title
+            +action-button(round=true quiet=true icon='x' class='o-dialog__close-btn l-card__block')
 
         section(class=bodyClass)
             if slots.body
diff --git a/tpl/objects/header.pug b/tpl/objects/header.pug
deleted file mode 100644
index 0d9d7ee..0000000
--- a/tpl/objects/header.pug
+++ /dev/null
@@ -1,12 +0,0 @@
-mixin header
-    -
-        let classes = {
-            'o-header': true
-        }
-        if (attributes.class) {
-            classes[attributes.class] = true;
-        }
-
-    header(class=classes)
-        .o-header__content.t-lo
-            block
diff --git a/tpl/objects/icon.pug b/tpl/objects/icon.pug
index 1ed6052..67bcf37 100644
--- a/tpl/objects/icon.pug
+++ b/tpl/objects/icon.pug
@@ -2,8 +2,8 @@ mixin icon(id)
     -
         let href    = 'icons.svg#' + id
         let classes = {
-            'o-icon':        true,
-            'o-icon--block': attributes.block,
+            'o-icon':    true,
+            'u-d-block': attributes.block,
         }
         if (attributes.class) {
             classes[attributes.class] = true;
diff --git a/tpl/objects/sidebar.pug b/tpl/objects/sidebar.pug
deleted file mode 100644
index caa0f1f..0000000
--- a/tpl/objects/sidebar.pug
+++ /dev/null
@@ -1,12 +0,0 @@
-mixin sidebar
-    -
-        let classes = {
-            'o-sidebar': true
-        }
-        if (attributes.class) {
-            classes[attributes.class] = true;
-        }
-
-    aside(class=classes)
-        .o-sidebar__content.l-overflow
-            block