diff options
author | Saturnino Abril <saturnino.abril@gmail.com> | 2017-08-03 14:29:31 +0800 |
---|---|---|
committer | GitHub <noreply@github.com> | 2017-08-03 14:29:31 +0800 |
commit | f3934bc7e1e8ef555e1c2e1fe0ece3dbd88ea687 (patch) | |
tree | 8555be93795821a35dfe64ec6c8e749d235bbd4d /webapp/sass/layout/_webhooks.scss | |
parent | 345bb2236f1f34c2b1ddfec0024ea47c4b1b8950 (diff) | |
download | chat-f3934bc7e1e8ef555e1c2e1fe0ece3dbd88ea687.tar.gz chat-f3934bc7e1e8ef555e1c2e1fe0ece3dbd88ea687.tar.bz2 chat-f3934bc7e1e8ef555e1c2e1fe0ece3dbd88ea687.zip |
[PLT-1249] Add close button 'x' to the right of a link preview (#7017)
* add close button 'x' to the right of a link preview
* Updating webhook UI
* UI improvements for close button
* Adding hover state
* Making the close button visible on mobile
* previews are permanently disabled/closed for that link
* make post as required props
* fix JS error of undefined
* fix update issue both at center and RHS view
Diffstat (limited to 'webapp/sass/layout/_webhooks.scss')
-rw-r--r-- | webapp/sass/layout/_webhooks.scss | 49 |
1 files changed, 48 insertions, 1 deletions
diff --git a/webapp/sass/layout/_webhooks.scss b/webapp/sass/layout/_webhooks.scss index 6f6ab0c90..edb4cbd93 100644 --- a/webapp/sass/layout/_webhooks.scss +++ b/webapp/sass/layout/_webhooks.scss @@ -38,6 +38,17 @@ .post { .attachment { + margin-left: -20px; + position: relative; + + &:hover { + .attachment__body__wrap { + .btn-close { + visibility: visible; + } + } + } + &.attachment--opengraph { max-width: 800px; } @@ -46,7 +57,7 @@ border-radius: 4px; border-style: solid; border-width: 1px; - margin: 5px 0; + margin: 5px 0 5px 20px; padding: 2px 5px; } @@ -99,6 +110,42 @@ vertical-align: top; width: 100%; } + + .btn-close { + @include opacity(.4); + background: transparent; + border: none; + color: inherit; + font-size: 21px; + font-weight: 500; + height: 20px; + left: -7px; + line-height: 20px; + outline: none; + padding: 0; + position: absolute; + text-align: center; + text-decoration: none; + text-shadow: none; + visibility: hidden; + width: 20px; + z-index: 5; + + span { + font-family: 'Open Sans', sans-serif; + line-height: 10px; + } + + &:hover { + @include opacity(.9); + } + } + + &:hover { + .btn-close { + visibility: visible; + } + } } .attachment__body { |