4 files changed, 47 insertions, 16 deletions

diff --git a/tpl/views/dialog.pug b/tpl/views/dialog.pug
index 6aaead5..0b6f8e7 100644
--- a/tpl/views/dialog.pug
+++ b/tpl/views/dialog.pug
@@ -18,10 +18,40 @@ mixin view-dialog
 
         .c-box
             +backdrop
-                +dialog('Lorem ipsum')(noRule=true)
+                +dialog('Tags')
+                    +slot('sidebar-header')
+                        +div-heading('sm')(class='o-dialog__label')= '#channel'
+                    +slot('sidebar')
+                        +menu(style={ 'min-width': '10em' })
+                            +menu-item(icon='bookmark')= 'Bookmark'
+                            +menu-item(icon='tags', selected=true)= 'Tags'
+                            +menu-item(icon='hash')= 'achannel'
+                    +slot('body')
+                        p.u-mt-0= loremIpsum
+
+        .c-box
+            +backdrop
+                +dialog('#channel')
+                    +slot('sidebar')
+                        +menu(style={ 'min-width': '10em' })
+                            +menu-item(icon='bookmark')= 'Bookmark'
+                            +menu-item(icon='tags', selected=true)= 'Tags'
+                            +menu-item(icon='hash')= 'achannel'
+                    +slot('body')
+                        p.u-mt-0= loremIpsum
+
+        .c-box
+            +backdrop
+                +dialog
+                    +slot('header')
+                        .l-card.l-card--flush
+                            .l-card__block.l-flex
+                                +action-button(quiet=true icon='chevron-left')
+                                +action-button(quiet=true icon='chevron-right')
+                            .l-card__block.l-card__block--main
+                                +div-heading('sm')= 'Tags'
                     +slot('sidebar')
                         +menu(style={ 'min-width': '10em' })
-                            +menu-header= '#channel'
                             +menu-item(icon='bookmark')= 'Bookmark'
                             +menu-item(icon='tags', selected=true)= 'Tags'
                             +menu-item(icon='hash')= 'achannel'
diff --git a/tpl/views/rule.pug b/tpl/views/divider.pug
index 495c804..8c3ec0c 100644
--- a/tpl/views/rule.pug
+++ b/tpl/views/divider.pug
@@ -1,21 +1,21 @@
-mixin view-rule 
-    +view('rule', 'Rule')
+mixin view-divider 
+    +view('divider', 'Divider')
         .c-box
             +div-heading('lg')= 'Heading'
-            +rule('strong')
+            +divider('strong')
             p= loremIpsum
 
         .c-box
             +div-heading('sm')= 'Heading'
-            +rule('medium')
+            +divider('medium')
             p= loremIpsum
 
         .c-box
             +div-heading('xs')= 'Heading'
-            +rule('faint')
+            +divider('faint')
             p= loremIpsum
 
         .c-box
-            +rule('strong')= 'Strong'
-            +rule('medium')= 'Medium'
-            +rule('faint')= 'Faint'
+            +divider('strong')= 'Strong'
+            +divider('medium')= 'Medium'
+            +divider('faint')= 'Faint'
diff --git a/tpl/views/list-group.pug b/tpl/views/list-group.pug
index 970f0fb..9acef31 100644
--- a/tpl/views/list-group.pug
+++ b/tpl/views/list-group.pug
@@ -9,7 +9,7 @@ mixin view-list-group
 
         .c-box
             +list-group
-                +list-group-item(action=true)= 'First item'
-                +list-group-item(action=true)= 'Second item'
-                +list-group-item(action=true)= 'Third item'
-                +list-group-item(action=true)= 'Fourth item'
+                +list-group-item(interactive=true)= 'First item'
+                +list-group-item(interactive=true)= 'Second item'
+                +list-group-item(interactive=true)= 'Third item'
+                +list-group-item(interactive=true)= 'Fourth item'
diff --git a/tpl/views/text-field.pug b/tpl/views/text-field.pug
index 0ba84be..262195d 100644
--- a/tpl/views/text-field.pug
+++ b/tpl/views/text-field.pug
@@ -14,9 +14,10 @@ mixin view-text-field
                 +text-field(value='Incorrect input' pattern='a+' required=true disabled=true)
             br
             div
-                +text-field(placeholder='Just landed in L.A.')
+                +text-field(placeholder='Just landed in L.A.' class="u-p-50")
                     +slot('pre')
-                        +action-button(quiet=true selected=true class='l-card__block')= 'Volpeon'
+                        +action-button(quiet=true class='l-card__block')= 'Volpeon'
+                        +divider('vertical')(class='u-ml-50')
                     +slot('post')
                         +action-button(quiet=true icon='smile' class='l-card__block')
                         +action-button(quiet=true icon='send' class='l-card__block')