diff options
author | Clement Ho <clemmakesapps@gmail.com> | 2017-08-14 17:08:28 +0000 |
---|---|---|
committer | Clement Ho <clemmakesapps@gmail.com> | 2017-08-14 17:08:28 +0000 |
commit | cf55fb9b964ad47fa2f1eb5703f447bbb614f125 (patch) | |
tree | 7aabdcc059ce89897fbd4f11f1a75888508da6b9 /app/assets | |
parent | 3248911c08755b8c2885e88c65f3af33e6d1800c (diff) | |
parent | 8858ddaf83e57adc6c003e03e72929f6068a6bfa (diff) | |
download | gitlab-ce-cf55fb9b964ad47fa2f1eb5703f447bbb614f125.tar.gz |
Merge branch '34527-make-edit-comment-button-always-available-outside-of-dropdown' into 'master'
Resolve "Make edit comment button always available outside of dropdown"
Closes #34527
See merge request !12931
Diffstat (limited to 'app/assets')
-rw-r--r-- | app/assets/stylesheets/pages/notes.scss | 56 |
1 files changed, 29 insertions, 27 deletions
diff --git a/app/assets/stylesheets/pages/notes.scss b/app/assets/stylesheets/pages/notes.scss index 2bb867052f6..0a194f3707f 100644 --- a/app/assets/stylesheets/pages/notes.scss +++ b/app/assets/stylesheets/pages/notes.scss @@ -453,7 +453,10 @@ ul.notes { } .note-actions { + align-self: flex-start; flex-shrink: 0; + display: inline-flex; + align-items: center; // For PhantomJS that does not support flex float: right; margin-left: 10px; @@ -463,18 +466,12 @@ ul.notes { float: none; margin-left: 0; } - - .note-action-button { - margin-left: 8px; - } - - .more-actions-toggle { - margin-left: 2px; - } } .more-actions { - display: inline-block; + float: right; // phantomjs fallback + display: flex; + align-items: flex-end; .tooltip { white-space: nowrap; @@ -482,16 +479,10 @@ ul.notes { } .more-actions-toggle { - padding: 0; - &:hover .icon, &:focus .icon { color: $blue-600; } - - .icon { - padding: 0 6px; - } } .more-actions-dropdown { @@ -519,28 +510,42 @@ ul.notes { @include notes-media('max', $screen-md-max) { float: none; margin-left: 0; + } +} - .note-action-button { - margin-left: 0; - } +.note-actions-item { + margin-left: 15px; + display: flex; + align-items: center; + + &.more-actions { + // compensate for narrow icon + margin-left: 10px; } } .note-action-button { - display: inline; - line-height: 20px; + line-height: 1; + padding: 0; + min-width: 16px; + color: $gray-darkest; .fa { - color: $gray-darkest; position: relative; - font-size: 17px; + font-size: 16px; } + + svg { height: 16px; width: 16px; - fill: $gray-darkest; + top: 0; vertical-align: text-top; + + path { + fill: currentColor; + } } .award-control-icon-positive, @@ -613,10 +618,7 @@ ul.notes { .note-role { position: relative; - top: -2px; - display: inline-block; - padding-left: 7px; - padding-right: 7px; + padding: 0 7px; color: $notes-role-color; font-size: 12px; line-height: 20px; |