add alert partial

_includes/partial/alert.html

@@ -0,0 +1,11 @@
+<div class="bg-teal-100 border-t-4 border-teal-500 rounded-b text-teal-900 px-4 py-3 shadow-md" role="alert">
+    <div class="flex">
+        {% if include.style == 'info' %}
+            <svg class="fill-current h-6 w-6 text-teal-500 mr-4" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><path d="M2.93 17.07A10 10 0 1 1 17.07 2.93 10 10 0 0 1 2.93 17.07zm12.73-1.41A8 8 0 1 0 4.34 4.34a8 8 0 0 0 11.32 11.32zM9 11V9h2v6H9v-4zm0-6h2v2H9V5z"/></svg>
+        {% endif %}
+        <div>
+            <p class="font-bold">{{ include.title }}</p>
+            <p class="text-sm">{{ include.desc }}</p>
+        </div>
+    </div>
+</div>

_layouts/alternatives.html

@@ -3,9 +3,17 @@ layout: content
 ---
 <article class="prose prose-sm sm:prose lg:prose-lg xl:prose-xl mx-auto min-h-screen">
     <h2>{{ page.title }}</h2>
-    <p>Please keep in mind that this is the view of one or more devs of InvenTree. So there is an elemenet of bias involved.</p>
+    {% include partial/alert.html
+        style='info'
+        title='caveat'
+        desc='Please keep in mind that this is the view of one or more devs of InvenTree. So there is an elemenet of bias involved.'
+    %}
     {{ content }}
     {% if page.oss %}
-    <p>This alternative is (F)OSS - let's celebrate this by heading over, giving it a good look and staring the project! Motiviation keeps projects and maintainers healthy.</p>
+    {% include partial/alert.html
+        style='info'
+        title='(F)OSS'
+        desc="This alternative is (F)OSS - let's celebrate this by heading over, giving it a good look and staring the project! Motiviation keeps projects and maintainers healthy."
+    %}
     {% endif %}
 </article>