Merge pull request #1603 from vmware-tanzu/site/sidebar/reorganize

Website docs page sidebar reorganization and restyle

site/content/docs/_index.md

@@ -33,6 +33,16 @@ or [join the Pinniped community]({{< ref "/community" >}}).
 
 {{< docsmenu "howtos" >}}
 
+
+## Concierge Configuration
+
+{{< docsmenu "howto-configure-concierge" >}}
+
+
+## Supervisor Configuration
+
+{{< docsmenu "howto-configure-supervisor" >}}
+
 ## Reference
 
 {{< docsmenu "reference" >}}

site/content/docs/howto/concierge/_index.md

@@ -0,0 +1,14 @@
+---
+title: How-to Guides for Configuring Concierge
+cascade:
+  layout: docs
+menu:
+  docs:
+    name: Concierge Configuration
+    identifier: howto-configure-concierge
+    weight: 60
+---
+
+These how-to guides show how to configure the Pinniped Concierge after it has been installed:
+
+{{< docsmenu "howto-configure-concierge" >}}

site/content/docs/howto/concierge/configure-concierge-jwt.md

@@ -5,9 +5,11 @@ cascade:
   layout: docs
 menu:
   docs:
-    name: Configure Concierge JWT Authentication
+    name: JWT Authentication
     weight: 30
-    parent: howtos
+    parent: howto-configure-concierge
+aliases:
+  - /docs/howto/configure-concierge-jwt/
 ---
 The Concierge can validate [JSON Web Tokens (JWTs)](https://tools.ietf.org/html/rfc7519), which are commonly issued by [OpenID Connect (OIDC)](https://openid.net/connect/) identity providers.
 

site/content/docs/howto/concierge/configure-concierge-supervisor-jwt.md

@@ -5,9 +5,11 @@ cascade:
   layout: docs
 menu:
   docs:
-    name: Configure Concierge JWT Authentication with the Supervisor
+    name: JWT Authentication with Supervisor
-    weight: 50
+    weight: 40
-    parent: howtos
+    parent: howto-configure-concierge
+aliases:
+  - /docs/howto/configure-concierge-supervisor-jwt/
 ---
 The Concierge can validate [JSON Web Tokens (JWTs)](https://tools.ietf.org/html/rfc7519), which are commonly issued by [OpenID Connect (OIDC)](https://openid.net/connect/) identity providers.
 

site/content/docs/howto/concierge/configure-concierge-webhook.md

@@ -5,9 +5,11 @@ cascade:
   layout: docs
 menu:
   docs:
-    name: Configure Concierge Webhook Authentication
+    name: Webhook Authentication
-    weight: 40
+    weight: 50
-    parent: howtos
+    parent: howto-configure-concierge
+aliases:
+  - /docs/howto/configure-concierge-webhook/
 ---
 
 The Concierge can validate arbitrary tokens via an external webhook endpoint using the [same validation process as Kubernetes itself](https://kubernetes.io/docs/reference/access-authn-authz/authentication/#webhook-token-authentication).

site/content/docs/howto/supervisor/_index.md

@@ -0,0 +1,14 @@
+---
+title: How-to Guides for Configuring IDPs
+cascade:
+  layout: docs
+menu:
+  docs:
+    name: Supervisor Configuration
+    identifier: howto-configure-supervisor
+    weight: 60
+---
+
+These how-to guides show you how to install and configure the Pinniped Supervisor with specific identity providers:
+
+{{< docsmenu "howto-configure-supervisor" >}}

site/content/docs/howto/supervisor/configure-supervisor-with-activedirectory.md

@@ -5,9 +5,11 @@ cascade:
   layout: docs
 menu:
   docs:
-    name: Configure Supervisor With Active Directory
+    name: With Active Directory
-    weight: 110
+    weight: 150
-    parent: howtos
+    parent: howto-configure-supervisor
+aliases:
+  - /docs/howto/configure-supervisor-with-activedirectory/
 ---
 The Supervisor is an [OpenID Connect (OIDC)](https://openid.net/connect/) issuer that supports connecting a single
 "upstream" identity provider to many "downstream" cluster clients.
@@ -28,7 +30,7 @@ Create an [ActiveDirectoryIdentityProvider](https://github.com/vmware-tanzu/pinn
 
 This ActiveDirectoryIdentityProvider uses all the default configuration options.
 The default configuration options are documented in the
-[Active Directory configuration reference]({{< ref "../reference/active-directory-configuration">}}).
+[Active Directory configuration reference]({{< ref "../../reference/active-directory-configuration">}}).
 
 ```yaml
 apiVersion: idp.supervisor.pinniped.dev/v1alpha1
@@ -160,7 +162,7 @@ spec:
 ```
 
 More information about the defaults for these configuration options can be found in
-the [Active Directory configuration reference]({{< ref "../reference/active-directory-configuration">}}).
+the [Active Directory configuration reference]({{< ref "../../reference/active-directory-configuration">}}).
 
 ## Next steps
 

site/content/docs/howto/supervisor/configure-supervisor-with-auth0.md

@@ -5,9 +5,11 @@ cascade:
   layout: docs
 menu:
   docs:
-    name: Configure Supervisor With Auth0 OIDC
+    name: With Auth0 OIDC
     weight: 80
-    parent: howtos
+    parent: howto-configure-supervisor
+aliases:
+   - /docs/howto/configure-supervisor-with-auth0/
 ---
 The Supervisor is an [OpenID Connect (OIDC)](https://openid.net/connect/) issuer that supports connecting a single
 "upstream" identity provider to many "downstream" cluster clients.

site/content/docs/howto/supervisor/configure-supervisor-with-dex.md

@@ -5,9 +5,11 @@ cascade:
   layout: docs
 menu:
   docs:
-    name: Configure Supervisor With Dex OIDC
+    name: With Dex OIDC
     weight: 80
-    parent: howtos
+    parent: howto-configure-supervisor
+aliases:
+  - /docs/howto/configure-supervisor-with-dex/
 ---
 
 The Supervisor is an [OpenID Connect (OIDC)](https://openid.net/connect/) issuer that supports connecting a single

site/content/docs/howto/supervisor/configure-supervisor-with-gitlab.md

@@ -5,9 +5,11 @@ cascade:
   layout: docs
 menu:
   docs:
-    name: Configure Supervisor With GitLab OIDC
+    name: With GitLab OIDC
     weight: 90
-    parent: howtos
+    parent: howto-configure-supervisor
+aliases:
+   - /docs/howto/configure-supervisor-with-gitlab/
 ---
 The Supervisor is an [OpenID Connect (OIDC)](https://openid.net/connect/) issuer that supports connecting a single
 "upstream" identity provider to many "downstream" cluster clients.

site/content/docs/howto/supervisor/configure-supervisor-with-jumpcloudldap.md

@@ -5,9 +5,11 @@ cascade:
   layout: docs
 menu:
   docs:
-    name: Configure Supervisor With JumpCloud LDAP
+    name: With JumpCloud LDAP
     weight: 110
-    parent: howtos
+    parent: howto-configure-supervisor
+aliases:
+   - /docs/howto/configure-supervisor-with-jumpcloudldap/
 ---
 The Supervisor is an [OpenID Connect (OIDC)](https://openid.net/connect/) issuer that supports connecting a single
 "upstream" identity provider to many "downstream" cluster clients.

site/content/docs/howto/supervisor/configure-supervisor-with-okta.md

@@ -5,9 +5,11 @@ cascade:
   layout: docs
 menu:
   docs:
-    name: Configure Supervisor With Okta OIDC
+    name: With Okta OIDC
     weight: 80
-    parent: howtos
+    parent: howto-configure-supervisor
+aliases:
+   - /docs/howto/configure-supervisor-with-okta/
 ---
 The Supervisor is an [OpenID Connect (OIDC)](https://openid.net/connect/) issuer that supports connecting a single
 "upstream" identity provider to many "downstream" cluster clients.

site/content/docs/howto/supervisor/configure-supervisor-with-openldap.md

@@ -5,9 +5,11 @@ cascade:
   layout: docs
 menu:
   docs:
-    name: Configure Supervisor With OpenLDAP
+    name: With OpenLDAP
     weight: 100
-    parent: howtos
+    parent: howto-configure-supervisor
+aliases: 
+  - /docs/howto/configure-supervisor-with-openldap/
 ---
 The Supervisor is an [OpenID Connect (OIDC)](https://openid.net/connect/) issuer that supports connecting a single
 "upstream" identity provider to many "downstream" cluster clients.

site/content/docs/howto/supervisor/configure-supervisor-with-workspace_one_access.md

@@ -5,9 +5,11 @@ cascade:
   layout: docs
 menu:
   docs:
-    name: Configure Supervisor With Workspace ONE Access
+    name: With Workspace ONE Access
     weight: 80
-    parent: howtos
+    parent: howto-configure-supervisor
+aliases:
+   - /docs/howto/configure-supervisor-with-workspace_one_access/
 ---
 The Supervisor is an [OpenID Connect (OIDC)](https://openid.net/connect/) issuer that supports connecting a single
 "upstream" identity provider to many "downstream" cluster clients.

site/content/docs/howto/supervisor/configure-supervisor.md

@@ -5,9 +5,11 @@ cascade:
   layout: docs
 menu:
   docs:
-    name: Configure Supervisor as an OIDC Issuer
+    name: As an OIDC Issuer
-    weight: 70
+    weight: 10
-    parent: howtos
+    parent: howto-configure-supervisor
+aliases:
+  - /docs/howto/configure-supervisor/
 ---
 
 The Supervisor is an [OpenID Connect (OIDC)](https://openid.net/connect/) issuer that supports connecting a single

site/content/docs/reference/fips.md

@@ -5,7 +5,7 @@ cascade:
   layout: docs
 menu:
   docs:
-    name: FIPS-compatible builds of Pinniped binaries
+    name: FIPS-compatible builds
     weight: 30
     parent: reference
 ---
@@ -31,4 +31,3 @@ $ docker build -f hack/Dockerfile_fips .
 
 Now you can deploy [the concierge]({{< ref "install-concierge" >}}) and [the supervisor]({{< ref "install-supervisor" >}}) 
 by specifying this image instead of the standard Pinniped image in your `values.yaml` or `deployment.yaml` file.
-

site/content/docs/tutorials/concierge-and-supervisor-demo.md

@@ -101,7 +101,7 @@ had to make some choices. The choices made for this tutorial were:
 - For web-based login flows as used by OIDC identity providers, the Pinniped Supervisor needs TLS certificates
   that are trusted by the end users' web browsers. There are many ways to create TLS certificates.
   There are also several ways to configure the TLS certificates on the Supervisor, as described in the
-  [docs for configuring the Supervisor]({{< ref "../howto/configure-supervisor" >}}).
+  [docs for configuring the Supervisor]({{< ref "../howto/supervisor/configure-supervisor" >}}).
   For this tutorial we will use [Let's Encrypt](https://letsencrypt.org) with [cert-manager](https://cert-manager.io/docs/),
   because any reader could use these services if they would like to try these steps themselves.
 - The Pinniped Concierge can be installed in many types of Kubernetes clusters, as described in
@@ -198,7 +198,7 @@ kubectl apply \
 ### Create a LoadBalancer Service for the Supervisor
 
 There are several options for exposing the Supervisor's endpoints outside the cluster, which are described in the
-[howto guide for configuring the Supervisor]({{< ref "../howto/configure-supervisor" >}}). For this tutorial,
+[howto guide for configuring the Supervisor]({{< ref "../howto/supervisor/configure-supervisor" >}}). For this tutorial,
 we will use a public LoadBalancer.
 
 Create a LoadBalancer to expose the Supervisor's endpoints to the public, being careful to only
@@ -408,7 +408,7 @@ The general steps required to create and configure a client in Okta are:
 3. Create a test user with an email and a password. It does not need to be a real email address for the purposes of this tutorial.
 4. Create an app in the Okta UI.
    1. For more information about creating an app in the Okta UI, see the
-      [Configure Supervisor With Okta OIDC howto doc]({{< ref "../howto/configure-supervisor-with-okta" >}}).
+      [Configure Supervisor With Okta OIDC howto doc]({{< ref "../howto/supervisor/configure-supervisor-with-okta" >}}).
    2. Make sure that the test user is assigned to the app in the app's "Assignments" tab.
    3. Add the FederationDomain's callback endpoint to the "Sign-in redirect URIs" list on the app in the UI.
       The callback endpoint is the FederationDomain's issuer URL plus `/callback`,

site/content/docs/tutorials/concierge-only-demo.md

@@ -24,8 +24,8 @@ for a more specific example of installing onto a local kind cluster, including t
 1. [Install the Concierge]({{< ref "../howto/install-concierge" >}}).
 1. [Install the Pinniped command-line tool]({{< ref "../howto/install-cli" >}}).
 1. Configure the Concierge with a
-   [JWT]({{< ref "../howto/configure-concierge-jwt" >}}) or
+   [JWT]({{< ref "../howto/concierge/configure-concierge-jwt" >}}) or
-   [webhook]({{< ref "../howto/configure-concierge-webhook" >}}) authenticator.
+   [webhook]({{< ref "../howto/concierge/configure-concierge-webhook" >}}) authenticator.
 1. Generate a kubeconfig using the Pinniped command-line tool (run `pinniped get kubeconfig --help` for more information).
 1. Run `kubectl` commands using the generated kubeconfig. The Pinniped Concierge will automatically be used for authentication during those commands.
 

site/content/posts/2021-06-02-first-ldap-release.md

@@ -111,7 +111,7 @@ And it is important that your users are using authentic kubeconfig files handed
 ### How to use LDAP with your Pinniped Supervisor
 
 Once you have [installed]({{< ref "docs/howto/install-supervisor.md" >}})
-and [configured]({{< ref "docs/howto/configure-supervisor.md" >}}) the Supervisor, adding an LDAP provider is as easy as creating
+and [configured]({{< ref "docs/howto/supervisor/configure-supervisor.md" >}}) the Supervisor, adding an LDAP provider is as easy as creating
 an [LDAPIdentityProvider](https://github.com/vmware-tanzu/pinniped/blob/main/generated/1.20/README.adoc#ldapidentityprovider) resource.
 
 We've provided examples of using [OpenLDAP]({{< ref "docs/howto/install-supervisor.md" >}})

site/content/posts/2021-08-27-supporting-ad-oidc-workflows.md

@@ -23,7 +23,7 @@ Our initial LDAP implementation released with v.10.0 can be used to work with an
 
 Pinniped Supervisor authenticates your users with the AD provider via the LDAP protocol, and then issues unique, short-lived, per-cluster tokens. Our previous blog post on [LDAP configuration]({{< ref "2021-06-02-first-ldap-release.md">}}), elaborates on the security considerations to support integration at the Pinniped Supervisor level instead of at the Concierge.
 
-To setup the AD configuration, once you have Supervisor configured with ingress [installed the Pinniped Supervisor]({{< ref "docs/howto/install-supervisor.md" >}}) and you have [configured a FederationDomain]({{< ref "docs/howto/configure-supervisor" >}}) to issue tokens for your downstream clusters, you can create an [ActiveDirectoryIdentityProvider](https://github.com/vmware-tanzu/pinniped/blob/main/generated/1.20/README.adoc#activedirectoryidentityprovider) in the same namespace as the Supervisor.
+To setup the AD configuration, once you have Supervisor configured with ingress [installed the Pinniped Supervisor]({{< ref "docs/howto/install-supervisor.md" >}}) and you have [configured a FederationDomain]({{< ref "docs/howto/supervisor/configure-supervisor" >}}) to issue tokens for your downstream clusters, you can create an [ActiveDirectoryIdentityProvider](https://github.com/vmware-tanzu/pinniped/blob/main/generated/1.20/README.adoc#activedirectoryidentityprovider) in the same namespace as the Supervisor.
 Here’s what an example configuration looks like
 
 ```yaml
@@ -60,7 +60,7 @@ Here’s what an example configuration looks like
    password: "YOUR_PASSWORD"
  ```
 
-You can also customize the userSearch and groupSearch as shown in the examples in our reference documentation [here]({{< ref "docs/howto/configure-supervisor-with-activedirectory.md" >}})
+You can also customize the userSearch and groupSearch as shown in the examples in our reference documentation [here]({{< ref "docs/howto/supervisor/configure-supervisor-with-activedirectory.md" >}})
 
 In the above example, users will be able to login with either their sAMAccountName (i.e. pinny), userPrincipalName (i.e. pinny@example.com) or mail attribute.  This reduces the need to tell users what specific value from AD must be provided in the username field.  Regardless of what value the user provides in the username field, the userPrincipalName will be used as the identity in Kubernetes clusters.  UPN is used as the username attribute by default as it is unique within an AD forest.  Similarly, a UPN is generated for each group using its sAMAccountName attribute and the AD domain hostname.  The default AD configuration finds both direct and nested groups.
 

site/content/posts/2022-01-18-idp-refresh-tls-ciphers-for-compliance.md

@@ -61,7 +61,7 @@ spec:
     allowPasswordGrant: false
 ```
 
-Refer to a more complete example for configuring Okta at [how to configure Okta as IDP with Supervisor]({{< ref "docs/howto/configure-supervisor-with-okta.md" >}}).
+Refer to a more complete example for configuring Okta at [how to configure Okta as IDP with Supervisor]({{< ref "docs/howto/supervisor/configure-supervisor-with-okta.md" >}}).
 
 Inside Okta, when you create the Application, make sure to select refresh tokens as the Grant type along with Authorization code. See below:
 

site/content/posts/2022-04-15-fips-and-more.md

@@ -41,7 +41,7 @@ For more information on this feature refer to [#981](https://github.com/vmware-t
 
 We continue to gather feedback from the community around the need to integrate with different Identity Providers. With this in mind, we have documented our support for configuring [VMware Workspace ONE Access](https://www.vmware.com/products/workspace-one/access.html) (formerly VMware Identity Manager) as an Identity provider. Workspace ONE access also acts as a broker to other identity stores and providers—including Active Directory (AD), Active Directory Federation Services (ADFS), Azure AD, Okta and Ping Identity to enable authentication across on-premises, software-as-a-service (SaaS), web and native applications. Available as a cloud-hosted service, Workspace ONE Access is an integral part of the Workspace ONE platform.
 
-Refer to our detailed guide  on [how to configure supervisor with Workspace ONE Access]({{< ref "docs/howto/configure-supervisor-with-workspace_one_access.md" >}}).  
+Refer to our detailed guide  on [how to configure supervisor with Workspace ONE Access]({{< ref "docs/howto/supervisor/configure-supervisor-with-workspace_one_access.md" >}}).  
 
 ## What else is in this release?
 

site/themes/pinniped/assets/scss/_components.scss

@@ -1,6 +1,19 @@
 @import 'variables';
 @import 'mixins';
 
+/* Global */
+code {
+    background: #efefef;
+    padding: 2px 4px;
+    font-size: 85%;
+}
+pre code {
+    background: none;
+}
+.highlight pre codesite/sidebar/reorganize {
+    font-size: 100%;
+}
+
 /* Homepage Hero */
 .hero {
     background-color: $mainblue;
@@ -291,10 +304,6 @@
             }
         }
         code {
-            background-color: $white;
-            color: $darkgrey;
-            border: 2px solid #EFEFEF;
-            padding: 2px 8px;
             .c1 {
                 color: $blue;
                 font-style: italic;
@@ -309,12 +318,6 @@
             white-space: -pre-wrap;
             white-space: -o-pre-wrap;
             word-wrap: break-word;
-            code {
-                display: block;
-                border: 15px solid #EFEFEF;
-                padding: 15px;
-                margin-bottom: 30px;
-            }
         }
         img {
             max-width: 100%;
@@ -458,24 +461,33 @@
             width: 100%;
             float: none;
         }
-
+        position: relative;
+        a.active {
+            background: $lightgrey;
+            padding: 5px 7px;
+            margin-left: -7px;
+        }
+        h3 {
+            font-size: 18px;
+            font-family: $metropolis-medium;
+            margin-bottom: 10px;
+            a {
+                font-weight: 300;
+                line-height: 1.25;
+                color: #000;
+            }
+        }
         ul {
             padding-left: 0px;
+            margin-top: 0;
             margin-bottom: 35px;
-            ul {
+            list-style-type: none;
-                padding-left: 15px;
-                margin-top: 10px;
-                margin-bottom: 15px;
-            }
             li {
+                padding-right: 0px;
                 display: list-item;
-                margin-bottom: 15px;
                 a {
-                    color: $grey;
                     font-size: 14px;
-                    &.active {
+                    font-weight: 300;
-                        color: $blue;
-                    }
                 }
                 &.heading {
                     color: $black;
@@ -523,10 +535,6 @@
             }
         }
         code {
-            background-color: $white;
-            color: $darkgrey;
-            border: 2px solid #EFEFEF;
-            padding: 2px 8px;
             .c1 {
                 color: $blue;
                 font-style: italic;
@@ -541,13 +549,6 @@
             white-space: -pre-wrap;
             white-space: -o-pre-wrap;
             word-wrap: break-word;
-            code {
-                display: block;
-                border: 15px solid #EFEFEF;
-                padding: 15px;
-                margin-bottom: 30px;
-                font-size: 14px;
-            }
         }
         img {
             max-width: 100%;

site/themes/pinniped/layouts/partials/docs-sidebar.html

@@ -7,19 +7,19 @@
                  dir="auto" style="position: relative; vertical-align: top;">
         </span>
 </form>
-    <ul>
+    <div class="navigation">
         {{- $currentPage := . }}
         {{- range .Site.Menus.docs }}
+        <h3>
+            <a href="{{ .URL }}" class="{{ cond ($currentPage.IsMenuCurrent "docs" .) "active" "" }}">{{ .Name }}</a>
+        </h3>
+        <ul>
+           {{- range .Children }}
                 <li>
-                    <a href="{{ .URL }}" class="{{ cond ($currentPage.IsMenuCurrent "docs" .) "active" "" }}">{{ .Name }}</a>
+                    <a href="{{ .URL }}"{{ if $currentPage.IsMenuCurrent "docs" . }} class="active"{{ end }} >{{ .Name }}</a>
-                    {{- if .HasChildren }}
-                    <ul class="sub-menu">
-                        {{- range .Children }}
-                            <li><a href="{{ .URL }}"{{ if $currentPage.IsMenuCurrent "docs" . }} class="active"{{ end }} >{{ .Name }}</a></li>
-                        {{- end }}
-                    </ul>
-                    {{- end }}
                 </li>
+            {{- end }}
+        </ul>
         {{- end }}
-    </ul>
+    </div>
 </div>