From 135d567dc16ec5dbc33997922781f05242f1b350 Mon Sep 17 00:00:00 2001
From: Miki <miki@amazon.com>
Date: Fri, 13 Sep 2024 14:30:58 -0700
Subject: [PATCH] Adjust OuiSimplifiedBreadcrumbs alignment, colors, and
 tailing slash

Signed-off-by: Miki <miki@amazon.com>
---
 CHANGELOG.md                                  |  1 +
 .../breadcrumbs/_breadcrumbs_simplified.scss  | 22 +++++++++++++------
 2 files changed, 16 insertions(+), 7 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 7ad211a9e..9bb56bbca 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -22,6 +22,7 @@
 
 - Fix `compressed` styling of OuiDatePickerRange ([#1380](https://github.com/opensearch-project/oui/pull/1380))
 - Make OuiSearchBar consume a provided `className` ([#1381](https://github.com/opensearch-project/oui/pull/1381))
+- Adjust OuiSimplifiedBreadcrumbs alignment, colors, and tailing slash ([#1401](https://github.com/opensearch-project/oui/pull/1401))
 
 ### 🚞 Infrastructure
 
diff --git a/src/components/breadcrumbs/_breadcrumbs_simplified.scss b/src/components/breadcrumbs/_breadcrumbs_simplified.scss
index 4f6a40a9c..c1d8f0603 100644
--- a/src/components/breadcrumbs/_breadcrumbs_simplified.scss
+++ b/src/components/breadcrumbs/_breadcrumbs_simplified.scss
@@ -11,18 +11,27 @@
 
 .ouiSimplifiedBreadcrumbs {
   @include ouiFontSizeS;
-  margin-bottom: -$ouiSizeXS; /* 1 */
   display: flex;
   align-items: center;
   flex-wrap: wrap;
   min-width: 0; // Ensure it shrinks if the window is narrow
   margin-left: 0;
+
+  .euiLink.euiLink--text:focus {
+    animation: none;
+    background: none;
+  }
 }
 
 .ouiSimplifiedBreadcrumb {
   display: inline-block;
-  color: $ouiLinkColor !important; // sass-lint:disable-line no-important
   margin-right: $ouiBreadcrumbSpacing;
+
+  &.euiLink {
+    line-height: inherit;
+    font-weight: inherit;
+    color: $ouiLinkColor !important; // sass-lint:disable-line no-important
+  }
 }
 
 .ouiSimplifiedBreadcrumb--collapsed {
@@ -77,9 +86,8 @@
   transform: translateY(-1px) rotate(15deg);
   background: $ouiColorLightShade;
   color: $ouiColorDisabledText;
-}
 
-.euiLink.euiSimplifiedBreadcrumb {
-  line-height: inherit;
-  font-weight: inherit;
-}
\ No newline at end of file
+  &:last-child {
+    display: none;
+  }
+}