Version 1
[yaffs-website] / web / modules / contrib / blazy / css / components / blazy.lightbox.css
diff --git a/web/modules/contrib/blazy/css/components/blazy.lightbox.css b/web/modules/contrib/blazy/css/components/blazy.lightbox.css
new file mode 100644 (file)
index 0000000..4050ef2
--- /dev/null
@@ -0,0 +1,76 @@
+/**
+ * @file
+ * Provides shared lightbox stylings for both Colorbox and Photobox.
+ */
+
+.media__icon--litebox {
+  cursor: pointer;
+  display: block;
+  height: 80px;
+  left: 50%;
+  margin: 0;
+  opacity: 0;
+  position: absolute;
+  top: 50%;
+  width: 80px;
+  visibility: hidden;
+  z-index: 9;
+  -webkit-transition: visibility 0s linear 0.5s, opacity 0.5s linear;
+  transition: visibility 0s linear 0.5s, opacity 0.5s linear;
+  -ms-transform: translate(-50%, -50%);
+  -webkit-transform: translate(-50%, -50%);
+  transform: translate(-50%, -50%);
+}
+
+.media__icon--litebox::before,
+.media__icon--litebox::after {
+  content: '';
+  display: block;
+  position: absolute;
+  pointer-events: none;
+}
+
+.media__icon--litebox {
+  z-index: 9;
+}
+
+.media__icon--litebox::before,
+.media__icon--litebox::after {
+  background: white;
+  border-radius: 4px;
+  height: 2px;
+  left: 50%;
+  margin: -1px 0 0 -40px;
+  top: 50%;
+  width: 80px;
+  -ms-transform: rotate(0deg);
+  -webkit-transform: rotate(0deg);
+  transform: rotate(0deg);
+}
+
+.media__icon--litebox::after {
+  -ms-transform: rotate(-90deg);
+  -webkit-transform: rotate(-90deg);
+  transform: rotate(-90deg);
+}
+
+.media__icon--litebox:hover::before,
+.media__icon--litebox:hover::after {
+  background-color: #ff6d2c;
+}
+
+.media:hover .media__icon--litebox {
+  -webkit-transition-delay: 0s;
+  transition-delay: 0s;
+}
+
+.media:hover .media__icon--litebox,
+.media--switch .media__image {
+  opacity: 1;
+  visibility: visible;
+}
+
+.litebox {
+  border: 0;
+  display: block;
+}