1 files changed, 108 insertions, 83 deletions

diff --git a/web/sass-files/sass/partials/_post.scss b/web/sass-files/sass/partials/_post.scss
index ae02ccb4c..45b7b7f23 100644
--- a/web/sass-files/sass/partials/_post.scss
+++ b/web/sass-files/sass/partials/_post.scss
@@ -47,7 +47,22 @@ body.ios {
 
 .textarea-wrapper {
 	position:relative;
-	min-height:37px;
+	.textbox-preview-area {
+		position: absolute;
+		z-index: 2;
+		top: 0;
+		left: 0;
+		box-shadow: none;
+	}
+	.textbox-preview-link {
+		position: absolute;
+		z-index: 3;
+		bottom: -23px;
+		right: 0;
+		font-size: 13px;
+		cursor: pointer;
+	}
+	min-height:36px;
 }
 
 .date-separator, .new-separator {
@@ -183,7 +198,7 @@ body.ios {
 }
 
 #post-list {
-	flex: 1 1 auto;
+	@include flex(1 1 auto);
 	position: relative;
 	overflow-y: hidden;
 	.post-list-holder-by-time {
@@ -325,9 +340,9 @@ body.ios {
 			}
 		}
 		.msg-typing {
-			min-height: 20px;
-			line-height: 18px;
-			display: inline-block;
+			min-height: 25px;
+			line-height: 25px;
+			display: block;
 			font-size: 13px;
 			@include opacity(0.7);
 		}
@@ -497,6 +512,9 @@ body.ios {
 				border-bottom-left-radius: 4px;
 				@include opacity(.3);
 			}
+			&.tex .katex-display {
+				text-align: left;
+			}
 			code {
 				white-space: pre;
 			}
@@ -527,9 +545,13 @@ body.ios {
 		}
 		&.post-info {
 			.post-profile-time {
-				width: 150px;
-				display: inline-block;
-				margin-left: 50px;
+				color: #a8adb7;
+				vertical-align: top;
+				max-width: 220px;
+				overflow: hidden;
+				display: block;
+				white-space: nowrap;
+				text-overflow: ellipsis;
 			}
 		}
 		.post-header-col {
@@ -537,6 +559,8 @@ body.ios {
 			display: inline-block;
 			margin-right: 10px;
 			&.post-header__reply {
+				position: relative;
+				top: -1px;
 				min-width: 70px;
 				.dropdown-menu {
 					right: 0;
@@ -613,79 +637,80 @@ body.ios {
 }
 
 .attachment {
-    .attachment__content {
-        border-width: 1px;
-        border-style: solid;
-        border-radius: 4px;
-        padding: 2px 5px;
-        margin: 0 0 5px 0;
-    }
-    .attachment__thumb-pretext {
-        border: 0 none;
-        background: transparent;
-    }
-    .attachment__container {
-        border-left-width: 4px;
-        border-left-style: solid;
-        padding: 2px 0 2px 10px;
-        &.attachment__container--good {
-            border-left-color: #00C100;
-        }
-        &.attachment__container--warning {
-            border-left-color: #DEDE01;
-        }
-        &.attachment__container--danger {
-            border-left-color: #E40303;
-        }
-    }
-    .attachment__body {
-        float: left;
-        width: 80%;
-        padding-right: 5px;
-        &.attachment__body--no_thumb {
-            width: 100%;
-        }
-    }
-    .attachment__text p:last-of-type {
-        display: inline-block;
-    }
-    .attachment__thumb-pretext {
-        margin-left: 5px;
-    }
-    .attachment__title {
-        margin: 5px 0;
-        padding: 0;
-        line-height: 16px;
-        font-size: 16px;
-        a {
-            font-size: 16px;
-        }
-    }
-    .attachment__author-icon {
-        @include border-radius(50px);
-        margin-right: 5px;
-        width: 14px;
-        height: 14px;
-    }
-    .attachment__image {
-        max-width: 100%;
-        margin-bottom: 1em;
-    }
-    .attachment__thumb-container {
-        width: 20%;
-        float: right;
-        img {
-            max-height: 75px;
-            max-width: 100%;
-        }
-    }
-    .attachment___fields {
-        width: 100%;
-        .attachment___field-caption {
-            font-weight: 700;
-        }
-        .attachment___field p {
-            margin: 0;
-        }
-    }
+	.attachment__content {
+		border-width: 1px;
+		border-style: solid;
+		border-radius: 4px;
+		padding: 2px 5px;
+		margin: 0 0 5px 0;
+	}
+	.attachment__thumb-pretext {
+		border: 0 none;
+		background: transparent;
+	}
+	.attachment__container {
+		border-left-width: 4px;
+		border-left-style: solid;
+		padding: 2px 0 2px 10px;
+		&.attachment__container--good {
+			border-left-color: #00C100;
+		}
+		&.attachment__container--warning {
+			border-left-color: #DEDE01;
+		}
+		&.attachment__container--danger {
+			border-left-color: #E40303;
+		}
+	}
+	.attachment__body {
+		float: left;
+		width: 80%;
+		padding-right: 5px;
+		overflow-x: auto;
+		&.attachment__body--no_thumb {
+			width: 100%;
+		}
+	}
+	.attachment__text p:last-of-type {
+		display: inline-block;
+	}
+	.attachment__thumb-pretext {
+		margin-left: 5px;
+	}
+	.attachment__title {
+		margin: 5px 0;
+		padding: 0;
+		line-height: 16px;
+		font-size: 16px;
+		a {
+			font-size: 16px;
+		}
+	}
+	.attachment__author-icon {
+		@include border-radius(50px);
+		margin-right: 5px;
+		width: 14px;
+		height: 14px;
+	}
+	.attachment__image {
+		max-width: 100%;
+		margin-bottom: 1em;
+	}
+	.attachment__thumb-container {
+		width: 20%;
+		float: right;
+		img {
+			max-height: 75px;
+			max-width: 100%;
+		}
+	}
+	.attachment___fields {
+		width: 100%;
+		.attachment___field-caption {
+			font-weight: 700;
+		}
+		.attachment___field p {
+			margin: 0;
+		}
+	}
 }
\ No newline at end of file