diff --git a/app/assets/stylesheets/framework/avatar.scss b/app/assets/stylesheets/framework/avatar.scss
index f5ce70b606b04767185baf093246078b62beca95..bb8d71fbae8711721c4183dd30ca4be1053bb532 100644
--- a/app/assets/stylesheets/framework/avatar.scss
+++ b/app/assets/stylesheets/framework/avatar.scss
@@ -45,6 +45,7 @@
&.s32 { font-size: 20px; line-height: 32px; }
&.s40 { font-size: 16px; line-height: 40px; }
&.s60 { font-size: 32px; line-height: 60px; }
+ &.s70 { font-size: 34px; line-height: 70px; }
&.s90 { font-size: 36px; line-height: 90px; }
&.s110 { font-size: 40px; line-height: 112px; font-weight: 300; }
&.s140 { font-size: 72px; line-height: 140px; }
diff --git a/app/assets/stylesheets/framework/blocks.scss b/app/assets/stylesheets/framework/blocks.scss
index 434a26d57c66723c5991c3c918a73f0016b8fc34..6981f834d30e589e5b28fceb447d4ccef54ba4e7 100644
--- a/app/assets/stylesheets/framework/blocks.scss
+++ b/app/assets/stylesheets/framework/blocks.scss
@@ -24,8 +24,8 @@
background-color: $background-color;
padding: $gl-padding;
margin-bottom: 0;
- border-top: 1px solid $border-color;
- border-bottom: 1px solid $border-color;
+ border-top: 1px solid $white-dark;
+ border-bottom: 1px solid $white-dark;
color: $gl-gray;
&.oneline-block {
@@ -110,9 +110,9 @@
.cover-title {
color: $gl-header-color;
margin: 0;
- font-size: 23px;
+ font-size: 24px;
font-weight: normal;
- margin: 16px 0 5px;
+ margin-bottom: 5px;
color: #4c4e54;
font-size: 23px;
line-height: 1.1;
@@ -137,7 +137,6 @@
}
.cover-desc {
- padding: 0 $gl-padding 3px;
color: $gl-text-color;
&.username:last-child {
@@ -205,7 +204,7 @@
.content-block {
padding: $gl-padding 0;
- border-bottom: 1px solid $border-color;
+ border-bottom: 1px solid $white-dark;
&.oneline-block {
line-height: 36px;
diff --git a/app/assets/stylesheets/framework/mobile.scss b/app/assets/stylesheets/framework/mobile.scss
index 33cbee85987ae7220ce0470e55d57a14d4efc089..bd531f8376b1588be02fbcba85ecbcee709b7218 100644
--- a/app/assets/stylesheets/framework/mobile.scss
+++ b/app/assets/stylesheets/framework/mobile.scss
@@ -48,10 +48,6 @@
display: block;
}
- .project-home-desc {
- font-size: 21px;
- }
-
.project-repo-buttons,
.git-clone-holder {
display: none;
diff --git a/app/assets/stylesheets/framework/nav.scss b/app/assets/stylesheets/framework/nav.scss
index 2e1aa884d9c81a53794cfb3230d37f440a7c8f02..4e4a1d71a47ce41bb3d8059a7ac3d7f8dd34e5be 100644
--- a/app/assets/stylesheets/framework/nav.scss
+++ b/app/assets/stylesheets/framework/nav.scss
@@ -250,6 +250,11 @@
height: 51px;
white-space: nowrap;
overflow-x: auto;
+ overflow-y: hidden;
+ -webkit-overflow-scrolling: touch;
+ &::-webkit-scrollbar {
+ display: none;
+ }
li {
@@ -283,4 +288,8 @@
margin-top: 96px;
}
}
+
+ .right-sidebar {
+ top: 102px;
+ }
}
diff --git a/app/assets/stylesheets/framework/variables.scss b/app/assets/stylesheets/framework/variables.scss
index 5fa4c2666077c2ad3ae154975b3ab84d9e94a1d7..a769077bc8319b1dbc57d04267e11a44ecedfe83 100644
--- a/app/assets/stylesheets/framework/variables.scss
+++ b/app/assets/stylesheets/framework/variables.scss
@@ -119,8 +119,8 @@ $border-white-light: #f1f2f4;
$border-white-normal: #d6dae2;
$border-white-dark: #c6cacf;
-$border-gray-light: rgba(0, 0, 0, 0.06);
-$border-gray-normal: rgba(0, 0, 0, 0.10);;
+$border-gray-light: rgba(209, 209, 209, 0.70);
+$border-gray-normal: rgba(0, 0, 0, 0.10);
$border-gray-dark: #c6cacf;
$border-green-light: #2faa60;
diff --git a/app/assets/stylesheets/pages/projects.scss b/app/assets/stylesheets/pages/projects.scss
index c20f04653fcc9d0914d693a6574d443405a59dd9..faf3c84ba2ca19e09f60b617d29e02041f779d1e 100644
--- a/app/assets/stylesheets/pages/projects.scss
+++ b/app/assets/stylesheets/pages/projects.scss
@@ -26,8 +26,13 @@
}
.project-home-panel {
- padding-bottom: 40px;
- border-bottom: 1px solid $border-color;
+ background: $white-light;
+ text-align: left;
+ padding: 24px 0;
+
+ .container-fluid {
+ position: relative;
+ }
.cover-controls {
.project-settings-dropdown {
@@ -43,21 +48,50 @@
}
}
- .project-identicon-holder {
- margin-bottom: 16px;
+ .project-image-container {
+ @include make-sm-column(1);
+ max-width: 86px;
+ min-width: 86px;
+ padding-right: 0;
- .avatar, .identicon {
- margin: 0 auto;
- float: none;
+ @media (max-width: $screen-md-max) {
+ padding-left: 0;
+ margin-bottom: 10px;
+ max-width: none;
+ min-width: none;
+
+ .avatar.s70 {
+ margin: auto;
+ }
}
+ }
- .identicon {
- @include border-radius(50%);
+ .project-info {
+ @include make-sm-column(10);
+
+ h1 {
+ font-size: 24px;
+ font-weight: normal;
+ margin: 0;
+ }
+
+ .project-home-desc {
+ p {
+ margin: 0;
+ }
}
}
+ .identicon {
+ float: left;
+ @include border-radius(50%);
+ }
+
+ .avatar {
+ float: none;
+ }
+
.notifications-btn {
- margin-top: -28px;
.fa-bell {
margin-right: 6px;
@@ -69,28 +103,45 @@
}
.project-repo-buttons {
- margin-top: 20px;
- margin-bottom: 0;
+ font-size: 0;
- .count-buttons {
- display: block;
- margin-bottom: 20px;
- }
+ .btn {
+ @include btn-gray;
+ padding: 3px 10px;
+ text-transform: none;
+ background-color: $background-color;
- .clone-row {
- .split-repo-buttons,
- .project-clone-holder {
- display: inline-block;
+ .fa {
+ color: $layout-link-gray;
}
- .split-repo-buttons {
- margin: 0 12px;
+ .fa-caret-down {
+ margin-left: 3px;
}
}
- .btn {
- @include btn-gray;
- text-transform: none;
+ .btn-group:not(:first-child):not(:last-child) > .btn {
+ border-top-right-radius: 3px;
+ border-bottom-right-radius: 3px;
+ }
+
+ form {
+ margin-left: 10px;
+ }
+
+ .count-buttons {
+ display: inline-block;
+ vertical-align: top;
+ margin-top: 16px;
+ }
+
+ .project-clone-holder {
+ display: inline-block;
+ margin-top: 16px;
+
+ input {
+ height: 29px;
+ }
}
.count-with-arrow {
@@ -140,14 +191,14 @@
line-height: 13px;
padding: $gl-vert-padding $gl-padding;
letter-spacing: .4px;
- padding: 10px 14px;
+ padding: 7px 14px;
text-align: center;
vertical-align: middle;
touch-action: manipulation;
cursor: pointer;
background-image: none;
white-space: nowrap;
- margin: 0 11px 0 4px;
+ margin: 0 10px 0 4px;
&:hover {
background: #fff;
@@ -155,6 +206,30 @@
}
}
}
+
+ .project-right-buttons {
+ position: absolute;
+ right: 16px;
+ bottom: 0;
+
+ .btn {
+ padding: 3px 10px;
+ background-color: $background-color;
+ }
+
+ @media (max-width: 1304px) {
+ top: -6px;
+ }
+ }
+
+ @media (max-width: $screen-md-max) {
+ text-align: center;
+
+ .project-info,
+ .project-image-container {
+ width: 100%;
+ }
+ }
}
.split-one {
@@ -285,11 +360,11 @@ a.deploy-project-label {
}
.project-stats {
- text-align: center;
margin-top: $gl-padding;
margin-bottom: 0;
- padding-top: 10px;
- padding-bottom: 4px;
+ padding: 16px 0;
+ background-color: $white-light;
+ font-size: 0;
ul.nav {
display: inline-block;
@@ -300,12 +375,11 @@ a.deploy-project-label {
}
.nav > li > a {
- @include btn-default;
- @include btn-gray;
-
background-color: transparent;
- border: 1px solid #f7f8fa;
- margin-left: 12px;
+ margin-right: 12px;
+ padding: 0 10px;
+ font-size: 15px;
+ color: $notes-light-color;
}
li {
@@ -325,6 +399,10 @@ a.deploy-project-label {
background-color: #f0f2f5;
}
}
+
+ &.row-content-block.second-block {
+ margin-top: 0;
+ }
}
pre.light-well {
@@ -442,9 +520,14 @@ pre.light-well {
border-top: 0;
.edit-project-readme {
- z-index: 100;
+ z-index: 2;
position: relative;
}
+
+ .wiki h1 {
+ border-bottom: none;
+ padding: 0;
+ }
}
.git-clone-holder {
diff --git a/app/views/layouts/nav/_project.html.haml b/app/views/layouts/nav/_project.html.haml
index b60c419fb3a2277a74607c38e5d5f3941f863e10..ac692686bb26254889ac211b4d8a4e2bc0d4ce65 100644
--- a/app/views/layouts/nav/_project.html.haml
+++ b/app/views/layouts/nav/_project.html.haml
@@ -2,7 +2,7 @@
.controls
- access = user_max_access_in_project(current_user.id, @project)
- can_edit = can?(current_user, :admin_project, @project)
- %span.dropdown.project-settings-dropdown
+ .dropdown.project-settings-dropdown
%a.dropdown-new.btn.btn-default#project-settings-button{href: '#', 'data-toggle' => 'dropdown'}
= icon('cog')
= icon('caret-down')
diff --git a/app/views/projects/_home_panel.html.haml b/app/views/projects/_home_panel.html.haml
index cdb8d2b5e36fa18a429ee9f3691c18aec327bdb0..57c3d1b0a65bb08284fcde02c4255721c2afb5ec 100644
--- a/app/views/projects/_home_panel.html.haml
+++ b/app/views/projects/_home_panel.html.haml
@@ -1,37 +1,37 @@
- empty_repo = @project.empty_repo?
.project-home-panel.cover-block.clearfix{:class => ("empty-project" if empty_repo)}
- .project-identicon-holder
- = project_icon(@project, alt: '', class: 'project-avatar avatar s90')
- .cover-title.project-home-desc
- %h1
- = @project.name
- %span.visibility-icon.has-tooltip{data: { container: 'body' }, title: visibility_icon_description(@project)}
- = visibility_level_icon(@project.visibility_level, fw: false)
+ .container-fluid.container-limited
+ .row
+ .project-image-container
+ = project_icon(@project, alt: '', class: 'project-avatar avatar s70')
+ .project-info
+ .cover-title.project-home-desc
+ %h1
+ = @project.name
+ %span.visibility-icon.has-tooltip{data: { container: 'body' }, title: visibility_icon_description(@project)}
+ = visibility_level_icon(@project.visibility_level, fw: false)
- - if @project.description.present?
- .cover-desc.project-home-desc
- = markdown(@project.description, pipeline: :description)
+ - if @project.description.present?
+ .cover-desc.project-home-desc
+ = markdown(@project.description, pipeline: :description)
- - if forked_from_project = @project.forked_from_project
- .cover-desc
- Forked from
- = link_to project_path(forked_from_project) do
- = forked_from_project.namespace.try(:name)
+ - if forked_from_project = @project.forked_from_project
+ .cover-desc
+ Forked from
+ = link_to project_path(forked_from_project) do
+ = forked_from_project.namespace.try(:name)
- .project-repo-buttons
- .split-one.count-buttons
- = render 'projects/buttons/star'
- = render 'projects/buttons/fork'
+ .project-repo-buttons
+ .count-buttons
+ = render 'projects/buttons/star'
+ = render 'projects/buttons/fork'
- .clone-row
- .project-clone-holder
- = render "shared/clone_panel"
-
- .split-repo-buttons
- .btn-group.pull-left
- = render "projects/buttons/download"
- = render 'projects/buttons/dropdown'
+ .project-clone-holder
+ = render "shared/clone_panel"
+ .project-repo-buttons.btn-group.project-right-buttons
+ = render "projects/buttons/download"
+ = render 'projects/buttons/dropdown'
= render 'projects/buttons/notifications'
:javascript
diff --git a/app/views/projects/buttons/_dropdown.html.haml b/app/views/projects/buttons/_dropdown.html.haml
index 1e4c46fca2f159b7ef3e561ca4cd9206fe8afec0..16b8e1cca9134e9fab9867a7f579b31153f0a0e6 100644
--- a/app/views/projects/buttons/_dropdown.html.haml
+++ b/app/views/projects/buttons/_dropdown.html.haml
@@ -2,7 +2,7 @@
.btn-group
%a.btn.dropdown-toggle{href: '#', "data-toggle" => "dropdown"}
= icon('plus')
- %ul.dropdown-menu.dropdown-menu-right.project-home-dropdown
+ %ul.dropdown-menu.dropdown-menu-align-right.project-home-dropdown
- can_create_issue = can?(current_user, :create_issue, @project)
- merge_project = can?(current_user, :create_merge_request, @project) ? @project : (current_user && current_user.fork_of(@project))
- can_create_snippet = can?(current_user, :create_snippet, @project)
diff --git a/app/views/projects/buttons/_notifications.html.haml b/app/views/projects/buttons/_notifications.html.haml
index c1e3e5b73a2c3d945767969881aff32897765bfc..1d05da50581fdd72fd4a0b6e4a4a89e571ff4787 100644
--- a/app/views/projects/buttons/_notifications.html.haml
+++ b/app/views/projects/buttons/_notifications.html.haml
@@ -1,11 +1,11 @@
- if @notification_setting
= form_for @notification_setting, url: namespace_project_notification_setting_path(@project.namespace.becomes(Namespace), @project), method: :patch, remote: true, html: { class: 'inline', id: 'notification-form' } do |f|
= f.hidden_field :level
- %span.dropdown
+ .dropdown
%a.dropdown-new.btn.notifications-btn#notifications-button{href: '#', "data-toggle" => "dropdown"}
= icon('bell')
= notification_title(@notification_setting.level)
- = icon('angle-down')
- %ul.dropdown-menu.dropdown-menu-right.project-home-dropdown
+ = icon('caret-down')
+ %ul.dropdown-menu.dropdown-menu-align-right.project-home-dropdown
- NotificationSetting.levels.each do |level|
= notification_list_item(level.first, @notification_setting)
diff --git a/app/views/projects/show.html.haml b/app/views/projects/show.html.haml
index 74feb9e3282db65f5abbd1be9610a01199e53a94..61f739ad1d44015179ccdd1d07e3b6dc7b02657d 100644
--- a/app/views/projects/show.html.haml
+++ b/app/views/projects/show.html.haml
@@ -13,50 +13,51 @@
= render "home_panel"
.project-stats.row-content-block.second-block
- %ul.nav
- %li
- = link_to namespace_project_commits_path(@project.namespace, @project, current_ref) do
- = pluralize(number_with_delimiter(@project.commit_count), 'commit')
- %li
- = link_to namespace_project_branches_path(@project.namespace, @project) do
- = pluralize(number_with_delimiter(@repository.branch_names.count), 'branch')
- %li
- = link_to namespace_project_tags_path(@project.namespace, @project) do
- = pluralize(number_with_delimiter(@repository.tag_names.count), 'tag')
-
- %li
- = link_to project_files_path(@project) do
- = repository_size
-
- - if default_project_view != 'readme' && @repository.readme
+ .container-fluid.container-limited
+ %ul.nav
%li
- = link_to 'Readme', readme_path(@project)
-
- - if @repository.changelog
+ = link_to namespace_project_commits_path(@project.namespace, @project, current_ref) do
+ = pluralize(number_with_delimiter(@project.commit_count), 'commit')
%li
- = link_to 'Changelog', changelog_path(@project)
-
- - if @repository.license_blob
+ = link_to namespace_project_branches_path(@project.namespace, @project) do
+ = pluralize(number_with_delimiter(@repository.branch_names.count), 'branch')
%li
- = link_to license_short_name(@project), license_path(@project)
+ = link_to namespace_project_tags_path(@project.namespace, @project) do
+ = pluralize(number_with_delimiter(@repository.tag_names.count), 'tag')
- - if @repository.contribution_guide
%li
- = link_to 'Contribution guide', contribution_guide_path(@project)
+ = link_to project_files_path(@project) do
+ = repository_size
+
+ - if default_project_view != 'readme' && @repository.readme
+ %li
+ = link_to 'Readme', readme_path(@project)
+
+ - if @repository.changelog
+ %li
+ = link_to 'Changelog', changelog_path(@project)
+
+ - if @repository.license_blob
+ %li
+ = link_to license_short_name(@project), license_path(@project)
+
+ - if @repository.contribution_guide
+ %li
+ = link_to 'Contribution guide', contribution_guide_path(@project)
- - if current_user && can_push_branch?(@project, @project.default_branch)
- - unless @repository.changelog
- %li.missing
- = link_to add_special_file_path(@project, file_name: 'CHANGELOG') do
- Add Changelog
- - unless @repository.license_blob
- %li.missing
- = link_to add_special_file_path(@project, file_name: 'LICENSE') do
- Add License
- - unless @repository.contribution_guide
- %li.missing
- = link_to add_special_file_path(@project, file_name: 'CONTRIBUTING.md', commit_message: 'Add contribution guide') do
- Add Contribution guide
+ - if current_user && can_push_branch?(@project, @project.default_branch)
+ - unless @repository.changelog
+ %li.missing
+ = link_to add_special_file_path(@project, file_name: 'CHANGELOG') do
+ Add Changelog
+ - unless @repository.license_blob
+ %li.missing
+ = link_to add_special_file_path(@project, file_name: 'LICENSE') do
+ Add License
+ - unless @repository.contribution_guide
+ %li.missing
+ = link_to add_special_file_path(@project, file_name: 'CONTRIBUTING.md', commit_message: 'Add contribution guide') do
+ Add Contribution guide
- if @repository.commit
.content-block.second-block.white
diff --git a/app/views/shared/_clone_panel.html.haml b/app/views/shared/_clone_panel.html.haml
index 974751d99705d45e740466a622db1c0a2370ab89..84b3f44c0adfddee1f4590d049b185ae8f6d9ca6 100644
--- a/app/views/shared/_clone_panel.html.haml
+++ b/app/views/shared/_clone_panel.html.haml
@@ -5,7 +5,7 @@
%a#clone-dropdown.clone-dropdown-btn.btn{href: '#', 'data-toggle' => 'dropdown'}
%span
= default_clone_protocol.upcase
- = icon('angle-down')
+ = icon('caret-down')
%ul.dropdown-menu.dropdown-menu-right.clone-options-dropdown
%li
= ssh_clone_button(project)