yaffs.net Git - yaffs-website/blob - web/modules/contrib/slick/css/theme/slick.theme--asnavfor.css

   1 /**
   2  * @file
   3  * Provides basic thumbnail asNavFor skin.
   4  *
   5  * Main display has class "slick--main".
   6  * Thumbnail has class "slick--thumbnail".
   7  *
   8  * Tips: Be sure to use odd number for slideToShow with centerMode on.
   9  */
  10 .slick--thumbnail.slick--skin--asnavfor {
  11   margin-left: auto;
  12   margin-right: auto;
  13   padding: 0;
  14 }
  15
  16 .slick--thumbnail.slick--skin--asnavfor .slick-list {
  17   margin: 0 auto;
  18   padding: 30px 0;
  19 }
  20
  21 .slick--thumbnail.slick--skin--asnavfor .slide__caption p {
  22   margin: 0;
  23 }
  24
  25 .slick--thumbnail.slick--skin--asnavfor .slick-current {
  26   background: #fff;
  27 }
  28
  29 .slick--thumbnail.slick--skin--asnavfor .slick__slide {
  30   margin: 0 2px;
  31   overflow: visible;
  32   -webkit-backface-visibility: hidden;
  33   backface-visibility: hidden;
  34   -webkit-transition: -webkit-transform 0.4s ease-in-out 0.2s;
  35   transition: transform 0.4s ease-in-out 0.2s;
  36 }
  37
  38 .slick--thumbnail.slick--skin--asnavfor .slick__slide img {
  39   border: 6px solid transparent;
  40   cursor: pointer;
  41   position: relative;
  42   width: 100%;
  43 }
  44
  45 .slick--thumbnail.slick--skin--asnavfor .slick__slide.slick-current {
  46   box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
  47   -ms-transform: scale(1.3);
  48   -webkit-transform: scale(1.3);
  49   transform: scale(1.3);
  50   -webkit-transition-delay: 0s;
  51   transition-delay: 0s;
  52   z-index: 4;
  53 }
  54
  55 .slick--thumbnail.slick--skin--asnavfor .slick__slide.slick-current::before {
  56   content: '';
  57   display: block;
  58   border: 8px solid transparent;
  59   border-top: 0;
  60   border-bottom-color: #fff;
  61   height: 0;
  62   left: 50%;
  63   margin-left: -8px;
  64   position: absolute;
  65   top: -5px;
  66   width: 0;
  67   z-index: 1;
  68 }
  69
  70 .slick--thumbnail.slick--skin--asnavfor .slick__slide.slick-current img {
  71   border-color: #fff;
  72 }
  73
  74 .slick--thumbnail.slick--skin--asnavfor .slick-track {
  75   padding-bottom: 40px;
  76   padding-top: 40px;
  77 }
  78
  79 .slick--thumbnail.slick--skin--asnavfor .slick__arrow .slick-disabled {
  80   pointer-events: none;
  81   opacity: 0;
  82 }
  83
  84 /**
  85  * Thumnails layout.
  86  */
  87 .slick-wrapper--tn-top .slick--thumbnail.slick--skin--asnavfor .slick__slide.slick-current::before {
  88   top: auto;
  89   bottom: -6px;
  90   border-top: 8px solid #fff;
  91   border-bottom: 0;
  92 }
  93
  94 .slick-wrapper--tn-top .slick--thumbnail.slick--skin--asnavfor {
  95   margin-bottom: 0;
  96   z-index: 9;
  97 }
  98
  99 .slick-wrapper--tn-top .slick--thumbnail.slick--skin--asnavfor .slick-list {
 100   padding-bottom: 18px;
 101 }