From 8827eea8643bba95571edf2ea0f769b18e8369c2 Mon Sep 17 00:00:00 2001 From: Phil Hughes Date: Tue, 24 May 2016 08:28:18 +0100 Subject: Updated commits UI Closes #14633 --- app/assets/stylesheets/pages/commits.scss | 114 +++++++++++---------- app/helpers/ci_status_helper.rb | 8 +- app/helpers/commits_helper.rb | 26 +++-- app/views/projects/commits/_commit.html.haml | 21 ++-- app/views/projects/commits/_commits.html.haml | 17 +-- app/views/projects/commits/show.html.haml | 11 +- .../merge_requests/show/_commits.html.haml | 3 +- 7 files changed, 104 insertions(+), 96 deletions(-) diff --git a/app/assets/stylesheets/pages/commits.scss b/app/assets/stylesheets/pages/commits.scss index c8c6bbde084..05949e2cd43 100644 --- a/app/assets/stylesheets/pages/commits.scss +++ b/app/assets/stylesheets/pages/commits.scss @@ -7,74 +7,84 @@ margin-right: 9px; } -.lists-separator { - margin: 10px 0; - border-color: #ddd; +.commit-header { + padding: 5px 10px; + background-color: $background-color; + border-top: 1px solid $border-color; + border-bottom: 1px solid $border-color; + font-size: 14px; + + &:first-child { + border-top-width: 0; + } } -.commits-row { - ul { - margin: 0; +.commit-row-title { + line-height: 20px; + margin-bottom: 2px; - li.commit { - padding: 8px 0; - } + .notes_count { + float: right; + margin-right: 10px; } - .commits-row-date { - font-size: 15px; - line-height: 20px; - margin-bottom: 5px; + .str-truncated { + max-width: 70%; } -} -li.commit { - list-style: none; + .commit-row-message { + color: $gl-dark-link-color; - .commit-row-title { - font-size: $list-font-size; - line-height: 20px; - margin-bottom: 2px; - - .btn-clipboard { - margin-top: -1px; + &:hover { + text-decoration: underline; } + } - .notes_count { - float: right; - margin-right: 10px; + .text-expander { + background: #eee; + color: #555; + padding: 0 5px; + cursor: pointer; + margin-left: 4px; + &:hover { + background-color: #ddd; } + } +} - .commit_short_id { - min-width: 65px; - color: $gl-dark-link-color; - font-family: $monospace_font; - } +.commit-actions { + @media (min-width: $screen-md-min) { + float: right; + } +} - .str-truncated { - max-width: 70%; - } +.commit-short-id { + font-family: $monospace_font; + font-weight: 600; +} - .commit-row-message { - color: $gl-dark-link-color; +.commit { + padding: 10px 0 10px 55px; - &:hover { - text-decoration: underline; - } - } + &:not(:last-child) { + border-bottom: 1px solid #eee; + } + + a { + color: $gl-dark-link-color; + } - .text-expander { - background: #eee; - color: #555; - padding: 0 5px; - cursor: pointer; - margin-left: 4px; - &:hover { - background-color: #ddd; - } + .commit-link { + &:hover { + color: $gl-link-color; + text-decoration: none; } } + .avatar { + margin-left: -55px; + } + .item-title { display: inline-block; max-width: 70%; @@ -84,7 +94,7 @@ li.commit { font-size: 14px; border-left: 1px solid #eee; padding: 10px 15px; - margin: 5px 0 10px 5px; + margin: 10px 0 10px 0; background: #f9f9f9; display: none; @@ -111,10 +121,6 @@ li.commit { .avatar { margin-right: 8px; } - - .committed_ago { - display: inline-block; - } } &.inline-commit { diff --git a/app/helpers/ci_status_helper.rb b/app/helpers/ci_status_helper.rb index 07e5c146844..8e4ae1e6aec 100644 --- a/app/helpers/ci_status_helper.rb +++ b/app/helpers/ci_status_helper.rb @@ -38,10 +38,10 @@ module CiStatusHelper icon(icon_name + ' fw') end - def render_commit_status(commit, tooltip_placement: 'auto left') + def render_commit_status(commit, tooltip_placement: 'auto left', cssclass: '') project = commit.project path = builds_namespace_project_commit_path(project.namespace, project, commit) - render_status_with_link('commit', commit.status, path, tooltip_placement) + render_status_with_link('commit', commit.status, path, tooltip_placement, cssclass: cssclass) end def render_pipeline_status(pipeline, tooltip_placement: 'auto left') @@ -57,10 +57,10 @@ module CiStatusHelper private - def render_status_with_link(type, status, path, tooltip_placement) + def render_status_with_link(type, status, path, tooltip_placement, cssclass: '') link_to ci_icon_for_status(status), path, - class: "ci-status-link ci-status-icon-#{status.dasherize}", + class: "ci-status-link ci-status-icon-#{status.dasherize} #{cssclass}", title: "#{type.titleize}: #{ci_label_for_status(status)}", data: { toggle: 'tooltip', placement: tooltip_placement } end diff --git a/app/helpers/commits_helper.rb b/app/helpers/commits_helper.rb index d328f56c80c..767b346f2ff 100644 --- a/app/helpers/commits_helper.rb +++ b/app/helpers/commits_helper.rb @@ -16,6 +16,19 @@ module CommitsHelper commit_person_link(commit, options.merge(source: :committer)) end + def commit_author_avatar(commit, options = {}) + options = options.merge(source: :author) + user = commit.send(options[:source]) + + source_name = clean(commit.send "#{options[:source]}_name".to_sym) + source_email = clean(commit.send "#{options[:source]}_email".to_sym) + + person_name = user.try(:name) || source_name + person_email = user.try(:email) || source_email + + image_tag(avatar_icon(person_email, options[:size]), class: "avatar #{"s#{options[:size]}" if options[:size]}", width: options[:size], alt: "") + end + def image_diff_class(diff) if diff.deleted_file "deleted" @@ -102,24 +115,24 @@ module CommitsHelper if current_controller?(:projects, :commits) if @repo.blob_at(commit.id, @path) return link_to( - "Browse File »", + "Browse File", namespace_project_blob_path(project.namespace, project, tree_join(commit.id, @path)), - class: "pull-right" + class: "btn btn-default" ) elsif @path.present? return link_to( - "Browse Directory »", + "Browse Directory", namespace_project_tree_path(project.namespace, project, tree_join(commit.id, @path)), - class: "pull-right" + class: "btn btn-default" ) end end link_to( "Browse Files", namespace_project_tree_path(project.namespace, project, commit), - class: "pull-right" + class: "btn btn-default" ) end @@ -191,8 +204,7 @@ module CommitsHelper text = if options[:avatar] - avatar = image_tag(avatar_icon(person_email, options[:size]), class: "avatar #{"s#{options[:size]}" if options[:size]}", width: options[:size], alt: "") - %Q{#{avatar} #{person_name}} + %Q{#{person_name}} else person_name end diff --git a/app/views/projects/commits/_commit.html.haml b/app/views/projects/commits/_commit.html.haml index 367027182b6..288b95c3e6e 100644 --- a/app/views/projects/commits/_commit.html.haml +++ b/app/views/projects/commits/_commit.html.haml @@ -9,26 +9,25 @@ = cache(cache_key) do %li.commit.js-toggle-container{ id: "commit-#{commit.short_id}" } + = commit_author_avatar(commit) .commit-row-title %span.item-title - = link_to_gfm commit.title, namespace_project_commit_path(project.namespace, project, commit.id), class: "commit-row-message" + = link_to_gfm commit.title, namespace_project_commit_path(project.namespace, project, commit.id), class: "commit-row-message commit-link" - if commit.description? %a.text-expander.js-toggle-button ... - .pull-right + .commit-actions - if commit.status - = render_commit_status(commit) + = render_commit_status(commit, cssclass: 'btn btn-transparent') = clipboard_button(clipboard_text: commit.id) - = link_to commit.short_id, namespace_project_commit_path(project.namespace, project, commit), class: "commit_short_id" + = link_to commit.short_id, namespace_project_commit_path(project.namespace, project, commit), class: "commit-short-id btn btn-transparent commit-link" + = link_to_browse_code(project, commit) - if commit.description? - .commit-row-description.js-toggle-content - %pre - = preserve(markdown(escape_once(commit.description), pipeline: :single_line, author: commit.author)) + %pre.commit-row-description.js-toggle-content + = preserve(markdown(escape_once(commit.description), pipeline: :single_line, author: commit.author)) .commit-row-info - by = commit_author_link(commit, avatar: true, size: 24) - .committed_ago - #{time_ago_with_tooltip(commit.committed_date)}   - = link_to_browse_code(project, commit) + authored + #{time_ago_with_tooltip(commit.committed_date)}   diff --git a/app/views/projects/commits/_commits.html.haml b/app/views/projects/commits/_commits.html.haml index 7283a78a64e..dd12eae8f7e 100644 --- a/app/views/projects/commits/_commits.html.haml +++ b/app/views/projects/commits/_commits.html.haml @@ -4,18 +4,11 @@ - commits, hidden = limited_commits(@commits) - commits.chunk { |c| c.committed_date.in_time_zone.to_date }.each do |day, commits| - .row.commits-row - .col-md-2.hidden-xs.hidden-sm - %h5.commits-row-date - %i.fa.fa-calendar - %span= day.strftime('%d %b, %Y') - .light - = pluralize(commits.count, 'commit') - .col-md-10.col-sm-12 - %ul.content-list - = render commits, project: project - %hr.lists-separator + %li.commit-header= "#{day.strftime('%d %b, %Y')} #{pluralize(commits.count, 'commit')}" + %li.commits-row + %ul.list-unstyled.commit-list + = render commits, project: project - if hidden > 0 - .alert.alert-warning + %li.alert.alert-warning #{number_with_delimiter(hidden)} additional commits have been omitted to prevent performance issues. diff --git a/app/views/projects/commits/show.html.haml b/app/views/projects/commits/show.html.haml index 76ba0bea36d..51ca4eb903e 100644 --- a/app/views/projects/commits/show.html.haml +++ b/app/views/projects/commits/show.html.haml @@ -23,21 +23,18 @@ Create Merge Request .control - = form_tag(namespace_project_commits_path(@project.namespace, @project, @id), method: :get, class: 'pull-left commits-search-form') do - = search_field_tag :search, params[:search], { placeholder: 'Filter by commit message', id: 'commits-search', class: 'form-control search-text-input', spellcheck: false } - + = form_tag(namespace_project_commits_path(@project.namespace, @project, @id), method: :get, class: 'commits-search-form') do + = search_field_tag :search, params[:search], { placeholder: 'Filter by commit message', id: 'commits-search', class: 'form-control search-text-input input-short', spellcheck: false } - if current_user && current_user.private_token .control = link_to namespace_project_commits_path(@project.namespace, @project, @ref, {format: :atom, private_token: current_user.private_token}), title: "Commits Feed", class: 'btn' do = icon("rss") - - %ul.breadcrumb.repo-breadcrumb = commits_breadcrumbs %div{id: dom_id(@project)} - #commits-list.content_list= render "commits", project: @project - .clear + %ol#commits-list.list-unstyled.content_list + = render "commits", project: @project = spinner :javascript diff --git a/app/views/projects/merge_requests/show/_commits.html.haml b/app/views/projects/merge_requests/show/_commits.html.haml index a8f09f855d4..0b05785430b 100644 --- a/app/views/projects/merge_requests/show/_commits.html.haml +++ b/app/views/projects/merge_requests/show/_commits.html.haml @@ -2,4 +2,5 @@ = icon("sort-amount-desc") Most recent commits displayed first -= render "projects/commits/commits", project: @merge_request.project +%ol#commits-list.list-unstyled + = render "projects/commits/commits", project: @merge_request.project -- cgit v1.2.1 From 79b375e17876105cefcbc5c451e785aceedb0002 Mon Sep 17 00:00:00 2001 From: Phil Hughes Date: Tue, 24 May 2016 14:00:49 +0100 Subject: Updated some commit UI colors Fixed issue with tree view styles --- app/assets/stylesheets/pages/commits.scss | 25 ++++++++++++------------- app/assets/stylesheets/pages/tree.scss | 2 +- app/helpers/button_helper.rb | 4 ++-- app/views/projects/commits/_commit.html.haml | 8 ++++---- 4 files changed, 19 insertions(+), 20 deletions(-) diff --git a/app/assets/stylesheets/pages/commits.scss b/app/assets/stylesheets/pages/commits.scss index 05949e2cd43..d360a224848 100644 --- a/app/assets/stylesheets/pages/commits.scss +++ b/app/assets/stylesheets/pages/commits.scss @@ -41,13 +41,17 @@ } .text-expander { - background: #eee; - color: #555; + background: $gray-light; + color: $gl-gray-dark; padding: 0 5px; cursor: pointer; - margin-left: 4px; + border: 1px solid $border-gray-dark; + border-radius: $border-radius-default; + margin-left: 5px; + &:hover { - background-color: #ddd; + background-color: darken($gray-light, 10%); + text-decoration: none; } } } @@ -55,6 +59,7 @@ .commit-actions { @media (min-width: $screen-md-min) { float: right; + margin-left: $gl-padding; } } @@ -70,17 +75,11 @@ border-bottom: 1px solid #eee; } - a { + a, + button { color: $gl-dark-link-color; } - .commit-link { - &:hover { - color: $gl-link-color; - text-decoration: none; - } - } - .avatar { margin-left: -55px; } @@ -94,7 +93,7 @@ font-size: 14px; border-left: 1px solid #eee; padding: 10px 15px; - margin: 10px 0 10px 0; + margin: 10px 0; background: #f9f9f9; display: none; diff --git a/app/assets/stylesheets/pages/tree.scss b/app/assets/stylesheets/pages/tree.scss index f16fc7f388f..cfb6e2e888e 100644 --- a/app/assets/stylesheets/pages/tree.scss +++ b/app/assets/stylesheets/pages/tree.scss @@ -101,7 +101,7 @@ margin: 0; .commit { - padding: 0; + padding: 0 0 0 55px; .commit-row-title { .commit-row-message { diff --git a/app/helpers/button_helper.rb b/app/helpers/button_helper.rb index f742922d926..bf5505125ab 100644 --- a/app/helpers/button_helper.rb +++ b/app/helpers/button_helper.rb @@ -14,10 +14,10 @@ module ButtonHelper # # => "" # # See http://clipboardjs.com/#usage - def clipboard_button(data = {}) + def clipboard_button(data = {}, css_class: 'btn-clipboard') content_tag :button, icon('clipboard'), - class: 'btn btn-clipboard', + class: "btn #{css_class}", data: data, type: :button end diff --git a/app/views/projects/commits/_commit.html.haml b/app/views/projects/commits/_commit.html.haml index 288b95c3e6e..f79c9448f60 100644 --- a/app/views/projects/commits/_commit.html.haml +++ b/app/views/projects/commits/_commit.html.haml @@ -12,15 +12,15 @@ = commit_author_avatar(commit) .commit-row-title %span.item-title - = link_to_gfm commit.title, namespace_project_commit_path(project.namespace, project, commit.id), class: "commit-row-message commit-link" + = link_to_gfm commit.title, namespace_project_commit_path(project.namespace, project, commit.id), class: "commit-row-message" - if commit.description? %a.text-expander.js-toggle-button ... .commit-actions - if commit.status = render_commit_status(commit, cssclass: 'btn btn-transparent') - = clipboard_button(clipboard_text: commit.id) - = link_to commit.short_id, namespace_project_commit_path(project.namespace, project, commit), class: "commit-short-id btn btn-transparent commit-link" + = clipboard_button({ clipboard_text: commit.id }, css_class: 'btn-transparent') + = link_to commit.short_id, namespace_project_commit_path(project.namespace, project, commit), class: "commit-short-id btn btn-transparent" = link_to_browse_code(project, commit) - if commit.description? @@ -30,4 +30,4 @@ .commit-row-info = commit_author_link(commit, avatar: true, size: 24) authored - #{time_ago_with_tooltip(commit.committed_date)}   + #{time_ago_with_tooltip(commit.committed_date)} -- cgit v1.2.1 From 8b40a7745be84659c10db02e3bbb74126bd42414 Mon Sep 17 00:00:00 2001 From: Phil Hughes Date: Tue, 24 May 2016 17:06:49 +0100 Subject: Updated tests --- app/helpers/button_helper.rb | 8 ++++++++ app/helpers/commits_helper.rb | 1 - app/views/projects/commits/_commit.html.haml | 2 +- 3 files changed, 9 insertions(+), 2 deletions(-) diff --git a/app/helpers/button_helper.rb b/app/helpers/button_helper.rb index bf5505125ab..fabd726aae9 100644 --- a/app/helpers/button_helper.rb +++ b/app/helpers/button_helper.rb @@ -22,6 +22,14 @@ module ButtonHelper type: :button end + def clipboard_button_with_class(data = {}, css_class: 'btn-clipboard') + content_tag :button, + icon('clipboard'), + class: "btn #{css_class}", + data: data, + type: :button + end + def http_clone_button(project) klass = 'http-selector' klass << ' has-tooltip' if current_user.try(:require_password?) diff --git a/app/helpers/commits_helper.rb b/app/helpers/commits_helper.rb index 767b346f2ff..97d52b1fb9e 100644 --- a/app/helpers/commits_helper.rb +++ b/app/helpers/commits_helper.rb @@ -200,7 +200,6 @@ module CommitsHelper source_email = clean(commit.send "#{options[:source]}_email".to_sym) person_name = user.try(:name) || source_name - person_email = user.try(:email) || source_email text = if options[:avatar] diff --git a/app/views/projects/commits/_commit.html.haml b/app/views/projects/commits/_commit.html.haml index f79c9448f60..d6661deb5ff 100644 --- a/app/views/projects/commits/_commit.html.haml +++ b/app/views/projects/commits/_commit.html.haml @@ -19,7 +19,7 @@ .commit-actions - if commit.status = render_commit_status(commit, cssclass: 'btn btn-transparent') - = clipboard_button({ clipboard_text: commit.id }, css_class: 'btn-transparent') + = clipboard_button_with_class({ clipboard_text: commit.id }, css_class: 'btn-transparent') = link_to commit.short_id, namespace_project_commit_path(project.namespace, project, commit), class: "commit-short-id btn btn-transparent" = link_to_browse_code(project, commit) -- cgit v1.2.1 From 48726e9d307536318c7d87e2ba93f93582e22bfa Mon Sep 17 00:00:00 2001 From: Phil Hughes Date: Wed, 25 May 2016 09:11:47 +0100 Subject: Updated failing tests --- app/assets/stylesheets/pages/commits.scss | 4 ++-- app/helpers/button_helper.rb | 4 ++-- app/helpers/commits_helper.rb | 3 --- features/steps/project/source/browse_files.rb | 6 +++--- 4 files changed, 7 insertions(+), 10 deletions(-) diff --git a/app/assets/stylesheets/pages/commits.scss b/app/assets/stylesheets/pages/commits.scss index d360a224848..ba8d9cce49b 100644 --- a/app/assets/stylesheets/pages/commits.scss +++ b/app/assets/stylesheets/pages/commits.scss @@ -10,8 +10,8 @@ .commit-header { padding: 5px 10px; background-color: $background-color; - border-top: 1px solid $border-color; - border-bottom: 1px solid $border-color; + border-bottom: 1px solid #eee; + border-bottom: 1px solid #eee; font-size: 14px; &:first-child { diff --git a/app/helpers/button_helper.rb b/app/helpers/button_helper.rb index fabd726aae9..07a3f452460 100644 --- a/app/helpers/button_helper.rb +++ b/app/helpers/button_helper.rb @@ -14,10 +14,10 @@ module ButtonHelper # # => "" # # See http://clipboardjs.com/#usage - def clipboard_button(data = {}, css_class: 'btn-clipboard') + def clipboard_button(data = {}) content_tag :button, icon('clipboard'), - class: "btn #{css_class}", + class: "btn", data: data, type: :button end diff --git a/app/helpers/commits_helper.rb b/app/helpers/commits_helper.rb index 97d52b1fb9e..3dbb6e4a551 100644 --- a/app/helpers/commits_helper.rb +++ b/app/helpers/commits_helper.rb @@ -20,10 +20,7 @@ module CommitsHelper options = options.merge(source: :author) user = commit.send(options[:source]) - source_name = clean(commit.send "#{options[:source]}_name".to_sym) source_email = clean(commit.send "#{options[:source]}_email".to_sym) - - person_name = user.try(:name) || source_name person_email = user.try(:email) || source_email image_tag(avatar_icon(person_email, options[:size]), class: "avatar #{"s#{options[:size]}" if options[:size]}", width: options[:size], alt: "") diff --git a/features/steps/project/source/browse_files.rb b/features/steps/project/source/browse_files.rb index 2c0498de3b9..79a3ed8197e 100644 --- a/features/steps/project/source/browse_files.rb +++ b/features/steps/project/source/browse_files.rb @@ -202,8 +202,8 @@ class Spinach::Features::ProjectSourceBrowseFiles < Spinach::FeatureSteps end step 'I see Browse dir link' do - expect(page).to have_link 'Browse Directory »' - expect(page).not_to have_link 'Browse Code »' + expect(page).to have_link 'Browse Directory' + expect(page).not_to have_link 'Browse Code' end step 'I click on readme file' do @@ -219,7 +219,7 @@ class Spinach::Features::ProjectSourceBrowseFiles < Spinach::FeatureSteps step 'I see Browse code link' do expect(page).to have_link 'Browse Files' - expect(page).not_to have_link 'Browse Directory »' + expect(page).not_to have_link 'Browse Directory' end step 'I click on Permalink' do -- cgit v1.2.1 From 97cee7e231689a7dee2f193411f3cd7962c6ea52 Mon Sep 17 00:00:00 2001 From: Phil Hughes Date: Tue, 31 May 2016 11:04:18 +0100 Subject: Improved spacing on mobile --- app/assets/stylesheets/pages/commits.scss | 14 +++++++++++--- app/helpers/commits_helper.rb | 2 +- app/views/projects/commits/_commit.html.haml | 6 ++++-- 3 files changed, 16 insertions(+), 6 deletions(-) diff --git a/app/assets/stylesheets/pages/commits.scss b/app/assets/stylesheets/pages/commits.scss index ba8d9cce49b..2723fb0b6e0 100644 --- a/app/assets/stylesheets/pages/commits.scss +++ b/app/assets/stylesheets/pages/commits.scss @@ -57,7 +57,7 @@ } .commit-actions { - @media (min-width: $screen-md-min) { + @media (min-width: $screen-sm-min) { float: right; margin-left: $gl-padding; } @@ -69,7 +69,11 @@ } .commit { - padding: 10px 0 10px 55px; + padding: 10px 0 10px; + + @media (min-width: $screen-sm-min) { + padding-left: 55px; + } &:not(:last-child) { border-bottom: 1px solid #eee; @@ -78,6 +82,7 @@ a, button { color: $gl-dark-link-color; + vertical-align: baseline; } .avatar { @@ -86,7 +91,10 @@ .item-title { display: inline-block; - max-width: 70%; + + @media (min-width: $screen-sm-min) { + max-width: 70%; + } } .commit-row-description { diff --git a/app/helpers/commits_helper.rb b/app/helpers/commits_helper.rb index 3dbb6e4a551..55d65698292 100644 --- a/app/helpers/commits_helper.rb +++ b/app/helpers/commits_helper.rb @@ -23,7 +23,7 @@ module CommitsHelper source_email = clean(commit.send "#{options[:source]}_email".to_sym) person_email = user.try(:email) || source_email - image_tag(avatar_icon(person_email, options[:size]), class: "avatar #{"s#{options[:size]}" if options[:size]}", width: options[:size], alt: "") + image_tag(avatar_icon(person_email, options[:size]), class: "avatar #{"s#{options[:size]}" if options[:size]} hidden-xs", width: options[:size], alt: "") end def image_diff_class(diff) diff --git a/app/views/projects/commits/_commit.html.haml b/app/views/projects/commits/_commit.html.haml index d6661deb5ff..58ccd31442a 100644 --- a/app/views/projects/commits/_commit.html.haml +++ b/app/views/projects/commits/_commit.html.haml @@ -13,10 +13,12 @@ .commit-row-title %span.item-title = link_to_gfm commit.title, namespace_project_commit_path(project.namespace, project, commit.id), class: "commit-row-message" + - if commit.status + = render_commit_status(commit, cssclass: 'visible-xs-inline') - if commit.description? - %a.text-expander.js-toggle-button ... + %a.text-expander.hidden-xs.js-toggle-button ... - .commit-actions + .commit-actions.hidden-xs - if commit.status = render_commit_status(commit, cssclass: 'btn btn-transparent') = clipboard_button_with_class({ clipboard_text: commit.id }, css_class: 'btn-transparent') -- cgit v1.2.1 From d5afb1324f2fb9b9c19df3806662e159bbe4ffb3 Mon Sep 17 00:00:00 2001 From: Phil Hughes Date: Tue, 31 May 2016 11:17:13 +0100 Subject: Sends correct parameter to commit_author_link for avatar --- app/views/projects/commits/_commit.html.haml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/views/projects/commits/_commit.html.haml b/app/views/projects/commits/_commit.html.haml index 58ccd31442a..66df5fe5e20 100644 --- a/app/views/projects/commits/_commit.html.haml +++ b/app/views/projects/commits/_commit.html.haml @@ -30,6 +30,6 @@ = preserve(markdown(escape_once(commit.description), pipeline: :single_line, author: commit.author)) .commit-row-info - = commit_author_link(commit, avatar: true, size: 24) + = commit_author_link(commit, avatar: false, size: 24) authored #{time_ago_with_tooltip(commit.committed_date)} -- cgit v1.2.1 From 6863444b7e7d71e6b50ed8ab09cda6f3e0117176 Mon Sep 17 00:00:00 2001 From: Phil Hughes Date: Tue, 31 May 2016 11:40:46 +0100 Subject: SCSS lint fix --- app/assets/stylesheets/pages/commits.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/assets/stylesheets/pages/commits.scss b/app/assets/stylesheets/pages/commits.scss index 2723fb0b6e0..93566be88d1 100644 --- a/app/assets/stylesheets/pages/commits.scss +++ b/app/assets/stylesheets/pages/commits.scss @@ -69,7 +69,7 @@ } .commit { - padding: 10px 0 10px; + padding: 10px 0; @media (min-width: $screen-sm-min) { padding-left: 55px; -- cgit v1.2.1 From e5a83a9a94f7fbedb2fcce645248e1198dcf474f Mon Sep 17 00:00:00 2001 From: Phil Hughes Date: Wed, 1 Jun 2016 10:17:32 +0100 Subject: Added short commit ID to mobile --- app/assets/stylesheets/pages/commits.scss | 4 ---- app/views/projects/commits/_commit.html.haml | 3 +++ 2 files changed, 3 insertions(+), 4 deletions(-) diff --git a/app/assets/stylesheets/pages/commits.scss b/app/assets/stylesheets/pages/commits.scss index 93566be88d1..a392993b38d 100644 --- a/app/assets/stylesheets/pages/commits.scss +++ b/app/assets/stylesheets/pages/commits.scss @@ -34,10 +34,6 @@ .commit-row-message { color: $gl-dark-link-color; - - &:hover { - text-decoration: underline; - } } .text-expander { diff --git a/app/views/projects/commits/_commit.html.haml b/app/views/projects/commits/_commit.html.haml index 66df5fe5e20..757f4e7e8e0 100644 --- a/app/views/projects/commits/_commit.html.haml +++ b/app/views/projects/commits/_commit.html.haml @@ -13,6 +13,9 @@ .commit-row-title %span.item-title = link_to_gfm commit.title, namespace_project_commit_path(project.namespace, project, commit.id), class: "commit-row-message" + %span.commit-row-message.visible-xs-inline + · + = commit.short_id - if commit.status = render_commit_status(commit, cssclass: 'visible-xs-inline') - if commit.description? -- cgit v1.2.1 From 41c2ea9b7a036da7064b433de43c19e578cc7531 Mon Sep 17 00:00:00 2001 From: Phil Hughes Date: Tue, 7 Jun 2016 16:09:46 +0100 Subject: Vertical alignment of buttons in commit row --- app/assets/stylesheets/pages/commits.scss | 6 +++--- app/views/projects/commits/_commit.html.haml | 2 +- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/app/assets/stylesheets/pages/commits.scss b/app/assets/stylesheets/pages/commits.scss index a392993b38d..335d9e5efd7 100644 --- a/app/assets/stylesheets/pages/commits.scss +++ b/app/assets/stylesheets/pages/commits.scss @@ -20,8 +20,8 @@ } .commit-row-title { - line-height: 20px; - margin-bottom: 2px; + line-height: 1; + margin-bottom: 6px; .notes_count { float: right; @@ -115,7 +115,7 @@ .commit-row-info { color: $gl-gray; - line-height: 24px; + line-height: 1; a { color: $gl-gray; diff --git a/app/views/projects/commits/_commit.html.haml b/app/views/projects/commits/_commit.html.haml index 757f4e7e8e0..a959b34a539 100644 --- a/app/views/projects/commits/_commit.html.haml +++ b/app/views/projects/commits/_commit.html.haml @@ -9,7 +9,7 @@ = cache(cache_key) do %li.commit.js-toggle-container{ id: "commit-#{commit.short_id}" } - = commit_author_avatar(commit) + = commit_author_avatar(commit, size: 36) .commit-row-title %span.item-title = link_to_gfm commit.title, namespace_project_commit_path(project.namespace, project, commit.id), class: "commit-row-message" -- cgit v1.2.1 From e7ee3f9f4d34f74bb40c0e439a2f7920e55ba3ba Mon Sep 17 00:00:00 2001 From: Phil Hughes Date: Tue, 7 Jun 2016 16:16:18 +0100 Subject: Changed margin to better align vertically --- app/assets/stylesheets/pages/commits.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/assets/stylesheets/pages/commits.scss b/app/assets/stylesheets/pages/commits.scss index 335d9e5efd7..b954ed50945 100644 --- a/app/assets/stylesheets/pages/commits.scss +++ b/app/assets/stylesheets/pages/commits.scss @@ -21,7 +21,7 @@ .commit-row-title { line-height: 1; - margin-bottom: 6px; + margin-bottom: 5px; .notes_count { float: right; -- cgit v1.2.1 From b76ab726b2542d77d59b12457b62016d9205a5b2 Mon Sep 17 00:00:00 2001 From: Phil Hughes Date: Wed, 8 Jun 2016 10:32:54 +0100 Subject: Fixed horizontal and veritcal alignment of commit action buttons --- app/assets/stylesheets/pages/commits.scss | 22 ++++++++++++++++++---- 1 file changed, 18 insertions(+), 4 deletions(-) diff --git a/app/assets/stylesheets/pages/commits.scss b/app/assets/stylesheets/pages/commits.scss index b954ed50945..811f0765a27 100644 --- a/app/assets/stylesheets/pages/commits.scss +++ b/app/assets/stylesheets/pages/commits.scss @@ -10,7 +10,7 @@ .commit-header { padding: 5px 10px; background-color: $background-color; - border-bottom: 1px solid #eee; + border-top: 1px solid #eee; border-bottom: 1px solid #eee; font-size: 14px; @@ -21,7 +21,7 @@ .commit-row-title { line-height: 1; - margin-bottom: 5px; + margin-bottom: 7px; .notes_count { float: right; @@ -37,6 +37,7 @@ } .text-expander { + display: inline-block; background: $gray-light; color: $gl-gray-dark; padding: 0 5px; @@ -56,6 +57,19 @@ @media (min-width: $screen-sm-min) { float: right; margin-left: $gl-padding; + margin-top: 2px; + font-size: 0; + } + + .btn-transparent { + padding-left: 0; + padding-right: 0; + } + + .btn { + &:not(:first-child) { + margin-left: $gl-padding; + } } } @@ -68,7 +82,7 @@ padding: 10px 0; @media (min-width: $screen-sm-min) { - padding-left: 55px; + padding-left: 46px; } &:not(:last-child) { @@ -82,7 +96,7 @@ } .avatar { - margin-left: -55px; + margin-left: -46px; } .item-title { -- cgit v1.2.1 From 1f192afa2abab5fcab693eaf3e0fa3c874cfb793 Mon Sep 17 00:00:00 2001 From: Phil Hughes Date: Thu, 9 Jun 2016 10:50:03 +0100 Subject: Updated text expander text color --- app/assets/stylesheets/pages/commits.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/assets/stylesheets/pages/commits.scss b/app/assets/stylesheets/pages/commits.scss index 811f0765a27..5a6e55cf63f 100644 --- a/app/assets/stylesheets/pages/commits.scss +++ b/app/assets/stylesheets/pages/commits.scss @@ -39,7 +39,7 @@ .text-expander { display: inline-block; background: $gray-light; - color: $gl-gray-dark; + color: $gl-placeholder-color; padding: 0 5px; cursor: pointer; border: 1px solid $border-gray-dark; -- cgit v1.2.1