@openstack_dev/gatsby-theme-marketing-oif-core 1.0.20 → 1.0.22

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@openstack_dev/gatsby-theme-marketing-oif-core",
-  "version": "1.0.20",
+  "version": "1.0.22",
   "description": "Base theme for Marketing Sites",
   "author": "smarcet",
   "keywords": [

package/src/components/Navbar/AuthUserSubNavBar/index.js

@@ -79,7 +79,7 @@ function AuthUserSubNavBar({
           md: isSearchBarOpen ? "none" : "flex",
         },
         justifyContent: "flex-end",
-        marginLeft: "auto",
+        marginLeft: "1em",
         position: "relative",
       }}
     >

package/src/components/Navbar/NavBarHeader/index.module.scss

@@ -1,4 +1,5 @@
 .navbarHeader {
+  display: flex;
   .brandWrapper {
     margin: 10px 0;
     padding-right: 20px;

package/src/components/Navbar/PublicUserSubNavBar/index.js

@@ -49,7 +49,7 @@ function PublicUserSubNavBar({ isSearchBarOpen, isDesktop }) {
             },
             position: "relative",
             justifyContent: "flex-end",
-            marginLeft: "auto",
+            marginLeft: "1em",
           }
           : {
             position: "relative",

package/src/components/Navbar/SearchBar/index.js

@@ -41,11 +41,11 @@ function SearchBar({ isMobile, isMobileMenuOpen, onSearchBarOpen }) {
     }
   }, [isSearchBarOpen]);
 
+  const searchWidgetBaseUrl = getEnvVariable(SEARCH_WIDGET_BASE_URL);
+
   return (
     <>
-      <Script
-        src={`${getEnvVariable(SEARCH_WIDGET_BASE_URL)}/widget/embed.min.js`}
-      />
+      <Script src={`https://${searchWidgetBaseUrl}/widget/embed.min.js`} />
       {isMobile ? (
         <Box
           className={`${styles.openstackSearchBarMobile} openstack-search-bar ossw-mobile`}
@@ -58,7 +58,7 @@ function SearchBar({ isMobile, isMobileMenuOpen, onSearchBarOpen }) {
             height: { xs: isMobileMenuOpen ? "auto" : 0, md: 0 },
             color: "#8a959e",
           }}
-          data-baseurl={getEnvVariable(SEARCH_WIDGET_BASE_URL)}
+          data-baseurl={searchWidgetBaseUrl}
           data-context="www-openstack"
         />
       ) : (

package/src/components/Navbar/index.module.scss

@@ -11,6 +11,11 @@
   li {
     position: relative;
   }
+  .ulContainer {
+    @media (max-width: 925px) {
+      justify-content: space-between;
+    }
+  }
   .navbarOption {
     color: #8a959e;
     font-size: 12px;
@@ -27,6 +32,10 @@
     white-space: nowrap;
     background-color: transparent;
     align-items: center;
+    @media (min-width: 768px) and (max-width: 1067px) {
+      font-size: 11px;
+      padding: 15px 8px;
+    }
     &:hover {
       color: #333;
       background-color: transparent;
@@ -51,6 +60,9 @@
       margin: 0 15px 0 10px;
       padding-right: 0px;
       padding-left: 10px;
+      @media (min-width: 768px) and (max-width: 1060px) {
+        margin-left: 0px;
+      }
     }
     &.login {
       background: #2a4e68;

package/src/components/Navbar/template.js

@@ -53,8 +53,10 @@ function NavBarTemplate({ data, isLoggedUser, member }) {
                 },
                 alignItems: "center",
                 justifyContent: "flex-end",
+                paddingLeft: "0",
               }}
               component="ul"
+              className={styles.ulContainer}
             >
               {data.items.map(
                 (item) => item.display && (
@@ -65,20 +67,20 @@ function NavBarTemplate({ data, isLoggedUser, member }) {
                 />
                 ),
               )}
+              {isLoggedUser ? (
+                <AuthUserSubNavBar
+                  isMobile={false}
+                  member={member}
+                  navbarMenu={navbarMenu}
+                  isSearchBarOpen={isSearchBarOpen}
+                />
+              ) : (
+                <PublicUserSubNavBar
+                  isSearchBarOpen={isSearchBarOpen}
+                  isDesktop
+                />
+              )}
             </Box>
-            {isLoggedUser ? (
-              <AuthUserSubNavBar
-                isMobile={false}
-                member={member}
-                navbarMenu={navbarMenu}
-                isSearchBarOpen={isSearchBarOpen}
-              />
-            ) : (
-              <PublicUserSubNavBar
-                isSearchBarOpen={isSearchBarOpen}
-                isDesktop
-              />
-            )}
           </Toolbar>
           <SearchBar isMobileMenuOpen={isMobileMenuOpen} isMobile />
           {isMobileMenuOpen && (