diff --git a/web/react/components/user_settings/manage_incoming_hooks.jsx b/web/react/components/user_settings/manage_incoming_hooks.jsx index 12c041c7f4..1bbfbd162a 100644 --- a/web/react/components/user_settings/manage_incoming_hooks.jsx +++ b/web/react/components/user_settings/manage_incoming_hooks.jsx @@ -134,7 +134,7 @@ export default class ManageIncomingHooks extends React.Component { } else if (hooks.length > 0) { displayHooks = hooks; } else { - displayHooks = ; + displayHooks = ; } const existingHooks = ( diff --git a/web/react/utils/constants.jsx b/web/react/utils/constants.jsx index 8c9e1ee85f..0650fb92b7 100644 --- a/web/react/utils/constants.jsx +++ b/web/react/utils/constants.jsx @@ -130,6 +130,7 @@ module.exports = { mentionColor: '#ffffff', centerChannelBg: '#ffffff', centerChannelColor: '#333333', + newMessageSeparator: '#FF8800', linkColor: '#2389d7', buttonBg: '#2389d7', buttonColor: '#FFFFFF' @@ -150,12 +151,13 @@ module.exports = { mentionColor: '#bfcde8', centerChannelBg: '#f2f4f8', centerChannelColor: '#333333', + newMessageSeparator: '#FF8800', linkColor: '#2f81b7', buttonBg: '#1dacfc', buttonColor: '#FFFFFF' }, - dark: { - type: 'Dark', + mattermostDark: { + type: 'Mattermost Dark', sidebarBg: '#1B2C3E', sidebarText: '#bbbbbb', sidebarUnreadText: '#fff', @@ -170,9 +172,31 @@ module.exports = { mentionColor: '#FFFFFF', centerChannelBg: '#2F3E4E', centerChannelColor: '#DDDDDD', + newMessageSeparator: '#5de5da', linkColor: '#A4FFEB', buttonBg: '#1dacfc', buttonColor: '#FFFFFF' + }, + windows10: { + type: 'Windows 10 Dark', + sidebarBg: '#171717', + sidebarText: '#eee', + sidebarUnreadText: '#fff', + sidebarTextHoverBg: '#302e30', + sidebarTextHoverColor: '#fff', + sidebarTextActiveBg: '#484748', + sidebarTextActiveColor: '#FFFFFF', + sidebarHeaderBg: '#1f1f1f', + sidebarHeaderTextColor: '#FFFFFF', + onlineIndicator: '#0177e7', + mentionBj: '#0177e7', + mentionColor: '#FFFFFF', + centerChannelBg: '#1F1F1F', + centerChannelColor: '#DDDDDD', + newMessageSeparator: '#CC992D', + linkColor: '#0177e7', + buttonBg: '#0177e7', + buttonColor: '#FFFFFF' } }, THEME_ELEMENTS: [ @@ -232,6 +256,10 @@ module.exports = { id: 'centerChannelColor', uiName: 'Center Channel Text' }, + { + id: 'newMessageSeparator', + uiName: 'New message separator' + }, { id: 'linkColor', uiName: 'Link Color' diff --git a/web/react/utils/utils.jsx b/web/react/utils/utils.jsx index d45240f9a4..280370c337 100644 --- a/web/react/utils/utils.jsx +++ b/web/react/utils/utils.jsx @@ -615,7 +615,7 @@ export function applyTheme(theme) { } if (theme.centerChannelColor) { - changeCss('.app__content, .post-create__container .post-create-body .btn-file', 'color:' + theme.centerChannelColor, 1); + changeCss('.app__content, .post-create__container .post-create-body .btn-file, .post-create__container .post-create-footer .msg-typing, .loading-screen .loading__content .round', 'color:' + theme.centerChannelColor, 1); changeCss('#post-create', 'color:' + theme.centerChannelColor, 2); changeCss('.post-body hr', 'background:' + theme.centerChannelColor, 1); changeCss('.channel-header .heading', 'color:' + theme.centerChannelColor, 1); @@ -630,8 +630,8 @@ export function applyTheme(theme) { changeCss('.search-bar__container .search__form .search-bar', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.2) + '; color: ' + theme.centerChannelColor, 2); changeCss('.search-bar__container .search__form', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.2), 1); changeCss('.channel-intro .channel-intro__content', 'background:' + changeOpacity(theme.centerChannelColor, 0.05), 1); - changeCss('.date-separator .separator__text, .new-separator .separator__text', 'color:' + theme.centerChannelColor, 2); - changeCss('.date-separator .separator__hr, .new-separator .separator__hr, .post-right__container .post.post--root hr, .search-item-container', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.2), 1); + changeCss('.date-separator .separator__text', 'color:' + theme.centerChannelColor, 2); + changeCss('.date-separator .separator__hr, .post-right__container .post.post--root hr, .search-item-container', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.2), 1); changeCss('.channel-intro', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.2), 1); changeCss('.post.current--user .post-body, .post.post--comment.other--root.current--user .post-comment', 'background:' + changeOpacity(theme.centerChannelColor, 0.07), 1); changeCss('.post.current--user .post-body, .post.post--comment.other--root.current--user .post-comment, .post.post--comment.other--root .post-comment, .post.same--root .post-body', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.07), 2); @@ -645,6 +645,11 @@ export function applyTheme(theme) { changeCss('.sidebar--right', 'color:' + theme.centerChannelColor, 2); } + if (theme.newMessageSeparator) { + changeCss('.new-separator .separator__text', 'color:' + theme.newMessageSeparator, 1); + changeCss('.new-separator .separator__hr', 'border-color:' + changeOpacity(theme.newMessageSeparator, 0.5), 1); + } + if (theme.linkColor) { changeCss('a, a:focus, a:hover', 'color:' + theme.linkColor, 1); changeCss('.post .comment-icon__container', 'fill:' + theme.linkColor, 1); diff --git a/web/sass-files/sass/partials/_loading.scss b/web/sass-files/sass/partials/_loading.scss index d710557224..ab8601df6b 100644 --- a/web/sass-files/sass/partials/_loading.scss +++ b/web/sass-files/sass/partials/_loading.scss @@ -37,4 +37,4 @@ to { opacity: 0.1; } } } -} +} \ No newline at end of file diff --git a/web/sass-files/sass/partials/_post.scss b/web/sass-files/sass/partials/_post.scss index a1958af3b9..7532875d64 100644 --- a/web/sass-files/sass/partials/_post.scss +++ b/web/sass-files/sass/partials/_post.scss @@ -185,7 +185,7 @@ body.ios { .post-create__container { form { width: 100%; - padding: 10px 1em 0 1em; + padding: 0 1em; margin: 0; } .post-create-body { @@ -257,7 +257,7 @@ body.ios { line-height: 18px; display: inline-block; font-size: 13px; - color: #777; + @include opacity(0.6); } } } diff --git a/web/sass-files/sass/partials/_responsive.scss b/web/sass-files/sass/partials/_responsive.scss index e0b35d0bfa..d29c653ffe 100644 --- a/web/sass-files/sass/partials/_responsive.scss +++ b/web/sass-files/sass/partials/_responsive.scss @@ -417,7 +417,7 @@ padding: 0 1em; } form { - padding: 10px 0 0 0; + padding: 0; } .post-create-body { padding-bottom: 10px; diff --git a/web/static/images/themes/dark.png b/web/static/images/themes/mattermost dark.png similarity index 100% rename from web/static/images/themes/dark.png rename to web/static/images/themes/mattermost dark.png diff --git a/web/static/images/themes/windows 10 dark.png b/web/static/images/themes/windows 10 dark.png new file mode 100644 index 0000000000..d653048209 Binary files /dev/null and b/web/static/images/themes/windows 10 dark.png differ