From 6a273d825aed3b4fdc7dbb9461c92ed7479ad672 Mon Sep 17 00:00:00 2001 From: Maxime Poulin Date: Fri, 22 Jul 2016 23:01:55 -0400 Subject: [PATCH] Improve inline previews for links and images --- client/css/style.css | 21 +++++++++++++++++---- client/views/toggle.tpl | 2 +- 2 files changed, 18 insertions(+), 5 deletions(-) diff --git a/client/css/style.css b/client/css/style.css index fc111802..7f46637c 100644 --- a/client/css/style.css +++ b/client/css/style.css @@ -1105,6 +1105,7 @@ kbd { max-width: 100%; padding: 6px 8px; margin-top: 2px; + overflow: hidden; } #chat .toggle-content a { @@ -1113,18 +1114,23 @@ kbd { #chat .toggle-content img { max-width: 100%; - max-height: 250px; + max-height: 128px; display: block; margin: 2px 0; } #chat .toggle-content .thumb { - max-height: 110px; - max-width: 210px; + float: left; + margin-right: 10px; + max-width: 48px; + max-height: 36px; } #chat .toggle-content .head { font-weight: bold; + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden; } #chat .toggle-content .body { @@ -1132,10 +1138,17 @@ kbd { max-width: 460px; word-break: normal; word-wrap: break-word; + overflow: hidden; + max-height: 30px; + text-overflow: ellipsis; } #chat .toggle-content.show { - display: inline-block !important; + display: block; +} + +#chat .toggle-content.toggle-type-image.show { + display: inline; } #chat .count { diff --git a/client/views/toggle.tpl b/client/views/toggle.tpl index 1c51c5f5..2c8f84eb 100644 --- a/client/views/toggle.tpl +++ b/client/views/toggle.tpl @@ -1,5 +1,5 @@ {{#toggle}} -
+
{{#equal type "image"}}