pr updates

Signed-off-by: kaddy645 <xdeskart@amazon.com>
opensearch-project · Jul 28, 2022 · 37275cc · 37275cc
1 parent a7284d9
commit 37275cc
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 13 deletions.
diff --git a/src/core/public/_variables.scss b/src/core/public/_variables.scss
@@ -1,6 +1,6 @@
 @import "@elastic/eui/src/global_styling/variables/header";
 
 $osdHeaderOffset: $euiHeaderHeightCompensation;
-$osdPacificSky: #b9d9eb;
-$osdSanFranciscoFog: #d9e1e2;
-$osdMidnightSky: #002a3a;
+$osdHeaderBreadcrumbBlueBackground: #b9d9eb;
+$osdHeaderBreadcrumbGrayBackground: #d9e1e2;
+$osdHeaderBreadcrumbCollapsedLink: #002a3a;
diff --git a/src/core/public/chrome/ui/header/header_breadcrumbs.scss b/src/core/public/chrome/ui/header/header_breadcrumbs.scss
@@ -10,7 +10,7 @@
   filter: url("../../public/assets/round_filter.svg#round");
 
   .osdBreadcrumbs.first {
-    @include background($osdSanFranciscoFog,
+    @include background($osdHeaderBreadcrumbGrayBackground,
     polygon(
       0% 0%,
       100% 0%,
@@ -20,17 +20,17 @@
   }
 
   .osdBreadcrumbs.middle {
-    @include background($osdSanFranciscoFog,
+    @include background($osdHeaderBreadcrumbGrayBackground,
     polygon(
       $euiSizeS 0%,
       100% 0%,
-      calc(100% - #{$euiSizeS})  100%,
+      calc(100% - #{$euiSizeS}) 100%,
       0% 100%
     ));
   }
 
   .osdBreadcrumbs.last {
-    @include background($osdPacificSky,
+    @include background($osdHeaderBreadcrumbBlueBackground,
     polygon(
       $euiSizeS 0%,
       100% 0%,
@@ -40,11 +40,11 @@
   }
 
   .osdBreadcrumbs.first.last {
-    @include background($osdPacificSky,
+    @include background($osdHeaderBreadcrumbBlueBackground,
     polygon(
       0% 0%,
       100% 0%,
-      calc(100% - #{$euiSizeS})100%,
+      calc(100% - #{$euiSizeS}) 100%,
       0% 100%
     ));
   }
@@ -54,7 +54,7 @@
   }
 
   .euiBreadcrumb__collapsedLink {
-    color: $osdMidnightSky;
+    color: $osdHeaderBreadcrumbCollapsedLink;
     background: $euiColorEmptyShade;
   }
 

diff --git a/src/core/public/chrome/ui/header/header_breadcrumbs.tsx b/src/core/public/chrome/ui/header/header_breadcrumbs.tsx
@@ -50,7 +50,9 @@ export function HeaderBreadcrumbs({ appTitle$, breadcrumbs$ }: Props) {
   if (breadcrumbs.length === 0 && appTitle) {
     crumbs = [{ text: appTitle }];
   }
-
+
+  const crumbsLength = crumbs.length;
+
   crumbs = crumbs.map((breadcrumb, i) => ({
     ...breadcrumb,
     'data-test-subj': classNames(
@@ -62,8 +64,8 @@ export function HeaderBreadcrumbs({ appTitle$, breadcrumbs$ }: Props) {
     className: classNames(
       'osdBreadcrumbs',
       i === 0 && 'first',
-      i > 0 && i < crumbs.length - 1 && 'middle',
-      i === crumbs.length - 1 && 'last'
+      i > 0 && i < crumbsLength - 1 && 'middle',
+      i === crumbsLength - 1 && 'last'
     ),
   }));