From d3059c7d29b14006cf2684e6d5d489aa5f6de8fe Mon Sep 17 00:00:00 2001 From: Dmitriy Zaporozhets Date: Tue, 21 Apr 2015 15:31:32 +0300 Subject: [PATCH 01/14] New colorful design of sidebar Signed-off-by: Dmitriy Zaporozhets --- app/assets/stylesheets/base/mixins.scss | 7 -- .../stylesheets/generic/nav_sidebar.scss | 24 ---- app/assets/stylesheets/pages/header.scss | 28 ++++- app/assets/stylesheets/themes/dark-theme.scss | 105 ++++++++++++------ app/assets/stylesheets/themes/ui_basic.scss | 17 --- app/views/layouts/_head_panel.html.haml | 1 + 6 files changed, 96 insertions(+), 86 deletions(-) diff --git a/app/assets/stylesheets/base/mixins.scss b/app/assets/stylesheets/base/mixins.scss index 216f25cdcd5..feff931156c 100644 --- a/app/assets/stylesheets/base/mixins.scss +++ b/app/assets/stylesheets/base/mixins.scss @@ -50,13 +50,6 @@ @include box-shadow(0 0 0 3px #f1f1f1); } -@mixin header-font { - color: $style_color; - font-size: 16px; - line-height: 44px; - font-weight: normal; -} - @mixin md-typography { font-size: 15px; line-height: 1.5; diff --git a/app/assets/stylesheets/generic/nav_sidebar.scss b/app/assets/stylesheets/generic/nav_sidebar.scss index 3bcb7b81333..36552083851 100644 --- a/app/assets/stylesheets/generic/nav_sidebar.scss +++ b/app/assets/stylesheets/generic/nav_sidebar.scss @@ -6,7 +6,6 @@ top: 0; left: 0; height: 100%; - border-right: 1px solid $border-color; } } @@ -38,28 +37,10 @@ } .nav-sidebar li { - &.active a { - color: $text-color; - background: #FFF !important; - font-weight: bold; - border: 1px solid #EEE; - border-right: 1px solid transparent; - border-left: 3px solid $style_color; - - &.no-highlight { - background: none !important; - border: none; - } - - i { - color: $text-color; - } - } } .nav-sidebar li { &.separate-item { - border-top: 1px solid $border-color; padding-top: 10px; margin-top: 10px; } @@ -75,8 +56,6 @@ &:hover { text-decoration: none; - color: $text-color; - background: $border-color; } &:active, &:focus { @@ -158,9 +137,6 @@ left: 198px; font-size: 13px; background: transparent; - color: black; - border-left: 1px solid $border-color; - border-bottom: 1px solid $border-color; } .collapse-nav a:hover { diff --git a/app/assets/stylesheets/pages/header.scss b/app/assets/stylesheets/pages/header.scss index dde19b801f8..22b6ac8f339 100644 --- a/app/assets/stylesheets/pages/header.scss +++ b/app/assets/stylesheets/pages/header.scss @@ -11,9 +11,23 @@ header { width: 100%; .navbar-inner { + background: #FFF; + border-bottom: 1px solid #DDD; filter: none; + .title { + color: #555; + + a { + color: #555; + &:hover { + text-decoration: underline; + } + } + } + .nav > li > a { + color: #666; font-size: 14px; line-height: 32px; padding: 6px 10px; @@ -100,10 +114,8 @@ header { a { float: left; - padding: 5px 0; height: 46px; - width: 52px; - text-align: center; + width: 100%; img { width: 36px; @@ -124,8 +136,11 @@ header { position: relative; float: left; margin: 0; - margin-left: 5px; - @include header-font; + margin-left: 25px; + font-size: 18px; + line-height: 44px; + font-weight: normal; + @include str-truncated(37%); } @@ -164,9 +179,10 @@ header { padding-left: 25px; font-size: 13px; @include border-radius(3px); - border: 1px solid #c6c6c6; + border: 1px solid #DDD; box-shadow: none; @include transition(all 0.15s ease-in 0s); + background-color: #f5f5f5; } } } diff --git a/app/assets/stylesheets/themes/dark-theme.scss b/app/assets/stylesheets/themes/dark-theme.scss index b7b22a8724e..c3502cb46fc 100644 --- a/app/assets/stylesheets/themes/dark-theme.scss +++ b/app/assets/stylesheets/themes/dark-theme.scss @@ -2,60 +2,101 @@ header { &.navbar-gitlab { .navbar-inner { - background: $color; - .navbar-toggle { color: #FFF; } .app_logo, .navbar-toggle { + a { + color: $color-light; + } + background-color: $color-darker; + &:hover { - background-color: $color-darker; + background-color: $color-dark; + a { + color: #FFF; + } } } .app_logo { - background-color: $color-dark; - } - - .title { - color: #FFF; + @media (max-width: $screen-md-max) { + width: 52px; + h3 { + display: none; + } + } + border-bottom: 1px solid transparent; + margin-bottom: -1px; a { - color: #FFF; - &:hover { - text-decoration: underline; + padding: 5px 8px; + + img { + float: left; + } + + h3 { + width: 158px; + float: left; + margin: 0; + margin-left: 20px; + font-size: 18px; + line-height: 34px; + font-weight: normal; } } } + } + } + } - .search { - .search-input { - background-color: $color-light; - background-color: rgba(255, 255, 255, 0.5); - border: 1px solid $color-light; + .page-with-sidebar { + background: $color-darker; - &:focus { - background-color: white; - } - } + .collapse-nav a { + color: #FFF; + background: $color; + } + + .sidebar-wrapper { + background: $color-darker; + border-right: 1px solid $color-darker; + } + + .nav-sidebar li { + a { + color: $color-light; + + &:hover, &:focus, &:active { + background: $color-dark; } - .search-input::-webkit-input-placeholder { - color: #666; - } - - .nav > li > a { + i { color: $color-light; - - &:hover, &:focus, &:active { - background: none; - color: #FFF; - } } - .search-input { - border-color: $color-light; + .count { + color: $color-light; + background: $color-dark; + } + } + + &.separate-item { + border-top: 1px solid $color; + } + + &.active a { + color: #FFF; + font-weight: bold; + + &.no-highlight { + border: none; + } + + i { + color: #FFF } } } diff --git a/app/assets/stylesheets/themes/ui_basic.scss b/app/assets/stylesheets/themes/ui_basic.scss index 097d5c5b73c..03d98b00d49 100644 --- a/app/assets/stylesheets/themes/ui_basic.scss +++ b/app/assets/stylesheets/themes/ui_basic.scss @@ -7,23 +7,6 @@ header { &.navbar-gitlab { .navbar-inner { - background: #F1F1F1; - border-bottom: 1px solid #DDD; - - .title { - color: #555; - - a { - color: #555; - &:hover { - text-decoration: underline; - } - } - } - - .nav > li > a { - color: $style_color; - } } } } diff --git a/app/views/layouts/_head_panel.html.haml b/app/views/layouts/_head_panel.html.haml index d58582c107a..6851dd64df5 100644 --- a/app/views/layouts/_head_panel.html.haml +++ b/app/views/layouts/_head_panel.html.haml @@ -4,6 +4,7 @@ %div.app_logo = link_to root_path, class: "home has_bottom_tooltip", title: "Dashboard" do = brand_header_logo + %h3 GitLab %h1.title= title %button.navbar-toggle{"data-target" => ".navbar-collapse", "data-toggle" => "collapse", type: "button"} From 6e6df3b830092f093f87e91b7910ee4c50af9f80 Mon Sep 17 00:00:00 2001 From: Dmitriy Zaporozhets Date: Tue, 21 Apr 2015 16:35:11 +0300 Subject: [PATCH 02/14] Refactor themes for new UI Signed-off-by: Dmitriy Zaporozhets --- app/assets/stylesheets/pages/header.scss | 29 +++++++++++++++++ app/assets/stylesheets/pages/profile.scss | 2 +- .../{dark-theme.scss => gitlab-theme.scss} | 31 +------------------ app/assets/stylesheets/themes/ui_basic.scss | 7 +---- app/assets/stylesheets/themes/ui_blue.scss | 2 +- app/assets/stylesheets/themes/ui_color.scss | 2 +- app/assets/stylesheets/themes/ui_gray.scss | 2 +- app/assets/stylesheets/themes/ui_mars.scss | 2 +- app/assets/stylesheets/themes/ui_modern.scss | 2 +- app/views/profiles/design.html.haml | 6 ++-- 10 files changed, 40 insertions(+), 45 deletions(-) rename app/assets/stylesheets/themes/{dark-theme.scss => gitlab-theme.scss} (63%) diff --git a/app/assets/stylesheets/pages/header.scss b/app/assets/stylesheets/pages/header.scss index 22b6ac8f339..e88d35939ed 100644 --- a/app/assets/stylesheets/pages/header.scss +++ b/app/assets/stylesheets/pages/header.scss @@ -26,6 +26,35 @@ header { } } + .app_logo { + @media (max-width: $screen-md-max) { + width: 52px; + h3 { + display: none; + } + } + border-bottom: 1px solid transparent; + margin-bottom: -1px; + + a { + padding: 5px 8px; + + img { + float: left; + } + + h3 { + width: 158px; + float: left; + margin: 0; + margin-left: 20px; + font-size: 18px; + line-height: 34px; + font-weight: normal; + } + } + } + .nav > li > a { color: #666; font-size: 14px; diff --git a/app/assets/stylesheets/pages/profile.scss b/app/assets/stylesheets/pages/profile.scss index 65655d4bfa3..280e8b57174 100644 --- a/app/assets/stylesheets/pages/profile.scss +++ b/app/assets/stylesheets/pages/profile.scss @@ -37,7 +37,7 @@ } &.default { - background: #f1f1f1; + background: #888888; } &.modern { diff --git a/app/assets/stylesheets/themes/dark-theme.scss b/app/assets/stylesheets/themes/gitlab-theme.scss similarity index 63% rename from app/assets/stylesheets/themes/dark-theme.scss rename to app/assets/stylesheets/themes/gitlab-theme.scss index c3502cb46fc..929c4fa9c30 100644 --- a/app/assets/stylesheets/themes/dark-theme.scss +++ b/app/assets/stylesheets/themes/gitlab-theme.scss @@ -1,4 +1,4 @@ -@mixin dark-theme($color-light, $color, $color-darker, $color-dark) { +@mixin gitlab-theme($color-light, $color, $color-darker, $color-dark) { header { &.navbar-gitlab { .navbar-inner { @@ -19,35 +19,6 @@ } } } - - .app_logo { - @media (max-width: $screen-md-max) { - width: 52px; - h3 { - display: none; - } - } - border-bottom: 1px solid transparent; - margin-bottom: -1px; - - a { - padding: 5px 8px; - - img { - float: left; - } - - h3 { - width: 158px; - float: left; - margin: 0; - margin-left: 20px; - font-size: 18px; - line-height: 34px; - font-weight: normal; - } - } - } } } } diff --git a/app/assets/stylesheets/themes/ui_basic.scss b/app/assets/stylesheets/themes/ui_basic.scss index 03d98b00d49..63e8dce1e92 100644 --- a/app/assets/stylesheets/themes/ui_basic.scss +++ b/app/assets/stylesheets/themes/ui_basic.scss @@ -4,10 +4,5 @@ * */ .ui_basic { - header { - &.navbar-gitlab { - .navbar-inner { - } - } - } + @include gitlab-theme(#CCCCCC, #888888, #777777, #666666); } diff --git a/app/assets/stylesheets/themes/ui_blue.scss b/app/assets/stylesheets/themes/ui_blue.scss index e223058be8b..cf995622b6b 100644 --- a/app/assets/stylesheets/themes/ui_blue.scss +++ b/app/assets/stylesheets/themes/ui_blue.scss @@ -2,5 +2,5 @@ * Blue GitLab UI theme */ .ui_blue { - @include dark-theme(#BECDE9, #2980b9, #1970a9, #096099); + @include gitlab-theme(#BECDE9, #2980b9, #1970a9, #096099); } diff --git a/app/assets/stylesheets/themes/ui_color.scss b/app/assets/stylesheets/themes/ui_color.scss index 7ac6903b2e4..6babccec0da 100644 --- a/app/assets/stylesheets/themes/ui_color.scss +++ b/app/assets/stylesheets/themes/ui_color.scss @@ -2,5 +2,5 @@ * Violet GitLab UI theme */ .ui_color { - @include dark-theme(#98C, #548, #436, #325); + @include gitlab-theme(#98C, #548, #436, #325); } diff --git a/app/assets/stylesheets/themes/ui_gray.scss b/app/assets/stylesheets/themes/ui_gray.scss index 9257e5f4d40..f8e4a6ea7da 100644 --- a/app/assets/stylesheets/themes/ui_gray.scss +++ b/app/assets/stylesheets/themes/ui_gray.scss @@ -2,5 +2,5 @@ * Gray GitLab UI theme */ .ui_gray { - @include dark-theme(#979797, #373737, #272727, #222222); + @include gitlab-theme(#979797, #373737, #272727, #222222); } diff --git a/app/assets/stylesheets/themes/ui_mars.scss b/app/assets/stylesheets/themes/ui_mars.scss index 4caf5843d9b..fda96b64cd9 100644 --- a/app/assets/stylesheets/themes/ui_mars.scss +++ b/app/assets/stylesheets/themes/ui_mars.scss @@ -2,5 +2,5 @@ * Classic GitLab UI theme */ .ui_mars { - @include dark-theme(#979DA7, #474D57, #373D47, #24272D); + @include gitlab-theme(#979DA7, #474D57, #373D47, #24272D); } diff --git a/app/assets/stylesheets/themes/ui_modern.scss b/app/assets/stylesheets/themes/ui_modern.scss index 70449882317..8261e80b35f 100644 --- a/app/assets/stylesheets/themes/ui_modern.scss +++ b/app/assets/stylesheets/themes/ui_modern.scss @@ -2,5 +2,5 @@ * Modern GitLab UI theme */ .ui_modern { - @include dark-theme(#ADC, #019875, #018865, #017855); + @include gitlab-theme(#ADC, #019875, #018865, #017855); } diff --git a/app/views/profiles/design.html.haml b/app/views/profiles/design.html.haml index cc00d08d03b..646576c3164 100644 --- a/app/views/profiles/design.html.haml +++ b/app/views/profiles/design.html.haml @@ -12,17 +12,17 @@ = label_tag do .prev.default = f.radio_button :theme_id, 1 - Default + Graphite = label_tag do .prev.classic = f.radio_button :theme_id, 2 - Classic + Charcoal = label_tag do .prev.modern = f.radio_button :theme_id, 3 - Modern + Green = label_tag do .prev.gray From 9f032b9c2ac897151150d77d68dd7cd36c1ad990 Mon Sep 17 00:00:00 2001 From: Dmitriy Zaporozhets Date: Tue, 21 Apr 2015 16:35:45 +0300 Subject: [PATCH 03/14] Move header css from pages to generic Signed-off-by: Dmitriy Zaporozhets --- app/assets/stylesheets/{pages => generic}/header.scss | 0 1 file changed, 0 insertions(+), 0 deletions(-) rename app/assets/stylesheets/{pages => generic}/header.scss (100%) diff --git a/app/assets/stylesheets/pages/header.scss b/app/assets/stylesheets/generic/header.scss similarity index 100% rename from app/assets/stylesheets/pages/header.scss rename to app/assets/stylesheets/generic/header.scss From 1e7c4a25fd08685b04dfb19db4f9b1015aaf904d Mon Sep 17 00:00:00 2001 From: Dmitriy Zaporozhets Date: Tue, 21 Apr 2015 16:49:25 +0300 Subject: [PATCH 04/14] Small css cleanup Signed-off-by: Dmitriy Zaporozhets --- app/assets/stylesheets/generic/header.scss | 26 ++++++++-------------- 1 file changed, 9 insertions(+), 17 deletions(-) diff --git a/app/assets/stylesheets/generic/header.scss b/app/assets/stylesheets/generic/header.scss index e88d35939ed..72870d2ff96 100644 --- a/app/assets/stylesheets/generic/header.scss +++ b/app/assets/stylesheets/generic/header.scss @@ -16,8 +16,17 @@ header { filter: none; .title { + position: relative; + float: left; + margin: 0; + margin-left: 25px; + font-size: 18px; + line-height: 44px; + font-weight: normal; color: #555; + @include str-truncated(37%); + a { color: #555; &:hover { @@ -156,23 +165,6 @@ header { } } - /** - * - * Project / Area name - * - */ - .title { - position: relative; - float: left; - margin: 0; - margin-left: 25px; - font-size: 18px; - line-height: 44px; - font-weight: normal; - - @include str-truncated(37%); - } - .profile-pic { padding: 0px !important; width: 46px; From 4860c4dc07181b97e50558c43b1e35a97677beb8 Mon Sep 17 00:00:00 2001 From: Dmitriy Zaporozhets Date: Wed, 22 Apr 2015 16:48:39 +0300 Subject: [PATCH 05/14] Fix toggle of sidebar Signed-off-by: Dmitriy Zaporozhets --- app/assets/javascripts/sidebar.js.coffee | 1 + app/assets/stylesheets/generic/header.scss | 29 +++++++++++++++---- .../{nav_sidebar.scss => sidebar.scss} | 0 app/helpers/application_helper.rb | 8 ----- app/helpers/nav_helper.rb | 16 ++++++++++ app/views/layouts/_head_panel.html.haml | 2 +- .../layouts/_public_head_panel.html.haml | 3 +- 7 files changed, 43 insertions(+), 16 deletions(-) rename app/assets/stylesheets/generic/{nav_sidebar.scss => sidebar.scss} (100%) diff --git a/app/assets/javascripts/sidebar.js.coffee b/app/assets/javascripts/sidebar.js.coffee index 2e3f5608257..fb08016fbae 100644 --- a/app/assets/javascripts/sidebar.js.coffee +++ b/app/assets/javascripts/sidebar.js.coffee @@ -4,6 +4,7 @@ $(document).on("click", '.toggle-nav-collapse', (e) -> expanded = 'page-sidebar-expanded' $('.page-with-sidebar').toggleClass("#{collapsed} #{expanded}") + $('header').toggleClass("header-collapsed header-expanded") $('.toggle-nav-collapse i').toggleClass("fa-angle-right fa-angle-left") $.cookie("collapsed_nav", $('.page-with-sidebar').hasClass(collapsed), { path: '/' }) ) diff --git a/app/assets/stylesheets/generic/header.scss b/app/assets/stylesheets/generic/header.scss index 72870d2ff96..a86c01d4ce5 100644 --- a/app/assets/stylesheets/generic/header.scss +++ b/app/assets/stylesheets/generic/header.scss @@ -36,12 +36,6 @@ header { } .app_logo { - @media (max-width: $screen-md-max) { - width: 52px; - h3 { - display: none; - } - } border-bottom: 1px solid transparent; margin-bottom: -1px; @@ -229,3 +223,26 @@ header { right: 35px !important; } } + +@media (max-width: $screen-md-max) { + .header-collapsed, .header-expanded { + width: 52px; + + h3 { + display: none; + } + } +} + +@media(min-width: $screen-md-max) { + .header-collapsed { + width: 52px; + + h3 { + display: none; + } + } + + .header-expanded { + } +} diff --git a/app/assets/stylesheets/generic/nav_sidebar.scss b/app/assets/stylesheets/generic/sidebar.scss similarity index 100% rename from app/assets/stylesheets/generic/nav_sidebar.scss rename to app/assets/stylesheets/generic/sidebar.scss diff --git a/app/helpers/application_helper.rb b/app/helpers/application_helper.rb index 20457572a08..5c77af729d0 100644 --- a/app/helpers/application_helper.rb +++ b/app/helpers/application_helper.rb @@ -314,12 +314,4 @@ module ApplicationHelper profile_key_path(key) end end - - def nav_sidebar_class - if nav_menu_collapsed? - "page-sidebar-collapsed" - else - "page-sidebar-expanded" - end - end end diff --git a/app/helpers/nav_helper.rb b/app/helpers/nav_helper.rb index 2b03269800e..9b1dd8b8e54 100644 --- a/app/helpers/nav_helper.rb +++ b/app/helpers/nav_helper.rb @@ -2,4 +2,20 @@ module NavHelper def nav_menu_collapsed? cookies[:collapsed_nav] == 'true' end + + def nav_sidebar_class + if nav_menu_collapsed? + "page-sidebar-collapsed" + else + "page-sidebar-expanded" + end + end + + def nav_header_class + if nav_menu_collapsed? + "header-collapsed" + else + "header-expanded" + end + end end diff --git a/app/views/layouts/_head_panel.html.haml b/app/views/layouts/_head_panel.html.haml index 6851dd64df5..281ce31fe9c 100644 --- a/app/views/layouts/_head_panel.html.haml +++ b/app/views/layouts/_head_panel.html.haml @@ -1,4 +1,4 @@ -%header.navbar.navbar-fixed-top.navbar-gitlab +%header.navbar.navbar-fixed-top.navbar-gitlab{ class: nav_header_class } .navbar-inner .container %div.app_logo diff --git a/app/views/layouts/_public_head_panel.html.haml b/app/views/layouts/_public_head_panel.html.haml index 3d6d2bfc00a..98a87a39bd4 100644 --- a/app/views/layouts/_public_head_panel.html.haml +++ b/app/views/layouts/_public_head_panel.html.haml @@ -1,9 +1,10 @@ -%header.navbar.navbar-fixed-top.navbar-gitlab +%header.navbar.navbar-fixed-top.navbar-gitlab{ class: nav_header_class } .navbar-inner .container %div.app_logo = link_to explore_root_path, class: "home" do = brand_header_logo + %h3 GitLab %h1.title= title %button.navbar-toggle{"data-target" => ".navbar-collapse", "data-toggle" => "collapse", type: "button"} From 5647ce75b39f8660b16d3ef0ede5ba5804002005 Mon Sep 17 00:00:00 2001 From: Dmitriy Zaporozhets Date: Wed, 22 Apr 2015 16:54:39 +0300 Subject: [PATCH 06/14] No need in empty head panel on login page Signed-off-by: Dmitriy Zaporozhets --- app/views/layouts/devise.html.haml | 1 - 1 file changed, 1 deletion(-) diff --git a/app/views/layouts/devise.html.haml b/app/views/layouts/devise.html.haml index 6f805f1c9d1..c224c6f7f76 100644 --- a/app/views/layouts/devise.html.haml +++ b/app/views/layouts/devise.html.haml @@ -3,7 +3,6 @@ = render "layouts/head" %body.ui_mars.login-page.application = render "layouts/broadcast" - = render "layouts/public_head_panel", title: '' .container.navless-container .content = render "layouts/flash" From c41a5bf3cda51cceb0c52fca44a100294fb75858 Mon Sep 17 00:00:00 2001 From: Dmitriy Zaporozhets Date: Wed, 22 Apr 2015 17:28:44 +0300 Subject: [PATCH 07/14] Restyle explore page to sidebar layout Signed-off-by: Dmitriy Zaporozhets --- app/views/explore/projects/trending.html.haml | 8 ++++++- app/views/layouts/explore.html.haml | 22 ++----------------- app/views/layouts/nav/_explore.html.haml | 18 +++++++++++++++ 3 files changed, 27 insertions(+), 21 deletions(-) create mode 100644 app/views/layouts/nav/_explore.html.haml diff --git a/app/views/explore/projects/trending.html.haml b/app/views/explore/projects/trending.html.haml index 9cad9238933..18749ac00ae 100644 --- a/app/views/explore/projects/trending.html.haml +++ b/app/views/explore/projects/trending.html.haml @@ -1,3 +1,9 @@ +.explore-title + %h3 + Explore GitLab + %p.lead + Discover projects and groups. Share your projects with others +%hr .explore-trending-block %p.lead %i.fa.fa-comments-o @@ -7,5 +13,5 @@ %ul.bordered-list = render @trending_projects - .center + .center.append-bottom-20 = link_to 'Show all projects', explore_projects_path, class: 'btn btn-primary' diff --git a/app/views/layouts/explore.html.haml b/app/views/layouts/explore.html.haml index 2bd0b8d85c9..ca79382324e 100644 --- a/app/views/layouts/explore.html.haml +++ b/app/views/layouts/explore.html.haml @@ -1,4 +1,4 @@ -- page_title = 'Explore' +- page_title = 'Explore GitLab' !!! 5 %html{ lang: "en"} = render "layouts/head", title: page_title @@ -8,23 +8,5 @@ = render "layouts/head_panel", title: link_to(page_title, explore_root_path) - else = render "layouts/public_head_panel", title: link_to(page_title, explore_root_path) - .container.navless-container - .content - .explore-title - %h3 - Explore GitLab - %p.lead - Discover projects and groups. Share your projects with others - - %ul.nav.nav-tabs - = nav_link(path: 'projects#trending') do - = link_to 'Trending Projects', explore_root_path - = nav_link(path: 'projects#starred') do - = link_to 'Most Starred Projects', starred_explore_projects_path - = nav_link(path: 'projects#index') do - = link_to 'All Projects', explore_projects_path - = nav_link(controller: :groups) do - = link_to 'All Groups', explore_groups_path - - = yield + = render 'layouts/page', sidebar: 'layouts/nav/explore' diff --git a/app/views/layouts/nav/_explore.html.haml b/app/views/layouts/nav/_explore.html.haml new file mode 100644 index 00000000000..7ab370dbcd0 --- /dev/null +++ b/app/views/layouts/nav/_explore.html.haml @@ -0,0 +1,18 @@ +%ul.nav.nav-sidebar + = nav_link(path: 'projects#trending') do + = link_to explore_root_path do + %i.fa.fa-comments + %span Trending Projects + = nav_link(path: 'projects#starred') do + = link_to starred_explore_projects_path do + %i.fa.fa-star + %span Most Starred Projects + = nav_link(path: 'projects#index') do + = link_to explore_projects_path do + %i.fa.fa-bookmark + %span All Projects + = nav_link(controller: :groups) do + = link_to explore_groups_path do + %i.fa.fa-group + %span All Groups + From 27919e25e8059c644a79ef8b1f5f04d213999295 Mon Sep 17 00:00:00 2001 From: Dmitriy Zaporozhets Date: Wed, 22 Apr 2015 18:02:29 +0300 Subject: [PATCH 08/14] Add gitlab logo on login page Signed-off-by: Dmitriy Zaporozhets --- app/views/layouts/devise.html.haml | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/app/views/layouts/devise.html.haml b/app/views/layouts/devise.html.haml index c224c6f7f76..183c5a1e20a 100644 --- a/app/views/layouts/devise.html.haml +++ b/app/views/layouts/devise.html.haml @@ -2,6 +2,11 @@ %html{ lang: "en"} = render "layouts/head" %body.ui_mars.login-page.application + %header.navbar.navbar-fixed-top.navbar-gitlab + .navbar-inner + .container + %h4.center + = image_tag 'logo-white.png', width: 32, height: 32 = render "layouts/broadcast" .container.navless-container .content From 4a63573b21dedaebaf0722b819926c5a468bcc5d Mon Sep 17 00:00:00 2001 From: Dmitriy Zaporozhets Date: Thu, 2 Apr 2015 18:22:54 -0700 Subject: [PATCH 09/14] Start applying new layout to snippets pages --- app/controllers/snippets_controller.rb | 34 ++++++------- app/views/layouts/nav/_snippets.html.haml | 11 +++++ app/views/layouts/snippets.html.haml | 6 +++ .../snippets/current_user_index.html.haml | 49 +++++++++---------- app/views/snippets/index.html.haml | 1 - config/routes.rb | 3 +- 6 files changed, 57 insertions(+), 47 deletions(-) create mode 100644 app/views/layouts/nav/_snippets.html.haml create mode 100644 app/views/layouts/snippets.html.haml diff --git a/app/controllers/snippets_controller.rb b/app/controllers/snippets_controller.rb index cd52556b203..6c84dbbb998 100644 --- a/app/controllers/snippets_controller.rb +++ b/app/controllers/snippets_controller.rb @@ -1,10 +1,6 @@ class SnippetsController < ApplicationController before_filter :snippet, only: [:show, :edit, :destroy, :update, :raw] - - # Allow modify snippet before_filter :authorize_modify_snippet!, only: [:edit, :update] - - # Allow destroy snippet before_filter :authorize_admin_snippet!, only: [:destroy] before_filter :set_title @@ -16,24 +12,24 @@ class SnippetsController < ApplicationController layout :determine_layout def index - @snippets = SnippetsFinder.new.execute(current_user, filter: :all).page(params[:page]).per(PER_PAGE) - end + if params[:username].present? + @user = User.find_by(username: params[:username]) - def user_index - @user = User.find_by(username: params[:username]) + render_404 and return unless @user - render_404 and return unless @user + @snippets = SnippetsFinder.new.execute(current_user, { + filter: :by_user, + user: @user, + scope: params[:scope] }). + page(params[:page]).per(PER_PAGE) - @snippets = SnippetsFinder.new.execute(current_user, { - filter: :by_user, - user: @user, - scope: params[:scope] }). - page(params[:page]).per(PER_PAGE) - - if @user == current_user - render 'current_user_index' + if @user == current_user + render 'current_user_index' + else + render 'user_index' + end else - render 'user_index' + @snippets = SnippetsFinder.new.execute(current_user, filter: :all).page(params[:page]).per(PER_PAGE) end end @@ -108,6 +104,6 @@ class SnippetsController < ApplicationController end def determine_layout - current_user ? 'navless' : 'public_users' + current_user ? 'snippets' : 'public_users' end end diff --git a/app/views/layouts/nav/_snippets.html.haml b/app/views/layouts/nav/_snippets.html.haml new file mode 100644 index 00000000000..1c5d376a76d --- /dev/null +++ b/app/views/layouts/nav/_snippets.html.haml @@ -0,0 +1,11 @@ +%ul.nav.nav-sidebar + = nav_link(path: user_snippets_path(current_user), html_options: {class: 'home'}) do + = link_to user_snippets_path(current_user) do + %i.fa.fa-dashboard + %span + My Snippets + = nav_link(path: snippets_path) do + = link_to snippets_path, title: 'Discover snippets' do + %i.fa.fa-globe + %span + Discover Snippets diff --git a/app/views/layouts/snippets.html.haml b/app/views/layouts/snippets.html.haml new file mode 100644 index 00000000000..fbd29eb23a7 --- /dev/null +++ b/app/views/layouts/snippets.html.haml @@ -0,0 +1,6 @@ +!!! 5 +%html{ lang: "en"} + = render "layouts/head", title: "Dashboard" + %body{class: "#{app_theme} application", :'data-page' => body_data_page } + = render "layouts/head_panel", title: link_to("Snippets", snippets_path) + = render 'layouts/page', sidebar: 'layouts/nav/snippets' diff --git a/app/views/snippets/current_user_index.html.haml b/app/views/snippets/current_user_index.html.haml index 0df5ade500d..4a273557953 100644 --- a/app/views/snippets/current_user_index.html.haml +++ b/app/views/snippets/current_user_index.html.haml @@ -8,32 +8,29 @@ %p.light Share code pastes with others out of git repository -%hr -.row - .col-md-3 - %ul.nav.nav-pills.nav-stacked - = nav_tab :scope, nil do - = link_to user_snippets_path(@user) do - All - %span.pull-right - = @user.snippets.count - = nav_tab :scope, 'are_private' do - = link_to user_snippets_path(@user, scope: 'are_private') do - Private - %span.pull-right - = @user.snippets.are_private.count - = nav_tab :scope, 'are_internal' do - = link_to user_snippets_path(@user, scope: 'are_internal') do - Internal - %span.pull-right - = @user.snippets.are_internal.count - = nav_tab :scope, 'are_public' do - = link_to user_snippets_path(@user, scope: 'are_public') do - Public - %span.pull-right - = @user.snippets.are_public.count +%ul.nav.nav-tabs + = nav_tab :scope, nil do + = link_to user_snippets_path(@user) do + All + %span.badge + = @user.snippets.count + = nav_tab :scope, 'are_private' do + = link_to user_snippets_path(@user, scope: 'are_private') do + Private + %span.badge + = @user.snippets.are_private.count + = nav_tab :scope, 'are_internal' do + = link_to user_snippets_path(@user, scope: 'are_internal') do + Internal + %span.badge + = @user.snippets.are_internal.count + = nav_tab :scope, 'are_public' do + = link_to user_snippets_path(@user, scope: 'are_public') do + Public + %span.badge + = @user.snippets.are_public.count - .col-md-9.my-snippets - = render 'snippets' +.my-snippets + = render 'snippets' diff --git a/app/views/snippets/index.html.haml b/app/views/snippets/index.html.haml index 5cd8ae26cf9..108dd0cca3e 100644 --- a/app/views/snippets/index.html.haml +++ b/app/views/snippets/index.html.haml @@ -2,7 +2,6 @@ Public snippets .pull-right - - if current_user = link_to new_snippet_path, class: "btn btn-new btn-grouped", title: "New Snippet" do Add new snippet diff --git a/config/routes.rb b/config/routes.rb index 744a99feded..f95507017cb 100644 --- a/config/routes.rb +++ b/config/routes.rb @@ -51,7 +51,8 @@ Gitlab::Application.routes.draw do get 'raw' end end - get '/s/:username' => 'snippets#user_index', as: :user_snippets, constraints: { username: /.*/ } + + get '/s/:username' => 'snippets#index', as: :user_snippets, constraints: { username: /.*/ } # # Invites From 0261a5e222be1e7785a5af4390d457e19e6fef64 Mon Sep 17 00:00:00 2001 From: Dmitriy Zaporozhets Date: Thu, 2 Apr 2015 18:29:06 -0700 Subject: [PATCH 10/14] Fix wording and remove duplicate link --- app/views/layouts/nav/_snippets.html.haml | 4 ++-- app/views/snippets/current_user_index.html.haml | 2 -- 2 files changed, 2 insertions(+), 4 deletions(-) diff --git a/app/views/layouts/nav/_snippets.html.haml b/app/views/layouts/nav/_snippets.html.haml index 1c5d376a76d..e71967bc725 100644 --- a/app/views/layouts/nav/_snippets.html.haml +++ b/app/views/layouts/nav/_snippets.html.haml @@ -1,9 +1,9 @@ %ul.nav.nav-sidebar = nav_link(path: user_snippets_path(current_user), html_options: {class: 'home'}) do - = link_to user_snippets_path(current_user) do + = link_to user_snippets_path(current_user), title: 'Your snippets' do %i.fa.fa-dashboard %span - My Snippets + Your Snippets = nav_link(path: snippets_path) do = link_to snippets_path, title: 'Discover snippets' do %i.fa.fa-globe diff --git a/app/views/snippets/current_user_index.html.haml b/app/views/snippets/current_user_index.html.haml index 4a273557953..6bb2237a759 100644 --- a/app/views/snippets/current_user_index.html.haml +++ b/app/views/snippets/current_user_index.html.haml @@ -3,8 +3,6 @@ .pull-right = link_to new_snippet_path, class: "btn btn-new btn-grouped", title: "New Snippet" do Add new snippet - = link_to snippets_path, class: "btn btn-grouped" do - Discover snippets %p.light Share code pastes with others out of git repository From 47d26b05a4bf4f9d0bc118997d0aed78384c8f60 Mon Sep 17 00:00:00 2001 From: Dmitriy Zaporozhets Date: Wed, 22 Apr 2015 18:25:09 +0300 Subject: [PATCH 11/14] Fix snippets tests Signed-off-by: Dmitriy Zaporozhets --- features/steps/snippets/user.rb | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/features/steps/snippets/user.rb b/features/steps/snippets/user.rb index 866f637ab6c..146cc535d88 100644 --- a/features/steps/snippets/user.rb +++ b/features/steps/snippets/user.rb @@ -32,19 +32,19 @@ class Spinach::Features::SnippetsUser < Spinach::FeatureSteps end step 'I click "Internal" filter' do - within('.nav-stacked') do + within('.nav-tabs') do click_link "Internal" end end step 'I click "Private" filter' do - within('.nav-stacked') do + within('.nav-tabs') do click_link "Private" end end step 'I click "Public" filter' do - within('.nav-stacked') do + within('.nav-tabs') do click_link "Public" end end From 28639a1971980fcec2874357334f5789bada9b11 Mon Sep 17 00:00:00 2001 From: Dmitriy Zaporozhets Date: Wed, 22 Apr 2015 20:10:38 +0300 Subject: [PATCH 12/14] For navless pages render dashboard nav Signed-off-by: Dmitriy Zaporozhets --- app/views/layouts/_empty_head_panel.html.haml | 5 ++++ app/views/layouts/_page.html.haml | 30 +++++++++---------- app/views/layouts/devise.html.haml | 6 +--- app/views/layouts/navless.html.haml | 5 +--- 4 files changed, 21 insertions(+), 25 deletions(-) create mode 100644 app/views/layouts/_empty_head_panel.html.haml diff --git a/app/views/layouts/_empty_head_panel.html.haml b/app/views/layouts/_empty_head_panel.html.haml new file mode 100644 index 00000000000..b81c2d0364b --- /dev/null +++ b/app/views/layouts/_empty_head_panel.html.haml @@ -0,0 +1,5 @@ +%header.navbar.navbar-fixed-top.navbar-gitlab + .navbar-inner + .container + %h4.center + = image_tag 'logo-white.png', width: 32, height: 32 diff --git a/app/views/layouts/_page.html.haml b/app/views/layouts/_page.html.haml index 422966cdc55..19da8771c54 100644 --- a/app/views/layouts/_page.html.haml +++ b/app/views/layouts/_page.html.haml @@ -1,20 +1,18 @@ -- if defined?(sidebar) - .page-with-sidebar{ class: nav_sidebar_class } - = render "layouts/broadcast" - .sidebar-wrapper +.page-with-sidebar{ class: nav_sidebar_class } + = render "layouts/broadcast" + .sidebar-wrapper + - if defined?(sidebar) = render(sidebar) - .collapse-nav - = render partial: 'layouts/collapse_button' - .content-wrapper - .container-fluid - .content - = render "layouts/flash" - .clearfix - = yield -- else - .container.navless-container - .content - = yield + - else + = render 'layouts/nav/dashboard' + .collapse-nav + = render partial: 'layouts/collapse_button' + .content-wrapper + .container-fluid + .content + = render "layouts/flash" + .clearfix + = yield = yield :embedded_scripts diff --git a/app/views/layouts/devise.html.haml b/app/views/layouts/devise.html.haml index 183c5a1e20a..5a59c9fd59a 100644 --- a/app/views/layouts/devise.html.haml +++ b/app/views/layouts/devise.html.haml @@ -2,11 +2,7 @@ %html{ lang: "en"} = render "layouts/head" %body.ui_mars.login-page.application - %header.navbar.navbar-fixed-top.navbar-gitlab - .navbar-inner - .container - %h4.center - = image_tag 'logo-white.png', width: 32, height: 32 + = render "layouts/empty_head_panel" = render "layouts/broadcast" .container.navless-container .content diff --git a/app/views/layouts/navless.html.haml b/app/views/layouts/navless.html.haml index 4d0278251a6..10a0fcea2f8 100644 --- a/app/views/layouts/navless.html.haml +++ b/app/views/layouts/navless.html.haml @@ -4,7 +4,4 @@ %body{class: "#{app_theme} application", :'data-page' => body_data_page} = render "layouts/broadcast" = render "layouts/head_panel", title: defined?(@title_url) ? link_to(@title, @title_url) : @title - .container.navless-container - .content - = render "layouts/flash" - = yield + = render 'layouts/page' From 5f3b2be8a06708922c1bba0f83eb24264982bebf Mon Sep 17 00:00:00 2001 From: Dmitriy Zaporozhets Date: Wed, 22 Apr 2015 20:12:52 +0300 Subject: [PATCH 13/14] Fix snippet test Signed-off-by: Dmitriy Zaporozhets --- spec/routing/routing_spec.rb | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/spec/routing/routing_spec.rb b/spec/routing/routing_spec.rb index e219a57c29e..953c8dd8ddc 100644 --- a/spec/routing/routing_spec.rb +++ b/spec/routing/routing_spec.rb @@ -28,7 +28,7 @@ end # DELETE /snippets/:id(.:format) snippets#destroy describe SnippetsController, "routing" do it "to #user_index" do - expect(get("/s/User")).to route_to('snippets#user_index', username: 'User') + expect(get("/s/User")).to route_to('snippets#index', username: 'User') end it "to #raw" do From 63c5911961909b12b328b4182ba0f4b0e13c1bd6 Mon Sep 17 00:00:00 2001 From: Dmitriy Zaporozhets Date: Thu, 23 Apr 2015 11:51:17 +0300 Subject: [PATCH 14/14] Dont render dashbaord nav if user is not signed in Signed-off-by: Dmitriy Zaporozhets --- app/views/layouts/_page.html.haml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/views/layouts/_page.html.haml b/app/views/layouts/_page.html.haml index 19da8771c54..1c164800b0e 100644 --- a/app/views/layouts/_page.html.haml +++ b/app/views/layouts/_page.html.haml @@ -3,7 +3,7 @@ .sidebar-wrapper - if defined?(sidebar) = render(sidebar) - - else + - elsif current_user = render 'layouts/nav/dashboard' .collapse-nav = render partial: 'layouts/collapse_button'