7 files changed, 63 insertions, 21 deletions

diff --git a/web/sass-files/sass/partials/_base.scss b/web/sass-files/sass/partials/_base.scss
index 78006ff18..5b68b488f 100644
--- a/web/sass-files/sass/partials/_base.scss
+++ b/web/sass-files/sass/partials/_base.scss
@@ -24,6 +24,7 @@ body {
     height: 100%;
     > .row.main {
       height: 100%;
+      position: relative;
     }
   }
   > .container-fluid {
diff --git a/web/sass-files/sass/partials/_files.scss b/web/sass-files/sass/partials/_files.scss
index 65775f01e..1375a10e7 100644
--- a/web/sass-files/sass/partials/_files.scss
+++ b/web/sass-files/sass/partials/_files.scss
@@ -115,7 +115,6 @@
   height: 100px;
   float: left;
   margin: 5px 10px 5px 0;
-  display: table;
   border: 1px solid lightgrey;
   .post__load {
     height: 100%;
@@ -137,16 +136,16 @@
     }
   }
   .post-image__thumbnail {
-    display: table-cell;
-    vertical-align: top;
+    float: left;
     width: 50%;
     height: 100%;
     cursor: zoom-in;
     cursor: -webkit-zoom-in;
   }
   .post-image__details {
-    display: table-cell;
-    vertical-align: top;
+    float: left;
+    @include clearfix;
+    word-break: break-word;
     width: 50%;
     height: 100%;
     background: white;
@@ -194,11 +193,12 @@
     border-right: 1px solid #ddd;
     vertical-align: center;
 
-        // helper to center the image icon in the preview window
-        .file-details__preview-helper {
-          height: 100%;
-          display: inline-block;
-          vertical-align: middle;
-        }
-      }
+    // helper to center the image icon in the preview window
+    .file-details__preview-helper {
+      height: 100%;
+      display: inline-block;
+      vertical-align: middle;
     }
+  }
+}
+
diff --git a/web/sass-files/sass/partials/_post.scss b/web/sass-files/sass/partials/_post.scss
index 98b17120d..56b31205b 100644
--- a/web/sass-files/sass/partials/_post.scss
+++ b/web/sass-files/sass/partials/_post.scss
@@ -106,6 +106,32 @@ body.ios {
 	}
 }
 
+.file-overlay {
+	position: absolute;
+	top: 0;
+	left: 0;
+	width: 100%;
+	height: 100%;
+	background-color: rgba(0, 0, 0, 0.6);
+	text-align: center;
+	color: #FFF;
+	display: table;
+	font-size: 1.7em;
+	font-weight: 600;
+	z-index: 6;
+
+	> div {
+		display: table-cell;
+		vertical-align: middle;
+	}
+
+	.fa {
+		display: block;
+		font-size: 2em;
+		margin: 0 0 0.3em;
+	}
+}
+
 #post-list {
 	.post-list-holder-by-time {
 		background: #fff;
diff --git a/web/sass-files/sass/partials/_responsive.scss b/web/sass-files/sass/partials/_responsive.scss
index 47b2b6bd7..733d81c2b 100644
--- a/web/sass-files/sass/partials/_responsive.scss
+++ b/web/sass-files/sass/partials/_responsive.scss
@@ -189,6 +189,9 @@
 }
 
 @media screen and (max-width: 960px) {
+    .center-file-overlay {
+        font-size: 1.5em;
+    }
     .post {
         .post-header .post-header-col.post-header__reply {
             .comment-icon__container__hide {
@@ -240,6 +243,9 @@
     }
 }
 @media screen and (max-width: 768px) {
+    .center-file-overlay {
+        font-size: 1.3em;
+    }
     .date-separator, .new-separator {
         &.hovered--after {
             &:before {
@@ -431,9 +437,6 @@
             }
         }
     }
-    #user_settings {
-        border-right: none;
-    }
     body {
         &.white {
             .inner__wrap {
diff --git a/web/sass-files/sass/partials/_settings.scss b/web/sass-files/sass/partials/_settings.scss
index 1fb078bb9..0262ef60c 100644
--- a/web/sass-files/sass/partials/_settings.scss
+++ b/web/sass-files/sass/partials/_settings.scss
@@ -143,12 +143,6 @@
     }
 }
 
-#user_settings {
-    padding: 0 0.5em;
-    border-right: 1px solid #ddd;
-    max-width: 800px;
-}
-
 .channel-settings {
     padding: 0 10px;
 }
diff --git a/web/sass-files/sass/partials/_sidebar--left.scss b/web/sass-files/sass/partials/_sidebar--left.scss
index 5d866715e..2376c9212 100644
--- a/web/sass-files/sass/partials/_sidebar--left.scss
+++ b/web/sass-files/sass/partials/_sidebar--left.scss
@@ -6,6 +6,7 @@
     border-right: $border-gray;
     padding: 0 0 2em 0;
     background: #fafafa;
+    z-index: 5;
     &.sidebar--padded {
         padding-top: 44px;
     }
diff --git a/web/sass-files/sass/partials/_signup.scss b/web/sass-files/sass/partials/_signup.scss
index 3a6f73316..ddf2aab88 100644
--- a/web/sass-files/sass/partials/_signup.scss
+++ b/web/sass-files/sass/partials/_signup.scss
@@ -186,6 +186,23 @@
                     display: inline-block;
                 }
             }
+            &.google {
+                background: #dd4b39;
+                &:hover {
+                    background: darken(#dd4b39, 10%);
+                }
+                span {
+                    vertical-align: middle;
+                }
+                .icon {
+                    background: url("../images/googleLogo.png");
+                    width: 18px;
+                    height: 18px;
+                    margin-right: 8px;
+                    @include background-size(100% 100%);
+                    display: inline-block;
+                }
+            }
         }
         &.btn-default {
             color: #444;