Commit c3ce61ba authored by Jacob Schatz's avatar Jacob Schatz

Merge branch '18058-sub-nav' into 'master'

Sub navigation

## What does this MR do?
Styles sub nav   
cc @dzaporozhets  @skyruler @jschatz1 

## What are the relevant issue numbers?
#18058 and #17983 

## Screenshots (if relevant)
![Screen_Shot_2016-06-03_at_12.10.26_PM](/uploads/8b948c32699a93ab0a390bda31e0e411/Screen_Shot_2016-06-03_at_12.10.26_PM.png)
![Screen_Shot_2016-06-03_at_12.10.34_PM](/uploads/241115c35d0618f3de739be9a670416d/Screen_Shot_2016-06-03_at_12.10.34_PM.png)

See merge request !4468
parents 7d315aec ae659108
...@@ -61,6 +61,11 @@ ...@@ -61,6 +61,11 @@
margin-bottom: -$gl-padding; margin-bottom: -$gl-padding;
} }
&.content-component-block {
padding: 11px 0;
background-color: $white-light;
}
.title { .title {
color: $gl-text-color; color: $gl-text-color;
} }
......
...@@ -41,8 +41,7 @@ ...@@ -41,8 +41,7 @@
a { a {
display: inline-block; display: inline-block;
padding: 14px; padding: $gl-btn-padding;
padding-top: $gl-padding;
padding-bottom: 11px; padding-bottom: 11px;
margin-bottom: -1px; margin-bottom: -1px;
font-size: 15px; font-size: 15px;
...@@ -67,6 +66,27 @@ ...@@ -67,6 +66,27 @@
color: #78a; color: #78a;
} }
} }
&.sub-nav {
background-color: $background-color;
.container-fluid {
background-color: $background-color;
}
li {
a {
margin: 0;
padding: 11px 10px 9px;
}
&.active a {
border-bottom: none;
color: $link-underline-blue;
}
}
}
} }
.top-area { .top-area {
...@@ -81,6 +101,10 @@ ...@@ -81,6 +101,10 @@
width: 50%; width: 50%;
line-height: 28px; line-height: 28px;
&.wiki-page {
padding: 16px 10px 11px;
}
/* Small devices (phones, tablets, 768px and lower) */ /* Small devices (phones, tablets, 768px and lower) */
@media (max-width: $screen-sm-min) { @media (max-width: $screen-sm-min) {
width: 100%; width: 100%;
...@@ -104,6 +128,10 @@ ...@@ -104,6 +128,10 @@
margin-bottom: 0; margin-bottom: 0;
border-bottom: none; border-bottom: none;
li a {
padding: 16px 10px 11px;
}
/* Small devices (phones, tablets, 768px and lower) */ /* Small devices (phones, tablets, 768px and lower) */
@media (max-width: $screen-sm-max) { @media (max-width: $screen-sm-max) {
width: 100%; width: 100%;
...@@ -309,8 +337,8 @@ ...@@ -309,8 +337,8 @@
} }
.nav-control { .nav-control {
.fade-right {
.fade-right {
@media (min-width: $screen-xs-max) { @media (min-width: $screen-xs-max) {
right: 67px; right: 67px;
} }
...@@ -321,6 +349,24 @@ ...@@ -321,6 +349,24 @@
} }
} }
.scrolling-tabs-container {
position: relative;
.nav-links {
@include scrolling-links();
.fade-right {
@include fade(left, rgba(255, 255, 255, 0.4), $background-color);
right: 0;
}
.fade-left {
@include fade(right, rgba(255, 255, 255, 0.4), $background-color);
left: 0;
}
}
}
.nav-block { .nav-block {
position: relative; position: relative;
......
...@@ -489,9 +489,11 @@ pre.light-well { ...@@ -489,9 +489,11 @@ pre.light-well {
margin: 0; margin: 0;
} }
.project-show-activity {
.activity-filter-block { .activity-filter-block {
margin-top: -1px; .controls {
padding-bottom: 10px;
border-bottom: 1px solid $border-color;
} }
} }
......
- @no_container = true
- page_title "Branches" - page_title "Branches"
= render "projects/commits/head" = render "projects/commits/head"
.row-content-block
.pull-right %div{ class: (container_class) }
- if can? current_user, :push_code, @project .row-content-block.second-block.content-component-block
= link_to new_namespace_project_branch_path(@project.namespace, @project), class: 'btn btn-create' do .pull-right
= icon('plus') - if can? current_user, :push_code, @project
New branch = link_to new_namespace_project_branch_path(@project.namespace, @project), class: 'btn btn-create' do
  = icon('plus')
.dropdown.inline New branch
%button.dropdown-toggle.btn{type: 'button', 'data-toggle' => 'dropdown'}  
%span.light .dropdown.inline
- if @sort.present? %button.dropdown-toggle.btn{type: 'button', 'data-toggle' => 'dropdown'}
= @sort.humanize %span.light
- else - if @sort.present?
Name = @sort.humanize
%b.caret - else
%ul.dropdown-menu.dropdown-menu-align-right
%li
= link_to namespace_project_branches_path(sort: nil) do
Name Name
= link_to namespace_project_branches_path(sort: 'recently_updated') do %b.caret
= sort_title_recently_updated %ul.dropdown-menu.dropdown-menu-align-right
= link_to namespace_project_branches_path(sort: 'last_updated') do %li
= sort_title_oldest_updated = link_to namespace_project_branches_path(sort: nil) do
.oneline Name
Protected branches can be managed in project settings = link_to namespace_project_branches_path(sort: 'recently_updated') do
- unless @branches.empty? = sort_title_recently_updated
%ul.content-list.all-branches = link_to namespace_project_branches_path(sort: 'last_updated') do
- @branches.each do |branch| = sort_title_oldest_updated
= render "projects/branches/branch", branch: branch .oneline
= paginate @branches, theme: 'gitlab' Protected branches can be managed in project settings
- unless @branches.empty?
%ul.content-list.all-branches
- @branches.each do |branch|
= render "projects/branches/branch", branch: branch
= paginate @branches, theme: 'gitlab'
- @no_container = true
- page_title "Builds" - page_title "Builds"
= render "projects/pipelines/head" = render "projects/pipelines/head"
.top-area %div{ class: (container_class) }
%ul.nav-links .top-area
%li{class: ('active' if @scope.nil?)} %ul.nav-links
= link_to project_builds_path(@project) do %li{class: ('active' if @scope.nil?)}
All = link_to project_builds_path(@project) do
%span.badge.js-totalbuilds-count All
= number_with_delimiter(@all_builds.count(:id)) %span.badge.js-totalbuilds-count
= number_with_delimiter(@all_builds.count(:id))
%li{class: ('active' if @scope == 'running')}
= link_to project_builds_path(@project, scope: :running) do %li{class: ('active' if @scope == 'running')}
Running = link_to project_builds_path(@project, scope: :running) do
%span.badge.js-running-count Running
= number_with_delimiter(@all_builds.running_or_pending.count(:id)) %span.badge.js-running-count
= number_with_delimiter(@all_builds.running_or_pending.count(:id))
%li{class: ('active' if @scope == 'finished')}
= link_to project_builds_path(@project, scope: :finished) do %li{class: ('active' if @scope == 'finished')}
Finished = link_to project_builds_path(@project, scope: :finished) do
%span.badge.js-running-count Finished
= number_with_delimiter(@all_builds.finished.count(:id)) %span.badge.js-running-count
= number_with_delimiter(@all_builds.finished.count(:id))
.nav-controls
- if can?(current_user, :update_build, @project) .nav-controls
- if @all_builds.running_or_pending.any? - if can?(current_user, :update_build, @project)
= link_to 'Cancel running', cancel_all_namespace_project_builds_path(@project.namespace, @project), - if @all_builds.running_or_pending.any?
data: { confirm: 'Are you sure?' }, class: 'btn btn-danger', method: :post = link_to 'Cancel running', cancel_all_namespace_project_builds_path(@project.namespace, @project),
data: { confirm: 'Are you sure?' }, class: 'btn btn-danger', method: :post
- unless @repository.gitlab_ci_yml
= link_to 'Get started with Builds', help_page_path('ci/quick_start', 'README'), class: 'btn btn-info' - unless @repository.gitlab_ci_yml
= 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') = link_to ci_lint_path, class: 'btn btn-default' do
%span CI Lint = icon('wrench')
%span CI Lint
%ul.content-list
- if @builds.blank? %ul.content-list
%li - if @builds.blank?
.nothing-here-block No builds to show %li
- else .nothing-here-block No builds to show
.table-holder - else
%table.table.builds .table-holder
%thead %table.table.builds
%tr %thead
%th Status %tr
%th Build ID %th Status
%th Commit %th Build ID
%th Ref %th Commit
%th Stage %th Ref
%th Name %th Stage
%th Tags %th Name
%th Duration %th Tags
%th Finished at %th Duration
- if @project.build_coverage_enabled? %th Finished at
%th Coverage - if @project.build_coverage_enabled?
%th %th Coverage
%th
= render @builds, commit_sha: true, ref: true, stage: true, allow_retry: true, coverage: @project.build_coverage_enabled?
= render @builds, commit_sha: true, ref: true, stage: true, allow_retry: true, coverage: @project.build_coverage_enabled?
= paginate @builds, theme: 'gitlab'
= paginate @builds, theme: 'gitlab'
%ul.nav-links .scrolling-tabs-container
= nav_link(controller: %w(tree blob blame edit_tree new_tree find_file)) do %ul.nav-links.sub-nav.scrolling-tabs
= link_to project_files_path(@project) do %div{ class: (container_class) }
Files .fade-left
= nav_link(controller: %w(tree blob blame edit_tree new_tree find_file)) do
= link_to project_files_path(@project) do
Files
= nav_link(controller: [:commit, :commits]) do = nav_link(controller: [:commit, :commits]) do
= link_to namespace_project_commits_path(@project.namespace, @project, current_ref) do = link_to namespace_project_commits_path(@project.namespace, @project, current_ref) do
Commits Commits
= nav_link(controller: %w(network)) do = nav_link(controller: %w(network)) do
= link_to namespace_project_network_path(@project.namespace, @project, current_ref) do = link_to namespace_project_network_path(@project.namespace, @project, current_ref) do
Network Network
= nav_link(controller: :compare) do = nav_link(controller: :compare) do
= link_to namespace_project_compare_index_path(@project.namespace, @project, from: @repository.root_ref, to: current_ref) do = link_to namespace_project_compare_index_path(@project.namespace, @project, from: @repository.root_ref, to: current_ref) do
Compare Compare
= nav_link(html_options: {class: branches_tab_class}) do = nav_link(html_options: {class: branches_tab_class}) do
= link_to namespace_project_branches_path(@project.namespace, @project) do = link_to namespace_project_branches_path(@project.namespace, @project) do
Branches Branches
= nav_link(controller: [:tags, :releases]) do = nav_link(controller: [:tags, :releases]) do
= link_to namespace_project_tags_path(@project.namespace, @project) do = link_to namespace_project_tags_path(@project.namespace, @project) do
Tags Tags
.fade-right
- @no_container = true
- page_title "Commits", @ref - page_title "Commits", @ref
= content_for :meta_tags do = content_for :meta_tags do
- if current_user - if current_user
...@@ -5,37 +7,38 @@ ...@@ -5,37 +7,38 @@
= render "head" = render "head"
.row-content-block.second-block %div{ class: (container_class) }
.tree-ref-holder .row-content-block.second-block.content-component-block
= render 'shared/ref_switcher', destination: 'commits' .tree-ref-holder
= render 'shared/ref_switcher', destination: 'commits'
.block-controls.hidden-xs.hidden-sm
- if @merge_request.present?
.control
= link_to "View Open Merge Request", namespace_project_merge_request_path(@project.namespace, @project, @merge_request), class: 'btn'
- elsif create_mr_button?(@repository.root_ref, @ref)
.control
= link_to create_mr_path(@repository.root_ref, @ref), class: 'btn btn-success' do
= icon('plus')
Create Merge Request
.block-controls.hidden-xs.hidden-sm
- if @merge_request.present?
.control
= link_to "View Open Merge Request", namespace_project_merge_request_path(@project.namespace, @project, @merge_request), class: 'btn'
- elsif create_mr_button?(@repository.root_ref, @ref)
.control .control
= link_to create_mr_path(@repository.root_ref, @ref), class: 'btn btn-success' do = form_tag(namespace_project_commits_path(@project.namespace, @project, @id), method: :get, class: 'pull-left commits-search-form') do
= icon('plus') = search_field_tag :search, params[:search], { placeholder: 'Filter by commit message', id: 'commits-search', class: 'form-control search-text-input', spellcheck: false }
Create Merge Request
.control - if current_user && current_user.private_token
= form_tag(namespace_project_commits_path(@project.namespace, @project, @id), method: :get, class: 'pull-left commits-search-form') do .control
= search_field_tag :search, params[:search], { placeholder: 'Filter by commit message', id: 'commits-search', class: 'form-control search-text-input', spellcheck: false } = 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")
- 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 %ul.breadcrumb.repo-breadcrumb
= commits_breadcrumbs = commits_breadcrumbs
%div{id: dom_id(@project)} %div{id: dom_id(@project)}
#commits-list.content_list= render "commits", project: @project #commits-list.content_list= render "commits", project: @project
.clear .clear
= spinner = spinner
:javascript :javascript
CommitsList.init(#{@limit}); CommitsList.init(#{@limit});
- @no_container = true
- page_title "Compare" - page_title "Compare"
= render "projects/commits/head" = render "projects/commits/head"
.row-content-block %div{ class: (container_class) }
Compare branches, tags or commit ranges. .row-content-block.second-block.content-component-block
%br Compare branches, tags or commit ranges.
Fill input field with commit id like %br
%code.label-branch 4eedf23 Fill input field with commit id like
or branch/tag name like %code.label-branch 4eedf23
%code.label-branch master or branch/tag name like
and press compare button for the commits list and a code diff. %code.label-branch master
%br and press compare button for the commits list and a code diff.
Changes are shown <b>from</b> the version in the first field <b>to</b> the version in the second field. %br
Changes are shown <b>from</b> the version in the first field <b>to</b> the version in the second field.
.prepend-top-20 .prepend-top-20
= render "form" = render "form"
.row-content-block.append-bottom-default - @no_container = true
.tree-ref-holder
= render partial: 'shared/ref_switcher', locals: {destination: 'graph'}
.oneline %div{ class: (container_class) }
You can move around the graph by using the arrow keys. .row-content-block.second-block.content-component-block
.tree-ref-holder
= render partial: 'shared/ref_switcher', locals: {destination: 'graph'}
.oneline
You can move around the graph by using the arrow keys.
- page_title "Network", @ref - page_title "Network", @ref
= render "projects/commits/head" = render "projects/commits/head"
= render "head" = render "head"
.project-network %div{ class: (container_class) }
.controls .project-network
= form_tag namespace_project_network_path(@project.namespace, @project, @id), method: :get, class: 'form-inline network-form' do |f| .controls
= text_field_tag :extended_sha1, @options[:extended_sha1], placeholder: "Input an extended SHA1 syntax", class: 'search-input form-control input-mx-250 search-sha' = form_tag namespace_project_network_path(@project.namespace, @project, @id), method: :get, class: 'form-inline network-form' do |f|
= button_tag class: 'btn btn-success' do = text_field_tag :extended_sha1, @options[:extended_sha1], placeholder: "Input an extended SHA1 syntax", class: 'search-input form-control input-mx-250 search-sha'
= icon('search') = button_tag class: 'btn btn-success' do
.inline.prepend-left-20 = icon('search')
.checkbox.light .inline.prepend-left-20
= label_tag :filter_ref do .checkbox.light
= check_box_tag :filter_ref, 1, @options[:filter_ref] = label_tag :filter_ref do
%span Begin with the selected commit = check_box_tag :filter_ref, 1, @options[:filter_ref]
%span Begin with the selected commit
.network-graph .network-graph
= spinner nil, true = spinner nil, true
:javascript :javascript
network_graph = new Network({ network_graph = new Network({
......
%ul.nav-links %ul.nav-links.sub-nav
- if project_nav_tab? :pipelines %div{ class: (container_class) }
= nav_link(controller: :pipelines) do - if project_nav_tab? :pipelines
= link_to project_pipelines_path(@project), title: 'Pipelines', class: 'shortcuts-pipelines' do = nav_link(controller: :pipelines) do
%span = link_to project_pipelines_path(@project), title: 'Pipelines', class: 'shortcuts-pipelines' do
Pipelines %span
%span.badge.count.ci_counter= number_with_delimiter(@project.pipelines.running_or_pending.count) Pipelines
%span.badge.count.ci_counter= number_with_delimiter(@project.pipelines.running_or_pending.count)
- if project_nav_tab? :builds - if project_nav_tab? :builds
= nav_link(controller: %w(builds)) do = nav_link(controller: %w(builds)) do
= link_to project_builds_path(@project), title: 'Builds', class: 'shortcuts-builds' do = link_to project_builds_path(@project), title: 'Builds', class: 'shortcuts-builds' do
%span %span
Builds Builds
%span.badge.count.builds_counter= number_with_delimiter(@project.running_or_pending_build_count) %span.badge.count.builds_counter= number_with_delimiter(@project.running_or_pending_build_count)
- @no_container = true
- page_title "Pipelines" - page_title "Pipelines"
= render "projects/pipelines/head" = render "projects/pipelines/head"
.top-area %div{ class: (container_class) }
%ul.nav-links .top-area
%li{class: ('active' if @scope.nil?)} %ul.nav-links
= link_to project_pipelines_path(@project) do %li{class: ('active' if @scope.nil?)}
All = link_to project_pipelines_path(@project) do
%span.badge.js-totalbuilds-count All
= number_with_delimiter(@pipelines_count) %span.badge.js-totalbuilds-count
= number_with_delimiter(@pipelines_count)
%li{class: ('active' if @scope == 'running')}
= link_to project_pipelines_path(@project, scope: :running) do %li{class: ('active' if @scope == 'running')}
Running = link_to project_pipelines_path(@project, scope: :running) do
%span.badge.js-running-count Running
= number_with_delimiter(@running_or_pending_count) %span.badge.js-running-count
= number_with_delimiter(@running_or_pending_count)
%li{class: ('active' if @scope == 'branches')}
= link_to project_pipelines_path(@project, scope: :branches) do %li{class: ('active' if @scope == 'branches')}
Branches = link_to project_pipelines_path(@project, scope: :branches) do
Branches
%li{class: ('active' if @scope == 'tags')}
= link_to project_pipelines_path(@project, scope: :tags) do %li{class: ('active' if @scope == 'tags')}
Tags = link_to project_pipelines_path(@project, scope: :tags) do
Tags
.nav-controls
- if can? current_user, :create_pipeline, @project .nav-controls
= link_to new_namespace_project_pipeline_path(@project.namespace, @project), class: 'btn btn-create' do - if can? current_user, :create_pipeline, @project
= icon('plus') = link_to new_namespace_project_pipeline_path(@project.namespace, @project), class: 'btn btn-create' do
New pipeline = 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' - 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') = link_to ci_lint_path, class: 'btn btn-default' do
%span CI Lint = icon('wrench')
%span CI Lint
%ul.content-list.pipelines
- stages = @pipelines.stages %ul.content-list.pipelines
- if @pipelines.blank? - stages = @pipelines.stages
%li - if @pipelines.blank?
.nothing-here-block No pipelines to show %li
- else .nothing-here-block No pipelines to show
.table-holder - else
%table.table.builds .table-holder
%tbody %table.table.builds
%th ID %tbody
%th Commit %th ID
- stages.each do |stage| %th Commit
%th.stage - stages.each do |stage|
%span.has-tooltip{ title: "#{stage.titleize}" } %th.stage
= stage.titleize.pluralize %span.has-tooltip{ title: "#{stage.titleize}" }
%th Duration = stage.titleize.pluralize
%th %th Duration
= render @pipelines, commit_sha: true, stage: true, allow_retry: true, stages: stages %th
= render @pipelines, commit_sha: true, stage: true, allow_retry: true, stages: stages
= paginate @pipelines, theme: 'gitlab'
= paginate @pipelines, theme: 'gitlab'
- @no_container = true
- page_title "Tags" - page_title "Tags"
= render "projects/commits/head" = render "projects/commits/head"
.row-content-block %div{ class: (container_class) }
- if can? current_user, :push_code, @project .row-content-block.second-block.content-component-block
.pull-right - if can? current_user, :push_code, @project
= link_to new_namespace_project_tag_path(@project.namespace, @project), class: 'btn btn-create new-tag-btn' do .pull-right
= icon('plus') = link_to new_namespace_project_tag_path(@project.namespace, @project), class: 'btn btn-create new-tag-btn' do
New tag = icon('plus')
.oneline New tag
Tags give the ability to mark specific points in history as being important .oneline
Tags give the ability to mark specific points in history as being important
.tags .tags
- unless @tags.empty? - unless @tags.empty?
%ul.content-list %ul.content-list
- @tags.each do |tag| - @tags.each do |tag|
= render 'tag', tag: @repository.find_tag(tag) = render 'tag', tag: @repository.find_tag(tag)
= paginate @tags, theme: 'gitlab' = paginate @tags, theme: 'gitlab'
- else - else
.nothing-here-block .nothing-here-block
Repository has no tags yet. Repository has no tags yet.
%br
%small
Use git tag command to add a new one:
%br %br
%span.monospace git tag -a v1.4 -m 'version 1.4' %small
Use git tag command to add a new one:
%br
%span.monospace git tag -a v1.4 -m 'version 1.4'
- @no_container = true
- page_title @path.presence || "Files", @ref - page_title @path.presence || "Files", @ref
= content_for :meta_tags do = content_for :meta_tags do
- if current_user - if current_user
...@@ -5,13 +7,14 @@ ...@@ -5,13 +7,14 @@
= render 'projects/last_push' = render 'projects/last_push'
= render "projects/commits/head" = render "projects/commits/head"
.tree-controls %div{ class: (container_class) }
= render 'projects/find_file_link' .tree-controls
- if can? current_user, :download_code, @project = render 'projects/find_file_link'
= render 'projects/repositories/download_archive', ref: @ref, btn_class: 'hidden-xs hidden-sm btn-grouped', split_button: true - if can? current_user, :download_code, @project
= render 'projects/repositories/download_archive', ref: @ref, btn_class: 'hidden-xs hidden-sm btn-grouped', split_button: true
#tree-holder.tree-holder.clearfix #tree-holder.tree-holder.clearfix
.nav-block .nav-block
= render 'projects/tree/tree_header', tree: @tree = render 'projects/tree/tree_header', tree: @tree
= render 'projects/tree/tree_content', tree: @tree = render 'projects/tree/tree_content', tree: @tree
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
= render 'nav' = render 'nav'
.top-area .top-area
.nav-text .nav-text.wiki-page
%strong %strong
- if @page.persisted? - if @page.persisted?
= link_to @page.title.capitalize, namespace_project_wiki_path(@project.namespace, @project, @page) = link_to @page.title.capitalize, namespace_project_wiki_path(@project.namespace, @project, @page)
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment