testing side bar tags

Author: jdv

crowdsec-docs/sidebarsUnversioned.js

@@ -592,7 +592,7 @@ module.exports = {
             items: [              
                 {
                     type: "category",
-                    label: "CrowdSec Console",
+                    label: "CrowdSec Console ⭐",
                     link: {
                         type: "doc",
                         id: "getting_started/post_installation/console",
@@ -601,15 +601,18 @@ module.exports = {
                         "getting_started/post_installation/console_blocklists",
                         "getting_started/post_installation/console_hub",
                     ],
+                    className: "sideBarItemRecommended" // to display tag
                 },
                 {
                     type: "doc",
                     id: "getting_started/post_installation/whitelists",
                     label: "Whitelisting IPs ⭐",
+                    className: "sideBarItemRecommended"
                 }, 
                 {
                     type: "category",
                     label: "Acquisition ⚙️",
+                    className: "sideBarItemOptional",
                     link: {
                         type: "doc",
                         id: "getting_started/post_installation/acquisition",
@@ -631,11 +634,13 @@ module.exports = {
                     type: "doc",
                     id:   "getting_started/post_installation/profiles",
                     label: "Profiles ⚙️",
+                    className: "sideBarItemOptional"
                 },
                 {
                     type: "doc",
                     id:   "getting_started/post_installation/metrics",
                     label: "Metrics ⚙️",
+                    className: "sideBarItemOptional"
                 }, 
                 {
                     type: "doc",

crowdsec-docs/src/css/custom.css

@@ -483,4 +483,27 @@ div[class^='announcementBar'] {
   border: 0!important;
 }
 
+/* Quick guide specific CSS */
+.sideBarItemRecommended::after {
+  content: "Rec.";
+  display: inline-block;
+  margin-left: 0.5em;
+  padding: 0.1em 0.5em;
+  background-color: #007bff;
+  color: white;
+  border-radius: 999px;
+  font-size: 0.6em;
+  vertical-align: middle;
+}
 
+.sideBarItemOptional::after {
+  content: "Opt.";
+  display: inline-block;
+  margin-left: 0.5em;
+  padding: 0.1em 0.5em;
+  background-color: #ffc107;
+  color: black;
+  border-radius: 999px;
+  font-size: 0.6em;
+  vertical-align: middle;
+}