js/shoelace
1
0
Fork 0
mirror of https://github.com/shoelace-style/shoelace.git synced 2026-01-12 02:59:13 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(carousel): navigation arrow directionality for ltr/rtl

Browse Source
This commit is contained in:
Alessandro
2024-10-25 08:51:06 +00:00
committed by GitHub
parent 09024cfee5
commit 32f3eb7ebb
1 changed files with 3 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/components/carousel/carousel.component.ts
View File

@@ -512,7 +512,7 @@ export default class SlCarousel extends ShoelaceElement {
const currentPage = this.getCurrentPage(); const currentPage = this.getCurrentPage();
const prevEnabled = this.canScrollPrev(); const prevEnabled = this.canScrollPrev();
const nextEnabled = this.canScrollNext(); const nextEnabled = this.canScrollNext();
const isLtr = this.localize.dir() === 'rtl'; const isRtl = this.localize.dir() === 'rtl';
return html` return html`
<div part="base" class="carousel"> <div part="base" class="carousel">
@@ -553,7 +553,7 @@ export default class SlCarousel extends ShoelaceElement {
@click=${prevEnabled ? () => this.previous() : null} @click=${prevEnabled ? () => this.previous() : null}
> >
<slot name="previous-icon"> <slot name="previous-icon">
<sl-icon library="system" name="${isLtr ? 'chevron-left' : 'chevron-right'}"></sl-icon> <sl-icon library="system" name="${isRtl ? 'chevron-right' : 'chevron-left'}"></sl-icon>
</slot> </slot>
</button> </button>
@@ -570,7 +570,7 @@ export default class SlCarousel extends ShoelaceElement {
@click=${nextEnabled ? () => this.next() : null} @click=${nextEnabled ? () => this.next() : null}
> >
<slot name="next-icon"> <slot name="next-icon">
<sl-icon library="system" name="${isLtr ? 'chevron-right' : 'chevron-left'}"></sl-icon> <sl-icon library="system" name="${isRtl ? 'chevron-left' : 'chevron-right'}"></sl-icon>
</slot> </slot>
</button> </button>
</div> </div>