2 files changed, 24 insertions, 23 deletions

diff --git a/tpl/objects/form.pug b/tpl/objects/form.pug
index 24ac3f0..cbb1758 100644
--- a/tpl/objects/form.pug
+++ b/tpl/objects/form.pug
@@ -3,8 +3,8 @@ include field-label.pug
 mixin form
     form(class={
         'l-form':               true,
-        'l-form--labels-left':  attributes.labelsAlign === 'left',
-        'l-form--labels-right': attributes.labelsAlign === 'right',
+        'l-form--labels-start': attributes.labelsAlign === 'start',
+        'l-form--labels-end':   attributes.labelsAlign === 'end',
         'l-form--labels-above': attributes.labelsAlign === 'above'
         })
         block
diff --git a/tpl/views/form.pug b/tpl/views/form.pug
index 859e9a6..5b24757 100644
--- a/tpl/views/form.pug
+++ b/tpl/views/form.pug
@@ -1,29 +1,30 @@
 mixin view-form 
     +view('form', 'Form')
-        .c-box
-            +form(labelsAlign="left")
-                +form-item('Username')
-                    +text-field(placeholder='Example: Volpeon')
+        each align in ['above', 'start', 'end']
+            .c-box
+                +form(labelsAlign=align)
+                    +form-item('Username')
+                        +text-field(placeholder='Example: Volpeon')
 
-                +form-item('Password', 'At least 6 characters, all characters allowed')
-                    +text-field(placeholder='Example: hunter2' type='password')
+                    +form-item('Password', 'At least 6 characters, all characters allowed')
+                        +text-field(placeholder='Example: hunter2' type='password')
 
-                +form-item('Bio')
-                    +text-field(placeholder='Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam...')
+                    +form-item('Bio')
+                        +text-field(placeholder='Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam...')
 
-                +form-item('Favorite animal')
-                    +radio(name="form-demo-1" checked=true)= 'Foxes'
-                    +radio(name="form-demo-1")= 'Other'
+                    +form-item('Favorite animal')
+                        +radio(name="form-demo-1" checked=true)= 'Foxes'
+                        +radio(name="form-demo-1")= 'Other'
 
-                +form-item('Notification settings')
-                    +switch= 'In-app notifications'
-                    br
-                    +switch= 'Desktop notifications'
-                    br
-                    +switch= 'Email notifications'
+                    +form-item('Notification settings')
+                        +switch= 'In-app notifications'
+                        br
+                        +switch= 'Desktop notifications'
+                        br
+                        +switch= 'Email notifications'
 
-                +form-item('')
-                    +checkbox= 'I\'ve read and accept the terms and conditions'
+                    +form-item('')
+                        +checkbox= 'I\'ve read and accept the terms and conditions'
 
-                +form-item('')
-                    +a-button(variant='primary')= 'Register'
+                    +form-item('')
+                        +a-button(variant='primary')= 'Register'