diff options
-rw-r--r-- | webapp/components/post_info.jsx | 2 | ||||
-rw-r--r-- | webapp/sass/components/_buttons.scss | 6 | ||||
-rw-r--r-- | webapp/sass/layout/_headers.scss | 5 | ||||
-rw-r--r-- | webapp/sass/layout/_post-right.scss | 3 | ||||
-rw-r--r-- | webapp/sass/layout/_post.scss | 18 | ||||
-rw-r--r-- | webapp/sass/layout/_sidebar-right.scss | 10 | ||||
-rw-r--r-- | webapp/sass/responsive/_mobile.scss | 69 | ||||
-rw-r--r-- | webapp/sass/responsive/_tablet.scss | 29 | ||||
-rw-r--r-- | webapp/utils/utils.jsx | 2 |
9 files changed, 104 insertions, 40 deletions
diff --git a/webapp/components/post_info.jsx b/webapp/components/post_info.jsx index 2d41b0e54..3f81672e1 100644 --- a/webapp/components/post_info.jsx +++ b/webapp/components/post_info.jsx @@ -212,7 +212,7 @@ export default class PostInfo extends React.Component { var dropdown = this.createDropdown(); return ( - <ul className='post__header post__header--info'> + <ul className='post__header--info'> <li className='col'> <TimeSince eventTime={post.create_at} diff --git a/webapp/sass/components/_buttons.scss b/webapp/sass/components/_buttons.scss index 326640148..ffe82c524 100644 --- a/webapp/sass/components/_buttons.scss +++ b/webapp/sass/components/_buttons.scss @@ -20,6 +20,12 @@ .app__body & { color: $white; + + &:hover, + &:focus, + &:active { + color: $white; + } } &:hover, diff --git a/webapp/sass/layout/_headers.scss b/webapp/sass/layout/_headers.scss index ae114a805..950588df5 100644 --- a/webapp/sass/layout/_headers.scss +++ b/webapp/sass/layout/_headers.scss @@ -67,9 +67,8 @@ .channel-intro { border-bottom: 1px solid $light-gray; - margin: 0 auto 35px; - max-width: 1000px; - padding: 0 1em 5px; + margin: 0 30px 35px; + padding: 0 0 5px; .intro-links { display: inline-block; diff --git a/webapp/sass/layout/_post-right.scss b/webapp/sass/layout/_post-right.scss index 529f73995..93ad7af54 100644 --- a/webapp/sass/layout/_post-right.scss +++ b/webapp/sass/layout/_post-right.scss @@ -53,7 +53,6 @@ } .post-create__container { - margin-top: 10px; width: 100%; .textarea-wrapper { @@ -115,7 +114,7 @@ .post-right-channel__name { font-weight: 600; - margin: 0 0 10px 0; + margin: 0 0 15px; } .post-right-root-container li { diff --git a/webapp/sass/layout/_post.scss b/webapp/sass/layout/_post.scss index 592d486aa..374fa7324 100644 --- a/webapp/sass/layout/_post.scss +++ b/webapp/sass/layout/_post.scss @@ -520,6 +520,10 @@ body.ios { } } + .post__header--info { + padding: 0; + } + span { p:last-child { margin-bottom: .5em; @@ -554,16 +558,6 @@ body.ios { top: 6px; } } - - .post__time { - @include opacity(0); - font-size: 11px; - left: -7px; - line-height: 37px; - position: absolute; - text-rendering: auto; - top: -2px; - } } &.post--comment { @@ -610,10 +604,10 @@ body.ios { .post__content { display: table; margin: 0 auto; + padding: 0 15px; position: relative; table-layout: fixed; width: 100%; - padding: 0 15px; > div { display: table-cell; @@ -649,7 +643,7 @@ body.ios { .col__reply { position: absolute; - right: 0; + right: 10px; top: 30px; white-space: nowrap; width: 65px; diff --git a/webapp/sass/layout/_sidebar-right.scss b/webapp/sass/layout/_sidebar-right.scss index 062c3bde1..923e53d12 100644 --- a/webapp/sass/layout/_sidebar-right.scss +++ b/webapp/sass/layout/_sidebar-right.scss @@ -16,6 +16,10 @@ } .post { + .post__content { + padding: 0; + } + .post__header { .col__name { .user-popover { @@ -25,6 +29,12 @@ } } + .post-create__container { + form { + padding: .5em 15px 0; + } + } + .help__format-text { display: none; } diff --git a/webapp/sass/responsive/_mobile.scss b/webapp/sass/responsive/_mobile.scss index 3d30f6d96..6a9a134f2 100644 --- a/webapp/sass/responsive/_mobile.scss +++ b/webapp/sass/responsive/_mobile.scss @@ -15,6 +15,11 @@ font-size: 1em; } + .sidebar--left .team__header .user__picture, + .sidebar--menu .team__header .user__picture { + display: none; + } + .date-separator.hovered--before:after, .date-separator.hovered--after:before, .new-separator.hovered--after:before, @@ -22,6 +27,10 @@ background: none !important; } + .channel-intro { + margin: 0 15px 35px; + } + .post { .post__dropdown { display: inline-block; @@ -38,6 +47,27 @@ } } + .post__content { + padding: 0 10px 0 0; + } + + .post__header { + margin-bottom: 0; + + .col__reply { + top: 0; + width: 65px; + } + + .col__name { + pointer-events: none; + + .user-popover { + max-width: 130px; + } + } + } + .comment-icon__container { display: none; visibility: visible; @@ -63,7 +93,7 @@ } .post__body { - width: calc(100% - 75px); + width: 100%; } .post__reply { @@ -75,22 +105,18 @@ } } - &.other--root .post__reply { - &.post__reply--hide { - visibility: hidden; - } - } - - .post__header { - .col__reply { - width: 65px; + &.other--root { + &.post--comment { + .post__header { + .col__reply { + top: 0; + } + } } - .col__name { - pointer-events: none; - - .user-popover { - max-width: 130px; + .post__reply { + &.post__reply--hide { + visibility: hidden; } } } @@ -100,6 +126,15 @@ .post__time { display: none; } + + .post__header { + height: auto; + margin-top: 5px; + + .col__name { + display: inline-block; + } + } } } @@ -714,10 +749,6 @@ width: 100%; z-index: 5; - &.move--left { - @include translate3d(0, 0, 0); - } - .sidebar__collapse, .sidebar__search-icon { display: block; diff --git a/webapp/sass/responsive/_tablet.scss b/webapp/sass/responsive/_tablet.scss index cb5216dea..659100263 100644 --- a/webapp/sass/responsive/_tablet.scss +++ b/webapp/sass/responsive/_tablet.scss @@ -12,13 +12,18 @@ } } } + .sidebar--right { @include single-transition(all, .5s, ease); @include translateX(100%); z-index: 5; &.move--left { - @include translateX(0); + -webkit-transform: translateX(0) !important; + -moz-transform: translateX(0) !important; + -ms-transform: translateX(0) !important; + -o-transform: translateX(0) !important; + transform: translateX(0) !important; .search-bar__container { padding-right: 8px; @@ -44,8 +49,12 @@ } .inner-wrap { + &:not(.move--left) { + margin-right: 0 !important; + } + &.move--left { - margin-right: 0; + margin-right: 0 !important; .channel-header__links { position: relative; @@ -60,4 +69,20 @@ .second-bar { display: none; } + + .post { + &.same--root { + &.same--user { + .post__time { + @include opacity(0); + font-size: 11px; + left: 8px; + line-height: 37px; + position: absolute; + text-rendering: auto; + top: -2px; + } + } + } + } } diff --git a/webapp/utils/utils.jsx b/webapp/utils/utils.jsx index a1e16928b..8255b10f3 100644 --- a/webapp/utils/utils.jsx +++ b/webapp/utils/utils.jsx @@ -761,7 +761,7 @@ export function applyTheme(theme) { } if (theme.mentionHighlightLink) { - changeCss('.app__body .mention--highlight .mention-link', 'color:' + theme.mentionHighlightLink, 1); + changeCss('.app__body .mention--highlight .mention-link, .app__body .mention--highlight, .app__body .search-highlight', 'color:' + theme.mentionHighlightLink, 1); } if (!theme.codeTheme) { |