source: extensions/Fotorama/template/info_button.css

Last change on this file was 29947, checked in by JanisV, 10 years ago

Fixed info button for retina display

  • Property svn:executable set to *
File size: 1.4 KB
Line 
1.fotorama__info-icon {
2  width: 32px;
3  height: 32px;
4  bottom: 2px;
5  right: 2px;
6  z-index: 20;
7  background: url(../template/info_button.png) no-repeat scroll;
8  position: absolute;
9  cursor: pointer;
10}
11@media (-webkit-min-device-pixel-ratio: 1.5), (min-resolution: 2dppx) {
12  .fotorama__info-icon {
13    background: url('../template/info_button@2x.png') no-repeat scroll;
14    background-size: 32px 32px;
15  }
16}
17.fotorama__wrap--no-controls.fotorama__wrap--toggle-arrows .fotorama__info-icon {
18  opacity: 0;
19}
20.fotorama__wrap--no-controls.fotorama__wrap--toggle-arrows .fotorama__info-icon:focus {
21  opacity: 1;
22}
23.fotorama__wrap--css2.fotorama__wrap--no-controls.fotorama__wrap--toggle-arrows .fotorama__info-icon {
24  display: none;
25}
26.fotorama__wrap--css2.fotorama__wrap--no-controls.fotorama__wrap--toggle-arrows .fotorama__info-icon:focus {
27  display: block;
28}
29.fotorama__wrap--css2.fotorama__wrap--video .fotorama__info-icon {
30  display: none !important;
31}
32.fotorama__wrap--css3.fotorama__wrap--no-controls.fotorama__wrap--slide.fotorama__wrap--toggle-arrows .fotorama__info-icon:not(:focus) {
33  -webkit-transform: translate3d(32px,32px,0);
34  transform: translate3d(32px,32px,0);
35}
36.fotorama__wrap--css3 .fotorama__info-icon {
37  -webkit-transform: translate3d(0,0,0);
38  transform: translate3d(0,0,0);
39}
40.fotorama__wrap--css3 .fotorama__info-icon:not(:focus) {
41  transition-property: transform, opacity;
42  transition-duration: 0.3s;
43}
Note: See TracBrowser for help on using the repository browser.