From 4e87fb46f2958ae28bdcfbc469118f14297b4d26 Mon Sep 17 00:00:00 2001
From: Volpeon <git@volpeon.ink>
Date: Wed, 26 Jun 2024 09:19:02 +0200
Subject: Pill version for action button

---
 tpl/views/action-button.pug | 89 +++++++++++++++++++++++++++++----------------
 1 file changed, 58 insertions(+), 31 deletions(-)

(limited to 'tpl/views')

diff --git a/tpl/views/action-button.pug b/tpl/views/action-button.pug
index 8fb4e58..2c94c68 100644
--- a/tpl/views/action-button.pug
+++ b/tpl/views/action-button.pug
@@ -1,31 +1,63 @@
 mixin view-action-button 
     +view('action-button', 'Action button')
         .c-box
+            +action-button(size='sm')= 'Idle'
+            = ' '
             +action-button= 'Idle'
             = ' '
-            +action-button(selected=true)= 'Selected'
+            +action-button(size='lg')= 'Idle'
             = ' '
-            +action-button(disabled=true)= 'Disabled'
+            +action-button(size='xl')= 'Idle'
+
+        .c-box
+            +action-button(icon='trash' size='sm')
             = ' '
-            +action-button(selected=true disabled=true)= 'Selected + disabled'
-            br
-            br
-            +action-button(icon='trash')= 'Idle'
+            +action-button(icon='trash')
+            = ' '
+            +action-button(icon='trash' size='lg')
+            = ' '
+            +action-button(icon='trash' size='xl')
+
+        .c-box
+            +action-button(pill=true size='sm')= 'Idle'
             = ' '
-            +action-button(icon='trash' selected=true)= 'Selected'
+            +action-button(pill=true)= 'Idle'
             = ' '
-            +action-button(icon='trash' disabled=true)= 'Disabled'
+            +action-button(pill=true size='lg')= 'Idle'
+            = ' '
+            +action-button(pill=true size='xl')= 'Idle'
+
+        .c-box
+            +action-button(pill=true icon='trash' size='sm')
+            = ' '
+            +action-button(pill=true icon='trash')
+            = ' '
+            +action-button(pill=true icon='trash' size='lg')
+            = ' '
+            +action-button(pill=true icon='trash' size='xl')
+
+        .c-box
+            +action-button= 'Label'
+            = ' '
+            +action-button(icon='trash')= 'Label'
             = ' '
-            +action-button(icon='trash' selected=true disabled=true)= 'Selected + disabled'
-            br
-            br
             +action-button(icon='trash')
+
+        .c-box
+            +action-button(quiet=true)= 'Label'
+            = ' '
+            +action-button(quiet=true icon='trash')= 'Label'
+            = ' '
+            +action-button(quiet=true icon='trash')
+
+        .c-box
+            +action-button= 'Idle'
             = ' '
-            +action-button(icon='trash' selected=true)
+            +action-button(selected=true)= 'Selected'
             = ' '
-            +action-button(icon='trash' disabled=true)
+            +action-button(disabled=true)= 'Disabled'
             = ' '
-            +action-button(icon='trash' selected=true disabled=true)
+            +action-button(selected=true disabled=true)= 'Selected + disabled'
 
         .c-box
             +action-button(quiet=true )= 'Idle'
@@ -35,26 +67,21 @@ mixin view-action-button
             +action-button(quiet=true disabled=true)= 'Disabled'
             = ' '
             +action-button(quiet=true selected=true disabled=true)= 'Selected + disabled'
-            br
-            br
-            +action-button(quiet=true icon='trash')= 'Idle'
-            = ' '
-            +action-button(quiet=true icon='trash' selected=true)= 'Selected'
-            = ' '
-            +action-button(quiet=true icon='trash' disabled=true)= 'Disabled'
-            = ' '
-            +action-button(quiet=true icon='trash' selected=true disabled=true)= 'Selected + disabled'
-            br
-            br
-            +action-button(quiet=true icon='trash')
+
+        .c-box
+            +action-button(pill=true)= 'Idle'
             = ' '
-            +action-button(quiet=true icon='trash' selected=true)
+            +action-button(pill=true selected=true)= 'Selected'
             = ' '
-            +action-button(quiet=true icon='trash' disabled=true)
+            +action-button(pill=true disabled=true)= 'Disabled'
             = ' '
-            +action-button(quiet=true icon='trash' selected=true disabled=true)
+            +action-button(pill=true selected=true disabled=true)= 'Selected + disabled'
 
         .c-box
-            +action-button= 'Idle'
+            +action-button(pill=true quiet=true)= 'Idle'
             = ' '
-            +action-button(icon='trash')
+            +action-button(pill=true quiet=true selected=true)= 'Selected'
+            = ' '
+            +action-button(pill=true quiet=true disabled=true)= 'Disabled'
+            = ' '
+            +action-button(pill=true quiet=true selected=true disabled=true)= 'Selected + disabled'
-- 
cgit v1.2.3-70-g09d2