diff --git a/src/platform/web/ui/css/themes/element/timeline.css b/src/platform/web/ui/css/themes/element/timeline.css index 666e0ecd..14b55caf 100644 --- a/src/platform/web/ui/css/themes/element/timeline.css +++ b/src/platform/web/ui/css/themes/element/timeline.css @@ -15,11 +15,6 @@ See the License for the specific language governing permissions and limitations under the License. */ -ul.Timeline > li.messageStatus .Timeline_messageBody > p { - font-style: italic; - color: #777; -} - .Timeline_message { display: grid; grid-template: @@ -106,6 +101,11 @@ ul.Timeline > li.messageStatus .Timeline_messageBody > p { color: #aaa; } +.Timeline_messageBody.statusMessage { + font-style: italic; + color: #777; +} + .Timeline_messageBody { grid-area: body; line-height: 2.2rem; diff --git a/src/platform/web/ui/session/room/timeline/FileView.js b/src/platform/web/ui/session/room/timeline/FileView.js index aecca858..b45bd011 100644 --- a/src/platform/web/ui/session/room/timeline/FileView.js +++ b/src/platform/web/ui/session/room/timeline/FileView.js @@ -26,7 +26,7 @@ export class FileView extends TemplateView { t.button({className: "link", onClick: () => vm.abortSending()}, vm.i18n`Cancel`), ])); } else { - return renderMessage(t, vm, t.p({className: "Timeline_messageBody"}, [ + return renderMessage(t, vm, t.p({className: "Timeline_messageBody statusMessage"}, [ t.button({className: "link", onClick: () => vm.download()}, vm => vm.label), t.time(vm.date + " " + vm.time) ])); diff --git a/src/platform/web/ui/session/room/timeline/MissingAttachmentView.js b/src/platform/web/ui/session/room/timeline/MissingAttachmentView.js index 8afdd6d4..600f9c3c 100644 --- a/src/platform/web/ui/session/room/timeline/MissingAttachmentView.js +++ b/src/platform/web/ui/session/room/timeline/MissingAttachmentView.js @@ -20,6 +20,6 @@ import {renderMessage} from "./common.js"; export class MissingAttachmentView extends TemplateView { render(t, vm) { const remove = t.button({className: "link", onClick: () => vm.abortSending()}, vm.i18n`Remove`); - return renderMessage(t, vm, t.p({className: "Timeline_messageBody"}, [vm.label, " ", remove])); + return renderMessage(t, vm, t.p({className: "Timeline_messageBody statusMessage"}, [vm.label, " ", remove])); } } diff --git a/src/platform/web/ui/session/room/timeline/RedactedView.js b/src/platform/web/ui/session/room/timeline/RedactedView.js index cdc775b4..0d6e9696 100644 --- a/src/platform/web/ui/session/room/timeline/RedactedView.js +++ b/src/platform/web/ui/session/room/timeline/RedactedView.js @@ -21,7 +21,7 @@ export class RedactedView extends TemplateView { render(t, vm) { const cancelButton = t.if(vm => vm.isRedacting, t => t.button({onClick: () => vm.abortPendingRedaction()}, "Cancel")); return renderMessage(t, vm, - t.p({className: "Timeline_messageBody"}, [vm => vm.description, " ", cancelButton]) + t.p({className: "Timeline_messageBody statusMessage"}, [vm => vm.description, " ", cancelButton]) ); } } \ No newline at end of file diff --git a/src/platform/web/ui/session/room/timeline/TextMessageView.js b/src/platform/web/ui/session/room/timeline/TextMessageView.js index b1e7d13d..6fd7fdb8 100644 --- a/src/platform/web/ui/session/room/timeline/TextMessageView.js +++ b/src/platform/web/ui/session/room/timeline/TextMessageView.js @@ -22,9 +22,13 @@ import {renderMessage} from "./common.js"; export class TextMessageView extends TemplateView { render(t, vm) { const bodyView = t.mapView(vm => vm.body, body => new BodyView(body)); - return renderMessage(t, vm, - t.p({className: "Timeline_messageBody"}, [bodyView, t.time({className: {hidden: !vm.date}}, vm.date + " " + vm.time)]) - ); + return renderMessage(t, vm, t.p({ + className: "Timeline_messageBody", + statusMessage: vm => vm.shape === "message-status" + }, [ + bodyView, + t.time({className: {hidden: !vm.date}}, vm.date + " " + vm.time) + ])); } } diff --git a/src/platform/web/ui/session/room/timeline/common.js b/src/platform/web/ui/session/room/timeline/common.js index e938eb63..0ec0d0cc 100644 --- a/src/platform/web/ui/session/room/timeline/common.js +++ b/src/platform/web/ui/session/room/timeline/common.js @@ -24,7 +24,6 @@ export function renderMessage(t, vm, body) { unsent: vm.isUnsent, unverified: vm.isUnverified, continuation: vm => vm.isContinuation, - messageStatus: vm => vm.shape === "message-status" || vm.shape === "missing-attachment" || vm.shape === "file" || vm.shape === "redacted", }; return t.li({className: classes}, [ t.if(vm => !vm.isContinuation, t => renderStaticAvatar(vm, 30, "Timeline_messageAvatar")),