You are here

Home » API reference » Slick Carousel 7.2

slick.theme--split.css in Slick Carousel 7.2

Same filename and directory in other branches
  1. 8.2 css/theme/slick.theme--split.css
  2. 8 css/theme/slick.theme--split.css
  3. 7.3 css/theme/slick.theme--split.css

Detailed stylings are all yours, get yourself dirty.

File

css/theme/slick.theme--split.css
View source 
  1. /**

  2.  * @file

  3.  * Detailed stylings are all yours, get yourself dirty.

  4.  */

  5. .slick--skin--split .slide__caption {

  6.   top: 0;

  7. }

  8. 

  9. @media (min-width: 64em) {

  10.   .slide--caption--split-left .slide__caption,

  11.   .slide--caption--split-right .slide__caption {

  12.     left: 0;

  13.     padding: 20px;

  14.     position: relative;

  15.     top: 10%;

  16.     width: 42%;

  17.   }

  18. 

  19.   .slick--skin--split .slide--caption--split-left .slide__media,

  20.   .slick--skin--split .slide--caption--split-zebra:nth-child(odd) .slide__media {

  21.     float: left;

  22.     width: 48%;

  23.   }

  24. 

  25.   .slick--skin--split .slide--caption--split-right .slide__media,

  26.   .slick--skin--split .slide--caption--split-zebra:nth-child(even) .slide__media {

  27.     float: right;

  28.     width: 48%;

  29.   }

  30. 

  31.   .slick--skin--split .slide--caption--split-left .slide__caption,

  32.   .slick--skin--split .slide--caption--split-zebra:nth-child(odd) .slide__caption {

  33.     margin-left: 52%;

  34.     width: auto;

  35.   }

  36. 

  37.   .slick--skin--split .slide--caption--split-right .slide__caption,

  38.   .slick--skin--split .slide--caption--split-zebra:nth-child(even) .slide__caption {

  39.     margin-right: 52%;

  40.     width: auto;

  41.   }

  42. 

  43.   .slick--skin--split .slide--caption--split-left .slide__media,

  44.   .slick--skin--split .slide--caption--split-zebra:nth-child(odd) .slide__media {

  45.     float: left;

  46.     width: 48%;

  47.   }

  48. 

  49.   .slick--skin--split .slide--caption--split-right .slide__media,

  50.   .slick--skin--split .slide--caption--split-zebra:nth-child(even) .slide__media {

  51.     float: right;

  52.     width: 48%;

  53.   }

  54. 

  55.   .slick--skin--split .slide--caption--split-left .slide__constrained > .slide__caption,

  56.   .slick--skin--split .slide--caption--split-zebra:nth-child(odd) .slide__constrained > .slide__caption,

  57.   .slick--skin--split .slide--caption--split-left .slide__caption,

  58.   .slick--skin--split .slide--caption--split-zebra:nth-child(odd) .slide__caption {

  59.     margin-left: 52%;

  60.     width: auto;

  61.   }

  62. 

  63.   .slick--skin--split .slide--caption--split-right .slide__constrained > .slide__caption,

  64.   .slick--skin--split .slide--caption--split-zebra:nth-child(even) .slide__constrained > .slide__caption,

  65.   .slick--skin--split .slide--caption--split-right .slide__caption,

  66.   .slick--skin--split .slide--caption--split-zebra:nth-child(even) .slide__caption {

  67.     margin-right: 52%;

  68.     width: auto;

  69.   }

  70. }