diff options
Diffstat (limited to 'web')
-rw-r--r-- | web/react/components/admin_console/user_item.jsx | 4 | ||||
-rw-r--r-- | web/react/components/member_list_item.jsx | 4 | ||||
-rw-r--r-- | web/react/components/member_list_team_item.jsx | 4 | ||||
-rw-r--r-- | web/react/components/more_channels.jsx | 2 | ||||
-rw-r--r-- | web/react/components/posts_view.jsx | 6 | ||||
-rw-r--r-- | web/react/components/user_settings/manage_command_hooks.jsx | 6 | ||||
-rw-r--r-- | web/react/utils/constants.jsx | 1 | ||||
-rw-r--r-- | web/react/utils/utils.jsx | 1 | ||||
-rw-r--r-- | web/sass-files/sass/partials/_markdown.scss | 1 | ||||
-rw-r--r-- | web/sass-files/sass/partials/_mentions.scss | 16 | ||||
-rw-r--r-- | web/sass-files/sass/partials/_modal.scss | 16 | ||||
-rw-r--r-- | web/sass-files/sass/partials/_popover.scss | 3 | ||||
-rw-r--r-- | web/sass-files/sass/partials/_post.scss | 19 | ||||
-rw-r--r-- | web/sass-files/sass/partials/_settings.scss | 17 | ||||
-rw-r--r-- | web/static/images/postArrows.png | bin | 5684 -> 0 bytes |
15 files changed, 61 insertions, 39 deletions
diff --git a/web/react/components/admin_console/user_item.jsx b/web/react/components/admin_console/user_item.jsx index 02b01b090..0c1a55cc1 100644 --- a/web/react/components/admin_console/user_item.jsx +++ b/web/react/components/admin_console/user_item.jsx @@ -360,8 +360,8 @@ export default class UserItem extends React.Component { height='36' width='36' /> - <span className='member-name'>{Utils.getDisplayName(user)}</span> - <span className='member-email'>{email}</span> + <span className='more-name'>{Utils.getDisplayName(user)}</span> + <span className='more-description'>{email}</span> <div className='dropdown member-drop'> <a href='#' diff --git a/web/react/components/member_list_item.jsx b/web/react/components/member_list_item.jsx index c50ee5c96..41ea58eeb 100644 --- a/web/react/components/member_list_item.jsx +++ b/web/react/components/member_list_item.jsx @@ -124,8 +124,8 @@ export default class MemberListItem extends React.Component { height='36' width='36' /> - <div className='member-name'>{Utils.displayUsername(member.id)}</div> - <div className='member-description'>{member.email}</div> + <div className='more-name'>{Utils.displayUsername(member.id)}</div> + <div className='more-description'>{member.email}</div> </td> <td className='td--action lg'>{invite}</td> </tr> diff --git a/web/react/components/member_list_team_item.jsx b/web/react/components/member_list_team_item.jsx index 6e1006911..30086d1b2 100644 --- a/web/react/components/member_list_team_item.jsx +++ b/web/react/components/member_list_team_item.jsx @@ -208,8 +208,8 @@ export default class MemberListTeamItem extends React.Component { height='36' width='36' /> - <span className='member-name'>{Utils.displayUsername(user.id)}</span> - <span className='member-email'>{email}</span> + <span className='more-name'>{Utils.displayUsername(user.id)}</span> + <span className='more-description'>{email}</span> <div className='dropdown member-drop'> <a href='#' diff --git a/web/react/components/more_channels.jsx b/web/react/components/more_channels.jsx index d12ea4703..d800f93d8 100644 --- a/web/react/components/more_channels.jsx +++ b/web/react/components/more_channels.jsx @@ -114,7 +114,7 @@ export default class MoreChannels extends React.Component { <tr key={channel.id}> <td> <p className='more-name'>{channel.display_name}</p> - <p className='more-purpose'>{channel.purpose}</p> + <p className='more-description'>{channel.purpose}</p> </td> <td className='td--action'> {joinButton} diff --git a/web/react/components/posts_view.jsx b/web/react/components/posts_view.jsx index f108ace2e..ebe19abad 100644 --- a/web/react/components/posts_view.jsx +++ b/web/react/components/posts_view.jsx @@ -94,7 +94,7 @@ export default class PostsView extends React.Component { }); } - this.scrollStopAction.fireAfter(1000); + this.scrollStopAction.fireAfter(2000); } handleScrollStop() { this.setState({ @@ -564,6 +564,8 @@ function ScrollToBottomArrows({isScrolling, atBottom, onClick}) { <div className={className} onClick={onClick} - /> + > + <span dangerouslySetInnerHTML={{__html: Constants.SCROLL_BOTTOM_ICON}} /> + </div> ); } diff --git a/web/react/components/user_settings/manage_command_hooks.jsx b/web/react/components/user_settings/manage_command_hooks.jsx index d23d2957e..3656424b2 100644 --- a/web/react/components/user_settings/manage_command_hooks.jsx +++ b/web/react/components/user_settings/manage_command_hooks.jsx @@ -271,7 +271,7 @@ export default class ManageCommandCmds extends React.Component { cmds.push( <div key={cmd.id} - className='webcmd__item' + className='webhook__item webcmd__item' > <div className='padding-top x2'> <strong> @@ -400,7 +400,7 @@ export default class ManageCommandCmds extends React.Component { } const existingCmds = ( - <div className='webcmds__container'> + <div className='webhooks__container webcmds__container'> <label className='control-label padding-top x2'> <FormattedMessage id='user.settings.cmds.existing' @@ -408,7 +408,7 @@ export default class ManageCommandCmds extends React.Component { /> </label> <div className='padding-top divider-light'></div> - <div className='webcmds__list'> + <div className='webhooks__list webcmds__list'> {displayCmds} </div> </div> diff --git a/web/react/utils/constants.jsx b/web/react/utils/constants.jsx index 9689591a6..b1e84202d 100644 --- a/web/react/utils/constants.jsx +++ b/web/react/utils/constants.jsx @@ -173,6 +173,7 @@ export default { MENU_ICON: "<svg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px'width='4px' height='16px' viewBox='0 0 8 32' enable-background='new 0 0 8 32' xml:space='preserve'> <g> <circle cx='4' cy='4.062' r='4'/> <circle cx='4' cy='16' r='4'/> <circle cx='4' cy='28' r='4'/> </g> </svg>", COMMENT_ICON: "<svg version='1.1' id='Layer_2' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px'width='15px' height='15px' viewBox='1 1.5 15 15' enable-background='new 1 1.5 15 15' xml:space='preserve'> <g> <g> <path fill='#211B1B' d='M14,1.5H3c-1.104,0-2,0.896-2,2v8c0,1.104,0.896,2,2,2h1.628l1.884,3l1.866-3H14c1.104,0,2-0.896,2-2v-8 C16,2.396,15.104,1.5,14,1.5z M15,11.5c0,0.553-0.447,1-1,1H8l-1.493,2l-1.504-1.991L5,12.5H3c-0.552,0-1-0.447-1-1v-8 c0-0.552,0.448-1,1-1h11c0.553,0,1,0.448,1,1V11.5z'/> </g> </g> </svg>", REPLY_ICON: "<svg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px'viewBox='-158 242 18 18' style='enable-background:new -158 242 18 18;' xml:space='preserve'> <path d='M-142.2,252.6c-2-3-4.8-4.7-8.3-4.8v-3.3c0-0.2-0.1-0.3-0.2-0.3s-0.3,0-0.4,0.1l-6.9,6.2c-0.1,0.1-0.1,0.2-0.1,0.3 c0,0.1,0,0.2,0.1,0.3l6.9,6.4c0.1,0.1,0.3,0.1,0.4,0.1c0.1-0.1,0.2-0.2,0.2-0.4v-3.8c4.2,0,7.4,0.4,9.6,4.4c0.1,0.1,0.2,0.2,0.3,0.2 c0,0,0.1,0,0.1,0c0.2-0.1,0.3-0.3,0.2-0.4C-140.2,257.3-140.6,255-142.2,252.6z M-150.8,252.5c-0.2,0-0.4,0.2-0.4,0.4v3.3l-6-5.5 l6-5.3v2.8c0,0.2,0.2,0.4,0.4,0.4c3.3,0,6,1.5,8,4.5c0.5,0.8,0.9,1.6,1.2,2.3C-144,252.8-147.1,252.5-150.8,252.5z'/> </svg>", + SCROLL_BOTTOM_ICON: "<svg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px'viewBox='-239 239 21 23' style='enable-background:new -239 239 21 23;' xml:space='preserve'> <path d='M-239,241.4l2.4-2.4l8.1,8.2l8.1-8.2l2.4,2.4l-10.5,10.6L-239,241.4z M-228.5,257.2l8.1-8.2l2.4,2.4l-10.5,10.6l-10.5-10.6 l2.4-2.4L-228.5,257.2z'/> </svg>", UPDATE_TYPING_MS: 5000, THEMES: { default: { diff --git a/web/react/utils/utils.jsx b/web/react/utils/utils.jsx index 896a94ac5..c2487f290 100644 --- a/web/react/utils/utils.jsx +++ b/web/react/utils/utils.jsx @@ -680,6 +680,7 @@ export function applyTheme(theme) { } if (theme.centerChannelColor) { + changeCss('.post-list__arrows', 'fill:' + changeOpacity(theme.centerChannelColor, 0.3), 1); 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); diff --git a/web/sass-files/sass/partials/_markdown.scss b/web/sass-files/sass/partials/_markdown.scss index 14e12ecd2..0ba1929e0 100644 --- a/web/sass-files/sass/partials/_markdown.scss +++ b/web/sass-files/sass/partials/_markdown.scss @@ -39,6 +39,7 @@ padding: 4px 10px 5px 10px; font-size: 13px; opacity: 0.7; + z-index: 5; } .post__body { diff --git a/web/sass-files/sass/partials/_mentions.scss b/web/sass-files/sass/partials/_mentions.scss index df6dd40a2..aa654e9e8 100644 --- a/web/sass-files/sass/partials/_mentions.scss +++ b/web/sass-files/sass/partials/_mentions.scss @@ -18,6 +18,13 @@ line-height: 36px; font-size: 13px; cursor: pointer; + white-space: nowrap; + + .mention-align { + @include clearfix; + text-overflow: ellipsis; + width: calc(100% - 50px); + } } .mentions-text { @@ -33,6 +40,15 @@ font-size: 20px; text-align: center; @include border-radius(32px); + + .mention-align { + max-width: 80%; + overflow: hidden; + display: inline-block; + white-space: nowrap; + text-overflow: ellipsis; + } + } .mention-fullname { diff --git a/web/sass-files/sass/partials/_modal.scss b/web/sass-files/sass/partials/_modal.scss index b451adb75..db99e840b 100644 --- a/web/sass-files/sass/partials/_modal.scss +++ b/web/sass-files/sass/partials/_modal.scss @@ -103,7 +103,7 @@ background: rgba(0, 0, 0, 0.1); } span { - font-family: 'Open Sans', sans-serif; + font-family: 'Open Sans', sans-serif; line-height: 10px; } } @@ -170,6 +170,12 @@ overflow: hidden; text-overflow: ellipsis; } + .more-description { + @include opacity(0.7); + display: block; + overflow: hidden; + text-overflow: ellipsis; + } tbody { > tr { &:hover td { @@ -425,9 +431,9 @@ } .modal-body.edit-modal-body { - overflow: visible; + overflow: visible; - .suggestion-content { - max-height: 150px; - } + .suggestion-content { + max-height: 150px; + } } diff --git a/web/sass-files/sass/partials/_popover.scss b/web/sass-files/sass/partials/_popover.scss index 8a61758f1..bf762d2c9 100644 --- a/web/sass-files/sass/partials/_popover.scss +++ b/web/sass-files/sass/partials/_popover.scss @@ -150,6 +150,9 @@ } .more-name { margin-left: 6px; + max-width: 140px; + overflow: hidden; + text-overflow: ellipsis; } } } diff --git a/web/sass-files/sass/partials/_post.scss b/web/sass-files/sass/partials/_post.scss index cc22cc913..323691d89 100644 --- a/web/sass-files/sass/partials/_post.scss +++ b/web/sass-files/sass/partials/_post.scss @@ -264,32 +264,37 @@ body.ios { line-height: 25px; margin-left: -60px; -webkit-font-smoothing: initial; - @include single-transition(all, 0.3s, ease); + @include single-transition(all, 0.6s, ease); @include translateY(-45px); @include opacity(0); display: none; &.scrolling { - @include single-transition(all, 0.3s, ease); @include translateY(0); @include opacity(0.8); } } .post-list__arrows { - background: url('../images/postArrows.png') center; - @include background-size(28px 28px); background-repeat: no-repeat; width: 40px; height: 40px; + text-align: center; + fill: #444; position: absolute; bottom: 0; - left: 10px; + left: 9px; z-index: 50; @include opacity(0); - @include single-transition(all, 0.3s); + @include single-transition(all, 0.6s); display: none; + svg { + color: inherit; + width: 28px; + height: 28px; + } + &.scrolling { display: block; @include opacity(1); @@ -487,7 +492,7 @@ body.ios { position: absolute; top: -2px; left: -7px; - font-size: 11px; + font-size: 11px; line-height: 37px; @include opacity(0); } diff --git a/web/sass-files/sass/partials/_settings.scss b/web/sass-files/sass/partials/_settings.scss index bf296e913..1bbec566c 100644 --- a/web/sass-files/sass/partials/_settings.scss +++ b/web/sass-files/sass/partials/_settings.scss @@ -223,6 +223,8 @@ .section-describe { @include opacity(0.7); white-space:pre; + @include clearfix; + text-overflow: ellipsis; } .divider-dark { @@ -341,21 +343,6 @@ h3 { @include border-radius(50px); margin-right: 8px; } - .member-name { - font-weight:500; - display: block; - max-width: 80%; - overflow: hidden; - text-overflow: ellipsis; - } - - .member-email { - color:darkgrey; - display: block; - max-width: 80%; - overflow: hidden; - text-overflow: ellipsis; - } } .member-role, .member-drop { diff --git a/web/static/images/postArrows.png b/web/static/images/postArrows.png Binary files differdeleted file mode 100644 index 7b5919fc3..000000000 --- a/web/static/images/postArrows.png +++ /dev/null |