diff options
author | Asaad Mahmood <asaadmahmood@users.noreply.github.com> | 2017-04-17 06:27:15 +0500 |
---|---|---|
committer | Christopher Speller <crspeller@gmail.com> | 2017-04-16 21:27:15 -0400 |
commit | 62974f19cd0025a3a5098741210f1b61b08765a9 (patch) | |
tree | 39924b82639900382437e322b2121bc2bd6ec753 /webapp | |
parent | 74ffb6f98f7ee8b4e61743919ab20460c57ad4da (diff) | |
download | chat-62974f19cd0025a3a5098741210f1b61b08765a9.tar.gz chat-62974f19cd0025a3a5098741210f1b61b08765a9.tar.bz2 chat-62974f19cd0025a3a5098741210f1b61b08765a9.zip |
Ui improvements (#6089)
* PLT-6084 - Fixing emoji reaction overflow
* PLT-6158 - Fixing pinned badge alignment in RHS
* PLT-6306 - Post alignment in compact view
* PLT-6266 - Adjusting spacing for files (compact)
* PLT-6245 - Adjusting spacing in emoji screen modal
* PLT-6237 - Adjusting filter in system console
* PLT-6247 - Adjusting spacing on code block tag
* PLT-6302 - Margins not equal for paragraphs in post
Diffstat (limited to 'webapp')
-rw-r--r-- | webapp/components/emoji/components/delete_emoji_modal.jsx | 2 | ||||
-rw-r--r-- | webapp/components/emoji_picker/components/emoji_picker_preview.jsx | 2 | ||||
-rw-r--r-- | webapp/sass/components/_emoticons.scss | 20 | ||||
-rw-r--r-- | webapp/sass/layout/_markdown.scss | 10 | ||||
-rw-r--r-- | webapp/sass/layout/_post.scss | 6 | ||||
-rw-r--r-- | webapp/sass/layout/_sidebar-right.scss | 6 | ||||
-rw-r--r-- | webapp/sass/responsive/_tablet.scss | 28 | ||||
-rw-r--r-- | webapp/sass/routes/_admin-console.scss | 6 |
8 files changed, 46 insertions, 34 deletions
diff --git a/webapp/components/emoji/components/delete_emoji_modal.jsx b/webapp/components/emoji/components/delete_emoji_modal.jsx index 604e3a27b..77afd4c01 100644 --- a/webapp/components/emoji/components/delete_emoji_modal.jsx +++ b/webapp/components/emoji/components/delete_emoji_modal.jsx @@ -25,7 +25,7 @@ export default class DeleteEmoji extends DeleteModalTrigger { get modalMessage() { return ( <div className='alert alert-warning'> - <i className='fa fa-warning'/> + <i className='fa fa-warning fa-margin--right'/> <FormattedMessage id='emoji_list.delete.confirm.msg' defaultMessage='This action permanently deletes the custom emoji. Are you sure you want to delete it?' diff --git a/webapp/components/emoji_picker/components/emoji_picker_preview.jsx b/webapp/components/emoji_picker/components/emoji_picker_preview.jsx index d88215b16..24acf9668 100644 --- a/webapp/components/emoji_picker/components/emoji_picker_preview.jsx +++ b/webapp/components/emoji_picker/components/emoji_picker_preview.jsx @@ -44,7 +44,7 @@ export default class EmojiPickerPreview extends React.Component { <div className='emoji-picker__preview-image-box'> {previewImage} </div> - <div className='emoji-picker__preview-image-box'> + <div className='emoji-picker__preview-detail-box'> <span className='emoji-picker__preview-name'>{name}</span> <span className='emoji-picker__preview-aliases' diff --git a/webapp/sass/components/_emoticons.scss b/webapp/sass/components/_emoticons.scss index cf8815a24..df4bbc158 100644 --- a/webapp/sass/components/_emoticons.scss +++ b/webapp/sass/components/_emoticons.scss @@ -240,6 +240,7 @@ margin: 3px; } } + .emojisprite-wrapper { cursor: pointer; } @@ -247,30 +248,33 @@ .emoji-picker__preview { border-top: 1px solid; display: table-cell; - vertical-align: middle; flex-grow: 0; flex-shrink: 0; - height:45px; - width: 278px; + height: 45px; padding: 3px 10px; + vertical-align: middle; + width: 278px; &.emoji-picker__preview-placeholder { padding: 12px; } - .emoji-picker__preview-image-box { + > div { display: table-cell; vertical-align: middle; + } + + .emoji-picker__preview-image-box { height: 36px; width: 42px; .sprite-preview { + border: none; + display: inline-block; height: 36px; - width: 36px; + padding: 0; vertical-align: middle; - padding: 0px; - border: 0px; - display: inline-block; + width: 36px; } } diff --git a/webapp/sass/layout/_markdown.scss b/webapp/sass/layout/_markdown.scss index 1f8ea041e..0b0fd651a 100644 --- a/webapp/sass/layout/_markdown.scss +++ b/webapp/sass/layout/_markdown.scss @@ -64,19 +64,19 @@ padding: 4px 10px 5px; position: absolute; right: 0; - top: 0; + top: 5; z-index: 5; } .post-code__lineno { + -moz-user-select: none; + -ms-user-select: none; + -o-user-select: none; + -webkit-user-select: none; border-right: 1px solid #aaa; color: #aaa; margin-right: .5em; text-align: right; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - -o-user-select: none; user-select: none; } diff --git a/webapp/sass/layout/_post.scss b/webapp/sass/layout/_post.scss index 2a2876116..c1f8d1cf6 100644 --- a/webapp/sass/layout/_post.scss +++ b/webapp/sass/layout/_post.scss @@ -836,7 +836,7 @@ } .post__img { - padding-top: 3px; + padding-top: 1px; width: 16px; img { @@ -911,7 +911,7 @@ left: 36px; margin-left: 7px; position: absolute; - top: 8px; + top: 6px; } .post__img { @@ -1034,6 +1034,7 @@ right: 0; top: -4px; white-space: nowrap; + z-index: 6; } .col__remove { @@ -1156,7 +1157,6 @@ word-wrap: break-word; div { - margin-bottom: .4em; } p + p { diff --git a/webapp/sass/layout/_sidebar-right.scss b/webapp/sass/layout/_sidebar-right.scss index 8d801a0c2..bb979357d 100644 --- a/webapp/sass/layout/_sidebar-right.scss +++ b/webapp/sass/layout/_sidebar-right.scss @@ -42,6 +42,12 @@ } .post { + &.post--compact { + .post__pinned-badge { + margin: 0 0 0 5px; + } + } + .post__content { padding: 0 10px 0 0; } diff --git a/webapp/sass/responsive/_tablet.scss b/webapp/sass/responsive/_tablet.scss index e97eb3b59..1a0a27267 100644 --- a/webapp/sass/responsive/_tablet.scss +++ b/webapp/sass/responsive/_tablet.scss @@ -19,16 +19,18 @@ width: 300px; } } - .post-right__scroll{ - .post-create__container{ + + .post-right__scroll { + .post-create__container { .post-create-body { .icon__emoji_picker { - display:none; + display: none; top: -7px; } } } } + .post-create__container { form { padding: .5em 0 0; @@ -262,8 +264,12 @@ &:not(.post--thread) { padding: 0 .5em 0 77px; + &.other--root { + + } + .post__link { - margin: 4px 0 7px; + margin: 3px 0 7px; vertical-align: bottom; } @@ -278,7 +284,7 @@ .post__header { float: left; height: 21px; - padding-top: 3px; + padding-top: 2px; .col__name { font-weight: bold; @@ -298,14 +304,6 @@ } &.other--root { - .post__body { - > div { - &:first-child { - min-height: 21px; - } - } - } - .post__link + .post__body { clear: both; } @@ -422,11 +420,11 @@ display: inline-block; font-size: 11px; left: -14px; - line-height: 34px; + line-height: 20px; position: absolute; text-align: right; text-rendering: auto; - top: -2px; + top: 4px; width: 51px; &:hover { diff --git a/webapp/sass/routes/_admin-console.scss b/webapp/sass/routes/_admin-console.scss index a39e1c20a..854c84e20 100644 --- a/webapp/sass/routes/_admin-console.scss +++ b/webapp/sass/routes/_admin-console.scss @@ -498,7 +498,11 @@ .system-users__team-filter { display: inline-block; - width: 200px + width: 200px; + } + + label { + font-weight: normal; } } |