From cd36f293991e05323fe90cfdfb31f8315d0d7445 Mon Sep 17 00:00:00 2001 From: Dmitriy Zaporozhets Date: Wed, 8 Jun 2016 18:06:28 +0300 Subject: [PATCH 1/5] Improve button margin for btn-grouped css class Signed-off-by: Dmitriy Zaporozhets --- app/assets/stylesheets/framework/buttons.scss | 42 +++++++++---------- .../group_members/_group_member.html.haml | 2 +- .../project_members/_project_member.html.haml | 2 +- .../shared/milestones/_milestone.html.haml | 8 ++-- 4 files changed, 24 insertions(+), 30 deletions(-) diff --git a/app/assets/stylesheets/framework/buttons.scss b/app/assets/stylesheets/framework/buttons.scss index 625200cbca..1e3083cce5 100644 --- a/app/assets/stylesheets/framework/buttons.scss +++ b/app/assets/stylesheets/framework/buttons.scss @@ -79,6 +79,23 @@ @include btn-color($white-light, $border-color, $white-normal, $border-white-normal, $white-dark, $border-white-dark, $btn-white-active); } +@mixin btn-with-margin { + margin-left: $btn-side-margin; + float: left; + + &.inline { + float: none; + } + + &.btn-sm { + margin-left: $btn-sm-side-margin; + } + + &.btn-xs { + margin-left: $btn-xs-side-margin; + } +} + .btn { @include btn-default; @include btn-white; @@ -142,24 +159,7 @@ } &.btn-grouped { - margin-right: $btn-side-margin; - float: left; - - &.inline { - float: none; - } - - &:last-child { - margin-right: 0; - } - - &.btn-sm { - margin-right: $btn-sm-side-margin; - } - - &.btn-xs { - margin-right: $btn-xs-side-margin; - } + @include btn-with-margin; } &.disabled { @@ -203,11 +203,7 @@ .btn-group { &.btn-grouped { - margin-right: 7px; - float: left; - &:last-child { - margin-right: 0; - } + @include btn-with-margin; } } diff --git a/app/views/groups/group_members/_group_member.html.haml b/app/views/groups/group_members/_group_member.html.haml index 271700e6db..6bb542e658 100644 --- a/app/views/groups/group_members/_group_member.html.haml +++ b/app/views/groups/group_members/_group_member.html.haml @@ -34,7 +34,7 @@ %strong.member-access-level= member.human_access - if show_controls - if can?(current_user, :update_group_member, member) - = button_tag class: "btn-xs btn js-toggle-button", + = button_tag class: "btn-xs btn btn-grouped inline js-toggle-button", title: 'Edit access level', type: 'button' do = icon('pencil') diff --git a/app/views/projects/project_members/_project_member.html.haml b/app/views/projects/project_members/_project_member.html.haml index 1e53b8e37d..268f140d7d 100644 --- a/app/views/projects/project_members/_project_member.html.haml +++ b/app/views/projects/project_members/_project_member.html.haml @@ -32,7 +32,7 @@ .pull-right %strong= member.human_access - if can?(current_user, :update_project_member, member) - = button_tag class: "btn-xs btn js-toggle-button", + = button_tag class: "btn-xs btn-grouped inline btn js-toggle-button", title: 'Edit access level', type: 'button' do = icon('pencil') diff --git a/app/views/shared/milestones/_milestone.html.haml b/app/views/shared/milestones/_milestone.html.haml index 6b25745c55..acc3ccf4dc 100644 --- a/app/views/shared/milestones/_milestone.html.haml +++ b/app/views/shared/milestones/_milestone.html.haml @@ -35,11 +35,9 @@ .col-sm-6= render('shared/milestone_expired', milestone: milestone) .col-sm-6 - if can?(current_user, :admin_milestone, milestone.project) and milestone.active? - = link_to edit_namespace_project_milestone_path(milestone.project.namespace, milestone.project, milestone), class: "btn btn-xs" do - = icon('pencil-square-o') + = link_to edit_namespace_project_milestone_path(milestone.project.namespace, milestone.project, milestone), class: "btn btn-xs btn-grouped" do Edit \ - = link_to 'Close Milestone', namespace_project_milestone_path(@project.namespace, @project, milestone, milestone: {state_event: :close }), method: :put, remote: true, class: "btn btn-xs btn-close" - = link_to namespace_project_milestone_path(milestone.project.namespace, milestone.project, milestone), data: { confirm: 'Are you sure?' }, method: :delete, class: "btn btn-xs btn-remove" do - = icon('trash-o') + = link_to 'Close Milestone', namespace_project_milestone_path(@project.namespace, @project, milestone, milestone: {state_event: :close }), method: :put, remote: true, class: "btn btn-xs btn-close btn-grouped" + = link_to namespace_project_milestone_path(milestone.project.namespace, milestone.project, milestone), data: { confirm: 'Are you sure?' }, method: :delete, class: "btn btn-xs btn-remove btn-grouped" do Delete From c5e6292e5f9cdb71b785b00a0140e82528e095c7 Mon Sep 17 00:00:00 2001 From: Dmitriy Zaporozhets Date: Wed, 8 Jun 2016 18:14:20 +0300 Subject: [PATCH 2/5] Use default button size in the content list controls Signed-off-by: Dmitriy Zaporozhets --- app/assets/stylesheets/framework/lists.scss | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/app/assets/stylesheets/framework/lists.scss b/app/assets/stylesheets/framework/lists.scss index 96e7aa4fb1..dec327669e 100644 --- a/app/assets/stylesheets/framework/lists.scss +++ b/app/assets/stylesheets/framework/lists.scss @@ -138,7 +138,9 @@ ul.content-list { float: right; .btn { - padding: 10px 14px; + padding: $gl-vert-padding $gl-btn-padding; + margin-top: 4px; + margin-bottom: 4px; } } From 7d3dae2309025c796bdbdcec9ab2b0f5965ff166 Mon Sep 17 00:00:00 2001 From: Dmitriy Zaporozhets Date: Wed, 8 Jun 2016 18:23:45 +0300 Subject: [PATCH 3/5] Use responsive top-area on project branches and tags pages Signed-off-by: Dmitriy Zaporozhets --- app/views/projects/branches/index.html.haml | 47 ++++++++++----------- app/views/projects/tags/index.html.haml | 14 +++--- 2 files changed, 30 insertions(+), 31 deletions(-) diff --git a/app/views/projects/branches/index.html.haml b/app/views/projects/branches/index.html.haml index 0d59c3884c..e0367c4027 100644 --- a/app/views/projects/branches/index.html.haml +++ b/app/views/projects/branches/index.html.haml @@ -3,31 +3,30 @@ = render "projects/commits/head" %div{ class: (container_class) } - .row-content-block.second-block.content-component-block - .pull-right - - if can? current_user, :push_code, @project - = link_to new_namespace_project_branch_path(@project.namespace, @project), class: 'btn btn-create' do - = icon('plus') - New branch -   - .dropdown.inline - %button.dropdown-toggle.btn{type: 'button', 'data-toggle' => 'dropdown'} - %span.light - - if @sort.present? - = @sort.humanize - - else - Name - %b.caret - %ul.dropdown-menu.dropdown-menu-align-right - %li - = link_to namespace_project_branches_path(sort: nil) do - Name - = link_to namespace_project_branches_path(sort: 'recently_updated') do - = sort_title_recently_updated - = link_to namespace_project_branches_path(sort: 'last_updated') do - = sort_title_oldest_updated - .oneline + .top-area + .nav-text Protected branches can be managed in project settings + + - if can? current_user, :push_code, @project + .nav-controls + = link_to new_namespace_project_branch_path(@project.namespace, @project), class: 'btn btn-create' do + New branch + .dropdown.inline + %button.dropdown-toggle.btn{type: 'button', 'data-toggle' => 'dropdown'} + %span.light + - if @sort.present? + = @sort.humanize + - else + Name + %b.caret + %ul.dropdown-menu.dropdown-menu-align-right + %li + = link_to namespace_project_branches_path(sort: nil) do + Name + = link_to namespace_project_branches_path(sort: 'recently_updated') do + = sort_title_recently_updated + = link_to namespace_project_branches_path(sort: 'last_updated') do + = sort_title_oldest_updated - unless @branches.empty? %ul.content-list.all-branches - @branches.each do |branch| diff --git a/app/views/projects/tags/index.html.haml b/app/views/projects/tags/index.html.haml index 9ff805a898..2779084fe3 100644 --- a/app/views/projects/tags/index.html.haml +++ b/app/views/projects/tags/index.html.haml @@ -3,15 +3,15 @@ = render "projects/commits/head" %div{ class: (container_class) } - .row-content-block.second-block.content-component-block - - if can? current_user, :push_code, @project - .pull-right - = link_to new_namespace_project_tag_path(@project.namespace, @project), class: 'btn btn-create new-tag-btn' do - = icon('plus') - New tag - .oneline + .top-area + .nav-text Tags give the ability to mark specific points in history as being important + - if can? current_user, :push_code, @project + .nav-controls + = link_to new_namespace_project_tag_path(@project.namespace, @project), class: 'btn btn-create new-tag-btn' do + New tag + .tags - unless @tags.empty? %ul.content-list From 477c113c47717535365f7c22027234a20833a760 Mon Sep 17 00:00:00 2001 From: Dmitriy Zaporozhets Date: Wed, 8 Jun 2016 20:44:39 +0300 Subject: [PATCH 4/5] Improve buttons size and paddings in the lists Signed-off-by: Dmitriy Zaporozhets --- app/assets/stylesheets/framework/lists.scss | 10 ++++++++-- app/assets/stylesheets/framework/variables.scss | 4 ++-- app/views/projects/tags/_download.html.haml | 7 ++----- app/views/projects/tags/_tag.html.haml | 4 ++-- app/views/shared/groups/_group.html.haml | 6 +++--- 5 files changed, 17 insertions(+), 14 deletions(-) diff --git a/app/assets/stylesheets/framework/lists.scss b/app/assets/stylesheets/framework/lists.scss index dec327669e..b34ec16cdb 100644 --- a/app/assets/stylesheets/framework/lists.scss +++ b/app/assets/stylesheets/framework/lists.scss @@ -137,10 +137,16 @@ ul.content-list { padding-top: 1px; float: right; - .btn { - padding: $gl-vert-padding $gl-btn-padding; + > .btn, + > .btn-group { + margin-right: $gl-padding-top; + display: inline-block; margin-top: 4px; margin-bottom: 4px; + + &:last-child { + margin-right: 0; + } } } diff --git a/app/assets/stylesheets/framework/variables.scss b/app/assets/stylesheets/framework/variables.scss index d8ea07559a..9a85dedc09 100644 --- a/app/assets/stylesheets/framework/variables.scss +++ b/app/assets/stylesheets/framework/variables.scss @@ -79,8 +79,8 @@ $provider-btn-not-active-color: #4688f1; $link-underline-blue: #4a8bee; $layout-link-gray: #7e7c7c; $todo-alert-blue: #428bca; -$btn-side-margin: 7px; -$btn-sm-side-margin: 5px; +$btn-side-margin: 10px; +$btn-sm-side-margin: 7px; $btn-xs-side-margin: 5px; /* diff --git a/app/views/projects/tags/_download.html.haml b/app/views/projects/tags/_download.html.haml index 093d1d1bb0..8a11dbfa9f 100644 --- a/app/views/projects/tags/_download.html.haml +++ b/app/views/projects/tags/_download.html.haml @@ -1,7 +1,6 @@ -%span.btn-group.btn-grouped +%span.btn-group = link_to archive_namespace_project_repository_path(project.namespace, project, ref: ref, format: 'zip'), class: 'btn btn-default', rel: 'nofollow' do - %i.fa.fa-download - %span source code + %span Source code %a.btn.btn-default.dropdown-toggle{ 'data-toggle' => 'dropdown' } %span.caret %span.sr-only @@ -9,9 +8,7 @@ %ul.dropdown-menu.dropdown-menu-align-right{ role: 'menu' } %li = link_to archive_namespace_project_repository_path(project.namespace, project, ref: ref, format: 'zip'), rel: 'nofollow' do - %i.fa.fa-download %span Download zip %li = link_to archive_namespace_project_repository_path(project.namespace, project, ref: ref, format: 'tar.gz'), rel: 'nofollow' do - %i.fa.fa-download %span Download tar.gz diff --git a/app/views/projects/tags/_tag.html.haml b/app/views/projects/tags/_tag.html.haml index dbc35c16fe..844e105581 100644 --- a/app/views/projects/tags/_tag.html.haml +++ b/app/views/projects/tags/_tag.html.haml @@ -15,11 +15,11 @@ = render 'projects/tags/download', ref: tag.name, project: @project - if can?(current_user, :push_code, @project) - = link_to edit_namespace_project_tag_release_path(@project.namespace, @project, tag.name), class: 'btn-grouped btn has-tooltip', title: "Edit release notes" do + = link_to edit_namespace_project_tag_release_path(@project.namespace, @project, tag.name), class: 'btn has-tooltip', title: "Edit release notes" do = icon("pencil") - if can?(current_user, :admin_project, @project) - = link_to namespace_project_tag_path(@project.namespace, @project, tag.name), class: 'btn btn-grouped btn-xs btn-remove remove-row has-tooltip', title: "Delete tag", method: :delete, data: { confirm: "Deleting the '#{tag.name}' tag cannot be undone. Are you sure?", container: 'body' }, remote: true do + = link_to namespace_project_tag_path(@project.namespace, @project, tag.name), class: 'btn btn-remove remove-row has-tooltip', title: "Delete tag", method: :delete, data: { confirm: "Deleting the '#{tag.name}' tag cannot be undone. Are you sure?", container: 'body' }, remote: true do = icon("trash-o") - if commit diff --git a/app/views/shared/groups/_group.html.haml b/app/views/shared/groups/_group.html.haml index 40c6eb9be4..a25365a94f 100644 --- a/app/views/shared/groups/_group.html.haml +++ b/app/views/shared/groups/_group.html.haml @@ -6,10 +6,10 @@ - if group_member .controls.hidden-xs - if can?(current_user, :admin_group, group) - = link_to edit_group_path(group), class: "btn-sm btn btn-grouped" do - %i.fa.fa-cogs + = link_to edit_group_path(group), class: "btn" do + = icon('cogs') - = link_to leave_group_group_members_path(group), data: { confirm: leave_group_message(group.name) }, method: :delete, class: "btn-sm btn btn-grouped", title: 'Leave this group' do + = link_to leave_group_group_members_path(group), data: { confirm: leave_group_message(group.name) }, method: :delete, class: "btn", title: 'Leave this group' do = icon('sign-out') .stats From cdcca06b143c85e48196993a29ee73f746463dc9 Mon Sep 17 00:00:00 2001 From: Dmitriy Zaporozhets Date: Wed, 8 Jun 2016 21:01:53 +0300 Subject: [PATCH 5/5] Remove icons from button on wiki pages. Also consistent padding between buttons there Signed-off-by: Dmitriy Zaporozhets --- app/views/projects/builds/index.html.haml | 1 - app/views/projects/milestones/index.html.haml | 1 - app/views/projects/milestones/show.html.haml | 2 -- app/views/projects/pipelines/index.html.haml | 2 -- app/views/projects/wikis/_main_links.html.haml | 6 ++---- app/views/projects/wikis/_nav.html.haml | 1 - 6 files changed, 2 insertions(+), 11 deletions(-) diff --git a/app/views/projects/builds/index.html.haml b/app/views/projects/builds/index.html.haml index 55d2ac89eb..181547316a 100644 --- a/app/views/projects/builds/index.html.haml +++ b/app/views/projects/builds/index.html.haml @@ -34,7 +34,6 @@ = link_to 'Get started with Builds', help_page_path('ci/quick_start', 'README'), class: 'btn btn-info' = link_to ci_lint_path, class: 'btn btn-default' do - = icon('wrench') %span CI Lint %ul.content-list diff --git a/app/views/projects/milestones/index.html.haml b/app/views/projects/milestones/index.html.haml index e6133b22f9..60a5b83434 100644 --- a/app/views/projects/milestones/index.html.haml +++ b/app/views/projects/milestones/index.html.haml @@ -6,7 +6,6 @@ .nav-controls - if can?(current_user, :admin_milestone, @project) = link_to new_namespace_project_milestone_path(@project.namespace, @project), class: "btn btn-new", title: "New Milestone" do - = icon('plus') New Milestone .milestones diff --git a/app/views/projects/milestones/show.html.haml b/app/views/projects/milestones/show.html.haml index 19944e3e02..0b0e2bd686 100644 --- a/app/views/projects/milestones/show.html.haml +++ b/app/views/projects/milestones/show.html.haml @@ -23,11 +23,9 @@ = link_to 'Reopen Milestone', namespace_project_milestone_path(@project.namespace, @project, @milestone, milestone: {state_event: :activate }), method: :put, class: "btn btn-reopen btn-nr btn-grouped" = link_to edit_namespace_project_milestone_path(@project.namespace, @project, @milestone), class: "btn btn-grouped btn-nr" do - = icon('pencil-square-o') Edit = link_to namespace_project_milestone_path(@project.namespace, @project, @milestone), data: { confirm: 'Are you sure?' }, method: :delete, class: "btn btn-grouped btn-danger" do - = icon('trash-o') Delete .detail-page-description.milestone-detail diff --git a/app/views/projects/pipelines/index.html.haml b/app/views/projects/pipelines/index.html.haml index a78450e09d..b70693eeb6 100644 --- a/app/views/projects/pipelines/index.html.haml +++ b/app/views/projects/pipelines/index.html.haml @@ -28,14 +28,12 @@ .nav-controls - if can? current_user, :create_pipeline, @project = link_to new_namespace_project_pipeline_path(@project.namespace, @project), class: 'btn btn-create' do - = icon('plus') New pipeline - unless @repository.gitlab_ci_yml = link_to 'Get started with Pipelines', help_page_path('ci/quick_start', 'README'), class: 'btn btn-info' = link_to ci_lint_path, class: 'btn btn-default' do - = icon('wrench') %span CI Lint %ul.content-list.pipelines diff --git a/app/views/projects/wikis/_main_links.html.haml b/app/views/projects/wikis/_main_links.html.haml index 2b91b7e8f6..4faa547769 100644 --- a/app/views/projects/wikis/_main_links.html.haml +++ b/app/views/projects/wikis/_main_links.html.haml @@ -1,11 +1,9 @@ - if (@page && @page.persisted?) - = link_to namespace_project_wiki_history_path(@project.namespace, @project, @page), class: "btn btn-grouped" do + = link_to namespace_project_wiki_history_path(@project.namespace, @project, @page), class: "btn" do Page History - if can?(current_user, :create_wiki, @project) - = link_to namespace_project_wiki_edit_path(@project.namespace, @project, @page), class: "btn btn-grouped" do - %i.fa.fa-pencil-square-o + = link_to namespace_project_wiki_edit_path(@project.namespace, @project, @page), class: "btn" do Edit - if can?(current_user, :admin_wiki, @project) = link_to namespace_project_wiki_path(@project.namespace, @project, @page), data: { confirm: "Are you sure you want to delete this page?"}, method: :delete, class: "btn btn-remove" do - = icon('trash') Delete diff --git a/app/views/projects/wikis/_nav.html.haml b/app/views/projects/wikis/_nav.html.haml index a722fbc535..988fe024e2 100644 --- a/app/views/projects/wikis/_nav.html.haml +++ b/app/views/projects/wikis/_nav.html.haml @@ -13,7 +13,6 @@ .nav-controls - if can?(current_user, :create_wiki, @project) = link_to '#modal-new-wiki', class: "add-new-wiki btn btn-new", "data-toggle" => "modal" do - = icon('plus') New Page = render 'projects/wikis/new'