From 4b615b4dc12b918c0b62876af8203052c7963851 Mon Sep 17 00:00:00 2001
From: braginini <bangvalo@gmail.com>
Date: Fri, 19 May 2023 20:49:11 +0200
Subject: [PATCH] Correct images

---
 src/components/NavigationDocs.jsx                  |  8 ++++----
 src/pages/docs/about-netbird/how-netbird-works.mdx | 10 +++++-----
 .../docs/how-to/access-netbird-public-api.mdx      | 10 +++++-----
 .../docs/how-to/add-users-to-your-network.mdx      |  2 +-
 ...dx => enforce-periodic-user-authentication.mdx} |  8 ++++----
 src/pages/docs/how-to/examples.mdx                 |  2 +-
 .../docs/how-to/manage-dns-in-your-network.mdx     | 14 +++++++-------
 src/pages/docs/how-to/manage-network-access.mdx    | 12 ++++++------
 .../how-to/monitor-system-and-network-activity.mdx |  2 +-
 .../how-to/register-machines-using-setup-keys.mdx  |  6 +++---
 .../how-to/routing-traffic-to-private-networks.mdx | 14 +++++++-------
 11 files changed, 44 insertions(+), 44 deletions(-)
 rename src/pages/docs/how-to/{configure-periodic-user-authentication.mdx => enforce-periodic-user-authentication.mdx} (96%)

diff --git a/src/components/NavigationDocs.jsx b/src/components/NavigationDocs.jsx
index 558249e0..8be2768d 100644
--- a/src/components/NavigationDocs.jsx
+++ b/src/components/NavigationDocs.jsx
@@ -16,7 +16,7 @@ export const docsNavigation = [
         ],
     },
     {
-        title: 'How-to',
+        title: 'How-to guides',
         links: [
             { title: 'Getting started', href: '/docs/how-to/getting-started' },
             { title: 'Installation', href: '/docs/how-to/installation' },
@@ -24,7 +24,7 @@ export const docsNavigation = [
             { title: 'Manage network access', href: '/docs/how-to/manage-network-access' },
             { title: 'Add users to your network', href: '/docs/how-to/add-users-to-your-network' },
             { title: 'Access NetBird API', href: '/docs/how-to/access-netbird-public-api' },
-            { title: 'Configure periodic user authentication', href: '/docs/how-to/configure-periodic-user-authentication' },
+            { title: 'Enforce periodic authentication', href: '/docs/how-to/enforce-periodic-user-authentication' },
             { title: 'Monitor system and network activity', href: '/docs/how-to/monitor-system-and-network-activity' },
             { title: 'Route traffic to private networks', href: '/docs/how-to/routing-traffic-to-private-networks' },
             { title: 'Manage DNS in your network', href: '/docs/how-to/manage-dns-in-your-network' },
@@ -33,7 +33,7 @@ export const docsNavigation = [
         ],
     },
     {
-        title: 'Self-Hosted',
+        title: 'Self-hosted NetBird',
         links: [
             { title: 'Installation guide', href: '/docs/selfhosted/selfhosted-guide' },
             { title: 'Supported identity providers (IDPs)', href: '/docs/selfhosted/identity-providers' },
@@ -79,7 +79,7 @@ function NavigationGroup({ group, className }) {
         <li className={clsx('relative mt-6', className)}>
             <motion.h2
                 layout="position"
-                className="text-xs font-semibold text-zinc-900 dark:text-white"
+                className="text-s font-semibold text-zinc-900 dark:text-white"
             >
                 {group.title}
             </motion.h2>
diff --git a/src/pages/docs/about-netbird/how-netbird-works.mdx b/src/pages/docs/about-netbird/how-netbird-works.mdx
index 9c90d9ae..f70c6396 100644
--- a/src/pages/docs/about-netbird/how-netbird-works.mdx
+++ b/src/pages/docs/about-netbird/how-netbird-works.mdx
@@ -17,13 +17,13 @@ The combination of these elements ensures that direct point-to-point connections
 A **Peer** is a machine or any device that is connected to the network.
 It can be a Linux server running in the cloud or on-premises, a personal laptop, or even a Raspberry PI.
 
-<p align="center">
+<p>
     <img src="/img/architecture/high-level-dia.png" alt="high-level-dia" width="781" style={{boxShadow: '0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)'}}/>
 </p>
 
 With NetBird clients installed and authorized on the Management service, machines form a mesh network connecting to each other directly via an encrypted point-to-point Wireguard tunnel.
 
-<p align="center">
+<p>
     <img src="/img/architecture/mesh.png" alt="high-level-dia" style={{boxShadow: '0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)'}}/>
 </p>
 
@@ -53,7 +53,7 @@ After that, they are able to establish a connection to the new peer.
 
 The Management service runs in the cloud NetBird-managed. It can also be self-hosted.
 
-<p align="center">
+<p>
     <img src="/img/architecture/management.png" alt="management-dia" style={{boxShadow: '0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)'}}/>
 </p>
 
@@ -87,7 +87,7 @@ The only Signal's responsibility is:
 * **Serve as a notification mechanism for peers.** Before a connection can be established, peers need to find each other and exchange the most suitable connection candidates.
 This is done through Signal. After a connection has been established, Signal steps out.
 
-<p align="center">
+<p>
     <img src="/img/architecture/signal.png" alt="signal-dia" style={{boxShadow: '0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)'}}/>
 </p>
 
@@ -104,7 +104,7 @@ The Relay service is a [TURN server](https://webrtc.org/getting-started/turn-ser
 In fact, we use an open-source implementation called [Coturn](https://github.com/coturn/coturn).
 The purpose of this service is to be a "plan B" and relay traffic between peers in case a peer-to-peer connection isn't possible.
 
-<p align="center">
+<p>
     <img src="/img/architecture/relay.png" alt="relay-dia" style={{boxShadow: '0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)'}}/>
 </p>
 
diff --git a/src/pages/docs/how-to/access-netbird-public-api.mdx b/src/pages/docs/how-to/access-netbird-public-api.mdx
index 7cbf0c6a..13ae531e 100644
--- a/src/pages/docs/how-to/access-netbird-public-api.mdx
+++ b/src/pages/docs/how-to/access-netbird-public-api.mdx
@@ -21,14 +21,14 @@ The most common usage scenarios:
 ### Creating a service user
 
 To create a service user, you'll need to log in to your organization's account at https://app.netbird.io and navigate to the "Users" -> "Service Users" section of your account.
-<p align="center">
+<p>
     <img src="/img/overview/service-user-overview.png" alt="service-user-overview" width="780" class="imagewrapper"/>
 </p>
 
 From there, you can create a new service user and specify a role that the user should have.
 User role allows read-only access, use the admin for write access.
 
-<p align="center">
+<p>
     <img src="/img/overview/service-user-creation.png" alt="service-user-creation-popup" width="400" class="imagewrapper"/>
 </p>
 
@@ -40,20 +40,20 @@ User role allows read-only access, use the admin for write access.
 
 To create an access token, you'll need to log in to your account and navigate to the "Users" section and look for your user or create a [service user](#service-users) to use for your API requests.
 
-<p align="center">
+<p>
     <img src="/img/overview/personal-access-token-overview.png" alt="personal-access-token-overview" width="780" class="imagewrapper"/>
 </p>
 
 From there, you can create a new token and specify expiration for the token. You won't be able to modify your token.
 
-<p align="center">
+<p>
     <img src="/img/overview/personal-access-token-creation.png" alt="personal-access-creation-popup" width="400" class="imagewrapper"/>
 </p>
 
 After the token was generated successfully you will see a plain version of your token to copy and store in a secure place.
 Be aware that once you close the popup it is impossible to see the plain version of the token again as NetBird only stores a hashed version of the token.
 
-<p align="center">
+<p>
     <img src="/img/overview/personal-access-token-example.png" alt="personal-access-token-example" width="400" class="imagewrapper"/>
 </p>
 
diff --git a/src/pages/docs/how-to/add-users-to-your-network.mdx b/src/pages/docs/how-to/add-users-to-your-network.mdx
index 1d115d52..7df23c5d 100644
--- a/src/pages/docs/how-to/add-users-to-your-network.mdx
+++ b/src/pages/docs/how-to/add-users-to-your-network.mdx
@@ -33,7 +33,7 @@ A user window will pop up where you can specify the name and email address of th
 The invited users will receive an email invitation that they have to confirm.
 After logging in to the system, they will join your network automatically.
 
-<p align="center">
+<p>
     <img src="/img/how-to-guides/user-invites.gif" alt="high-level-dia" width="800" class="imagewrapper"/>
 </p>
 
diff --git a/src/pages/docs/how-to/configure-periodic-user-authentication.mdx b/src/pages/docs/how-to/enforce-periodic-user-authentication.mdx
similarity index 96%
rename from src/pages/docs/how-to/configure-periodic-user-authentication.mdx
rename to src/pages/docs/how-to/enforce-periodic-user-authentication.mdx
index c9d300e8..b23031df 100644
--- a/src/pages/docs/how-to/configure-periodic-user-authentication.mdx
+++ b/src/pages/docs/how-to/enforce-periodic-user-authentication.mdx
@@ -1,5 +1,5 @@
 
-# Configure periodic user authentication
+# Enforce periodic user authentication
 
 To ensure a high level of security, NetBird offers a peer login expiration feature that requires users to periodically reauthenticate their devices.
 Every new network has this feature enabled, and the expiration period is set to 24 hours by default. You can disable this feature and configure the expiration period in the account settings in the web UI https://app.netbird.io/settings.
@@ -10,7 +10,7 @@ Every new network has this feature enabled, and the expiration period is set to
 
 Expired peers will appear in the peers' view with the status `needs login`.
 
-<p align="center">
+<p>
     <img src="/img/how-to-guides/peer-needs-login.png" alt="peer-needs-login.png" class="imagewrapper"/>
 </p>
 
@@ -19,7 +19,7 @@ The expiration period can be set to anything between one hour and 180 days.
 Go to the Web UI Settings tab and set the desired period in the Authentication section.
 You can also disable the expiration for the whole network in the same section.
 
-<p align="center">
+<p>
     <img src="/img/how-to-guides/peer-login-expiration.png" alt="peer-login-expiration" class="imagewrapper"/>
 </p>
 
@@ -35,7 +35,7 @@ With NetBird you can disable login expiration per peer without disabling expirat
 In the Peers tab of the web UI click on the peer you want to disable expiration for and use the Login Expiration switch.
 Peers with `expiration disabled` will be marked with a corresponding label in the peers' table.
 
-<p align="center">
+<p>
     <img src="/img/how-to-guides/individual-peer-login-expiration.png" alt="peer-login-expiration" class="imagewrapper"/>
 </p>
 
diff --git a/src/pages/docs/how-to/examples.mdx b/src/pages/docs/how-to/examples.mdx
index a14ef4ea..96c646b5 100644
--- a/src/pages/docs/how-to/examples.mdx
+++ b/src/pages/docs/how-to/examples.mdx
@@ -3,7 +3,7 @@ export const title = 'Examples'
 
 ## NetBird Client on AWS ECS (Terraform)
 
-<p align="center">
+<p>
     <img src="/img/examples/wiretrustee-on-aws-ecs.png" alt="high-level-dia" width="400"/>
 </p>
 
diff --git a/src/pages/docs/how-to/manage-dns-in-your-network.mdx b/src/pages/docs/how-to/manage-dns-in-your-network.mdx
index 2dee0db4..0bce99a6 100644
--- a/src/pages/docs/how-to/manage-dns-in-your-network.mdx
+++ b/src/pages/docs/how-to/manage-dns-in-your-network.mdx
@@ -56,7 +56,7 @@ A nameserver group defines up to 2 nameservers to resolve DNS to a set of peers
 
 ### Creating a nameserver group
 Access the `DNS` tab and click the `Add Nameserver` button to create a new nameserver.
-<p align="center">
+<p>
     <img src="/img/how-to-guides/netbird-nameserver-add-button.png" alt="high-level-dia" class="imagewrapper"/>
 </p>
 That will open a nameserver selection configuration screen where you can choose between using three predefined public
@@ -67,13 +67,13 @@ If you choose a predefined public nameserver option, you can select the followin
 - [Google DNS servers](https://developers.google.com/speed/public-dns/docs/using)
 - [Cloudflare DNS servers](https://one.one.one.one/dns/)
 - [Quad9 DNS servers](https://www.quad9.net/)
-<p align="center">
+<p>
     <img src="/img/how-to-guides/netbird-nameserver-selection-view-open.png" alt="high-level-dia" width="300" class="imagewrapper"/>
 </p>
 
 After selecting one of the three options, you need to assign a peer group for which this nameserver will be effective.
 In the example below, we chose the "All" group:
-<p align="center">
+<p>
     <img src="/img/how-to-guides/netbird-nameserver-all-group.png" alt="high-level-dia" width="300" class="imagewrapper"/>
 </p>
 
@@ -87,7 +87,7 @@ In the example below, we are creating a nameserver with the following informatio
 - Add at least one nameserver: `192.168.0.32` with port `53`
 - Match mode: `All domains`
 - Distribution group: `Remote developers`
-<p align="center">
+<p>
     <img src="/img/how-to-guides/netbird-nameserver-custom.png" alt="high-level-dia" width="300" class="imagewrapper"/>
 </p>
 
@@ -95,7 +95,7 @@ In the example below, we are creating a nameserver with the following informatio
 Sometimes we want to forward DNS queries to specific nameservers but only for particular domains that match a setting.
 Taking the example of custom nameservers above, you could select a match mode for only domains listed there.
 Below you can see the same nameserver setup but only for the `berlinoffice.com` domain:
-<p align="center">
+<p>
     <img src="/img/how-to-guides/netbird-nameserver-remote-resolver.png" alt="high-level-dia" width="300" class="imagewrapper"/>
 </p>
 
@@ -107,12 +107,12 @@ Below you can see the same nameserver setup but only for the `berlinoffice.com`
 You can select as many distribution groups as you want for your nameserver setup. Keep in mind to link them to peers and, if required, to add access control rules when using private nameservers.
 ### Adding remote private DNS servers
 To add a private DNS server that is running behind routing peers, you need to create resources to ensure communication between your nameserver clients can communicate. In the Berlin office example from previous steps, we have a peer from the `Office network` that can route traffic to the `192.168.0.32` IP, so we need to ensure that a similar network route exists:
-<p align="center">
+<p>
     <img src="/img/how-to-guides/netbird-nameserver-remote-route.png" alt="high-level-dia" class="imagewrapper"/>
 </p>
 
 Then we need to confirm that an access rule exists to connect `Remote developers` to `Office network` group:
-<p align="center">
+<p>
     <img src="/img/how-to-guides/netbird-nameserver-remote-rule.png" alt="high-level-dia" class="imagewrapper"/>
 </p>
 
diff --git a/src/pages/docs/how-to/manage-network-access.mdx b/src/pages/docs/how-to/manage-network-access.mdx
index 4b5373d3..3f2c01e9 100644
--- a/src/pages/docs/how-to/manage-network-access.mdx
+++ b/src/pages/docs/how-to/manage-network-access.mdx
@@ -68,18 +68,18 @@ There is a `Default` rule, which configures a Default mesh connection between al
 After accessing the `Access Control` tab, you can click on the `Add Rule` button to create a new rule. This will open a screen
 where you need to name the rule, set its status, and add groups to the source and destination lists.
 
-<p align="center">
+<p>
     <img src="/img/overview/create-rule.png" alt="high-level-dia" width="300" class="imagewrapper"/>
 </p>
 
 If required, you can create new groups by simply entering new names in the input box for either source or destination lists.
 
-<p align="center">
+<p>
     <img src="/img/overview/create-group-in-rule.png" alt="high-level-dia" width="300" class="imagewrapper"/>
 </p>
 
 Once you are done configuring the rule, click the `Create` button to save it. You will then see your new rule in the table.
-<p align="center">
+<p>
     <img src="/img/overview/new-rule-list.png" alt="high-level-dia" width="600" class="imagewrapper"/>
 </p>
 
@@ -91,7 +91,7 @@ Once you are done configuring the rule, click the `Create` button to save it. Yo
 If you create a new group when defining a rule, you will need to associate peers with this group.
 You can do it by accessing the `Peers` tab and clicking the `Groups` column of any peer you want to associate with the new group.
 
-<p align="center">
+<p>
     <img src="/img/overview/associate-peer-groups.png" alt="high-level-dia" width="300" class="imagewrapper"/>
 </p>
 
@@ -107,10 +107,10 @@ To disable a rule, you should follow the steps of [updating rules](#updating-rul
 ### Deleting Rules
 To delete a rule, you should click on the rule's menu and choose `Delete`. A confirmation window will pop up.
 
-<p align="center">
+<p>
     <img src="/img/overview/delete-rule-menu.png" alt="high-level-dia" width="600" class="imagewrapper"/>
 </p>
 
-<p align="center">
+<p>
     <img src="/img/overview/delete-rule-popup.png" alt="high-level-dia" width="300" class="imagewrapper"/>
 </p>
\ No newline at end of file
diff --git a/src/pages/docs/how-to/monitor-system-and-network-activity.mdx b/src/pages/docs/how-to/monitor-system-and-network-activity.mdx
index a1f0d89d..eae26619 100644
--- a/src/pages/docs/how-to/monitor-system-and-network-activity.mdx
+++ b/src/pages/docs/how-to/monitor-system-and-network-activity.mdx
@@ -7,7 +7,7 @@ Whether a new machine or user joined your network or the access control policy h
 Activity monitoring is enabled by default for every network, and you can access it in the web UI under the [Activity tab](https://app.netbird.io/activity).
 You can also use the search bar to filter events by activity type.
 
-<p align="center">
+<p>
     <img src="/img/how-to-guides/activity-monitoring.png" alt="activity-monitoring" width="800" class="imagewrapper"/>
 </p>
 
diff --git a/src/pages/docs/how-to/register-machines-using-setup-keys.mdx b/src/pages/docs/how-to/register-machines-using-setup-keys.mdx
index da402114..e61e716d 100644
--- a/src/pages/docs/how-to/register-machines-using-setup-keys.mdx
+++ b/src/pages/docs/how-to/register-machines-using-setup-keys.mdx
@@ -23,7 +23,7 @@ Setup keys are available in the NetBird Management dashboard under the Setup Key
 
 By default, we generate 2 setup keys right after account creation. You can easily add new or revoke keys.
 
-<p align="center">
+<p>
     <img src="/img/architecture/setup-keys.png" alt="high-level-dia" class="imagewrapper"/>
 </p>
 
@@ -36,7 +36,7 @@ Setup keys are set to expire after 30 days. When expired, the setup key can't be
 
 ## Peer Auto-grouping
 
-<p align="center">
+<p>
     <img src="/img/architecture/peer-auto-tagging-setupkey.gif" alt="high-level-dia" width="800" class="imagewrapper"/>
 </p>
 
@@ -51,7 +51,7 @@ to these groups. All the access control rules enabled for these groups will appl
 To add `Auto-assign groups`, open the `Setup Keys` tab and create or update any existing setup key.
 Then use this key to enroll new machine.
 
-<p align="center">
+<p>
     <img src="/img/architecture/netbird-peer-auto-tagging-newkey.png" alt="high-level-dia" width="500" class="imagewrapper"/>
 </p>
 
diff --git a/src/pages/docs/how-to/routing-traffic-to-private-networks.mdx b/src/pages/docs/how-to/routing-traffic-to-private-networks.mdx
index d356bb7f..52eb43b7 100644
--- a/src/pages/docs/how-to/routing-traffic-to-private-networks.mdx
+++ b/src/pages/docs/how-to/routing-traffic-to-private-networks.mdx
@@ -14,7 +14,7 @@ NetBird provides fast and reliable end-to-end encryption between peers in your n
 
 In these cases, you can configure network routes assigning routing peers to connect existing infrastructure. Routing peers will forward packets between your NetBird peers and your other networks; they can masquerade traffic going to your data centers or embedded devices, reducing the need for external route configuration and agent installation.
 
-<p align="center">
+<p>
     <img src="/img/how-to-guides/netbird-network-routes.png" alt="high-level-dia"  />
 </p>
 
@@ -59,7 +59,7 @@ A network route describes a network you want to connect with your NetBird peers.
 ### Creating a network route
 Access the `Network Routes` tab and click the `Add Route` button to create a new route.
 That will open a route configuration screen where you can add the information about the network you want to route:
-<p align="center">
+<p>
     <img src="/img/how-to-guides/netbird-network-routes-add-button.png" alt="high-level-dia" class="imagewrapper"/>
 </p>
 
@@ -72,12 +72,12 @@ In the example below, we are creating a route with the following information:
 - Routing peer: `aws-nb-europe-router-az-a`
 - Distribution Groups: `All`
 
-<p align="center">
+<p>
     <img src="/img/how-to-guides/netbird-network-routes-create.png" alt="high-level-dia" width="300" class="imagewrapper"/>
 </p>
 
 Once you fill in the route information, you can click on the `Save` button to save your new route.
-<p align="center">
+<p>
     <img src="/img/how-to-guides/netbird-network-routes-saved-new.png" alt="high-level-dia" class="imagewrapper"/>
 </p>
 Done! Now every peer connected to your routing peer will be able to send traffic to your external network.
@@ -92,13 +92,13 @@ To enable high-available mode, you can click on `Configure` and select a new pee
 
 In the following screenshot, we are adding the peer `aws-nb-europe-router-az-b` to the `aws-eu-central-1-vpc` route:
 
-<p align="center">
+<p>
     <img src="/img/how-to-guides/netbird-network-routes-create-ha.png" alt="high-level-dia" width="300" class="imagewrapper"/>
 </p>
 
 This way, nodes connected to both peer `aws-nb-europe-router-az-a` and peer `aws-nb-europe-router-az-b` would have a highly available connection with the network `172.31.0.0/16`.
 
-<p align="center">
+<p>
     <img src="/img/how-to-guides/netbird-network-routes-saved-new-ha.png" alt="high-level-dia" class="imagewrapper"/>
 </p>
 
@@ -115,7 +115,7 @@ In this case, the routing peer won't hide any NetBird peer  IP and will forward
 That will require a routing configuration on your external network router pointing your NetBird network back to your routing peer.
 This way, devices that don't have the agent installed can communicate with your NetBird peers.
 
-<p align="center">
+<p>
     <img src="/img/how-to-guides/netbird-network-routes-masquerading.png" alt="high-level-dia" class="imagewrapper"/>
 </p>