Add slideshow for images

3 files changed, 42 insertions, 0 deletions

diff --git a/assets/sass/_image_slideshow.sass b/assets/sass/_image_slideshow.sass
new file mode 100644
index 00000000..d88a81fb
--- /dev/null
+++ 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
diff --git a/assets/sass/_thumbnails.sass b/assets/sass/_thumbnails.sass
index 9e130576..f4f0c12b 100644
--- a/assets/sass/_thumbnails.sass
+++ b/assets/sass/_thumbnails.sass
@@ -15,6 +15,7 @@
   box-shadow: 4px 2px 10px -6px rgba(0, 0, 0, 0.55)
   margin-right: 15px
   img
+    cursor: pointer
     border-top-left-radius: 5px
     border-top-right-radius: 5px
     &:hover
diff --git a/assets/sass/app.sass b/assets/sass/app.sass
index 7615f817..378b3ea3 100644
--- a/assets/sass/app.sass
+++ b/assets/sass/app.sass
@@ -52,3 +52,4 @@
 @import activity_stream
 @import gantt_chart
 @import user_mentions
+@import image_slideshow