chore(*): update carousel sample alignment

Author: dobromirts

src/app/layouts/carousel/carousel-animations-sample/carousel-animations-sample.component.html

@@ -1,7 +1,7 @@
 <div class="carousel-animation-wrapper">
     <div class="action-wrapper">
-        <span style="margin: 0 5px 0 10px;">Current animation: </span>
-        <span style="max-width: 100px;">
+        <span>Current animation: </span>
+        <span class="select-container">
             <igx-select #select [(ngModel)]="carousel.animationType">
                 <igx-select-item *ngFor="let animation of animations" [value]="animation">
                     {{animation | titlecase}}
@@ -17,15 +17,15 @@
                         <igx-card-header>
                             <h4 igxCardHeaderTitle>{{slide.heading}}</h4>
                         </igx-card-header>
-
+ 
                         <igx-card-content>
                             <p>{{slide.description}}</p>
                         </igx-card-content>
-
+ 
                         <igx-card-media>
                             <img [src]="slide.image">
                         </igx-card-media>
-
+ 
                         <igx-card-actions>
                             <a igxButton href="{{slide.link}}" target="_blank" rel="noopener" style="text-decoration: none;" igxStart>visit page</a>
                         </igx-card-actions>
@@ -36,3 +36,4 @@ <h4 igxCardHeaderTitle>{{slide.heading}}</h4>
         </igx-carousel>
     </div>
 </div>
+ 

src/app/layouts/carousel/carousel-animations-sample/carousel-animations-sample.component.scss

@@ -5,35 +5,55 @@
     justify-content: center;
     height: 100%;
     padding: 10px;
-
+ 
     img {
         width: 100%;
     }
 }
-
+ 
 .carousel-wrapper {
     max-height: 600px;
     height: 100%;
     width: 90%;
     margin: 20px auto;
 }
-
+ 
 .action-wrapper {
     height: 40px;
     width: 70%;
     display: flex;
     align-items: baseline;
     margin-bottom: 1rem;
-    margin-left: 1rem;
+    margin-left: 5.7rem;
 }
-
+ 
 .carousel-animation-wrapper {
     height: 700px;
     margin: 16px auto;
     display: flex;
     flex-flow: column;
 }
-
+ 
 .igx-card {
     box-shadow: none;
 }
+ 
+.select-container {
+    margin-left: 10px;
+}
+ 
+span:first-child {
+    position: relative;
+    bottom: 2px;
+}
+ 
+igx-select {
+    width: 150px;
+}
+ 
+::ng-deep {
+    .input.igx-input-group__input {
+        top: 10px;
+        left: 10px;
+    }
+}