add custom zilla-plus icon

# Conflicts: # src/how-tos/amazon-msk/development.md
aklivity · Nov 8, 2023 · 6493f01 · 6493f01
1 parent 78f4cf4
commit 6493f01
Show file tree

Hide file tree

Showing 16 changed files with 54 additions and 34 deletions.
diff --git a/src/.vuepress/navbar/en.ts b/src/.vuepress/navbar/en.ts
@@ -5,13 +5,14 @@ import versions from "../versions.json" assert { type: "json" };
 const versionLinks = <{ text: string; link: string }[]>(
   versions.map((o) => ({
     text: o.text,
+    icon: o.icon,
     link: o.key ? `${hostnameSEO}/${siteBase}/${o.key}` : o.link,
   }))
 );
 
 export const enNavbar = navbar([
-  { text: "Get Started", icon: "play", link: "/tutorials/quickstart/kafka-proxies.md" },
-  { text: "Reference", icon: "book", link: "/reference/config/overview.md" },
-  { text: "version", icon: "list-ol", children: versionLinks },
-  { text: "aklivity", icon: "globe", link: "https://www.aklivity.io/" },
+  { text: "Get Started", icon: "fas fa-play", link: "/tutorials/quickstart/kafka-proxies.md" },
+  { text: "Reference", icon: "fas fa-book", link: "/reference/config/overview.md" },
+  { text: "version", icon: "fas fa-list-ol", children: versionLinks },
+  { text: "aklivity", icon: "fas fa-globe", link: "https://www.aklivity.io/" },
 ]);
diff --git a/src/.vuepress/sidebar/en.ts b/src/.vuepress/sidebar/en.ts
@@ -221,12 +221,13 @@ export const enSidebar = sidebar({
         {
           text: "Amazon MSK Pubic Proxy",
           collapsible: true,
-          icon: "plus",
+          icon: "aky-zilla-plus",
           prefix: "how-tos/amazon-msk/",
           link: "how-tos/amazon-msk/public-proxy.md",
           children: [
             {
               text: "Overview",
+              icon: "aky-zilla-plus",
               link: "public-proxy.md",
             },
             "development.md",
@@ -236,7 +237,7 @@ export const enSidebar = sidebar({
         },
         {
           text: "Amazon MSK Private Proxy",
-          icon: "plus",
+          icon: "aky-zilla-plus",
           link: "how-tos/amazon-msk/private-proxy.md",
         },
       ],

diff --git a/src/.vuepress/styles/index.scss b/src/.vuepress/styles/index.scss
@@ -77,7 +77,14 @@ table.no-head {
     span.icon {
         order: 2;
         margin-left: auto;
-        color: var(--theme-color);
+    }
+}
+.vp-catalog-title {
+    display: flex !important;
+    flex-direction: row;
+    span.icon {
+        order: 2;
+        margin-left: .2em;
     }
 }
 // Zilla plus container styles
@@ -126,3 +133,14 @@ table.no-head {
         display: none;
     }
 }
+
+
+// === ICONS ===
+.aky-zilla-plus {
+    &::after {
+        content: url('data:image/svg+xml,<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 94 94"><defs><style>.cls-1{fill:url(%23linear-gradient);}</style><linearGradient id="linear-gradient" x1="0.5" y1="47.5" x2="94.5" y2="47.5" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="%235a7cd9"/><stop offset="0.28" stop-color="%234799c9"/><stop offset="0.76" stop-color="%2329c4b0"/><stop offset="1" stop-color="%231ed5a7"/></linearGradient></defs><title>zilla-plus-icon</title><g id="Rounded_Plus" data-name="Rounded Plus"><path class="cls-1" d="M94.5,35.83V59.17a4.23,4.23,0,0,1-4.23,4.23H63.4V90.27a4.23,4.23,0,0,1-4.23,4.23H35.83a4.23,4.23,0,0,1-4.23-4.23V63.4H4.73A4.23,4.23,0,0,1,.5,59.17V35.83A4.23,4.23,0,0,1,4.73,31.6H31.6V4.73A4.23,4.23,0,0,1,35.83.5H59.17A4.23,4.23,0,0,1,63.4,4.73V31.6H90.27A4.23,4.23,0,0,1,94.5,35.83Z" transform="translate(-0.5 -0.5)"/></g></svg>');
+        display: inline-block;
+        height: .8em;
+        width: .8em;
+    }
+}
diff --git a/src/.vuepress/theme.ts b/src/.vuepress/theme.ts
@@ -7,7 +7,7 @@ export default hopeTheme({
   hostname: hostnameSEO,
   logo: "/logo.png",
   logoDark: "/logo-dark.png",
-  iconAssets: "fontawesome-with-brands",
+  iconAssets: ["fontawesome-with-brands"],
   favicon: "favicon.ico",
 
   repo: "aklivity/zilla",

diff --git a/src/.vuepress/versions.json b/src/.vuepress/versions.json
@@ -1,5 +1,5 @@
 [
-    { "text": "Roadmap", "icon": "bars-progress", "link": "https://github.com/orgs/aklivity/projects/4" },
-    { "text": "Changelog", "icon": "tag", "link": "https://github.com/aklivity/zilla/releases" },
-    { "text": "@next", "key": "next" }
+    { "text": "Roadmap", "icon": "fas fa-bars-progress", "link": "https://github.com/orgs/aklivity/projects/4" },
+    { "text": "Changelog", "icon": "fas fa-tag", "link": "https://github.com/aklivity/zilla/releases" },
+    { "text": "@next", "icon": "fas fa-circle-right", "key": "next" }
 ]
diff --git a/src/README.md b/src/README.md
@@ -1,6 +1,6 @@
 ---
 home: true
-icon: home
+icon: fas fa-home
 title: Home
 heroImage: /zilla-rings.webp
 heroImageDark: /zilla-rings.webp
@@ -17,22 +17,22 @@ actions:
 features:
 
   - title: Get Started
-    icon: play
+    icon: fas fa-play
     details: Install Zilla, connect it to your Kafka Cluster, and define your first API endpoints.
     link: /how-tos/install.html
 
   - title: Todo App Example
-    icon: diagram-project
+    icon: fas fa-diagram-project
     details: Create a Todo application using a CQRS design pattern that's backed by Apache Kafka and Zilla.
     link: /tutorials/todo-app/build.html
 
   - title: Kafka Proxies
-    icon: arrows-left-right-to-line
+    icon: fas fa-arrows-left-right-to-line
     details: Define REST, SSE, gRPC and MQTT endpoints that map to Kafka topic streams.
     link: /concepts/kafka-proxies/rest-proxy.html
 
   - title: Reference
-    icon: book
+    icon: fas fa-book
     details: Learn about Zilla command and configuration properties.
     link: /reference/config/overview.html
 

diff --git a/src/concepts/kafka-proxies/mqtt-proxy.md b/src/concepts/kafka-proxies/mqtt-proxy.md
@@ -34,7 +34,7 @@ mqtt_kafka_proxy:
 
 The Zilla MQTT `server` supports the [MQTT v5.0 Specification].
 
-::: info Feature Coming Soon <HopeIcon icon="circle-right"/>
+::: info Feature Coming Soon <HopeIcon icon="fas fa-circle-right"/>
 [MQTT v3.1.1 Specification] support is currently on the [Zilla roadmap]. Star and watch the [Zilla repo] for new releases!
 :::
 
@@ -47,7 +47,7 @@ The Zilla MQTT `server` supports the [MQTT v5.0 Specification].
 
 The Zilla MQTT `server` supports the "At most once (QoS 0)" Quality of Service flag.
 
-::: info Feature Coming Soon <HopeIcon icon="circle-right"/>
+::: info Feature Coming Soon <HopeIcon icon="fas fa-circle-right"/>
 At least once (QoS 1) and Exactly once (QoS 2) delivery support is currently on the [Zilla roadmap]. Star and watch the [Zilla repo] for new releases!
 :::
 

diff --git a/src/how-tos/amazon-msk/development.md b/src/how-tos/amazon-msk/development.md
@@ -1,11 +1,11 @@
 ---
-icon: plus
+icon: aky-zilla-plus
 description: Setup connectivity to your MSK cluster via the internet from your local development environment.
 ---
 
 # Development
 
-[Zilla Plus](https://www.aklivity.io/products/zilla-plus)
+[Available in Zilla Plus<sup>+</sup>](https://www.aklivity.io/products/zilla-plus)
 {.zilla-plus-badge .hint-container .info}
 
 ::: tip Estimated time to complete 20-30 minutes.

diff --git a/src/how-tos/amazon-msk/private-proxy.md b/src/how-tos/amazon-msk/private-proxy.md
@@ -1,11 +1,11 @@
 ---
-icon: plus
+icon: aky-zilla-plus
 description: Securely access an Amazon MSK cluster across VPCs via AWS PrivateLink.
 ---
 
 # Private MSK Proxy
 
-[Zilla Plus](https://www.aklivity.io/products/zilla-plus)
+[Available in Zilla Plus<sup>+</sup>](https://www.aklivity.io/products/zilla-plus)
 {.zilla-plus-badge .hint-container .info}
 
 ::: tip Estimated time to complete 20-30 minutes.

diff --git a/src/how-tos/amazon-msk/production-mutual-trust.md b/src/how-tos/amazon-msk/production-mutual-trust.md
@@ -1,11 +1,11 @@
 ---
-icon: plus
+icon: aky-zilla-plus
 description: Setup mutual authentication to your MSK cluster from anywhere on the internet.
 ---
 
 # Production (Mutual Trust)
 
-[Zilla Plus](https://www.aklivity.io/products/zilla-plus)
+[Available in Zilla Plus<sup>+</sup>](https://www.aklivity.io/products/zilla-plus)
 {.zilla-plus-badge .hint-container .info}
 
 ::: tip Estimated time to complete 20-30 minutes.

diff --git a/src/how-tos/amazon-msk/production.md b/src/how-tos/amazon-msk/production.md
@@ -1,11 +1,11 @@
 ---
-icon: plus
+icon: aky-zilla-plus
 description: Setup connectivity to your MSK cluster from anywhere on the internet.
 ---
 
 # Production
 
-[Zilla Plus](https://www.aklivity.io/products/zilla-plus)
+[Available in Zilla Plus<sup>+</sup>](https://www.aklivity.io/products/zilla-plus)
 {.zilla-plus-badge .hint-container .info}
 
 ::: tip Estimated time to complete 20-30 minutes.

diff --git a/src/how-tos/amazon-msk/public-proxy.md b/src/how-tos/amazon-msk/public-proxy.md
@@ -1,11 +1,11 @@
 ---
-icon: plus
+icon: aky-zilla-plus
 description: Securely access your Amazon MSK cluster via the internet.
 ---
 
 # Public MSK Proxy
 
-[Zilla Plus](https://www.aklivity.io/products/zilla-plus)
+[Available in Zilla Plus<sup>+</sup>](https://www.aklivity.io/products/zilla-plus)
 {.zilla-plus-badge .hint-container .info}
 
 ::: tip Estimated time to complete 20-30 minutes.

diff --git a/src/reference/config/bindings/binding-amqp.md b/src/reference/config/bindings/binding-amqp.md
@@ -9,7 +9,7 @@ tag:
 
 # amqp Binding
 
-::: info Feature Coming Soon <HopeIcon icon="circle-right"/>
+::: info Feature Coming Soon <HopeIcon icon="fas fa-circle-right"/>
 This is currently on the [Zilla roadmap](https://github.com/orgs/aklivity/projects/4). Star and watch the [Zilla repo](https://github.com/aklivity/zilla/releases) for new releases!
 :::
 

diff --git a/src/reference/config/bindings/binding-kafka-proxy.md b/src/reference/config/bindings/binding-kafka-proxy.md
@@ -1,7 +1,7 @@
 ---
 shortTitle: kafka-proxy 
 description: Zilla runtime kafka-proxy binding
-icon: plus
+icon: aky-zilla-plus
 category:
   - Binding
 tag:
@@ -10,7 +10,7 @@ tag:
 
 # kafka-proxy Binding
 
-[Zilla Plus](https://www.aklivity.io/products/zilla-plus)
+[Available in Zilla Plus<sup>+</sup>](https://www.aklivity.io/products/zilla-plus)
 {.zilla-plus-badge .hint-container .info}
 
 Zilla runtime kafka-proxy binding.

diff --git a/src/reference/config/vaults/vault-aws.md b/src/reference/config/vaults/vault-aws.md
@@ -1,7 +1,7 @@
 ---
 shortTitle: aws
 description: Zilla runtime aws vault
-icon: plus
+icon: aky-zilla-plus
 category:
   - Vault
 ---

diff --git a/src/reference/config/zilla-cli.md b/src/reference/config/zilla-cli.md
@@ -30,7 +30,7 @@ The Zilla Runtime command line interface uses the [Zilla Runtime Configuration](
 
 ### zilla generate
 
-::: info Feature Coming Soon <HopeIcon icon="circle-right"/>
+::: info Feature Coming Soon <HopeIcon icon="fas fa-circle-right"/>
 This is currently on the [Zilla roadmap](https://github.com/orgs/aklivity/projects/4). Star and watch the [Zilla repo](https://github.com/aklivity/zilla/releases) for new releases!
 :::
 
@@ -170,7 +170,7 @@ zilla stop
 
 ### zilla tune
 
-::: info Feature Coming Soon <HopeIcon icon="circle-right"/>
+::: info Feature Coming Soon <HopeIcon icon="fas fa-circle-right"/>
 This is currently on the [Zilla roadmap](https://github.com/orgs/aklivity/projects/4). Star and watch the [Zilla repo](https://github.com/aklivity/zilla/releases) for new releases!
 :::