From 2f88bcb2232e1e24456ac9ddfd72fd38727519f2 Mon Sep 17 00:00:00 2001 From: Asaad Mahmood Date: Fri, 2 Jun 2017 20:46:54 +0500 Subject: Multiple Ui improvements (#6553) * PLT-6729 - Fixing close button * PLT-5216 - Updating mattermost theme * PLT-6679 - Fixing styling for active state --- webapp/images/themes/mattermost.png | Bin 93862 -> 67199 bytes webapp/sass/components/_modal.scss | 6 +++++- webapp/utils/constants.jsx | 36 ++++++++++++++++++------------------ webapp/utils/utils.jsx | 4 ++-- 4 files changed, 25 insertions(+), 21 deletions(-) (limited to 'webapp') diff --git a/webapp/images/themes/mattermost.png b/webapp/images/themes/mattermost.png index 8dea37ff6..d11a8db29 100644 Binary files a/webapp/images/themes/mattermost.png and b/webapp/images/themes/mattermost.png differ diff --git a/webapp/sass/components/_modal.scss b/webapp/sass/components/_modal.scss index 6388fe8de..de7d9cdfb 100644 --- a/webapp/sass/components/_modal.scss +++ b/webapp/sass/components/_modal.scss @@ -213,14 +213,18 @@ line-height: 30px; position: absolute; right: 10px; + text-shadow: none; width: 30px; z-index: 5; - text-shadow: none; &:hover { @include alpha-property(background, $black, .1); } + .sr-only { + display: none; + } + span { font-family: 'Open Sans', sans-serif; line-height: 10px; diff --git a/webapp/utils/constants.jsx b/webapp/utils/constants.jsx index dc0856888..ea87f2cd4 100644 --- a/webapp/utils/constants.jsx +++ b/webapp/utils/constants.jsx @@ -481,28 +481,28 @@ export const Constants = { }, mattermost: { type: 'Mattermost', - sidebarBg: '#fafafa', - sidebarText: '#333333', - sidebarUnreadText: '#333333', - sidebarTextHoverBg: '#e6f2fa', - sidebarTextActiveBorder: '#378FD2', - sidebarTextActiveColor: '#111111', - sidebarHeaderBg: '#3481B9', + sidebarBg: '#1a1d1f', + sidebarText: '#ffffff', + sidebarUnreadText: '#e8e8e8', + sidebarTextHoverBg: '#525252', + sidebarTextActiveBorder: '#27a1b2', + sidebarTextActiveColor: '#ffffff', + sidebarHeaderBg: '#1a1d1f', sidebarHeaderTextColor: '#ffffff', - onlineIndicator: '#7DBE00', - awayIndicator: '#DCBD4E', - mentionBj: '#2389d7', + onlineIndicator: '#1fc1d9', + awayIndicator: '#c4c492', + mentionBj: '#ba3939', mentionColor: '#ffffff', centerChannelBg: '#ffffff', - centerChannelColor: '#333333', - newMessageSeparator: '#FF8800', - linkColor: '#2389d7', - buttonBg: '#23A2FF', + centerChannelColor: '#2d3138', + newMessageSeparator: '#1c8c99', + linkColor: '#1c8c99', + buttonBg: '#27a1b2', buttonColor: '#FFFFFF', - errorTextColor: '#a94442', - mentionHighlightBg: '#f3e197', - mentionHighlightLink: '#2f81b7', - codeTheme: 'github', + errorTextColor: '#cc2d2d', + mentionHighlightBg: '#1c8c99', + mentionHighlightLink: '#ffffff', + codeTheme: 'monokai', image: mattermostThemeImage }, mattermostDark: { diff --git a/webapp/utils/utils.jsx b/webapp/utils/utils.jsx index 0ef057dac..e4aa48a59 100644 --- a/webapp/utils/utils.jsx +++ b/webapp/utils/utils.jsx @@ -697,9 +697,9 @@ export function applyTheme(theme) { } if (theme.linkColor) { - changeCss('.app__body a, .app__body a:focus, .app__body a:hover, .app__body .btn, .app__body .btn:focus, .app__body .btn:hover, .app__body .channel-header #member_popover:hover', 'color:' + theme.linkColor); + changeCss('.app__body .channel-header__links > a.active, .app__body a, .app__body a:focus, .app__body a:hover, .app__body .btn, .app__body .btn:focus, .app__body .btn:hover, .app__body .channel-header #member_popover: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 .reacticon__container, .app__body .post .comment-icon__container, .app__body .post .post__reply', 'fill:' + theme.linkColor); + changeCss('.app__body .channel-header__links .icon:hover, .app__body .channel-header__links > a.active .icon, .app__body .post .flag-icon__container.visible, .app__body .post .reacticon__container, .app__body .post .comment-icon__container, .app__body .post .post__reply', 'fill:' + theme.linkColor); 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, .app__body .channel-header .pinned-posts-button:hover svg', 'fill:' + theme.linkColor); changeCss('.app__body .post-reaction.post-reaction--current-user', 'background:' + changeOpacity(theme.linkColor, 0.1)); changeCss('.app__body .post-reaction.post-reaction--current-user', 'border-color:' + changeOpacity(theme.linkColor, 0.4)); -- cgit v1.2.3-1-g7c22