diff --git a/webapp/plugins/jira/components/settings.jsx b/webapp/plugins/jira/components/settings.jsx index 5e5b5fac6f..c0f7a0a7b3 100644 --- a/webapp/plugins/jira/components/settings.jsx +++ b/webapp/plugins/jira/components/settings.jsx @@ -29,7 +29,7 @@ class UserSuggestion extends Suggestion { render() { const {item, isSelection} = this.props; - let className = 'jirabots__name'; + let className = 'suggestion-list__item mentions__name'; if (isSelection) { className += ' suggestion--selected'; } @@ -218,7 +218,7 @@ export default class JIRASettings extends AdminSettings { onChange={this.handleSecretChange} disabled={!this.state.enabled} /> -
+

-

- + ' }} /> -

+
diff --git a/webapp/plugins/jira/components/style.scss b/webapp/plugins/jira/components/style.scss index 4773283167..46dd584275 100644 --- a/webapp/plugins/jira/components/style.scss +++ b/webapp/plugins/jira/components/style.scss @@ -5,34 +5,19 @@ .jirabots__dropdown { position: relative; -} -.jirabots__dropdown::before { - position: absolute; - top: 13px; - right: 8px; - content: " "; - pointer-events: none; - - width: 0; - height: 0; - - border-left: 8px solid transparent; - border-right: 8px solid transparent; - border-top: 8px solid #e2e2e2; -} - -.jirabots__name { - @include clearfix; - cursor: pointer; - font-size: 13px; - line-height: 20px; - margin: 0; - padding: 6px 10px; - position: relative; - white-space: nowrap; - width: 100%; - z-index: 101; + &:before { + border-color: #999 transparent transparent; + border-style: solid; + border-width: 5px 5px 2.5px; + content: ''; + height: 0; + pointer-events: none; + position: absolute; + right: 11px; + top: 15px; + width: 0; + } } .jirabot__image { diff --git a/webapp/sass/components/_suggestion-list.scss b/webapp/sass/components/_suggestion-list.scss index 77550e3315..05a83c32d5 100644 --- a/webapp/sass/components/_suggestion-list.scss +++ b/webapp/sass/components/_suggestion-list.scss @@ -4,19 +4,26 @@ @extend %popover-box-shadow; width: 100%; z-index: 100; + + .suggestion-list__item { + &:hover { + background: alpha-color($black, .1); + } + } } .suggestion-list--top { - position: absolute; bottom: 100%; + position: absolute; } .suggestion-list--bottom { - position: relative; height: 0; + position: relative; } .suggestion-list__content { + -webkit-overflow-scrolling: touch; background-color: $white; border: $border-gray; max-height: 292px; @@ -24,7 +31,6 @@ overflow-y: scroll; padding-bottom: 5px; width: 100%; - -webkit-overflow-scrolling: touch; .command { border-bottom: 1px solid $light-gray; diff --git a/webapp/sass/routes/_admin-console.scss b/webapp/sass/routes/_admin-console.scss index 829ed107ec..4ce4c00f1e 100644 --- a/webapp/sass/routes/_admin-console.scss +++ b/webapp/sass/routes/_admin-console.scss @@ -185,6 +185,17 @@ margin: 2em 0; padding: .8em 1.5rem; + &.banner--url { + padding: 1.2em; + } + + .banner__url { + background: alpha-color($black, .07); + border-radius: 2px; + padding: .7em 1em; + word-break: break-all; + } + .banner__heading { font-size: 1.5em; margin-bottom: 0.5em; @@ -305,7 +316,7 @@ .status-icon-error { color: #ea6262; } - + .suggestion--selected { background-color: #e2e2e2; }