add pricing link to hub nav section

Author: arpban

src/components/nav/MainNav.tsx

@@ -40,27 +40,6 @@ const MainNav: React.FC = () => {
       <Flex as="ul" sx={{ height: '100%', alignItems: 'center', p: 0, m: 0, listStyle: 'none' }}>
         <NavItem name="Products" hasSubmenu>
           <Grid sx={{ gridTemplateColumns: 'repeat(2, 364px)' }}>
-            <Product
-              title="Traefik Enterprise"
-              description="The API Gateway Cloud Natives Trust"
-              logo={<TraefikEnterpriseLogo />}
-              url="https://traefik.io/traefik-enterprise/"
-              color="#337fe6"
-              links={[
-                {
-                  title: 'Pricing',
-                  url: 'https://traefik.io/pricing/',
-                  external: true,
-                  icon: <PriceTagIcon aria-hidden="true" />,
-                },
-                {
-                  title: 'Free Trial',
-                  url: 'https://info.traefik.io/get-traefik-enterprise-free-for-30-days',
-                  external: true,
-                  icon: <LaptopIcon aria-hidden="true" />,
-                },
-              ]}
-            />
             <Product
               title="Traefik Hub"
               titleHtml={
@@ -79,12 +58,17 @@ const MainNav: React.FC = () => {
                   </Heading>
                 </Flex>
               }
-              description="Your APIs deserve better"
+              description="Kubernetes-Native API Management"
               logo={<TraefikHubLogo />}
               url="https://traefik.io/traefik-hub/"
               color="#7f8c2b"
-              bgColor="#f4f5f6"
               links={[
+                {
+                  title: 'Pricing',
+                  url: 'https://traefik.io/pricing/',
+                  external: true,
+                  icon: <PriceTagIcon aria-hidden="true" />,
+                },
                 {
                   title: 'Free Trial',
                   url: 'http://traefik.io/traefik-hub-signup',
@@ -93,6 +77,28 @@ const MainNav: React.FC = () => {
                 },
               ]}
             />
+            <Product
+              title="Traefik Enterprise"
+              description="The API Gateway Cloud Natives Trust"
+              logo={<TraefikEnterpriseLogo />}
+              url="https://traefik.io/traefik-enterprise/"
+              color="#337fe6"
+              bgColor="#f4f5f6"
+              links={[
+                {
+                  title: 'Pricing',
+                  url: 'https://traefik.io/pricing/',
+                  external: true,
+                  icon: <PriceTagIcon aria-hidden="true" />,
+                },
+                {
+                  title: 'Free Trial',
+                  url: 'https://info.traefik.io/get-traefik-enterprise-free-for-30-days',
+                  external: true,
+                  icon: <LaptopIcon aria-hidden="true" />,
+                },
+              ]}
+            />
           </Grid>
         </NavItem>