From 1f78c5d46053ad37c280f0bc5273522d76888e63 Mon Sep 17 00:00:00 2001 From: Andrey Date: Thu, 24 Sep 2015 18:36:15 +0200 Subject: UI changes to the project view, empty project and project list new project button --- app/assets/stylesheets/base/mixins.scss | 81 +++++-- app/assets/stylesheets/base/variables.scss | 4 +- app/assets/stylesheets/generic/avatar.scss | 2 + app/assets/stylesheets/generic/typography.scss | 22 +- app/assets/stylesheets/pages/projects.scss | 296 +++++++++++++++++++++++-- app/views/projects/_home_panel.html.haml | 29 +-- app/views/projects/buttons/_fork.html.haml | 1 - app/views/projects/buttons/_star.html.haml | 5 - app/views/shared/_clone_panel.html.haml | 2 +- 9 files changed, 373 insertions(+), 69 deletions(-) diff --git a/app/assets/stylesheets/base/mixins.scss b/app/assets/stylesheets/base/mixins.scss index a2f6c3e21f4..cdebe498914 100644 --- a/app/assets/stylesheets/base/mixins.scss +++ b/app/assets/stylesheets/base/mixins.scss @@ -93,46 +93,89 @@ } h1 { - margin-top: 45px; - font-size: 2.5em; + font-size: 1.3em; + font-weight: 600; + margin: 24px 0 12px 0; + padding: 0 0 10px 0; + border-bottom: 1px solid #e7e9ed; + color: #313236; } h2 { - margin-top: 40px; - font-size: 2em; + font-size: 1.2em; + font-weight: 600; + margin: 24px 0 12px 0; + color: #313236; } h3 { - margin-top: 35px; - font-size: 1.5em; + margin: 24px 0 12px 0; + font-size: 1.25em; } h4 { - margin-top: 30px; - font-size: 1.2em; + margin: 24px 0 12px 0; + font-size: 1.1em; + } + + h5 { + margin: 24px 0 12px 0; + font-size: 1em; + } + + h6 { + margin: 24px 0 12px 0; + font-size: 0.90em; } blockquote { - color: #888; + padding: 8px 21px; + margin: 12px 0 12px; + border-left: 3px solid #e7e9ed; + } + + blockquote p { + color: #7f8fa4 !important; font-size: 15px; line-height: 1.5; } - + + p { + color:#5c5d5e; + margin:6px 0 0 0; + } + table { @extend .table; @extend .table-bordered; + margin: 12px 0 12px 0; + color: #5c5d5e; th { - background: #EEE; - } + background: #f8fafc; + } + } + + pre { + @include border-radius(2px); + + margin: 12px 0 12px 0 !important; + background-color: #f8fafc !important; + font-size: 13px !important; + color: #5b6169 !important; + line-height: 1.6em !important; } p > code { - font-size: inherit; font-weight: inherit; } + + ul { + color: #5c5d5e; + } + li { - line-height: 1.5; + line-height: 1.6em; } a[href*="/uploads/"], a[href*="storage.googleapis.com/google-code-attachments/"] { @@ -152,6 +195,7 @@ } } + @mixin str-truncated($max_width: 82%) { display: inline-block; overflow: hidden; @@ -183,7 +227,7 @@ &.active { background: #f9f9f9; a { - font-weight: bold; + font-weight: 600; } } @@ -199,6 +243,11 @@ } } +.pull-right .light .fa-pencil { + top: 20px; + position: relative; +} + @mixin input-big { height: 36px; padding: 5px 10px; @@ -250,4 +299,4 @@ color: #78a; } } -} +} \ No newline at end of file diff --git a/app/assets/stylesheets/base/variables.scss b/app/assets/stylesheets/base/variables.scss index 2fc7bf1720a..f6bdea9a897 100644 --- a/app/assets/stylesheets/base/variables.scss +++ b/app/assets/stylesheets/base/variables.scss @@ -12,8 +12,8 @@ $sidebar_width: 230px; $avatar_radius: 50%; $code_font_size: 13px; $code_line_height: 1.5; -$border-color: #E7E9ED; -$background-color: #F8FAFC; +$border-color: #dce0e6; +$background-color: #F7F8FA; $header-height: 58px; $fixed-layout-width: 1200px; $gl-gray: #7f8fa4; diff --git a/app/assets/stylesheets/generic/avatar.scss b/app/assets/stylesheets/generic/avatar.scss index 221cb6a04a5..36e582d4854 100644 --- a/app/assets/stylesheets/generic/avatar.scss +++ b/app/assets/stylesheets/generic/avatar.scss @@ -28,6 +28,7 @@ &.s48 { width: 48px; height: 48px; margin-right: 10px; } &.s60 { width: 60px; height: 60px; margin-right: 12px; } &.s90 { width: 90px; height: 90px; margin-right: 15px; } + &.s110 { width: 110px; height: 110px; margin-right: 15px; } &.s140 { width: 140px; height: 140px; margin-right: 20px; } &.s160 { width: 160px; height: 160px; margin-right: 20px; } } @@ -42,6 +43,7 @@ &.s32 { font-size: 22px; line-height: 32px; } &.s60 { font-size: 32px; line-height: 60px; } &.s90 { font-size: 36px; line-height: 90px; } + &.s110 { font-size: 40px; line-height: 112px; font-weight: 300; } &.s140 { font-size: 72px; line-height: 140px; } &.s160 { font-size: 96px; line-height: 160px; } } diff --git a/app/assets/stylesheets/generic/typography.scss b/app/assets/stylesheets/generic/typography.scss index d5f0d86a307..bfb559c294b 100644 --- a/app/assets/stylesheets/generic/typography.scss +++ b/app/assets/stylesheets/generic/typography.scss @@ -2,11 +2,17 @@ * Headers * */ + + body { + text-rendering: optimizeLegibility + } + .page-title { margin-top: 0px; - line-height: 1.5; - font-weight: normal; - margin-bottom: 5px; + line-height: 1.3; + font-size: 1.25em; + font-weight: 600; + margin: 12px 7px 12px 7px; } h1, h2, h3, h4, h5, h6 { @@ -55,6 +61,7 @@ a > code { @include md-typography; word-wrap: break-word; + padding: 7px; /* Link to current header. */ h1, h2, h3, h4, h5, h6 { @@ -83,9 +90,12 @@ a > code { } } - ul { + ul,ol { padding: 0; - margin: 0 0 9px 25px !important; + margin: 6px 0 6px 18px !important; + } + ol { + color: #5c5d5e; } } @@ -111,4 +121,4 @@ textarea.js-gfm-input { .strikethrough { text-decoration: line-through; -} +} \ No newline at end of file diff --git a/app/assets/stylesheets/pages/projects.scss b/app/assets/stylesheets/pages/projects.scss index a986fafff07..621ba2fe2c8 100644 --- a/app/assets/stylesheets/pages/projects.scss +++ b/app/assets/stylesheets/pages/projects.scss @@ -19,10 +19,10 @@ background: #f7f8fa; margin: -$gl-padding; padding: $gl-padding; - padding-top: 40px; + padding: 44px 0 17px 0; .project-identicon-holder { - margin-bottom: 15px; + margin-bottom: 16px; .avatar, .identicon { margin: 0 auto; @@ -40,23 +40,26 @@ .project-home-desc { h1 { + color: #313236; margin: 0; - margin-bottom: 10px; + margin-bottom: 6px; font-size: 23px; font-weight: normal; } p { - color: #7f8fa4; + color: #5c5d5e; } } .git-clone-holder { - max-width: 600px; - margin: 20px auto; + max-width: 498px; .form-control { background: #FFF; + font-size: 14px; + height: 42px; + margin-left: -2px; } } @@ -66,30 +69,66 @@ color: inherit; } } - + .input-group { + display: inline-table; + position: relative; + top: 17px; + margin-bottom: 44px; + } .project-repo-buttons { - margin-top: $gl-padding; - margin-bottom: 25px; + margin-top: 12px; + margin-bottom: 0px; .btn { @extend .btn-info; - + @include border-radius(2px); + + background-color: #f0f2f5; + border: 1px solid #dce0e5; text-transform: uppercase; - font-size: 15px; - line-height: 20px; - padding: 8px 14px; - border-radius: 3px; - margin-left: 10px; + color: #313236; + font-size: 13px; + font-weight: 600; + line-height: 18px; + padding: 11px 16px; + margin-left: 12px; + + &:hover { + @include border-radius(2px); + color: #313236; + border: 1px solid #dce0e5; + background-color: #ebeef2; + } + + &:focus { + @include border-radius(2px); + color: #313236; + border: 1px solid #dce0e5; + background-color: #ebeef2; + } + + &:active { + @include box-shadow(inset 0 0 4px rgba(0, 0, 0, 0.12)); + color: #313236 !important; + border: 1px solid #c6cacf !important; + background-color: #e4e7ed !important; + } .count { - padding-left: 7px; display: inline-block; - margin-left: 7px; } } } } +.split-one { + display: inline-table; + + a { + margin: -1px !important; + } +} + .git-clone-holder { .project-home-dropdown + & { margin-right: 45px; @@ -103,7 +142,7 @@ } .input-group-addon { - background: #FAFAFA; + background: #f7f8fa; &.git-protocols { padding: 0; @@ -111,11 +150,157 @@ .input-group-btn:last-child > .btn { @include border-radius-right(0); + + border-left: 1px solid #c6cacf; + margin-left: -2px !important; + } + input-group-btn:first-child > .btn { + @include border-radius-left(0); } } } } +.projects-search-form { + + .input-group .btn-success { + background-color: #2ebf6b !important; + border: 1px solid #28b061 !important; + color: #fff !important; + + &:hover { + background-color: #2eb867 !important; + } + + &:focus { + background-color: #2eb867 !important; + } + + &:active { + @include box-shadow (inset 0 0 4px rgba(0, 0, 0, 0.12)); + + background-color: #28b061 !important; + border: 1px solid #26a65c !important; + color: #fff !important; + } + } + + .input-group .form-control { + height: 39px !important; + } + +} + +.input-group-btn > .btn { + background-color: #f0f2f5; + border: 1px solid #dce0e5; + text-transform: uppercase; + color: #313236; + font-size: 13px; + font-weight: 600; + + &:focus { + outline: none; + color: #313236; + border: 1px solid #dce0e5; + background-color: #ebeef2; + } + + &:hover { + outline: none; + color: #313236; + border: 1px solid #dce0e5; + background-color: #ebeef2; + } + + &:active { + @include box-shadow(inset 0 0 4px rgba(0, 0, 0, 0.12)); + + color: #313236 !important; + border: 1px solid #c6cacf !important; + background-color: #e4e7ed !important; + } + +} + +.input-group-btn > .btn.active { + @include box-shadow(inset 0 0 4px rgba(0, 0, 0, 0.12)); + + border-top-right-radius: 0px; + border-bottom-right-radius: 0px; + color: #313236 !important; + border: 1px solid #c6cacf !important; + background-color: #e4e7ed !important; +} + +.split-repo-buttons { + display: inline-table; + margin-left: 12px; + + .btn { + margin: 0 !important; + } + + .dropdown { + margin: 0 !important; + } + + .dropdown-toggle { + margin: -5px !important; + } +} + +#notification-form { + margin-left: 5px; +} + +.open > .dropdown-toggle.btn { + @include box-shadow(inset 0 0 4px rgba(0, 0, 0, 0.12)); + + border: 1px solid #c6cacf !important; + background-color: #e4e7ed !important; + text-transform: uppercase; + color: #313236; + font-size: 13px; + font-weight: 600; + color: #313236 !important; +} + +.dropdown-menu { + @include box-shadow(rgba(76, 86, 103, 0.247059) 0px 0px 1px 0px, rgba(31, 37, 50, 0.317647) 0px 2px 18px 0px); + @include border-radius (0px); + + border: none; + padding: 16px 0; + font-size: 14px; + font-weight: 100; + + li a { + color: #5f697a; + line-height: 30px; + + &:hover { + background-color: #3084bb !important; + } + } + + .fa-fw { + margin-right: 8px; + } +} + +.fa-bell { + margin-right: 6px; +} + +.fa-angle-down { + margin-left: 6px; +} + +.project-home-panel .project-home-dropdown { + margin: 13px 0px 0; +} + .project-visibility-level-holder { .radio { margin-bottom: 10px; @@ -232,15 +417,48 @@ table.table.protected-branches-list tr.no-border { .project-stats { text-align: center; - margin-top: 0; + margin-top: 15px; margin-bottom: 0; - padding-top: 5px; - padding-bottom: 0; + padding-top: 10px; + padding-bottom: 4px; ul.nav-pills { display:inline-block; } + + .nav-pills li { + display:inline; + } + .nav > li > a { + border: 1px solid transparent; + color: #313236; + font-size: 13px; + font-weight: 600; + text-decoration: none; + text-transform: uppercase; + margin: 0 8px 0 0; + padding: 10px 16px 10px 16px; + + &:hover { + @include border-radius(2px); + border: 1px solid #dce0e5; + background-color: #f0f2f5; + } + + &:focus { + @include border-radius(2px); + border: 1px solid #dce0e5; + background-color: #f0f2f5; + } + + &:active { + @include box-shadow(inset 0 0 4px rgba(0, 0, 0, 0.12)); + border: 1px solid #c6cacf; + background-color: #e4e7ed; + } + } + li { display:inline; } @@ -251,11 +469,11 @@ table.table.protected-branches-list tr.no-border { } li.missing a { - color: #bbb; - border: 1px dashed #ccc; + color: #5a6069; + border: 1px dashed #dce0e5; &:hover { - background-color: #FAFAFA; + background-color: #f0f2f5; } } } @@ -273,6 +491,36 @@ pre.light-well { border-bottom: 1px solid #e7e9ed; } +.git-empty { + margin: 0 7px 0 7px; + + h5 { + color: #5c5d5e; + } + + .light-well { + @include border-radius (2px); + + color: #5b6169 !important; + font-size: 13px !important; + line-height: 1.6em !important; + } +} + +.prepend-top-20 { + margin: 20px 8px 20px 8px; + + .btn-remove { + @include border-radius (2px); + + font-size: 13px; + font-weight: 600px; + text-transform: uppercase; + float: left !important; + margin-bottom: 14px; + } +} + /* * Projects list rendered on dashboard and user page */ diff --git a/app/views/projects/_home_panel.html.haml b/app/views/projects/_home_panel.html.haml index 6e53f55b0ab..8c0980369fd 100644 --- a/app/views/projects/_home_panel.html.haml +++ b/app/views/projects/_home_panel.html.haml @@ -16,18 +16,19 @@ .project-repo-buttons - = render 'projects/buttons/star' - - - unless empty_repo - = render 'projects/buttons/fork' - - - if can? current_user, :download_code, @project - = link_to archive_namespace_project_repository_path(@project.namespace, @project, ref: @ref, format: 'zip'), class: 'btn', rel: 'nofollow' do - = icon('download fw') - Download - + .split-one + = render 'projects/buttons/star' + + - unless empty_repo + = render 'projects/buttons/fork' + + = render "shared/clone_panel" + .split-repo-buttons + - unless empty_repo + - if can? current_user, :download_code, @project + = link_to archive_namespace_project_repository_path(@project.namespace, @project, ref: @ref, format: 'zip'), class: 'btn', rel: 'nofollow' do + = icon('download fw') + + = render 'projects/buttons/dropdown' = render 'projects/buttons/notifications' - - = render 'projects/buttons/dropdown' - - = render "shared/clone_panel" + diff --git a/app/views/projects/buttons/_fork.html.haml b/app/views/projects/buttons/_fork.html.haml index 854c154824d..8f2f631eb7d 100644 --- a/app/views/projects/buttons/_fork.html.haml +++ b/app/views/projects/buttons/_fork.html.haml @@ -8,6 +8,5 @@ - else = link_to new_namespace_project_fork_path(@project.namespace, @project), title: "Fork project", class: 'btn' do = icon('code-fork fw') - Fork %span.count = @project.forks_count diff --git a/app/views/projects/buttons/_star.html.haml b/app/views/projects/buttons/_star.html.haml index 5d7df5ae099..3501dddefbe 100644 --- a/app/views/projects/buttons/_star.html.haml +++ b/app/views/projects/buttons/_star.html.haml @@ -1,10 +1,6 @@ - if current_user = link_to toggle_star_namespace_project_path(@project.namespace, @project), class: 'btn star-btn toggle-star', method: :post, remote: true do = icon('star fw') - - if current_user.starred?(@project) - Unstar - - else - Star %span.count = @project.star_count @@ -17,6 +13,5 @@ - else = link_to new_user_session_path, class: 'btn has_tooltip star-btn', title: 'You must sign in to star a project' do = icon('star fw') - Star %span.count = @project.star_count diff --git a/app/views/shared/_clone_panel.html.haml b/app/views/shared/_clone_panel.html.haml index 2cd422e772a..b23b2f0d5eb 100644 --- a/app/views/shared/_clone_panel.html.haml +++ b/app/views/shared/_clone_panel.html.haml @@ -24,4 +24,4 @@ .input-group-addon .visibility-level-label.has_tooltip{'data-title' => "#{visibility_level_label(project.visibility_level)} project" } = visibility_level_icon(project.visibility_level) - = visibility_level_label(project.visibility_level).downcase + -- cgit v1.2.1 From 1868c8b25842cf24c79b8abf62ce5c177e5b82e3 Mon Sep 17 00:00:00 2001 From: Dmitriy Zaporozhets Date: Fri, 25 Sep 2015 10:04:09 +0200 Subject: Fix tests Signed-off-by: Dmitriy Zaporozhets --- features/steps/project/fork.rb | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/features/steps/project/fork.rb b/features/steps/project/fork.rb index 370960845cc..b0230add34f 100644 --- a/features/steps/project/fork.rb +++ b/features/steps/project/fork.rb @@ -5,8 +5,7 @@ class Spinach::Features::ProjectFork < Spinach::FeatureSteps step 'I click link "Fork"' do expect(page).to have_content "Shop" - expect(page).to have_content "Fork" - click_link "Fork" + click_link "Fork project" end step 'I am a member of project "Shop"' do -- cgit v1.2.1 From 12acf15c90d25a22e706737dc54f17466fb30320 Mon Sep 17 00:00:00 2001 From: Andrey Date: Fri, 25 Sep 2015 20:33:05 +0200 Subject: Project page Update refactoring buttons, fixes for projects filter on the dashboard and group page --- app/assets/stylesheets/base/mixins.scss | 2 +- app/assets/stylesheets/generic/buttons.scss | 138 +++++++++++++ app/assets/stylesheets/generic/header.scss | 1 - app/assets/stylesheets/generic/sidebar.scss | 3 +- app/assets/stylesheets/generic/typography.scss | 8 +- app/assets/stylesheets/pages/groups.scss | 6 + app/assets/stylesheets/pages/projects.scss | 218 +++++++-------------- app/views/dashboard/projects/_projects.html.haml | 2 +- app/views/groups/_projects.html.haml | 2 +- app/views/projects/buttons/_dropdown.html.haml | 2 +- .../projects/buttons/_notifications.html.haml | 2 +- app/views/projects/empty.html.haml | 74 +++---- 12 files changed, 263 insertions(+), 195 deletions(-) diff --git a/app/assets/stylesheets/base/mixins.scss b/app/assets/stylesheets/base/mixins.scss index cdebe498914..5a7e79ddecd 100644 --- a/app/assets/stylesheets/base/mixins.scss +++ b/app/assets/stylesheets/base/mixins.scss @@ -299,4 +299,4 @@ color: #78a; } } -} \ No newline at end of file +} diff --git a/app/assets/stylesheets/generic/buttons.scss b/app/assets/stylesheets/generic/buttons.scss index 46ef595ddf0..cf76f538e01 100644 --- a/app/assets/stylesheets/generic/buttons.scss +++ b/app/assets/stylesheets/generic/buttons.scss @@ -1,3 +1,6 @@ +body { + text-rendering: geometricPrecision; +} .btn { @extend .btn-default; @@ -88,3 +91,138 @@ } } } + +@mixin btn-info { + @include border-radius(2px); + + border-width: 1px; + border-style: solid; + text-transform: uppercase; + font-size: 13px; + font-weight: 600; + line-height: 18px; + padding: 11px 16px; + letter-spacing: .4px; + + &:hover { + border-width: 1px; + border-style: solid; + } + + &:focus { + border-width: 1px; + border-style: solid; + } + + &:active { + @include box-shadow(inset 0 0 4px rgba(0, 0, 0, 0.12)); + border-width: 1px; + border-style: solid; + } +} + +@mixin btn-middle { + @include border-radius(2px); + + border-width: 1px; + border-style: solid; + text-transform: uppercase; + font-size: 13px; + font-weight: 600; + line-height: 18px; + padding: 11px 24px; + letter-spacing: .4px; + + &:hover { + border-width: 1px; + border-style: solid; + } + + &:focus { + border-width: 1px; + border-style: solid; + } + + &:active { + @include box-shadow(inset 0 0 4px rgba(0, 0, 0, 0.12)); + border-width: 1px; + border-style: solid; + } +} + + +@mixin btn-green { + background-color: #28b061; + border: 1px solid #26a65c; + color: #fff; + + &:hover { + background-color: #26ab5d; + border: 1px solid #229954; + color: #fff; + } + + &:focus { + background-color: #26ab5d; + border: 1px solid #229954; + color: #fff; + } + + &:active { + @include box-shadow (inset 0 0 4px rgba(0, 0, 0, 0.12)); + + background-color: #23a158 !important; + border: 1px solid #229954 !important; + color: #fff !important; + } +} + +/*Butons*/ + +@mixin bnt-project { + background-color: #f0f2f5; + border-color: #dce0e5; + color: #313236; + + &:hover { + border-color:#dce0e5; + background-color: #ebeef2; + color: #313236; + } + + &:focus { + border-color: #dce0e5; + background-color: #ebeef2; + color: #313236; + } + + &:active { + @include box-shadow(inset 0 0 4px rgba(0, 0, 0, 0.12)); + + color: #313236 !important; + border-color: #c6cacf !important; + background-color: #e4e7ed !important; + } +} + +@mixin btn-remove { + background-color: #f72e60; + border-color: #ee295a; + + &:hover { + background-color: #e82757; + border-color: #e32555; + } + + &:focus { + background-color: #e82757; + border-color: #e32555; + } + + &:active { + @include box-shadow(inset 0 0 4px rgba(0, 0, 0, 0.12)); + background-color: #d42450 !important; + border-color: #e12554 !important; + } + +} \ No newline at end of file diff --git a/app/assets/stylesheets/generic/header.scss b/app/assets/stylesheets/generic/header.scss index b758a526fbb..543ce41ab52 100644 --- a/app/assets/stylesheets/generic/header.scss +++ b/app/assets/stylesheets/generic/header.scss @@ -26,7 +26,6 @@ header { min-height: $header-height; background-color: #fff; border: none; - border-bottom: 1px solid #EEE; .container-fluid { width: 100% !important; diff --git a/app/assets/stylesheets/generic/sidebar.scss b/app/assets/stylesheets/generic/sidebar.scss index 3d055f0e66f..c5ea3aca7ca 100644 --- a/app/assets/stylesheets/generic/sidebar.scss +++ b/app/assets/stylesheets/generic/sidebar.scss @@ -21,12 +21,11 @@ min-height: 100vh; width: 100%; padding: 20px; - background: #f1f4f8; + background: #EAEBEC; .container-fluid { background: #FFF; padding: $gl-padding; - border: 1px solid #e7e9ed; min-height: 90vh; &.container-blank { diff --git a/app/assets/stylesheets/generic/typography.scss b/app/assets/stylesheets/generic/typography.scss index bfb559c294b..0ccb21f3cd1 100644 --- a/app/assets/stylesheets/generic/typography.scss +++ b/app/assets/stylesheets/generic/typography.scss @@ -2,10 +2,10 @@ * Headers * */ - - body { - text-rendering: optimizeLegibility - } +body { + text-rendering:optimizeLegibility; + -webkit-text-shadow: rgba(255,255,255,0.01) 0 0 1px; +} .page-title { margin-top: 0px; diff --git a/app/assets/stylesheets/pages/groups.scss b/app/assets/stylesheets/pages/groups.scss index 2b1b747139a..07a38a19fad 100644 --- a/app/assets/stylesheets/pages/groups.scss +++ b/app/assets/stylesheets/pages/groups.scss @@ -10,3 +10,9 @@ .milestone-row { @include str-truncated(90%); } + +.dashboard .side .panel .panel-heading .input-group { + .form-control { + height: 42px; + } +} \ No newline at end of file diff --git a/app/assets/stylesheets/pages/projects.scss b/app/assets/stylesheets/pages/projects.scss index 621ba2fe2c8..a5940543a9d 100644 --- a/app/assets/stylesheets/pages/projects.scss +++ b/app/assets/stylesheets/pages/projects.scss @@ -1,3 +1,14 @@ +.alert_holder { + margin: -16px; + + .alert-link { + font-weight: normal; + } +} +.no-ssh-key-message { + background-color: #f28d35; + margin-bottom: 16px; +} .new_project, .edit_project { fieldset.features { @@ -20,20 +31,20 @@ margin: -$gl-padding; padding: $gl-padding; padding: 44px 0 17px 0; - + .project-identicon-holder { margin-bottom: 16px; - + .avatar, .identicon { margin: 0 auto; float: none; } - + .identicon { @include border-radius(50%); } } - + .project-home-dropdown { margin: 11px 3px 0; } @@ -59,7 +70,7 @@ background: #FFF; font-size: 14px; height: 42px; - margin-left: -2px; + margin-left: -1px; } } @@ -75,45 +86,15 @@ top: 17px; margin-bottom: 44px; } + .project-repo-buttons { margin-top: 12px; margin-bottom: 0px; - + .btn { - @extend .btn-info; - @include border-radius(2px); + @include bnt-project; + @include btn-info; - background-color: #f0f2f5; - border: 1px solid #dce0e5; - text-transform: uppercase; - color: #313236; - font-size: 13px; - font-weight: 600; - line-height: 18px; - padding: 11px 16px; - margin-left: 12px; - - &:hover { - @include border-radius(2px); - color: #313236; - border: 1px solid #dce0e5; - background-color: #ebeef2; - } - - &:focus { - @include border-radius(2px); - color: #313236; - border: 1px solid #dce0e5; - background-color: #ebeef2; - } - - &:active { - @include box-shadow(inset 0 0 4px rgba(0, 0, 0, 0.12)); - color: #313236 !important; - border: 1px solid #c6cacf !important; - background-color: #e4e7ed !important; - } - .count { display: inline-block; } @@ -123,6 +104,7 @@ .split-one { display: inline-table; + margin-right: 12px; a { margin: -1px !important; @@ -138,7 +120,7 @@ cursor: auto; @extend .monospace; background: #FAFAFA; - width: 100%; + width: 101%; } .input-group-addon { @@ -147,106 +129,66 @@ &.git-protocols { padding: 0; border: none; - + .input-group-btn:last-child > .btn { @include border-radius-right(0); border-left: 1px solid #c6cacf; margin-left: -2px !important; } - input-group-btn:first-child > .btn { - @include border-radius-left(0); - } } } } .projects-search-form { - .input-group .btn-success { - background-color: #2ebf6b !important; - border: 1px solid #28b061 !important; - color: #fff !important; - - &:hover { - background-color: #2eb867 !important; - } - - &:focus { - background-color: #2eb867 !important; - } - - &:active { - @include box-shadow (inset 0 0 4px rgba(0, 0, 0, 0.12)); - - background-color: #28b061 !important; - border: 1px solid #26a65c !important; - color: #fff !important; - } - } - .input-group .form-control { - height: 39px !important; + height: 42px; } - } -.input-group-btn > .btn { - background-color: #f0f2f5; - border: 1px solid #dce0e5; - text-transform: uppercase; - color: #313236; - font-size: 13px; - font-weight: 600; - - &:focus { - outline: none; - color: #313236; - border: 1px solid #dce0e5; - background-color: #ebeef2; - } - - &:hover { - outline: none; - color: #313236; - border: 1px solid #dce0e5; - background-color: #ebeef2; +.input-group-btn { + .btn { + @include bnt-project; + @include btn-middle; + + &:hover { + outline: none; + } + + &:focus { + outline: none; + } + + &:active { + outline: none; + } } - &:active { + .active { @include box-shadow(inset 0 0 4px rgba(0, 0, 0, 0.12)); - color: #313236 !important; border: 1px solid #c6cacf !important; background-color: #e4e7ed !important; } - -} - -.input-group-btn > .btn.active { - @include box-shadow(inset 0 0 4px rgba(0, 0, 0, 0.12)); - border-top-right-radius: 0px; - border-bottom-right-radius: 0px; - color: #313236 !important; - border: 1px solid #c6cacf !important; - background-color: #e4e7ed !important; + .btn-green { + @include btn-green + } + } .split-repo-buttons { display: inline-table; - margin-left: 12px; + margin: 0 12px 0 12px; - .btn { - margin: 0 !important; - } - - .dropdown { - margin: 0 !important; + .btn{ + @include bnt-project; + @include btn-info; } .dropdown-toggle { - margin: -5px !important; + margin: -5px; } } @@ -254,22 +196,25 @@ margin-left: 5px; } -.open > .dropdown-toggle.btn { +.dropdown-new { + margin-left: -5px; +} + +.open > .dropdown-new.btn { @include box-shadow(inset 0 0 4px rgba(0, 0, 0, 0.12)); border: 1px solid #c6cacf !important; background-color: #e4e7ed !important; text-transform: uppercase; - color: #313236; + color: #313236 !important; font-size: 13px; font-weight: 600; - color: #313236 !important; } .dropdown-menu { @include box-shadow(rgba(76, 86, 103, 0.247059) 0px 0px 1px 0px, rgba(31, 37, 50, 0.317647) 0px 2px 18px 0px); @include border-radius (0px); - + border: none; padding: 16px 0; font-size: 14px; @@ -298,7 +243,7 @@ } .project-home-panel .project-home-dropdown { - margin: 13px 0px 0; + margin: 13px 0px 0; } .project-visibility-level-holder { @@ -431,32 +376,12 @@ table.table.protected-branches-list tr.no-border { } .nav > li > a { - border: 1px solid transparent; - color: #313236; - font-size: 13px; - font-weight: 600; - text-decoration: none; - text-transform: uppercase; - margin: 0 8px 0 0; - padding: 10px 16px 10px 16px; - - &:hover { - @include border-radius(2px); - border: 1px solid #dce0e5; - background-color: #f0f2f5; - } - - &:focus { - @include border-radius(2px); - border: 1px solid #dce0e5; - background-color: #f0f2f5; - } + @include btn-info; + @include bnt-project; - &:active { - @include box-shadow(inset 0 0 4px rgba(0, 0, 0, 0.12)); - border: 1px solid #c6cacf; - background-color: #e4e7ed; - } + background-color: transparent; + border: 1px solid #f7f8fa; + margin-left: 12px; } li { @@ -501,29 +426,27 @@ pre.light-well { .light-well { @include border-radius (2px); - color: #5b6169 !important; - font-size: 13px !important; - line-height: 1.6em !important; + color: #5b6169; + font-size: 13px; + line-height: 1.6em; } } .prepend-top-20 { - margin: 20px 8px 20px 8px; + margin-top: 20px; .btn-remove { - @include border-radius (2px); + @include btn-middle; + @include btn-remove; - font-size: 13px; - font-weight: 600px; - text-transform: uppercase; float: left !important; - margin-bottom: 14px; } } /* * Projects list rendered on dashboard and user page */ + .projects-list { @include basic-list; @@ -581,3 +504,4 @@ pre.light-well { .inline-form { display: inline-block; } + diff --git a/app/views/dashboard/projects/_projects.html.haml b/app/views/dashboard/projects/_projects.html.haml index ef9b9ce756a..0afe4e651c7 100644 --- a/app/views/dashboard/projects/_projects.html.haml +++ b/app/views/dashboard/projects/_projects.html.haml @@ -4,7 +4,7 @@ = search_field_tag :filter_projects, nil, placeholder: 'Filter by name', class: 'projects-list-filter form-control' - if current_user.can_create_project? %span.input-group-btn - = link_to new_project_path, class: 'btn btn-success' do + = link_to new_project_path, class: 'btn btn-green' do New project = render 'shared/projects/list', projects: @projects diff --git a/app/views/groups/_projects.html.haml b/app/views/groups/_projects.html.haml index 9ac56b1e5fe..2b27a88794d 100644 --- a/app/views/groups/_projects.html.haml +++ b/app/views/groups/_projects.html.haml @@ -4,7 +4,7 @@ = search_field_tag :filter_projects, nil, placeholder: 'Filter by name', class: 'projects-list-filter form-control' - if can? current_user, :create_projects, @group %span.input-group-btn - = link_to new_project_path(namespace_id: @group.id), class: 'btn btn-success' do + = link_to new_project_path(namespace_id: @group.id), class: 'btn btn-green' do New project = render 'shared/projects/list', projects: @projects, projects_limit: 20, stars: false diff --git a/app/views/projects/buttons/_dropdown.html.haml b/app/views/projects/buttons/_dropdown.html.haml index bc7625e8989..4580c912692 100644 --- a/app/views/projects/buttons/_dropdown.html.haml +++ b/app/views/projects/buttons/_dropdown.html.haml @@ -1,6 +1,6 @@ - if current_user %span.dropdown - %a.dropdown-toggle.btn.btn-new{href: '#', "data-toggle" => "dropdown"} + %a.dropdown-new.btn.btn-new{href: '#', "data-toggle" => "dropdown"} = icon('plus') %ul.dropdown-menu.dropdown-menu-right.project-home-dropdown - if can?(current_user, :create_issue, @project) diff --git a/app/views/projects/buttons/_notifications.html.haml b/app/views/projects/buttons/_notifications.html.haml index 57f764178d5..4b69a6d7a6f 100644 --- a/app/views/projects/buttons/_notifications.html.haml +++ b/app/views/projects/buttons/_notifications.html.haml @@ -5,7 +5,7 @@ = hidden_field_tag :notification_id, @membership.id = hidden_field_tag :notification_level %span.dropdown - %a.dropdown-toggle.btn.btn-new#notifications-button{href: '#', "data-toggle" => "dropdown"} + %a.dropdown-new.btn.btn-new#notifications-button{href: '#', "data-toggle" => "dropdown"} = icon('bell') = notification_label(@membership) = icon('angle-down') diff --git a/app/views/projects/empty.html.haml b/app/views/projects/empty.html.haml index 185ebf23934..d8f9f692c0b 100644 --- a/app/views/projects/empty.html.haml +++ b/app/views/projects/empty.html.haml @@ -1,7 +1,8 @@ -- if current_user && can?(current_user, :download_code, @project) - = render 'shared/no_ssh' - = render 'shared/no_password' - +.alert_holder + - if current_user && can?(current_user, :download_code, @project) + = render 'shared/no_ssh' + = render 'shared/no_password' + = render "home_panel" .gray-content-block.center @@ -15,38 +16,39 @@ file to this project. .prepend-top-20 -%h3.page-title - Command line instructions -%div.git-empty - %fieldset - %h5 Git global setup - %pre.light-well - :preserve - git config --global user.name "#{h git_user_name}" - git config --global user.email "#{h git_user_email}" +.empty_wrapper + %h3.page-title + Command line instructions + %div.git-empty + %fieldset + %h5 Git global setup + %pre.light-well + :preserve + git config --global user.name "#{h git_user_name}" + git config --global user.email "#{h git_user_email}" - %fieldset - %h5 Create a new repository - %pre.light-well - :preserve - git clone #{ content_tag(:span, default_url_to_repo, class: 'clone')} - cd #{h @project.path} - touch README.md - git add README.md - git commit -m "add README" - git push -u origin master + %fieldset + %h5 Create a new repository + %pre.light-well + :preserve + git clone #{ content_tag(:span, default_url_to_repo, class: 'clone')} + cd #{h @project.path} + touch README.md + git add README.md + git commit -m "add README" + git push -u origin master - %fieldset - %h5 Existing folder or Git repository - %pre.light-well - :preserve - cd existing_folder - git init - git remote add origin #{ content_tag(:span, default_url_to_repo, class: 'clone')} - git add . - git commit - git push -u origin master + %fieldset + %h5 Existing folder or Git repository + %pre.light-well + :preserve + cd existing_folder + git init + git remote add origin #{ content_tag(:span, default_url_to_repo, class: 'clone')} + git add . + git commit + git push -u origin master -- if can? current_user, :remove_project, @project - .prepend-top-20 - = link_to 'Remove project', [@project.namespace.becomes(Namespace), @project], data: { confirm: remove_project_message(@project)}, method: :delete, class: "btn btn-remove pull-right" + - if can? current_user, :remove_project, @project + .prepend-top-20 + = link_to 'Remove project', [@project.namespace.becomes(Namespace), @project], data: { confirm: remove_project_message(@project)}, method: :delete, class: "btn btn-remove pull-right" -- cgit v1.2.1 From ce49e49bfb40872475b82b500f5e52f6ec36b81f Mon Sep 17 00:00:00 2001 From: Andrey Date: Mon, 28 Sep 2015 11:26:42 +0200 Subject: edit action allign --- app/assets/stylesheets/base/mixins.scss | 10 +++++----- app/views/projects/_readme.html.haml | 2 +- 2 files changed, 6 insertions(+), 6 deletions(-) diff --git a/app/assets/stylesheets/base/mixins.scss b/app/assets/stylesheets/base/mixins.scss index 5a7e79ddecd..bba4728af36 100644 --- a/app/assets/stylesheets/base/mixins.scss +++ b/app/assets/stylesheets/base/mixins.scss @@ -243,11 +243,6 @@ } } -.pull-right .light .fa-pencil { - top: 20px; - position: relative; -} - @mixin input-big { height: 36px; padding: 5px 10px; @@ -300,3 +295,8 @@ } } } + +.fa-align { + top: 20px; + position: relative; +} \ No newline at end of file diff --git a/app/views/projects/_readme.html.haml b/app/views/projects/_readme.html.haml index 5038edb95ed..5bc1999ec9d 100644 --- a/app/views/projects/_readme.html.haml +++ b/app/views/projects/_readme.html.haml @@ -5,7 +5,7 @@   - if can?(current_user, :push_code, @project) = link_to namespace_project_edit_blob_path(@project.namespace, @project, tree_join(@repository.root_ref, readme.name)), class: 'light' do - %i.fa.fa-pencil + %i.fa-align.fa.fa-pencil .wiki = cache(readme_cache_key) do = render_readme(readme) -- cgit v1.2.1 From ad679127608ebb711bbd49268e3380a30aabb336 Mon Sep 17 00:00:00 2001 From: Andrey Date: Mon, 28 Sep 2015 12:03:41 +0200 Subject: !important removed from pre --- app/assets/stylesheets/base/mixins.scss | 6 ------ app/assets/stylesheets/generic/common.scss | 2 +- app/assets/stylesheets/highlight/white.scss | 7 ++++--- 3 files changed, 5 insertions(+), 10 deletions(-) diff --git a/app/assets/stylesheets/base/mixins.scss b/app/assets/stylesheets/base/mixins.scss index bba4728af36..20c62250bc1 100644 --- a/app/assets/stylesheets/base/mixins.scss +++ b/app/assets/stylesheets/base/mixins.scss @@ -157,12 +157,6 @@ pre { @include border-radius(2px); - - margin: 12px 0 12px 0 !important; - background-color: #f8fafc !important; - font-size: 13px !important; - color: #5b6169 !important; - line-height: 1.6em !important; } p > code { diff --git a/app/assets/stylesheets/generic/common.scss b/app/assets/stylesheets/generic/common.scss index 48fad7701ef..91dbe1ec244 100644 --- a/app/assets/stylesheets/generic/common.scss +++ b/app/assets/stylesheets/generic/common.scss @@ -313,7 +313,7 @@ table { } .wiki .highlight, .note-body .highlight { - margin-bottom: 9px; + margin: 12px 0 12px 0; } .wiki .code { diff --git a/app/assets/stylesheets/highlight/white.scss b/app/assets/stylesheets/highlight/white.scss index 5de589109bd..20a144ef952 100644 --- a/app/assets/stylesheets/highlight/white.scss +++ b/app/assets/stylesheets/highlight/white.scss @@ -1,9 +1,10 @@ /* https://github.com/aahan/pygments-github-style */ pre.code.highlight.white, .code.white { - - background-color: #fff; - color: #333; + background-color: #f8fafc; + font-size: 13px; + color: #5b6169; + line-height: 1.6em; .line-numbers, .line-numbers a { -- cgit v1.2.1