chore: add badge to differentiate scaler types (#1432)

kedacore · Aug 7, 2024 · 03a85e5 · 03a85e5
1 parent ecb20bb
commit 03a85e5
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 0 deletions.
diff --git a/assets/sass/style.sass b/assets/sass/style.sass
@@ -264,6 +264,13 @@ hr
 .section 
 	padding: 4rem 1.5rem
 
+.badge
+  border: 1px solid #dbdbdb
+  border-radius: 20px
+  padding: 3px 6px
+  color: blue
+  font-size: 1rem
+
 .copyBtn 
   padding: 10px
   background: none

diff --git a/layouts/partials/javascript.html b/layouts/partials/javascript.html
@@ -258,10 +258,14 @@
           results.forEach(function (result) {
             const doc = parse[result.ref];
             const element = template.content.cloneNode(true);
+              element.querySelector(".badge").textContent = doc.type;
               element.querySelector(".scaler-title").textContent = doc.title;
               element
                 .querySelector(".scaler-title")
                 .setAttribute("href", doc.href);
+              doc.type === 'external' &&
+              (element.querySelector(".badge").style.color =
+                'purple');
               doc.description &&
                 (element.querySelector(".description").textContent =
                   doc.description);

diff --git a/layouts/partials/scaler-template.html b/layouts/partials/scaler-template.html
@@ -2,6 +2,7 @@
   <div class="column is-half">
     <div class="card">
       <div class="card-content">
+        <p class="badge is-pulled-right"></p>
         <a
           class="title is-size-4 is-size-5-mobile has-text-primary has-text-weight-bold scaler-title"
         >