Format

donaldxdonald · Jan 25, 2024 · 0479429 · 0479429
1 parent b98c746
commit 0479429
Show file tree

Hide file tree

Showing 3 changed files with 23 additions and 25 deletions.
diff --git a/playgrounds/embla-carousel-playground-angular/.editorconfig b/playgrounds/embla-carousel-playground-angular/.editorconfig
diff --git a/playgrounds/embla-carousel-playground-angular/src/app/app.component.html b/playgrounds/embla-carousel-playground-angular/src/app/app.component.html
@@ -1,6 +1,6 @@
 <main class="playground">
   <h1 class="playground__h1">Playground - Angular</h1>
   <div class="sandbox__carousel">
-    <app-carousel [options]="OPTIONS" [slides]="SLIDES" ></app-carousel>
+    <app-carousel [options]="OPTIONS" [slides]="SLIDES"></app-carousel>
   </div>
 </main>
diff --git a/playgrounds/embla-carousel-playground-angular/src/app/carousel/carousel.component.html b/playgrounds/embla-carousel-playground-angular/src/app/carousel/carousel.component.html
@@ -1,14 +1,20 @@
-
-<div class="embla" >
-  <div class="embla__viewport" emblaCarousel #emblaRef="emblaCarousel" [options]="options" [subscribeToEvents]="subscribeToEvents" (emblaChange)="onSelect(emblaRef.emblaApi!)">
+<div class="embla">
+  <div
+    class="embla__viewport"
+    emblaCarousel
+    #emblaRef="emblaCarousel"
+    [options]="options"
+    [subscribeToEvents]="subscribeToEvents"
+    (emblaChange)="onSelect(emblaRef.emblaApi!)"
+  >
     <div class="embla__container">
       <div *ngFor="let slide of slides; let index" class="embla__slide">
         <div class="embla__slide__number">
-          <span>{{index + 1}}</span>
+          <span>{{ index + 1 }}</span>
         </div>
         <img
           class="embla__slide__img"
-          [src]="'/assets/images/slide-'+ (index + 1) +'.jpg'"
+          [src]="'/assets/images/slide-' + (index + 1) + '.jpg'"
           alt="Your alt text"
         />
       </div>
@@ -22,7 +28,9 @@
       (click)="scrollPrev()"
     >
       <svg class="embla__button__svg" viewBox="137.718 -1.001 366.563 644">
-        <path d="M428.36 12.5c16.67-16.67 43.76-16.67 60.42 0 16.67 16.67 16.67 43.76 0 60.42L241.7 320c148.25 148.24 230.61 230.6 247.08 247.08 16.67 16.66 16.67 43.75 0 60.42-16.67 16.66-43.76 16.67-60.42 0-27.72-27.71-249.45-249.37-277.16-277.08a42.308 42.308 0 0 1-12.48-30.34c0-11.1 4.1-22.05 12.48-30.42C206.63 234.23 400.64 40.21 428.36 12.5z" />
+        <path
+          d="M428.36 12.5c16.67-16.67 43.76-16.67 60.42 0 16.67 16.67 16.67 43.76 0 60.42L241.7 320c148.25 148.24 230.61 230.6 247.08 247.08 16.67 16.66 16.67 43.75 0 60.42-16.67 16.66-43.76 16.67-60.42 0-27.72-27.71-249.45-249.37-277.16-277.08a42.308 42.308 0 0 1-12.48-30.34c0-11.1 4.1-22.05 12.48-30.42C206.63 234.23 400.64 40.21 428.36 12.5z"
+        />
       </svg>
     </button>
     <button
@@ -31,7 +39,9 @@
       (click)="scrollNext()"
     >
       <svg class="embla__button__svg" viewBox="0 0 238.003 238.003">
-        <path d="M181.776 107.719L78.705 4.648c-6.198-6.198-16.273-6.198-22.47 0s-6.198 16.273 0 22.47l91.883 91.883-91.883 91.883c-6.198 6.198-6.198 16.273 0 22.47s16.273 6.198 22.47 0l103.071-103.039a15.741 15.741 0 0 0 4.64-11.283c0-4.13-1.526-8.199-4.64-11.313z" />
+        <path
+          d="M181.776 107.719L78.705 4.648c-6.198-6.198-16.273-6.198-22.47 0s-6.198 16.273 0 22.47l91.883 91.883-91.883 91.883c-6.198 6.198-6.198 16.273 0 22.47s16.273 6.198 22.47 0l103.071-103.039a15.741 15.741 0 0 0 4.64-11.283c0-4.13-1.526-8.199-4.64-11.313z"
+        />
       </svg>
     </button>
   </div>
@@ -40,7 +50,11 @@
 <div class="embla__dots">
   <ng-template *ngFor="let item of scrollSnaps; let index">
     <button
-      [ngClass]="'embla__dot'.concat(index === selectedIndex ? ' embla__dot--selected' : '')"
+      [ngClass]="
+        'embla__dot'.concat(
+          index === selectedIndex ? ' embla__dot--selected' : ''
+        )
+      "
       type="button"
       (click)="scrollTo(index)"
     ></button>