diff options
author | Harrison Healey <harrisonmhealey@gmail.com> | 2015-10-05 16:12:29 -0400 |
---|---|---|
committer | Harrison Healey <harrisonmhealey@gmail.com> | 2015-10-05 16:12:29 -0400 |
commit | da61bb38ff04b4e93d952b37aae02fa43360aa49 (patch) | |
tree | a2ad43f680e598695e8bfa2632f3d5d9d8f8b81a | |
parent | e2e00d9d43c14806cd5a5c424b9879636dfd89c8 (diff) | |
parent | e7d7892fd762c71e09d742487193670a98a71742 (diff) | |
download | chat-da61bb38ff04b4e93d952b37aae02fa43360aa49.tar.gz chat-da61bb38ff04b4e93d952b37aae02fa43360aa49.tar.bz2 chat-da61bb38ff04b4e93d952b37aae02fa43360aa49.zip |
Merge pull request #925 from asaadmahmoodspin/ui-improvements
Multiple UI Improvements
-rw-r--r-- | web/react/components/popover_list_members.jsx | 3 | ||||
-rw-r--r-- | web/react/components/user_settings/import_theme_modal.jsx | 4 | ||||
-rw-r--r-- | web/react/utils/utils.jsx | 4 | ||||
-rw-r--r-- | web/sass-files/sass/partials/_base.scss | 21 | ||||
-rw-r--r-- | web/sass-files/sass/partials/_forms.scss | 5 | ||||
-rw-r--r-- | web/sass-files/sass/partials/_headers.scss | 2 | ||||
-rw-r--r-- | web/sass-files/sass/partials/_mentions.scss | 4 | ||||
-rw-r--r-- | web/sass-files/sass/partials/_settings.scss | 1 |
8 files changed, 20 insertions, 24 deletions
diff --git a/web/react/components/popover_list_members.jsx b/web/react/components/popover_list_members.jsx index 95a88c3d6..aaaea3c6f 100644 --- a/web/react/components/popover_list_members.jsx +++ b/web/react/components/popover_list_members.jsx @@ -67,9 +67,6 @@ export default class PopoverListMembers extends React.Component { > <div id='member_tooltip' - data-placement='left' - data-toggle='tooltip' - title='View Channel Members' > {countText} <span diff --git a/web/react/components/user_settings/import_theme_modal.jsx b/web/react/components/user_settings/import_theme_modal.jsx index 0f5cb59f5..4e8ee03fa 100644 --- a/web/react/components/user_settings/import_theme_modal.jsx +++ b/web/react/components/user_settings/import_theme_modal.jsx @@ -150,7 +150,9 @@ export default class ImportThemeModal extends React.Component { className='form-control' onChange={this.handleChange} /> - {this.state.inputError} + <div className='input__help'> + {this.state.inputError} + </div> </div> </div> </Modal.Body> diff --git a/web/react/utils/utils.jsx b/web/react/utils/utils.jsx index e2a95034f..307a311ab 100644 --- a/web/react/utils/utils.jsx +++ b/web/react/utils/utils.jsx @@ -471,7 +471,7 @@ export function applyTheme(theme) { } if (theme.centerChannelColor) { - changeCss('.app__content, .post-create__container .post-create-body .btn-file, .post-create__container .post-create-footer .msg-typing, .loading-screen .loading__content .round, .command-name, .modal .modal-content, .dropdown-menu, .popover, .mentions-name', 'color:' + theme.centerChannelColor, 1); + changeCss('.app__content, .post-create__container .post-create-body .btn-file, .post-create__container .post-create-footer .msg-typing, .command-name, .modal .modal-content, .dropdown-menu, .popover, .mentions-name', 'color:' + theme.centerChannelColor, 1); changeCss('#post-create', 'color:' + theme.centerChannelColor, 2); changeCss('.mentions--top, .command-box', 'box-shadow:' + changeOpacity(theme.centerChannelColor, 0.2) + ' 1px -3px 12px', 3); changeCss('.mentions--top, .command-box', '-webkit-box-shadow:' + changeOpacity(theme.centerChannelColor, 0.2) + ' 1px -3px 12px', 2); @@ -479,7 +479,7 @@ export function applyTheme(theme) { changeCss('.dropdown-menu, .popover ', 'box-shadow:' + changeOpacity(theme.centerChannelColor, 0.1) + ' 0px 6px 12px', 3); changeCss('.dropdown-menu, .popover ', '-webkit-box-shadow:' + changeOpacity(theme.centerChannelColor, 0.1) + ' 0px 6px 12px', 2); changeCss('.dropdown-menu, .popover ', '-moz-box-shadow:' + changeOpacity(theme.centerChannelColor, 0.1) + ' 0px 6px 12px', 1); - changeCss('.post-body hr', 'background:' + theme.centerChannelColor, 1); + changeCss('.post-body hr, .loading-screen .loading__content .round', 'background:' + theme.centerChannelColor, 1); changeCss('.channel-header .heading', 'color:' + theme.centerChannelColor, 1); changeCss('.markdown__table tbody tr:nth-child(2n)', 'background:' + changeOpacity(theme.centerChannelColor, 0.07), 1); changeCss('.channel-header__info>div.dropdown .header-dropdown__icon', 'color:' + changeOpacity(theme.centerChannelColor, 0.8), 1); diff --git a/web/sass-files/sass/partials/_base.scss b/web/sass-files/sass/partials/_base.scss index fa465ff91..841db7c5a 100644 --- a/web/sass-files/sass/partials/_base.scss +++ b/web/sass-files/sass/partials/_base.scss @@ -36,14 +36,13 @@ body { .popover { color: #333; - a { - color: $primary-color; - &:hover, &:focus { - color: $primary-color; + &.bottom { + >.arrow:after { + border-bottom-color: rgba(white, 0.5); } } .popover-title { - background: rgba(black, 0.1); + background: rgba(black, 0.05); } } @@ -60,7 +59,7 @@ body { } .word-break--all { - word-break: break-all; + word-break: break-all; } a { @@ -165,9 +164,9 @@ a:focus, a:hover { } .emoji { - width: 1.5em; - height: 1.5em; - display: inline-block; - margin-bottom: 0.25em; - background-size: contain; + width: 1.5em; + height: 1.5em; + display: inline-block; + margin-bottom: 0.25em; + background-size: contain; } diff --git a/web/sass-files/sass/partials/_forms.scss b/web/sass-files/sass/partials/_forms.scss index 65ea161d4..6c1f7cc6c 100644 --- a/web/sass-files/sass/partials/_forms.scss +++ b/web/sass-files/sass/partials/_forms.scss @@ -16,11 +16,12 @@ } } .input__help { - color: #777; + color: inherit; margin: 10px 0 0 10px; word-break: break-word; + @include opacity(0.8); &.dark { - color: #222; + @include opacity(1); } &.error { color: #a94442; diff --git a/web/sass-files/sass/partials/_headers.scss b/web/sass-files/sass/partials/_headers.scss index 9b9e5f573..2a4e82fc7 100644 --- a/web/sass-files/sass/partials/_headers.scss +++ b/web/sass-files/sass/partials/_headers.scss @@ -37,7 +37,7 @@ &.description { overflow: hidden; text-overflow: ellipsis; - color: #888; + @include opacity(0.6); margin-top: 2px; max-height: 45px; } diff --git a/web/sass-files/sass/partials/_mentions.scss b/web/sass-files/sass/partials/_mentions.scss index aff31e418..a2bd0dcea 100644 --- a/web/sass-files/sass/partials/_mentions.scss +++ b/web/sass-files/sass/partials/_mentions.scss @@ -55,10 +55,6 @@ padding-left: 10px; } -.mention-link { - color: $primary-color; -} - .mention-highlight { background-color:#fff2bb; color: #333; diff --git a/web/sass-files/sass/partials/_settings.scss b/web/sass-files/sass/partials/_settings.scss index 1f785f63c..42475efd5 100644 --- a/web/sass-files/sass/partials/_settings.scss +++ b/web/sass-files/sass/partials/_settings.scss @@ -81,6 +81,7 @@ .appearance-section { .premade-themes { + margin-bottom: 10px; .theme-label { font-weight: 400; margin-top: 5px; |