5 files changed, 45 insertions, 33 deletions

diff --git a/tpl/objects/action-menu.pug b/tpl/objects/action-menu.pug
index 8c1a584..e8cecb2 100644
--- a/tpl/objects/action-menu.pug
+++ b/tpl/objects/action-menu.pug
@@ -2,14 +2,7 @@ include icon.pug
 include status-indicator.pug
 
 mixin action-menu
-    -
-        let classes = {
-            'o-action-menu':         true,
-            'o-action-menu--static': true,
-            't-raised':              true
-        }
-
-    div(class=classes)
+    .o-action-menu.u-ps.t-raised
         block
 
 mixin action-menu-item
diff --git a/tpl/objects/backdrop.pug b/tpl/objects/backdrop.pug
new file mode 100644
index 0000000..6ad72d7
--- /dev/null
+++ b/tpl/objects/backdrop.pug
@@ -0,0 +1,3 @@
+mixin backdrop
+    .o-backdrop.u-ps(style={ width: '100%', 'min-height': '5em' })
+        block
diff --git a/tpl/objects/dialog.pug b/tpl/objects/dialog.pug
new file mode 100644
index 0000000..2cbbd4f
--- /dev/null
+++ b/tpl/objects/dialog.pug
@@ -0,0 +1,16 @@
+include rule.pug
+include button.pug
+include heading.pug
+
+mixin dialog(title)
+    .o-dialog.t-raised
+        header.o-dialog__header
+            +div-heading('lg')(class='o-dialog__title')
+                = title
+        +rule('medium')
+        section.o-dialog__body
+            block
+        footer.o-dialog__footer
+            +a-button(outline=true)= 'Cancel'
+            = ' '
+            +a-button(outline=true variant='primary')= 'Continue'
diff --git a/tpl/objects/heading.pug b/tpl/objects/heading.pug
index 546df43..a0de4af 100644
--- a/tpl/objects/heading.pug
+++ b/tpl/objects/heading.pug
@@ -1,34 +1,34 @@
-mixin h1-heading
-    - let classes = ['o-heading', 'o-heading--' + attributes.level]
-    h1(class=classes)
+mixin h1-heading(level)
+    - let classes = ['o-heading', 'o-heading--' + level]
+    h1(class=classes)&attributes(attributes)
         block
 
-mixin h2-heading
-    - let classes = ['o-heading', 'o-heading--' + attributes.level]
-    h2(class=classes)
+mixin h2-heading(level)
+    - let classes = ['o-heading', 'o-heading--' + level]
+    h2(class=classes)&attributes(attributes)
         block
 
-mixin h3-heading
-    - let classes = ['o-heading', 'o-heading--' + attributes.level]
-    h3(class=classes)
+mixin h3-heading(level)
+    - let classes = ['o-heading', 'o-heading--' + level]
+    h3(class=classes)&attributes(attributes)
         block
 
-mixin h4-heading
-    - let classes = ['o-heading', 'o-heading--' + attributes.level]
-    h4(class=classes)
+mixin h4-heading(level)
+    - let classes = ['o-heading', 'o-heading--' + level]
+    h4(class=classes)&attributes(attributes)
         block
 
-mixin h5-heading
-    - let classes = ['o-heading', 'o-heading--' + attributes.level]
-    h5(class=classes)
+mixin h5-heading(level)
+    - let classes = ['o-heading', 'o-heading--' + level]
+    h5(class=classes)&attributes(attributes)
         block
 
-mixin h6-heading
-    - let classes = ['o-heading', 'o-heading--' + attributes.level]
-    h6(class=classes)
+mixin h6-heading(level)
+    - let classes = ['o-heading', 'o-heading--' + level]
+    h6(class=classes)&attributes(attributes)
         block
 
-mixin div-heading
-    - let classes = ['o-heading', 'o-heading--' + attributes.level]
-    div(class=classes)
+mixin div-heading(level)
+    - let classes = ['o-heading', 'o-heading--' + level]
+    div(class=classes)&attributes(attributes)
         block
diff --git a/tpl/objects/rule.pug b/tpl/objects/rule.pug
index 958ff18..63a039f 100644
--- a/tpl/objects/rule.pug
+++ b/tpl/objects/rule.pug
@@ -1,10 +1,10 @@
-mixin rule
+mixin rule(level)
     -
         let classes = {
-            'o-rule':           true,
-            'o-rule--labelled': !!block
+            'o-rule':             true,
+            'o-rule--labelled':   !!block,
+            ['o-rule--' + level]: true
         }
-        classes['o-rule--' + attributes.level] = true
 
     div(class=classes)
         if block