make buttons configurable

_includes/block/hero.html

@@ -12,10 +12,16 @@
         {% if include.detail %}
         <p class="mb-8 leading-relaxed">{{ include.detail }}</p>
         {% endif %}
+        {% if include.buttons %}
         <div class="flex justify-center">
-          <button class="inline-flex text-white bg-secondary border-0 py-2 px-6 focus:outline-none hover:bg-primary rounded text-lg">Button</button>
+          {% for item in include.buttons %}
-          <button class="ml-4 inline-flex cm-hvr-btn border-0 py-2 px-6 focus:outline-none text-lg">Button</button>
+          <button class="
+          {% if  forloop.index != 0 %}ml-4{% endif %}
+          {% if item.primary %}cm-hvr-btn-primary{% else%}cm-hvr-btn{% endif%}
+          inline-flex border-0 py-2 px-6 focus:outline-none text-lg">{{item.text}}</button>
+          {% endfor %}
         </div>
+        {% endif %}
       </div>
       <div class="lg:max-w-lg lg:w-full md:w-1/2 w-5/6">
         {% if include.image %}

_layouts/user.html

@@ -2,7 +2,14 @@
 layout: default
 ---
 
-{% include block/hero.html title=site.tagline title_2=page.title_2 image='https://dummyimage.com/860x600' color='with InvenTree' detail=page.long_text %}
+{% include block/hero.html
+    title=site.tagline
+    title_2=page.title_2
+    image='https://dummyimage.com/860x600'
+    color='with InvenTree'
+    detail=page.long_text
+    buttons=page.buttons
+%}
 
 {% assign data = site.data[page.data] %}
 {% include block/features.html data=data extend=true %}

assets/index.css

@@ -32,6 +32,10 @@ layout: empty
         @apply text-gray-700 bg-gray-100 hover:bg-gray-200 rounded
     }
 
+    .cm-hvr-btn-primary {
+        @apply text-white bg-secondary hover:bg-primary rounded
+    }
+
     .cm-gray-1 {
         @apply text-gray-900
     }

use/maker.md

@@ -6,4 +6,7 @@ data: for_maker
 long_text: |
     lorem ipsum place for
     multiline inteligent text
+buttons:
+    - text: Button
+    - text: Button1
 ---