Refactored card usage to remove card-layout shortcode

archetypes/landing-page.md

@@ -31,18 +31,16 @@ nd-product:
 [//]: # "One card will take full width page: two will take half width each. Three will stack like an inverse pyramid."
 [//]: # "Some examples of content could be the latest release note, the most common install path, and a popular new feature."
 
-{{<card-layout>}}
-  {{<card-section showAsCards="true" isFeaturedSection="true">}}
-    {{<card title="<some-title>">}}
-      <!-- Each description should be roughly 10 words or less. -->
-    {{</card>}}
-    <!-- The titleURL and icon are both optional -->
-    <!-- Lucide icon names can be found at https://lucide.dev/icons/ -->
-    {{<card title="<some-title>" titleUrl="<some-url>" icon="<some-lucide-icon>">}}
-      <!-- Each description should be roughly 10 words or less. -->
-    {{</card>}}
-  {{</card-section>}}
-{{</card-layout>}}
+{{<card-section  isFeaturedSection="true">}}
+  {{<card title="<some-title>">}}
+    <!-- Each description should be roughly 10 words or less. -->
+  {{</card>}}
+  <!-- The titleURL and icon are both optional -->
+  <!-- Lucide icon names can be found at https://lucide.dev/icons/ -->
+  {{<card title="<some-title>" titleUrl="<some-url>" icon="<some-lucide-icon>">}}
+    <!-- Each description should be roughly 10 words or less. -->
+  {{</card>}}
+{{</card-section>}}
 
 ## Other content 
 

content/_index.md

@@ -1,4 +1,55 @@
 ---
 title: NGINX Product Documentation
 description: Learn how to deliver, manage, and protect your applications using F5 NGINX products.
----
+---
+
+## NGINX Product Documentation 
+Learn how to deliver, manage, and protect your applications using F5 NGINX products. 
+
+{{<card-section  title="NGINX One">}}
+  {{<card title="NGINX One Console" titleUrl="/nginx-one/" brandIcon="NGINX-One-product-icon.svg" isLanding="true">}}
+    Monitor your infrastructure, address security vulnerabilities, and assess the health of your NGINX fleet, all from a single console.
+  {{</card >}}
+  {{<card title="NGINX Plus" titleUrl="/nginx/" brandIcon="NGINX-Plus-product-icon-RGB.svg" isLanding="true">}}
+    The all-in-one load balancer, reverse proxy, web server, content cache, and API gateway.
+  {{</card >}}
+  {{<card title="NGINX Instance Manager" titleUrl="/nginx-instance-manager/" brandIcon="NGINX-Instance-Manager-product-icon.svg" isLanding="true">}}
+    Track and control NGINX Open Source and NGINX Plus instances.
+  {{</card >}}
+  {{<card title="NGINX Ingress Controller" titleUrl="/nginx-ingress-controller/" brandIcon="NGINX-Ingress-Controller-product-icon.svg" isLanding="true">}}
+    Kubernetes traffic management with API gateway, identity, and observability features.
+  {{</card >}}
+  {{<card title="NGINX Gateway Fabric" titleUrl="/nginx-gateway-fabric/" brandIcon="NGINX-Gateway-Fabric-product-icon.svg" isLanding="true">}}
+    Next generation Kubernetes connectivity using the Gateway API.
+  {{</card >}}
+  {{<card title="NGINX Open Source" titleUrl="https://nginx.org/en/docs/" brandIcon="NGINX-product-icon.svg" isLanding="true">}}
+    The open source all-in-one load balancer, content cache, and web server
+  {{</card >}}
+  {{<card title="NGINX Agent" titleUrl="/nginx-agent/" brandIcon="NGINX-product-icon.svg" isLanding="true">}}
+    A daemon providing observability data and remote configuration for NGINX Open Source and NGINX Plus instances
+  {{</card >}}
+  {{<card title="Subscription Licensing & Solutions" titleUrl="/solutions/" brandIcon="NGINX-product-icon.svg" isLanding="true">}}
+    Stay compliant with your NGINX subscription licenses and see how you can use NGINX One to build secure, scalable, and high-performing applications and APIs.
+  {{</card >}}
+{{</card-section>}}
+
+{{<card-section  title="NGINX App Protect">}}
+  {{<card title="NGINX App Protect WAF" titleUrl="/nginx-app-protect-waf/" brandIcon="NGINX-App-Protect-WAF-product-icon.svg" isLanding="true">}}
+    Lightweight, high-performance, advanced protection against Layer 7 attacks on your apps and APIs
+  {{</card >}}
+  {{<card title="NGINX App Protect DoS" titleUrl="/nginx-app-protect-dos/" brandIcon="NGINX-App-Protect-DoS-product-icon.svg" isLanding="true">}}
+    Defend, adapt, and mitigate against Layer 7 denial-of-service attacks on your apps and APIs
+  {{</card >}}
+{{</card-section>}}
+
+{{<card-section  title="NGINX as a Service">}}
+  {{<card title="NGINX as a Service for Azure" titleUrl="/nginxaas/azure/" brandIcon="NGINX-for-Azure-product-icon.png" isLanding="true">}}
+    Infrastructure-as-a-Service (IaaS) version of NGINX Plus for your Microsoft Azure application stack
+  {{</card >}}
+{{</card-section>}}
+
+{{<card-section  title="More NGINX Products">}}
+  {{<card title="NGINX Unit" titleUrl="https://unit.nginx.org/" brandIcon="NGINX-product-icon.svg" isLanding="true">}}
+    Dynamic app server that can run beside NGINX, NGINX Plus, or on its own
+  {{</card >}}
+{{</card-section>}}

content/agent/_index.md

@@ -33,26 +33,22 @@ configurations, collection and reporting of real-time NGINX performance and oper
 [//]: # "One card will take full width page: two will take half width each. Three will stack like an inverse pyramid."
 [//]: # "Some examples of content could be the latest release note, the most common install path, and a popular new feature."
 
-{{<card-layout>}}
-  {{<card-section showAsCards="true" isFeaturedSection="true">}}
-    {{<card title="About" titleUrl="/nginx-agent/about" icon="info">}}
-      Learn everything you need to know about NGINX Agent
-    {{</card>}}
-    <!-- The titleURL and icon are both optional -->
-    <!-- Lucide icon names can be found at https://lucide.dev/icons/ -->
-    {{<card title="Getting started" titleUrl="/nginx-agent/installation-upgrade/getting-started" icon="unplug">}}
-      Install NGINX Agent and run a mock control plane
-    {{</card>}}
-  {{</card-section>}}
-{{</card-layout>}}
+{{<card-section  isFeaturedSection="true">}}
+  {{<card title="About" titleUrl="about/" icon="info">}}
+    Learn everything you need to know about NGINX Agent
+  {{</card>}}
+  <!-- The titleURL and icon are both optional -->
+  <!-- Lucide icon names can be found at https://lucide.dev/icons/ -->
+  {{<card title="Getting started" titleUrl="installation-upgrade/getting-started/" icon="unplug">}}
+    Install NGINX Agent and run a mock control plane
+  {{</card>}}
+{{</card-section>}}
 
-{{<card-layout>}}
-  {{<card-section showAsCards="true" isFeaturedSection="true">}}
-    {{<card title="Upgrade" titleUrl="/nginx-agent/installation-upgrade/upgrade/" icon="circle-fading-arrow-up">}}
-    {{</card>}}
-    {{<card title="Configuration" titleUrl="/nginx-agent/configuration" icon="cog">}}
-    {{</card>}}
-    {{<card title="Support" titleUrl="/nginx-agent/support" icon="hand-helping">}}
-    {{</card>}}
-  {{</card-section>}}
-{{</card-layout>}}
+{{<card-section  isFeaturedSection="true">}}
+  {{<card title="Upgrade" titleUrl="installation-upgrade/upgrade/" icon="circle-fading-arrow-up">}}
+  {{</card>}}
+  {{<card title="Configuration" titleUrl="configuration/" icon="cog">}}
+  {{</card>}}
+  {{<card title="Support" titleUrl="support/" icon="hand-helping">}}
+  {{</card>}}
+{{</card-section>}}

content/agent/installation-upgrade/container-environments/docker-images.md

@@ -77,7 +77,7 @@ git clone [email protected]:nginx/agent.git
 
 ### Download the NGINX Plus certificate and key {#myf5-download}
 
-{{< fa "circle-info" "text-muted" >}} **This step is required if you are using NGINX Plus. If you are using NGINX open source, you can skip this section.**
+{{< icon "circle-info" "text-muted" >}} **This step is required if you are using NGINX Plus. If you are using NGINX open source, you can skip this section.**
 
 In order to build a container image with NGINX Plus, you must provide the SSL certificate and private key files provided with your NGINX Plus license. These files grant access to the package repository from which the script will download the NGINX Plus package.
 
@@ -213,6 +213,3 @@ To build an image with Debian and an older version of NGINX Agent you can run th
 ```shell
 IMAGE_BUILD_TARGET=install-agent-repo NGINX_AGENT_VERSION=2.37.0~bullseye OS_RELEASE=debian OS_VERSION=bullseye-slim make image
 ```
-
-
-

content/controller/platform/access-management/manage-active-directory-auth-provider.md

@@ -80,7 +80,7 @@ Take the steps below to create a new Authentication Provider by using the NGINX
 
 ## Set up an Microsoft Entra Auth Provider {#set-up-entra}
 
-{{< fa "arrow-circle-right" >}} **Introduced in NGINX Controller ADC v3.22**
+{{< icon "arrow-circle-right" >}} **Introduced in NGINX Controller ADC v3.22**
 
 In the previous section, you selected **Microsoft Entra** from the **Authentication Provider Type** list. Next, you'll set up the Auth Provider so it can connect to Microsoft Entra.
 

content/mesh/guides/monitoring-and-tracing.md

@@ -57,8 +57,8 @@ To use NGINX Service Mesh with your Prometheus deployment:
    If you are deploying NGINX Plus Ingress Controller with the NGINX Service Mesh, add the `nginx-plus-ingress` scrape config as well.
    Consult the [Metrics]( {{< ref "/mesh/tutorials/kic/deploy-with-kic.md#nginx-plus-ingress-controller-metrics" >}} ) section of the NGINX Ingress Controller Deployment tutorial for more information about the metrics collected.
 
-   - {{< fa "download" >}} {{< link "/examples/nginx-mesh-sidecars-scrape-config.yaml" "`nginx-mesh-sidecars-scrape-config.yaml`" >}}
-   - {{< fa "download" >}} {{< link "/examples/nginx-plus-ingress-scrape-config.yaml" "`nginx-plus-ingress-scrape-config.yaml`" >}}
+   - {{< icon "download" >}} {{< link "/examples/nginx-mesh-sidecars-scrape-config.yaml" "`nginx-mesh-sidecars-scrape-config.yaml`" >}}
+   - {{< icon "download" >}} {{< link "/examples/nginx-plus-ingress-scrape-config.yaml" "`nginx-plus-ingress-scrape-config.yaml`" >}}
 
 {{< see-also >}}
 For more information on how to view and understand the metrics that we track, see our [Prometheus Metrics]({{< ref "prometheus-metrics.md" >}}) guide.

content/mesh/guides/secure-traffic-mtls.md

@@ -60,7 +60,7 @@ SPIRE uses a mechanism called "Upstream Authority" to interface with PKI systems
 In order to use a proper PKI, you must first choose one of the upstream authorities NGINX Service Mesh supports:
 
 - [disk](https://github.com/spiffe/spire/blob/v1.0.0/doc/plugin_server_upstreamauthority_disk.md): Requires certificates and private key be on disk.
-  - Template: {{< fa "download" >}} {{< link "/examples/upstream-ca/disk.yaml" "disk.yaml" >}}
+  - Template: {{< icon "download" >}} {{< link "/examples/upstream-ca/disk.yaml" "disk.yaml" >}}
 
   - The minimal configuration to successfully deploy the mesh using the `disk` upstream authority looks like this:
 
@@ -73,7 +73,7 @@ In order to use a proper PKI, you must first choose one of the upstream authorit
     ```
 
 - [aws_pca](https://github.com/spiffe/spire/blob/v1.0.0/doc/plugin_server_upstreamauthority_aws_pca.md): Uses [Amazon Certificate Manager Private Certificate Authority (ACM PCA)](https://docs.aws.amazon.com/acm-pca/latest/userguide/PcaWelcome.html) to manage certificates.
-  - Template: {{< fa "download" >}} {{< link "/examples/upstream-ca/aws_pca.yaml" "aws_pca.yaml" >}}
+  - Template: {{< icon "download" >}} {{< link "/examples/upstream-ca/aws_pca.yaml" "aws_pca.yaml" >}}
 
   - Here is the minimal configuration to deploy the mesh using the `aws_pca` upstream authority:
 
@@ -102,7 +102,7 @@ In order to use a proper PKI, you must first choose one of the upstream authorit
   {{< /note >}}
 
 - [awssecret](https://github.com/spiffe/spire/blob/v1.0.0/doc/plugin_server_upstreamauthority_awssecret.md): Loads CA credentials from AWS SecretsManager.
-  - Template: {{< fa "download" >}} {{< link "/examples/upstream-ca/awssecret.yaml" "awssecret.yaml" >}}
+  - Template: {{< icon "download" >}} {{< link "/examples/upstream-ca/awssecret.yaml" "awssecret.yaml" >}}
 
   - Here is the minimal configuration to deploy the mesh using the `awssecret` upstream authority:
 
@@ -120,10 +120,10 @@ In order to use a proper PKI, you must first choose one of the upstream authorit
   {{< /important >}}
 
 - [vault](https://github.com/spiffe/spire/blob/v0.12.3/doc/plugin_server_upstreamauthority_vault.md): Uses Vault PKI Engine to manage certificates.
-  - Template: {{< fa "download" >}} {{< link "/examples/upstream-ca/vault.yaml" "vault.yaml" >}}
+  - Template: {{< icon "download" >}} {{< link "/examples/upstream-ca/vault.yaml" "vault.yaml" >}}
 
 - [cert-manager](https://github.com/spiffe/spire/blob/v1.0.0/doc/plugin_server_upstreamauthority_cert_manager.md): Uses an instance of `cert-manager` running in Kubernetes to request intermediate signing certificates for SPIRE server.
-  - Template: {{< fa "download" >}} {{< link "/examples/upstream-ca/cert-manager.yaml" "cert-manager.yaml" >}}
+  - Template: {{< icon "download" >}} {{< link "/examples/upstream-ca/cert-manager.yaml" "cert-manager.yaml" >}}
 
   - Here is the minimal configuration to deploy the mesh using the `cert-manager` upstream authority:
 
@@ -247,7 +247,7 @@ spire-server-0      2/2     Running   0          24h
 
 We'll use the [Istio `bookinfo`](https://istio.io/docs/examples/bookinfo/) example to test that traffic is, in fact, encrypted with mTLS enabled.
 
-- {{< fa "download" >}} {{< link "/examples/bookinfo.yaml" "`bookinfo.yaml`" >}}
+- {{< icon "download" >}} {{< link "/examples/bookinfo.yaml" "`bookinfo.yaml`" >}}
 
 1. Enable [automatic sidecar injection]( {{< ref "/mesh/guides/inject-sidecar-proxy.md#automatic-proxy-injection" >}} ) for the `default` namespace.
 1. Deploy the `bookinfo` application:

content/mesh/guides/smi-traffic-policies.md

@@ -170,7 +170,7 @@ In this example, `GET` requests to the destination service from `source-1` will
 The burst of 10 and a delay of `nodelay` means that 10 excess requests over the rate will be forwarded to the destination service immediately.
 Requests from sources other than `source-1`, or requests from `source-1` that are _not_ `GET` requests, will not be rate limited.
 
-> You can download the schema for the RateLimit CRD here: {{< fa "download" >}} [`rate-limit-schema.yaml`](https://github.com/nginxinc/nginx-service-mesh/blob/main/helm-chart/crds/ratelimit.yaml)
+> You can download the schema for the RateLimit CRD here: {{< icon "download" >}} [`rate-limit-schema.yaml`](https://github.com/nginxinc/nginx-service-mesh/blob/main/helm-chart/crds/ratelimit.yaml)
 
 The rate limit spec contains the following fields:
 

content/mesh/reference/api-usage.md

@@ -22,7 +22,7 @@ kubectl edit meshconfig nginx-mesh-config -n nginx-mesh
 
 This will open your default text editor to make changes. To see the configurable fields, download the custom resource definition:
 
-{{< fa "download" >}} [`meshconfig-schema.yaml`](https://github.com/nginxinc/nginx-service-mesh/blob/main/helm-chart/crds/meshconfig.yaml)
+{{< icon "download" >}} [`meshconfig-schema.yaml`](https://github.com/nginxinc/nginx-service-mesh/blob/main/helm-chart/crds/meshconfig.yaml)
 
 {{< warning >}}
 If the `meshconfig` resource is deleted, or the `spec.meshConfigClassName` field is removed or changed, then the global mesh configuration cannot be updated, and unexpected behavior may occur.

content/mesh/tutorials/accesscontrol-walkthrough.md

@@ -19,10 +19,10 @@ The access control mode can be [set to `deny` at the global level]( {{< ref "/me
 1. Enable [automatic sidecar injection]( {{< ref "/mesh/guides/inject-sidecar-proxy.md#automatic-proxy-injection" >}} ) for the `default` namespace.
 1. Download all of the example files:
 
-    - {{< fa "download" >}} {{< link "/examples/dest-svc.yaml" >}}
-    - {{< fa "download" >}} {{< link "/examples/access.yaml" >}}
-    - {{< fa "download" >}} {{< link "/examples/driver-allowed.yaml" >}}
-    - {{< fa "download" >}} {{< link "/examples/driver-disallowed.yaml" >}}
+    - {{< icon "download" >}} {{< link "/examples/dest-svc.yaml" >}}
+    - {{< icon "download" >}} {{< link "/examples/access.yaml" >}}
+    - {{< icon "download" >}} {{< link "/examples/driver-allowed.yaml" >}}
+    - {{< icon "download" >}} {{< link "/examples/driver-disallowed.yaml" >}}
 
 ## Objectives
 
@@ -352,7 +352,7 @@ Traffic can be filtered via sets that are classified via ServiceAccounts. But [T
 For exact matches, be sure to use regular expression anchors. To exactly match the header value `hello`, be sure to use `^hello$`; otherwise, additional headers that contain the sequence `hello` will be allowed.
   {{< /tip>}}
 {{< tip>}}
-For an expanded example showing configuration for an application using a headless service, checkout our example for clustered application traffic policies {{< fa "download" >}} {{< link "/examples/clustered-application.yaml" >}}
+For an expanded example showing configuration for an application using a headless service, checkout our example for clustered application traffic policies {{< icon "download" >}} {{< link "/examples/clustered-application.yaml" >}}
 {{< /tip>}}
 
 ## Resources

content/mesh/tutorials/deploy-example-app.md

@@ -14,7 +14,7 @@ type:
 
 In this tutorial, we will use the `bookinfo` example app Deployment.
 
-- {{< fa "download" >}} {{< link "examples/bookinfo.yaml" "examples/bookinfo.yaml" >}}
+- {{< icon "download" >}} {{< link "examples/bookinfo.yaml" "examples/bookinfo.yaml" >}}
 
 {{< note >}}
 Notice in the above yaml: