Changeset 110633 in spip-zone for _plugins_/owlcarousel


Ignore:
Timestamp:
Jun 12, 2018, 7:40:43 AM (5 months ago)
Author:
arnaud.berard@…
Message:

maj des css de owlcarousel version 2.3 base + theme

correctifs sur les buttons.prev/next, touch …

Location:
_plugins_/owlcarousel/trunk/css
Files:
2 edited

Legend:

Unmodified
Added
Removed
  • _plugins_/owlcarousel/trunk/css/owl.carousel.css

    r104551 r110633  
    11/**
    2  * Owl Carousel v2.1.6
    3  * Copyright 2013-2016 David Deutsch
    4  * Licensed under MIT (https://github.com/OwlCarousel2/OwlCarousel2/blob/master/LICENSE)
     2 * Owl Carousel v2.3.4
     3 * Copyright 2013-2018 David Deutsch
     4 * Licensed under: SEE LICENSE IN https://github.com/OwlCarousel2/OwlCarousel2/blob/master/LICENSE
    55 */
    6 
    7 
    86/*
    97 *  Owl Carousel - Core
    108 */
    11 
    129.owl-carousel {
    13         display: none;
    14         width: 100%;
    15         -webkit-tap-highlight-color: transparent;
    16         /* position relative and z-index fix webkit rendering fonts issue */
    17         position: relative;
    18         z-index: 1;
    19 }
    20 
    21 .owl-carousel .owl-stage {
    22         position: relative;
    23         -ms-touch-action: pan-Y;
    24 }
    25 
    26 .owl-carousel .owl-stage:after {
    27         content: ".";
    28         display: block;
    29         clear: both;
    30         visibility: hidden;
    31         line-height: 0;
    32         height: 0;
    33 }
    34 
    35 .owl-carousel .owl-stage-outer {
    36         position: relative;
    37         overflow: hidden;
    38         /* fix for flashing background */
    39         -webkit-transform: translate3d(0px, 0px, 0px);
    40 }
    41 
    42 .owl-carousel .owl-item {
    43         position: relative;
    44         min-height: 1px;
    45         float: left;
    46         -webkit-backface-visibility: hidden;
    47         -webkit-tap-highlight-color: transparent;
    48         -webkit-touch-callout: none;
    49 }
    50 
    51 .owl-carousel .owl-item img {
    52         display: block;
    53         width: 100%;
    54         -webkit-transform-style: preserve-3d;
    55 }
    56 
    57 .owl-carousel .owl-nav.disabled,
    58 .owl-carousel .owl-dots.disabled {
    59         display: none;
    60 }
    61 
    62 .owl-carousel .owl-nav .owl-prev,
    63 .owl-carousel .owl-nav .owl-next,
    64 .owl-carousel .owl-dot {
    65         cursor: pointer;
    66         cursor: hand;
    67         -webkit-user-select: none;
    68         -khtml-user-select: none;
    69         -moz-user-select: none;
    70         -ms-user-select: none;
    71         user-select: none;
    72 }
    73 
    74 .owl-carousel.owl-loaded {
    75         display: block;
    76 }
    77 
    78 .owl-carousel.owl-loading {
    79         opacity: 0;
    80         display: block;
    81 }
    82 
    83 .owl-carousel.owl-hidden {
    84         opacity: 0;
    85 }
    86 
    87 .owl-carousel.owl-refresh .owl-item {
    88         display: none;
    89 }
    90 
    91 .owl-carousel.owl-drag .owl-item {
    92         -webkit-user-select: none;
    93         -moz-user-select: none;
    94         -ms-user-select: none;
    95         user-select: none;
    96 }
    97 
    98 .owl-carousel.owl-grab {
    99         cursor: move;
    100         cursor: grab;
    101 }
    102 
    103 .owl-carousel.owl-rtl {
    104         direction: rtl;
    105 }
    106 
    107 .owl-carousel.owl-rtl .owl-item {
    108         float: right;
    109 }
    110 
     10  display: none;
     11  width: 100%;
     12  -webkit-tap-highlight-color: transparent;
     13  /* position relative and z-index fix webkit rendering fonts issue */
     14  position: relative;
     15  z-index: 1; }
     16  .owl-carousel .owl-stage {
     17    position: relative;
     18    -ms-touch-action: pan-Y;
     19    touch-action: manipulation;
     20    -moz-backface-visibility: hidden;
     21    /* fix firefox animation glitch */ }
     22  .owl-carousel .owl-stage:after {
     23    content: ".";
     24    display: block;
     25    clear: both;
     26    visibility: hidden;
     27    line-height: 0;
     28    height: 0; }
     29  .owl-carousel .owl-stage-outer {
     30    position: relative;
     31    overflow: hidden;
     32    /* fix for flashing background */
     33    -webkit-transform: translate3d(0px, 0px, 0px); }
     34  .owl-carousel .owl-wrapper,
     35  .owl-carousel .owl-item {
     36    -webkit-backface-visibility: hidden;
     37    -moz-backface-visibility: hidden;
     38    -ms-backface-visibility: hidden;
     39    -webkit-transform: translate3d(0, 0, 0);
     40    -moz-transform: translate3d(0, 0, 0);
     41    -ms-transform: translate3d(0, 0, 0); }
     42  .owl-carousel .owl-item {
     43    position: relative;
     44    min-height: 1px;
     45    float: left;
     46    -webkit-backface-visibility: hidden;
     47    -webkit-tap-highlight-color: transparent;
     48    -webkit-touch-callout: none; }
     49  .owl-carousel .owl-item img {
     50    display: block;
     51    width: 100%; }
     52  .owl-carousel .owl-nav.disabled,
     53  .owl-carousel .owl-dots.disabled {
     54    display: none; }
     55  .owl-carousel .owl-nav .owl-prev,
     56  .owl-carousel .owl-nav .owl-next,
     57  .owl-carousel .owl-dot {
     58    cursor: pointer;
     59    -webkit-user-select: none;
     60    -khtml-user-select: none;
     61    -moz-user-select: none;
     62    -ms-user-select: none;
     63    user-select: none; }
     64  .owl-carousel .owl-nav button.owl-prev,
     65  .owl-carousel .owl-nav button.owl-next,
     66  .owl-carousel button.owl-dot {
     67    background: none;
     68    color: inherit;
     69    border: none;
     70    padding: 0 !important;
     71    font: inherit; }
     72  .owl-carousel.owl-loaded {
     73    display: block; }
     74  .owl-carousel.owl-loading {
     75    opacity: 0;
     76    display: block; }
     77  .owl-carousel.owl-hidden {
     78    opacity: 0; }
     79  .owl-carousel.owl-refresh .owl-item {
     80    visibility: hidden; }
     81  .owl-carousel.owl-drag .owl-item {
     82    -ms-touch-action: pan-y;
     83        touch-action: pan-y;
     84    -webkit-user-select: none;
     85    -moz-user-select: none;
     86    -ms-user-select: none;
     87    user-select: none; }
     88  .owl-carousel.owl-grab {
     89    cursor: move;
     90    cursor: grab; }
     91  .owl-carousel.owl-rtl {
     92    direction: rtl; }
     93  .owl-carousel.owl-rtl .owl-item {
     94    float: right; }
    11195
    11296/* No Js */
    113 
    11497.no-js .owl-carousel {
    115         display: block;
    116 }
    117 
     98  display: block; }
    11899
    119100/*
    120101 *  Owl Carousel - Animate Plugin
    121102 */
    122 
    123103.owl-carousel .animated {
    124         animation-duration: 1000ms;
    125         animation-fill-mode: both;
    126 }
     104  animation-duration: 1000ms;
     105  animation-fill-mode: both; }
    127106
    128107.owl-carousel .owl-animated-in {
    129         z-index: 0;
    130 }
     108  z-index: 0; }
    131109
    132110.owl-carousel .owl-animated-out {
    133         z-index: 1;
    134 }
     111  z-index: 1; }
    135112
    136113.owl-carousel .fadeOut {
    137         animation-name: fadeOut;
    138 }
     114  animation-name: fadeOut; }
    139115
    140116@keyframes fadeOut {
    141         0% {
    142                 opacity: 1;
    143         }
    144         100% {
    145                 opacity: 0;
    146         }
    147 }
    148 
     117  0% {
     118    opacity: 1; }
     119  100% {
     120    opacity: 0; } }
    149121
    150122/*
    151123 *      Owl Carousel - Auto Height Plugin
    152124 */
    153 
    154125.owl-height {
    155         transition: height 500ms ease-in-out;
    156 }
    157 
     126  transition: height 500ms ease-in-out; }
    158127
    159128/*
    160129 *      Owl Carousel - Lazy Load Plugin
    161130 */
    162 
    163 .owl-carousel .owl-item .owl-lazy {
    164         opacity: 0;
    165         transition: opacity 400ms ease;
    166 }
    167 
    168 .owl-carousel .owl-item img.owl-lazy {
    169         transform-style: preserve-3d;
    170 }
    171 
     131.owl-carousel .owl-item {
     132  /**
     133                        This is introduced due to a bug in IE11 where lazy loading combined with autoheight plugin causes a wrong
     134                        calculation of the height of the owl-item that breaks page layouts
     135                 */ }
     136  .owl-carousel .owl-item .owl-lazy {
     137    opacity: 0;
     138    transition: opacity 400ms ease; }
     139  .owl-carousel .owl-item .owl-lazy[src^=""], .owl-carousel .owl-item .owl-lazy:not([src]) {
     140    max-height: 0; }
     141  .owl-carousel .owl-item img.owl-lazy {
     142    transform-style: preserve-3d; }
    172143
    173144/*
    174145 *      Owl Carousel - Video Plugin
    175146 */
    176 
    177147.owl-carousel .owl-video-wrapper {
    178         position: relative;
    179         height: 100%;
    180         background: #000;
    181 }
     148  position: relative;
     149  height: 100%;
     150  background: #000; }
    182151
    183152.owl-carousel .owl-video-play-icon {
    184         position: absolute;
    185         height: 80px;
    186         width: 80px;
    187         left: 50%;
    188         top: 50%;
    189         margin-left: -40px;
    190         margin-top: -40px;
    191         background: url("../images/owl.video.play.png") no-repeat;
    192         cursor: pointer;
    193         z-index: 1;
    194         -webkit-backface-visibility: hidden;
    195         transition: transform 100ms ease;
    196 }
     153  position: absolute;
     154  height: 80px;
     155  width: 80px;
     156  left: 50%;
     157  top: 50%;
     158  margin-left: -40px;
     159  margin-top: -40px;
     160  background: url("owl.video.play.png") no-repeat;
     161  cursor: pointer;
     162  z-index: 1;
     163  -webkit-backface-visibility: hidden;
     164  transition: transform 100ms ease; }
    197165
    198166.owl-carousel .owl-video-play-icon:hover {
    199         -ms-transform: scale(1.3, 1.3);
    200         transform: scale(1.3, 1.3);
    201 }
     167  -ms-transform: scale(1.3, 1.3);
     168      transform: scale(1.3, 1.3); }
    202169
    203170.owl-carousel .owl-video-playing .owl-video-tn,
    204171.owl-carousel .owl-video-playing .owl-video-play-icon {
    205         display: none;
    206 }
     172  display: none; }
    207173
    208174.owl-carousel .owl-video-tn {
    209         opacity: 0;
    210         height: 100%;
    211         background-position: center center;
    212         background-repeat: no-repeat;
    213         background-size: contain;
    214         transition: opacity 400ms ease;
    215 }
     175  opacity: 0;
     176  height: 100%;
     177  background-position: center center;
     178  background-repeat: no-repeat;
     179  background-size: contain;
     180  transition: opacity 400ms ease; }
    216181
    217182.owl-carousel .owl-video-frame {
    218         position: relative;
    219         z-index: 1;
    220         height: 100%;
    221         width: 100%;
    222 }
     183  position: relative;
     184  z-index: 1;
     185  height: 100%;
     186  width: 100%; }
  • _plugins_/owlcarousel/trunk/css/owl.theme.css

    r104551 r110633  
    11/**
    2  * Owl Carousel v2.1.6
    3  * Copyright 2013-2016 David Deutsch
    4  * Licensed under MIT (https://github.com/OwlCarousel2/OwlCarousel2/blob/master/LICENSE)
     2 * Owl Carousel v2.3.4
     3 * Copyright 2013-2018 David Deutsch
     4 * Licensed under: SEE LICENSE IN https://github.com/OwlCarousel2/OwlCarousel2/blob/master/LICENSE
    55 */
    6 
    7 
    86/*
    97 *      Default theme - Owl Carousel CSS File
    108 */
     9.owl-theme .owl-nav {
     10  margin-top: 10px;
     11  text-align: center;
     12  -webkit-tap-highlight-color: transparent; }
     13  .owl-theme .owl-nav [class*='owl-'] {
     14    color: #FFF;
     15    font-size: 14px;
     16    margin: 5px;
     17    padding: 4px 7px;
     18    background: #D6D6D6;
     19    display: inline-block;
     20    cursor: pointer;
     21    border-radius: 3px; }
     22    .owl-theme .owl-nav [class*='owl-']:hover {
     23      background: #869791;
     24      color: #FFF;
     25      text-decoration: none; }
     26  .owl-theme .owl-nav .disabled {
     27    opacity: 0.5;
     28    cursor: default; }
    1129
    12 .owl-theme .owl-nav {
    13         margin-top: 10px;
    14         text-align: center;
    15         -webkit-tap-highlight-color: transparent;
    16 }
    17 
    18 .owl-theme .owl-nav [class*='owl-'] {
    19         color: #FFF;
    20         font-size: 14px;
    21         margin: 5px;
    22         padding: 4px 7px;
    23         background: #D6D6D6;
    24         display: inline-block;
    25         cursor: pointer;
    26         border-radius: 3px;
    27 }
    28 
    29 .owl-theme .owl-nav [class*='owl-']:hover {
    30         background: #869791;
    31         color: #FFF;
    32         text-decoration: none;
    33 }
    34 
    35 .owl-theme .owl-nav .disabled {
    36         opacity: 0.5;
    37         cursor: default;
    38 }
    39 
    40 .owl-theme .owl-nav.disabled+.owl-dots {
    41         margin-top: 10px;
    42 }
     30.owl-theme .owl-nav.disabled + .owl-dots {
     31  margin-top: 10px; }
    4332
    4433.owl-theme .owl-dots {
    45         text-align: center;
    46         -webkit-tap-highlight-color: transparent;
    47 }
    48 
    49 .owl-theme .owl-dots .owl-dot {
    50         display: inline-block;
    51         zoom: 1;
    52         *display: inline;
    53 }
    54 
    55 .owl-theme .owl-dots .owl-dot span {
    56         width: 10px;
    57         height: 10px;
    58         margin: 5px 7px;
    59         background: #D6D6D6;
    60         display: block;
    61         -webkit-backface-visibility: visible;
    62         transition: opacity 200ms ease;
    63         border-radius: 30px;
    64 }
    65 
    66 .owl-theme .owl-dots .owl-dot.active span,
    67 .owl-theme .owl-dots .owl-dot:hover span {
    68         background: #869791;
    69 }
     34  text-align: center;
     35  -webkit-tap-highlight-color: transparent; }
     36  .owl-theme .owl-dots .owl-dot {
     37    display: inline-block;
     38    zoom: 1;
     39    *display: inline; }
     40    .owl-theme .owl-dots .owl-dot span {
     41      width: 10px;
     42      height: 10px;
     43      margin: 5px 7px;
     44      background: #D6D6D6;
     45      display: block;
     46      -webkit-backface-visibility: visible;
     47      transition: opacity 200ms ease;
     48      border-radius: 30px; }
     49    .owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span {
     50      background: #869791; }
Note: See TracChangeset for help on using the changeset viewer.