refactor(Breadcrumb): use CSS logical properties instead of physical …

…values (#1101)
Endava · Jun 11, 2024 · e4b1638 · e4b1638
1 parent 84a311a
commit e4b1638
Show file tree

Hide file tree

Showing 2 changed files with 2 additions and 2 deletions.
diff --git a/packages/beeq/src/components/breadcrumb-item/scss/bq-breadcrumb-item.scss b/packages/beeq/src/components/breadcrumb-item/scss/bq-breadcrumb-item.scss
@@ -7,7 +7,7 @@
 .breadcrumb-item {
   @apply border-[length:--bq-breadcrumb-item--border-width] border-[color:--bq-breadcrumb-item--border-color];
   @apply rounded-[--bq-breadcrumb-item--border-radius] bg-[--bq-breadcrumb-item--background] shadow-[shadow:--bq-breadcrumb-item--box-shadow];
-  @apply py-[--bq-breadcrumb-item--paddingY] pe-[--bq-breadcrumb-item--padding-end] ps-[--bq-breadcrumb-item--padding-start];
+  @apply pe-[--bq-breadcrumb-item--padding-end] ps-[--bq-breadcrumb-item--padding-start] p-b-[--bq-breadcrumb-item--paddingY];
   @apply text-[length:--bq-breadcrumb-item--text-size] font-regular leading-[--bq-breadcrumb-item--line-height] text-[color:--bq-breadcrumb-item--text-color];
   @apply focus-visible:focus hover:text-hover-text-brand active:outline-none;
   @apply transition-colors duration-300 ease-in-out;

diff --git a/packages/beeq/src/components/breadcrumb/bq-breadcrumb.tsx b/packages/beeq/src/components/breadcrumb/bq-breadcrumb.tsx
@@ -122,7 +122,7 @@ export class BqBreadcrumb {
 
         <span hidden aria-hidden="true" ref={(element) => (this.spanElem = element)}>
           <slot name="separator">
-            <span class="flex w-3 items-center justify-center">/</span>
+            <span class="flex items-center justify-center is-3">/</span>
           </slot>
         </span>
       </Host>