From 7399d349dedc35c8c05b223a3c143a420bf2411f Mon Sep 17 00:00:00 2001 From: Pepijn Date: Thu, 8 Dec 2016 00:08:37 +0100 Subject: Created a new message indicator component to indicate new messages (#4299) * Created a new message indicator component to indicate new messages are present outside the user's view: * Created new component with styling * Theming and i18n support for new messages indicator * Count new unviewed messages and integrate with component * Coding style for new message indicator * Fixed bugs with new message indicator: * Fix display issues with new message indicator * Update text to deal with plurals in React * Fix coded style for ticket 'PLT-1917': add new message indicator. * Use only server generated timestamps for checking new messages at the bottom * Move transitionend to prop, fix style selectors --- webapp/utils/utils.jsx | 3 +++ 1 file changed, 3 insertions(+) (limited to 'webapp/utils') diff --git a/webapp/utils/utils.jsx b/webapp/utils/utils.jsx index 00b7f53f8..7d7cc3583 100644 --- a/webapp/utils/utils.jsx +++ b/webapp/utils/utils.jsx @@ -560,6 +560,7 @@ export function applyTheme(theme) { changeCss('body.app__body', 'scrollbar-face-color:' + theme.centerChannelBg); changeCss('body.app__body', 'scrollbar-track-color:' + theme.centerChannelBg); changeCss('.app__body .post-list__new-messages-below', 'color:' + theme.centerChannelBg); + changeCss('.app__body .nav-pills__unread-indicator-bottom', 'color:' + theme.centerChannelBg); } if (theme.centerChannelColor) { @@ -642,6 +643,8 @@ export function applyTheme(theme) { changeCss('.app__body a, .app__body a:focus, .app__body a:hover, .app__body .btn, .app__body .btn:focus, .app__body .btn:hover', 'color:' + theme.linkColor); changeCss('.app__body .attachment .attachment__container', 'border-left-color:' + changeOpacity(theme.linkColor, 0.5)); changeCss('.app__body .channel-header__links .icon:hover, .app__body .post .flag-icon__container.visible, .app__body .post .comment-icon__container, .app__body .post .post__reply', 'fill:' + theme.linkColor); + changeCss('.app__body .nav-pills__unread-indicator-bottom', 'background:' + theme.linkColor); + changeCss('.app__body .nav-pills__unread-indicator-bottom:hover', 'background:' + changeColor(theme.linkColor, 0.1)); } if (theme.buttonBg) { -- cgit v1.2.3-1-g7c22