diff options
Diffstat (limited to 'webapp/sass')
| -rw-r--r-- | webapp/sass/components/_emoticons.scss | 168 | ||||
| -rw-r--r-- | webapp/sass/layout/_post-right.scss | 6 | ||||
| -rw-r--r-- | webapp/sass/layout/_post.scss | 6 |
3 files changed, 50 insertions, 130 deletions
diff --git a/webapp/sass/components/_emoticons.scss b/webapp/sass/components/_emoticons.scss index 210c8620b..24d53eef3 100644 --- a/webapp/sass/components/_emoticons.scss +++ b/webapp/sass/components/_emoticons.scss @@ -8,7 +8,6 @@ top: 2px; vertical-align: middle; visibility: hidden; - } .emoticon { @@ -48,100 +47,6 @@ vertical-align: middle; } -.emoji-picker__popover { - padding: 0px; - - .popover-content { - padding: 0px; - } -} - -.emoji-picker-react-rhs-comment { - position: absolute; - width: 278px; - border: 1px solid; - min-height: 298px; - border-radius: 3px; - top: 21px; - right:59px; - z-index: 100; - .emoji-picker__search-container { - position: relative; - - .emoji-picker__search-icon { - padding-left: 6px; - padding-top: 6px; - position: absolute; - font-size: 13px; - } - - - } -} - -.emoji-picker-react { - position: absolute; - width: 278px; - border: 1px solid; - min-height: 298px; - border-radius: 3px; - top: 42px; - right:59px; - z-index: 100; - .emoji-picker__search-container { - position: relative; - - .emoji-picker__search-icon { - padding-left: 6px; - padding-top: 6px; - position: absolute; - font-size: 13px; - } - - - } -} - - -.emoji-picker-bottom { - display: flex; - flex-direction: column; - @include user-select(none); - position: absolute; - z-index: 40; - right: 0%; - width: 278px; - border: 1px solid; - min-height: 298px; - border-radius: 3px; - - .emoji-picker__search-container { - position: relative; - - .emoji-picker__search-icon { - padding-left: 6px; - padding-top: 6px; - position: absolute; - font-size: 13px; - } - - - } -} - -.emoji-picker__search { - border-width: 1px 0px 1px 0px; - border-style: solid; - padding: 2px 0 2px 25px; - width: 100%; - height: 25px; - font-size: 12px; - - &:focus{ - outline: none; - } -} - .emoji-picker { @include user-select(none); border-radius: 3px; @@ -149,23 +54,9 @@ display: flex; flex-direction: column; position: absolute; - right: 0; - top: -361px; + height: 362px; width: 278px; z-index: 8; - - .emoji-picker__search-container { - position: relative; - - .emoji-picker__search-icon { - padding-left: 6px; - padding-top: 6px; - position: absolute; - font-size: 13px; - } - - - } } .emoji-picker__categories { @@ -187,6 +78,30 @@ } } +.emoji-picker__search-container { + position: relative; + + .emoji-picker__search-icon { + padding-left: 6px; + padding-top: 6px; + position: absolute; + font-size: 13px; + } + + .emoji-picker__search { + border-width: 1px 0px 1px 0px; + border-style: solid; + padding: 2px 0 2px 25px; + width: 100%; + height: 25px; + font-size: 12px; + + &:focus{ + outline: none; + } + } +} + .emoji-picker__items { max-height: 262px; overflow-x: hidden; @@ -194,15 +109,12 @@ padding: 0px 8px 8px 8px; position: relative; - - .emoji-picker__category-header { font-size: 12px; font-weight: bold; margin-bottom: 6px; margin-top: 3px; padding-top: 3px; - // padding-bottom: 10px; } .emoji-picker__preview_sprite { @@ -238,25 +150,21 @@ } } - .emoji-picker__item { - font-size: 18px; - margin: 3px; - } - .emoticon { - max-height: 21px; - max-width: 21px; - min-height: 0; - min-width: 0; - width: auto; - height: auto; - margin: 0 auto; + .emoji-picker__item-wrapper { + .emoji-picker__item { + font-size: 18px; + margin: 3px; + max-height: 21px; + max-width: 21px; + min-height: 0; + min-width: 0; + width: auto; + height: auto; + margin: 0 auto; + } } } -.emojisprite-wrapper { - cursor: pointer; -} - .emoji-picker__preview { border-top: 1px solid; display: flex; @@ -294,6 +202,7 @@ font-weight: bold; } } + .emoji-picker__preview-image-box { display: flex; align-items: center; @@ -318,5 +227,4 @@ max-height: 36px; max-width: 42px; } - } diff --git a/webapp/sass/layout/_post-right.scss b/webapp/sass/layout/_post-right.scss index 531638ec7..85dd20f53 100644 --- a/webapp/sass/layout/_post-right.scss +++ b/webapp/sass/layout/_post-right.scss @@ -92,6 +92,12 @@ margin-right: 10px; padding: 6px 0; } + + .emoji-picker { + position: absolute; + top: -361px; + right: 0px; + } } } diff --git a/webapp/sass/layout/_post.scss b/webapp/sass/layout/_post.scss index 85a4bb2cd..73253f4be 100644 --- a/webapp/sass/layout/_post.scss +++ b/webapp/sass/layout/_post.scss @@ -393,6 +393,12 @@ } } + .emoji-picker { + position: absolute; + top: -361px; + right: 0px; + } + .post-create.scroll { .btn-file { right: 10px; |