add badges

Author: marle3003

webui/src/views/Kafka.vue

@@ -41,6 +41,9 @@ useMeta(title, description, "https://mokapi.io/kafka")
         <div class="row hero-title">
           <div class="col-12 col-lg-6 px-0">
             <h1>Mock and Validate Kafka Messages with Ease</h1>
+            <div class="mb-3">
+              <span class="badge">Kafka</span>
+            </div>
             <p class="description">Test and develop Kafka-based applications faster with Mokapi's powerful mocking and validation tools.</p>
             <p class="d-none d-md-block">
               <router-link :to="{ path: '/docs/guides' }">
@@ -112,7 +115,7 @@ useMeta(title, description, "https://mokapi.io/kafka")
     <section>
       <div class="container">
         <h2>Use Cases</h2>
-    <div class="row row-cols-1 row-cols-md-3 g-4">
+      <div class="row row-cols-1 row-cols-md-3 g-4">
         <div class="col">
           <div class="card h-100 position-relative">
               <div class="card-body">

webui/src/views/Ldap.vue

@@ -26,6 +26,9 @@ useMeta(title, description, "https://mokapi.io/ldap")
         <div class="row hero-title">
           <div class="col-12 col-lg-6">
             <h1>Use Mokapi to Mock an LDAP Server</h1>
+            <div class="mb-3">
+              <span class="badge">LDAP</span>
+            </div>
             <p class="description">Simulate LDAP directories for testing and development without setting up a real LDAP server.</p>
             <p class="d-none d-md-block">
               <router-link :to="{ path: '/docs/guides' }">

webui/src/views/Smtp.vue

@@ -52,6 +52,9 @@ function hasTouchSupport() {
         <div class="row hero-title">
           <div class="col-12 col-lg-6">
             <h1>End-to-end email testing for a smooth email experience</h1>
+            <div class="mb-3">
+              <span class="badge">SMTP</span>
+            </div>
             <p class="description">Test SMTP emails safely and no risk of spamming mailboxes</p>
             <p class="d-none d-md-block">
               <router-link :to="{ path: '/docs/guides' }">