Add slideshow for images

2016-12-11 18:37:40 -05:00
parent ffb3926178
commit a3d1ce47d3
9 changed files with 220 additions and 5 deletions
--- a/assets/sass/_image_slideshow.sass
+++ b/assets/sass/_image_slideshow.sass
@@ -0,0 +1,40 @@
+.image-slideshow-overlay
+  position: fixed
+  top: 0
+  left: 0
+  width: 100%
+  height: 100%
+  background: rgba(0, 0, 0, 0.95)
+  overflow: auto
+  z-index: 100
+  img
+    display: block
+    margin: auto
+  figcaption
+    color: #fff
+    opacity: 0.7
+    position: absolute
+    bottom: 5px
+    right: 15px
+
+.slideshow-icon
+  color: #fff
+  position: absolute
+  font-size: 2.5em
+  opacity: 0.6
+  &:hover
+    opacity: 0.9
+    cursor: pointer
+
+.slideshow-previous-icon
+  left: 10px
+  top: 45%
+
+.slideshow-next-icon
+  right: 10px
+  top: 45%
+
+.slideshow-close-icon
+  right: 10px
+  top: 10px
+  font-size: 1.4em