You are here

Home » API reference » Blazy PhotoSwipe 7

blazy.photoswipe.theme.css in Blazy PhotoSwipe 7

Same filename and directory in other branches
  1. 8 css/blazy.photoswipe.theme.css

File

css/blazy.photoswipe.theme.css
View source 
  1. /**

  2.  * @file

  3.  */

  4. 

  5. /** Fix for unclean destroy. */

  6. .pswp[aria-hidden="true"] {

  7.   display: none;

  8. }

  9. 

  10. .pswp__item {

  11.   text-align: center;

  12. }

  13. 

  14. .pswp .media-wrapper {

  15.   display: inline-block;

  16.   line-height: 0;

  17.   margin: 0 auto;

  18.   max-width: 98%;

  19.   position: relative;

  20.   text-align: left;

  21.   top: 50%;

  22.   -webkit-transform: translateY(-50%);

  23.   -ms-transform: translateY(-50%);

  24.   transform: translateY(-50%);

  25.   vertical-align: middle;

  26.   width: 100%;

  27. }

  28. 

  29. .pswp__item--html .pswp__img {

  30.   cursor: -webkit-grab;

  31.   cursor: -moz-grab;

  32.   cursor: grab;

  33. }

  34. 

  35. .pswp.pswp--dragging .pswp__img {

  36.   cursor: -webkit-grabbing;

  37.   cursor: -moz-grabbing;

  38.   cursor: grabbing;

  39. }

  40. 

  41. /**

  42.  * Recheck this.

  43.  *

  44.  * @todo: Remove temp fix for FF will-change warning:

  45.  * https://github.com/dimsemenov/PhotoSwipe/issues/855

  46.  */

  47. .pswp__zoom-wrap {

  48.   will-change: auto !important;

  49.   -webkit-backface-visibility: visible !important;

  50. }

  51. 

  52. /** @todo remove once Blazy updated to fix this regression video size. */

  53. @media screen and (min-width: 1280px) {

  54.   /** Prevents oversized video player. Adjust it accordingly. */

  55.   .pswp .media-wrapper {

  56.     max-width: 72%;

  57.   }

  58. }