diff options
author | Andrew Fontaine <afontaine@gitlab.com> | 2019-07-12 21:57:26 +0300 |
---|---|---|
committer | Andrew Fontaine <afontaine@gitlab.com> | 2019-07-12 21:57:26 +0300 |
commit | bbbef26fdcb1842b475db9482eb3a9c204bf15b4 (patch) | |
tree | 862aacc9bdc6eb29c20dc97d15ea24c5f1b58a22 | |
parent | c6ff3d3c918d37dd620ee05d512b3cffeb6b0587 (diff) |
Fix Alignment of Resolved Threads Counterbutton-bug-fixes
Fixes the button group alignments of the threads-resolved counter and
buttons
-rw-r--r-- | app/assets/javascripts/notes/components/discussion_counter.vue | 46 | ||||
-rw-r--r-- | app/assets/stylesheets/pages/notes.scss | 6 |
2 files changed, 23 insertions, 29 deletions
diff --git a/app/assets/javascripts/notes/components/discussion_counter.vue b/app/assets/javascripts/notes/components/discussion_counter.vue index d7ffa0abb79..4f177606cb4 100644 --- a/app/assets/javascripts/notes/components/discussion_counter.vue +++ b/app/assets/javascripts/notes/components/discussion_counter.vue @@ -50,7 +50,7 @@ export default { <template> <div v-if="resolvableDiscussionsCount > 0" class="line-resolve-all-container full-width-mobile"> - <div class="full-width-mobile d-flex d-sm-block"> + <div class="full-width-mobile d-flex"> <div :class="{ 'has-next-btn': hasNextButton }" class="line-resolve-all"> <span :class="{ 'is-active': allResolved }" @@ -64,29 +64,27 @@ export default { {{ n__('thread resolved', 'threads resolved', resolvableDiscussionsCount) }} </span> </div> - <div - v-if="resolveAllDiscussionsIssuePath && !allResolved" - class="btn-group btn-group-sm" - role="group" - > - <a - v-gl-tooltip - :href="resolveAllDiscussionsIssuePath" - :title="s__('Resolve all threads in new issue')" - class="new-issue-for-discussion btn btn-default discussion-create-issue-btn" - > - <icon name="issue-new" /> - </a> - </div> - <div v-if="isLoggedIn && !allResolved" class="btn-group btn-group-sm" role="group"> - <button - v-gl-tooltip - title="Jump to first unresolved thread" - class="btn btn-default discussion-next-btn" - @click="jumpToFirstUnresolvedDiscussion" - > - <icon name="comment-next" /> - </button> + <div class="btn-group btn-group-sm" role="group"> + <template v-if="resolveAllDiscussionsIssuePath && !allResolved"> + <a + v-gl-tooltip + :href="resolveAllDiscussionsIssuePath" + :title="s__('Resolve all threads in new issue')" + class="new-issue-for-discussion btn btn-default discussion-create-issue-btn" + > + <icon name="issue-new" /> + </a> + </template> + <template v-if="isLoggedIn && !allResolved"> + <button + v-gl-tooltip + title="Jump to first unresolved thread" + class="btn btn-default discussion-next-btn" + @click="jumpToFirstUnresolvedDiscussion" + > + <icon name="comment-next" /> + </button> + </template> </div> </div> </div> diff --git a/app/assets/stylesheets/pages/notes.scss b/app/assets/stylesheets/pages/notes.scss index b9b8eabf909..2ec584e32b3 100644 --- a/app/assets/stylesheets/pages/notes.scss +++ b/app/assets/stylesheets/pages/notes.scss @@ -825,17 +825,13 @@ $note-form-margin-left: 72px; white-space: nowrap; } - .btn-group { - margin-left: -4px; - } - .discussion-next-btn { border-top-left-radius: 0; border-bottom-left-radius: 0; } .btn { - line-height: $gl-line-height; + line-height: 1.5; svg { fill: $gray-darkest; |