src/examples/carousel/resources/sass/app.scss

   1 /**
   2  * Cusotm css for the Carousel example
   3  */
   4
   5 body,
   6 .x-fullscreen, .x-layout-fit-item, .x-layout-card-item {
   7     background-color: #000;
   8 }
   9
  10 .my-carousel-item {
  11     background: url(images/loading.png) no-repeat center center;
  12 }
  13
  14 @media screen and (orientation:portrait) {
  15     .my-carousel-item-img {
  16         background-size: 100% auto;
  17     }
  18 }
  19
  20 @media screen and (orientation:landscape) {
  21     .my-carousel-item-img {
  22         background-size: auto 100%;
  23     }
  24 }
  25
  26 .x-portrait .my-carousel-item-img {
  27     background-size: 100% auto;
  28 }
  29
  30 .x-landscape .my-carousel-item-img {
  31     background-size: auto 100%;
  32 }
  33
  34 .my-carousel-item-img {
  35     background-position: center center;
  36 }
  37
  38 .x-carousel-indicator > * {
  39     background-color: orange !important;
  40     opacity: 0.4;
  41 }
  42
  43 .x-carousel-indicator > .x-carousel-indicator-active {
  44     opacity: 1;
  45 }