summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorMaurizio De Santis <desantis.maurizio@gmail.com>2018-01-08 09:27:50 +0000
committerPhil Hughes <me@iamphill.com>2018-01-08 09:27:50 +0000
commitf07727d92edab71444e28b12f4d8b6d9f8db690c (patch)
treeee3689b68341edf67a946c5675bf497f0bc736f2
parent82e2d90b519e76fe6d73f791f610da1a425e6091 (diff)
downloadgitlab-ce-f07727d92edab71444e28b12f4d8b6d9f8db690c.tar.gz
Fix slash commands dropdown description
-rw-r--r--app/assets/javascripts/gfm_auto_complete.js6
-rw-r--r--app/assets/stylesheets/framework/markdown_area.scss12
-rw-r--r--changelogs/unreleased/40190-fix-slash-commands-dropdown-description-mis-alignement-on-firefox.yml5
3 files changed, 20 insertions, 3 deletions
diff --git a/app/assets/javascripts/gfm_auto_complete.js b/app/assets/javascripts/gfm_auto_complete.js
index d918d80df8d..df20e1e9c88 100644
--- a/app/assets/javascripts/gfm_auto_complete.js
+++ b/app/assets/javascripts/gfm_auto_complete.js
@@ -57,12 +57,12 @@ class GfmAutoComplete {
displayTpl(value) {
if (GfmAutoComplete.isLoading(value)) return GfmAutoComplete.Loading.template;
// eslint-disable-next-line no-template-curly-in-string
- let tpl = '<li>/${name}';
+ let tpl = '<li><span class="name">/${name}</span>';
if (value.aliases.length > 0) {
- tpl += ' <small>(or /<%- aliases.join(", /") %>)</small>';
+ tpl += ' <small class="aliases">(or /<%- aliases.join(", /") %>)</small>';
}
if (value.params.length > 0) {
- tpl += ' <small><%- params.join(" ") %></small>';
+ tpl += ' <small class="params"><%- params.join(" ") %></small>';
}
if (value.description !== '') {
tpl += '<small class="description"><i><%- description %></i></small>';
diff --git a/app/assets/stylesheets/framework/markdown_area.scss b/app/assets/stylesheets/framework/markdown_area.scss
index 6b07ffdbd61..938f5f49c09 100644
--- a/app/assets/stylesheets/framework/markdown_area.scss
+++ b/app/assets/stylesheets/framework/markdown_area.scss
@@ -192,6 +192,17 @@
overflow-y: auto;
overflow-x: hidden;
+ .name,
+ small.aliases,
+ small.params {
+ float: left;
+ }
+
+ small.aliases,
+ small.params {
+ padding: 2px 5px;
+ }
+
small.description {
float: right;
padding: 3px 5px;
@@ -209,6 +220,7 @@
}
ul > li {
+ @include clearfix;
white-space: nowrap;
}
diff --git a/changelogs/unreleased/40190-fix-slash-commands-dropdown-description-mis-alignement-on-firefox.yml b/changelogs/unreleased/40190-fix-slash-commands-dropdown-description-mis-alignement-on-firefox.yml
new file mode 100644
index 00000000000..71a606ff607
--- /dev/null
+++ b/changelogs/unreleased/40190-fix-slash-commands-dropdown-description-mis-alignement-on-firefox.yml
@@ -0,0 +1,5 @@
+---
+title: "Fix slash commands dropdown description mis-alignment on Firefox"
+merge_request: 16125
+author: Maurizio De Santis
+type: fixed