3 files changed, 52 insertions, 47 deletions

diff --git a/web/sass-files/sass/partials/_modal.scss b/web/sass-files/sass/partials/_modal.scss
index b942a5a40..5570b5ce4 100644
--- a/web/sass-files/sass/partials/_modal.scss
+++ b/web/sass-files/sass/partials/_modal.scss
@@ -140,7 +140,7 @@
 			padding: 0;
 		}
 	}
-	.more-channel-table {
+	.more-table {
 		margin: 0;
 		table-layout: fixed;
 		p {
@@ -150,9 +150,11 @@
 			@include opacity(0.8);
 			margin: 5px 0;
 		}
-		.more-channel-name {
+		.more-name {
 			font-weight: 600;
 			font-size: 0.95em;
+			overflow: hidden;
+			text-overflow: ellipsis;
 		}
 		tbody {
 			> tr {
@@ -175,6 +177,9 @@
 						padding: 8px 15px 8px 8px;
 						width: 80px;
 						vertical-align: middle;
+						&.lg {
+							width: 110px;
+						}
 					}
 				}
 			}
@@ -189,7 +194,7 @@
 			position: relative;
 			max-width: 90%;
 			min-height: 100px;
-			min-width: 240px;
+			min-width: 320px;
 			@include border-radius(3px);
 			display: table;
 			margin: 0 auto;
@@ -331,47 +336,42 @@
 }
 
 .modal-direct-channels {
-    .user-list {
-        list-style-type: none;
-        margin: 15px 0px 0px;
-        max-height: 600px;
-        padding: 0px;
-        overflow: auto;
 
-        li {
-            border-bottom: 1px solid #ddd;
-            height: 60px;
-            padding: 10px 0px;
+	.user-list {
+		margin-top: 10px;
+		overflow: auto;
+		-webkit-overflow-scrolling: touch;
+		max-height: 500px;
+		position: relative;
+	}
 
-            .image-div {
-                padding: 0px;
+	.table {
+		margin-top: 10px;
+	}
 
-                .profile-image {
-                    width: 40px;
-                    height: 40px;
-                    @include border-radius(20px);
-                }
-            }
+	.modal-body {
+		padding: 20px 0 0;
+		@include clearfix;
+	}
 
-            .username {
-                font-weight: bold;
-            }
+	.filter-row {
+		padding: 0 15px;
+	}
 
-            .nickname {
-                color: #888;
-            }
+	.member-count {
+		margin-top: 5px;
+		float: right;
+		@include opacity(0.8);
+	}
 
-            .btn-div {
-                padding: 0px;
-                .btn-message {
-                    position: relative;
-                    top: 5px;
-                }
-            }
+	.more-description {
+		@include opacity(0.7);
+	}
 
-            &:last-child {
-                border-bottom: 0px;
-            }
-        }
-    }
+	.profile-img {
+		-moz-border-radius: 50px;
+		-webkit-border-radius: 50px;
+		border-radius: 50px;
+		margin-right: 8px;
+	}
 }
diff --git a/web/sass-files/sass/partials/_responsive.scss b/web/sass-files/sass/partials/_responsive.scss
index 09f2c179e..09ac2047c 100644
--- a/web/sass-files/sass/partials/_responsive.scss
+++ b/web/sass-files/sass/partials/_responsive.scss
@@ -267,9 +267,17 @@
             }
         }
         .file-details {
+            width: 100%;
             height: auto;
         }
     }
+    .modal-direct-channels {
+        .member-count {
+            float: none;
+            margin-top: 10px;
+            display: block;
+        }
+    }
     .center-file-overlay {
         font-size: 1.3em;
     }
@@ -690,7 +698,7 @@
         .modal-image {
             .image-wrapper {
                 font-size: 12px;
-                min-width: 280px;
+                min-width: 250px;
                 .modal-close {
                     @include opacity(1);
                 }
diff --git a/web/sass-files/sass/partials/_settings.scss b/web/sass-files/sass/partials/_settings.scss
index 0c2f25eab..c4591d7b6 100644
--- a/web/sass-files/sass/partials/_settings.scss
+++ b/web/sass-files/sass/partials/_settings.scss
@@ -230,13 +230,6 @@
     font-weight:500;
 }
 
-.profile-img {
-    width:128px;
-    height:128px;
-    margin-bottom: 10px;
-    @include border-radius(128px);
-}
-
 .sel-btn {
     margin-right:5px;
 }
@@ -298,3 +291,7 @@
 .color-btn {
     margin:4px;
 }
+
+.no-resize {
+    resize:none;
+}