Bubble shortcode QOL changes

Author: cmilesb

content/operate/_index.md

@@ -5,20 +5,20 @@ linkTitle: Operate
 hideListLinks: true
 ---
 
-| {{<color-bubble "#80DBFF">}} Redis Cloud | {{<color-bubble "#DCFF1E">}} Redis Software |
+| {{<color-bubble color="bg-blue-bubble">}} Redis Cloud | {{<color-bubble color="bg-yellow-bubble">}} Redis Software |
 |:-----------|:--------------|
 | <ul><li> [Get started with Redis Cloud]({{< relref "/operate/rc/rc-quickstart" >}}) </li><li> [Create a database]({{< relref "/operate/rc/databases/create-database" >}}) </li><li> [Connect to your database]({{< relref "/operate/rc/databases/connect" >}}) </li><li>[REST API]({{< relref "/operate/rc/api/" >}})</li></ul> | <ul><li> [Install Redis Software]({{< relref "/operate/rs/installing-upgrading" >}}) </li><li> [Set up a new cluster]({{< relref "/operate/rs/clusters/new-cluster-setup" >}}) </li><li> [Create a database]({{< relref "/operate/rs/databases/create" >}}) </li><li> [Connect to your database]({{< relref "/operate/rs/databases/connect" >}}) </li><li>[REST API]({{< relref "/operate/rs/references/rest-api/" >}})</li></ul> |
-| {{<color-bubble "#C795E3">}} **Redis Community Edition** | {{<color-bubble "#8A99A0">}} **Redis for Kubernetes** |
+| {{<color-bubble color="bg-purple-bubble">}} **Redis Community Edition** | {{<color-bubble color="bg-gray-bubble">}} **Redis for Kubernetes** |
 | <ul><li> [Install Redis community edition]({{< relref "/operate/oss_and_stack/install/install-redis" >}}) </li><li> [Install Redis Stack]({{< relref "/operate/oss_and_stack/install/install-stack" >}}) </li><li> [Manage Redis]({{< relref "/operate/oss_and_stack/management" >}}) </li></ul> | <ul><li> [Deploy Redis for Kubernetes]({{< relref "/operate/kubernetes/deployment" >}}) </li><li> [Architecture]({{< relref "/operate/kubernetes/architecture" >}}) </li><li> [API Reference]({{< relref "/operate/kubernetes/reference" >}}) </li></ul> |
-| {{<color-bubble "#FD4439">}} **Redis Insight** | |
+| {{<color-bubble color="bg-red-bubble">}} **Redis Insight** | |
 | <ul><li> [Install Redis Insight]({{< relref "/operate/redisinsight/install" >}}) </li><li> [Use Redis Insight]({{< relref "/develop/tools/insight" >}}) </li></ul> | |
 
 ## Product features
 
 ### High availability and durability
 
 <!-- | Feature | RC        | RS         | CE       | K8s          | -->
-| | <nobr>{{<color-bubble "#80DBFF">}} Redis</nobr> Cloud | <nobr>{{<color-bubble "#DCFF1E">}} Redis</nobr> Software | <nobr>{{<color-bubble "#C795E3">}} Redis</nobr> Community Edition | <nobr>{{<color-bubble "#8A99A0">}} Redis for</nobr> Kubernetes |
+| | <nobr>{{<color-bubble color="bg-blue-bubble">}} Redis</nobr> Cloud | <nobr>{{<color-bubble color="bg-yellow-bubble">}} Redis</nobr> Software | <nobr>{{<color-bubble color="bg-purple-bubble">}} Redis</nobr> Community Edition | <nobr>{{<color-bubble color="bg-gray-bubble">}} Redis for</nobr> Kubernetes |
 |:-----------|:--------------|:-----------|:--------------|:--------------|
 | Clustering | [Clustering]({{< relref "/operate/rc/databases/configuration/clustering" >}}) | [Clustering]({{<relref "/operate/rs/databases/durability-ha/clustering">}}) | [Scale with Redis Cluster]({{< relref "/operate/oss_and_stack/management/scaling" >}}) | [Redis Enterprise clusters (REC)]({{<relref "/operate/kubernetes/re-clusters">}}) |
 | Replication | [Replication]({{< relref "/operate/rc/databases/configuration/high-availability" >}}) | [Replication]({{<relref "/operate/rs/databases/durability-ha/replication">}}) | [Replication]({{< relref "/operate/oss_and_stack/management/replication" >}}) | [Create replica databases]({{<relref "/operate/kubernetes/re-databases/replica-redb/">}})|
@@ -32,7 +32,7 @@ hideListLinks: true
 ### Logging and monitoring
 
 <!-- | Feature | RC        | RS         | CE       | K8s          | -->
-| | <nobr>{{<color-bubble "#80DBFF">}} Redis</nobr> Cloud | <nobr>{{<color-bubble "#DCFF1E">}} Redis</nobr> Software | <nobr>{{<color-bubble "#C795E3">}} Redis</nobr> Community Edition | <nobr>{{<color-bubble "#8A99A0">}} Redis for</nobr> Kubernetes |
+| | <nobr>{{<color-bubble color="bg-blue-bubble">}} Redis</nobr> Cloud | <nobr>{{<color-bubble color="bg-yellow-bubble">}} Redis</nobr> Software | <nobr>{{<color-bubble color="bg-purple-bubble">}} Redis</nobr> Community Edition | <nobr>{{<color-bubble color="bg-gray-bubble">}} Redis for</nobr> Kubernetes |
 |:-----------|:--------------|:-----------|:--------------|:--------------|
 | Monitoring | [Monitor performance]({{< relref "/operate/rc/databases/monitor-performance" >}}) | [Monitoring]({{<relref "/operate/rs/monitoring">}}) | [INFO]({{< relref "/commands/info" >}}), [MONITOR]({{< relref "/commands/monitor" >}}), and [LATENCY DOCTOR]({{< relref "/commands/latency-doctor" >}})<br/>[Analysis with Redis Insight]({{< relref "/develop/tools/insight#database-analysis" >}}) | [Export metrics to Prometheus]({{<relref "/operate/kubernetes/re-clusters/connect-prometheus-operator/">}}) |
 | Logging | [System logs]({{< relref "/operate/rc/logs-reports/system-logs" >}}) | [Logging]({{<relref "/operate/rs/clusters/logging">}}) | `/var/log/redis/redis.log`<br/>[SLOWLOG]({{< relref "/commands/slowlog" >}})<br/>[Keyspace notifications]({{< relref "/develop/use/keyspace-notifications" >}}) | [Logs]({{<relref "/operate/kubernetes/logs/">}}) |
@@ -42,7 +42,7 @@ hideListLinks: true
 ### Security
 
 <!-- | Feature | RC        | RS         | CE       | K8s          | -->
-| | <nobr>{{<color-bubble "#80DBFF">}} Redis</nobr> Cloud | <nobr>{{<color-bubble "#DCFF1E">}} Redis</nobr> Software | <nobr>{{<color-bubble "#C795E3">}} Redis</nobr> Community Edition | <nobr>{{<color-bubble "#8A99A0">}} Redis for</nobr> Kubernetes |
+| | <nobr>{{<color-bubble color="bg-blue-bubble" >}} Redis</nobr> Cloud | <nobr>{{<color-bubble color="bg-yellow-bubble">}} Redis</nobr> Software | <nobr>{{<color-bubble color="bg-purple-bubble">}} Redis</nobr> Community Edition | <nobr><div class="h-3 w-3 rounded-md border border-redis-pen-600 inline-block mr-1" style="background-color: #8A99A0"></div> Redis for</nobr> Kubernetes |
 |:-----------|:--------------|:-----------|:--------------|:--------------|
 | Transport Layer Security (TLS) | [TLS]({{<relref "/operate/rc/security/database-security/tls-ssl">}}) | [TLS]({{<relref "/operate/rs/security/encryption/tls">}}) | [TLS]({{< relref "/operate/oss_and_stack/management/security/encryption" >}}) | [REDB tlsMode]({{<relref "https://redis.io/docs/latest/operate/kubernetes/reference/redis_enterprise_database_api/#spec">}}) |
 | Role-based access control (RBAC) | [Role-based access control]({{<relref "/operate/rc/security/access-control/data-access-control/role-based-access-control">}}) | [Access control]({{<relref "/operate/rs/security/access-control">}}) | [Access control list]({{< relref "/operate/oss_and_stack/management/security/acl" >}}) | [REC credentials]({{<relref "/operate/kubernetes/security/manage-rec-credentials/">}}) |

layouts/shortcodes/color-bubble.html

@@ -1 +1,2 @@
-<div class="h-3 w-3 rounded-md border border-redis-pen-600 inline-block mr-1" style="background-color: {{ .Get 0 }}"></div>
+{{- $bgClass := .Get "color" -}}
+<div class="h-3 w-3 rounded-md border border-redis-pen-600 inline-block mr-1 {{ $bgClass }}"></div>

tailwind.config.js

@@ -61,7 +61,12 @@ module.exports = {
 					200: '#F9F9F9',
 					600: '#bfc2c4',
 					800: '#4E545B'
-				}
+				},
+				'blue-bubble': '#80DBFF',
+        		'yellow-bubble': '#DCFF1E',
+        		'purple-bubble': '#C795E3',
+        		'gray-bubble': '#8A99A0',
+        		'red-bubble': '#FD4439'
 			},
       typography: (theme) => (  {
         DEFAULT: {