diff options
Diffstat (limited to 'web/react')
| -rw-r--r-- | web/react/components/sidebar_right.jsx | 19 | ||||
| -rw-r--r-- | web/react/utils/utils.jsx | 5 |
2 files changed, 20 insertions, 4 deletions
diff --git a/web/react/components/sidebar_right.jsx b/web/react/components/sidebar_right.jsx index ac1049da0..ee247265d 100644 --- a/web/react/components/sidebar_right.jsx +++ b/web/react/components/sidebar_right.jsx @@ -52,14 +52,29 @@ export default class SidebarRight extends React.Component { doStrangeThings() { // We should have a better way to do this stuff // Hence the function name. + var windowWidth = $(window).outerWidth(); + var sidebarRightWidth = $('.sidebar--right').outerWidth(); + $('.inner__wrap').removeClass('.move--right'); $('.inner__wrap').addClass('move--left'); $('.sidebar--left').removeClass('move--right'); $('.sidebar--right').addClass('move--left'); //$('.sidebar--right').prepend('<div class="sidebar__overlay"></div>'); - - if (!(this.state.search_visible || this.state.post_right_visible)) { + if (this.state.search_visible || this.state.post_right_visible) { + if (windowWidth > 960) { + $('.inner__wrap').velocity({marginRight: sidebarRightWidth}, {duration: 500, easing: 'easeOutSine'}); + $('.sidebar--right').velocity({translateX: 0}, {duration: 500, easing: 'easeOutSine'}); + } else { + $('.inner__wrap, .sidebar--right').attr('style', ''); + } + } else { + if (windowWidth > 960) { + $('.inner__wrap').velocity({marginRight: 0}, {duration: 500, easing: 'easeOutSine'}); + $('.sidebar--right').velocity({translateX: sidebarRightWidth}, {duration: 500, easing: 'easeOutSine'}); + } else { + $('.inner__wrap, .sidebar--right').attr('style', ''); + } $('.inner__wrap').removeClass('move--left').removeClass('move--right'); $('.sidebar--right').removeClass('move--left'); return ( diff --git a/web/react/utils/utils.jsx b/web/react/utils/utils.jsx index c2b2ce15a..52d88c5b9 100644 --- a/web/react/utils/utils.jsx +++ b/web/react/utils/utils.jsx @@ -617,6 +617,7 @@ export function applyTheme(theme) { if (theme.centerChannelColor) { changeCss('.sidebar--left, .sidebar--right .sidebar--right__header', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.2), 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, .tip-overlay', 'color:' + theme.centerChannelColor, 1); + changeCss('#archive-link-home', 'background:' + changeOpacity(theme.centerChannelColor, 0.15), 1); changeCss('#post-create', 'color:' + theme.centerChannelColor, 2); changeCss('.mentions--top, .suggestion-list', 'box-shadow:' + changeOpacity(theme.centerChannelColor, 0.2) + ' 1px -3px 12px', 3); changeCss('.mentions--top, .suggestion-list', '-webkit-box-shadow:' + changeOpacity(theme.centerChannelColor, 0.2) + ' 1px -3px 12px', 2); @@ -685,11 +686,11 @@ export function applyTheme(theme) { } if (theme.mentionHighlightBg) { - changeCss('.mention-highlight, .search-highlight, #archive-link-home', 'background:' + theme.mentionHighlightBg, 1); + changeCss('.mention-highlight, .search-highlight', 'background:' + theme.mentionHighlightBg, 1); } if (theme.mentionHighlightBg) { - changeCss('.post.post--highlight, #archive-link-home', 'background:' + changeOpacity(theme.mentionHighlightBg, 0.5), 1); + changeCss('.post.post--highlight', 'background:' + changeOpacity(theme.mentionHighlightBg, 0.5), 1); } if (theme.mentionHighlightLink) { |