From 60f0a58508ce77666fa96c73d76dc0620f23daaf Mon Sep 17 00:00:00 2001 From: Jean-Baptiste Bellet Date: Fri, 18 Nov 2022 09:46:05 +0100 Subject: [PATCH 1/6] Add `admin-v2` on admin body if `admin_style_v2` feature toggled on --- app/views/spree/layouts/admin.html.haml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/views/spree/layouts/admin.html.haml b/app/views/spree/layouts/admin.html.haml index 2895809887..4d04dfd43b 100644 --- a/app/views/spree/layouts/admin.html.haml +++ b/app/views/spree/layouts/admin.html.haml @@ -3,7 +3,7 @@ %head{"data-hook" => "admin_inside_head"} = render :partial => 'spree/admin/shared/head' - %body.admin + %body.admin{ "class": ("admin-v2" if feature?(:admin_style_v2, spree_current_user)) } - if content_for?(:main_ng_app_name) - if content_for?(:main_ng_ctrl_name) %div{ "ng-app" => yield(:main_ng_app_name).strip.html_safe, "ng-controller" => yield(:main_ng_ctrl_name).strip.html_safe } From 61d3f79444a4bfe0534126cf37b5121b96352399 Mon Sep 17 00:00:00 2001 From: Jean-Baptiste Bellet Date: Fri, 18 Nov 2022 09:47:22 +0100 Subject: [PATCH 2/6] Add admin-v2 scss style file --- app/webpacker/css/admin/all.scss | 2 ++ app/webpacker/css/admin/v2/main.scss | 2 ++ app/webpacker/css/admin/v2/variables.scss | 9 +++++++++ 3 files changed, 13 insertions(+) create mode 100644 app/webpacker/css/admin/v2/main.scss create mode 100644 app/webpacker/css/admin/v2/variables.scss diff --git a/app/webpacker/css/admin/all.scss b/app/webpacker/css/admin/all.scss index 2441e920ba..673d934971 100644 --- a/app/webpacker/css/admin/all.scss +++ b/app/webpacker/css/admin/all.scss @@ -120,3 +120,5 @@ @import "components/tom_select"; @import 'app/components/help_modal_component/help_modal_component'; + +@import "v2/main.scss"; diff --git a/app/webpacker/css/admin/v2/main.scss b/app/webpacker/css/admin/v2/main.scss new file mode 100644 index 0000000000..b10eb9bb64 --- /dev/null +++ b/app/webpacker/css/admin/v2/main.scss @@ -0,0 +1,2 @@ +@import "variables.scss"; + diff --git a/app/webpacker/css/admin/v2/variables.scss b/app/webpacker/css/admin/v2/variables.scss new file mode 100644 index 0000000000..1eba6e0a5c --- /dev/null +++ b/app/webpacker/css/admin/v2/variables.scss @@ -0,0 +1,9 @@ +// Should finally replace (or at least complete) the file /admin/globale/variables.scss + +$v2-orange: #F27052; +$v2-orange-light: #F5947D; +$v2-orange-lighter: #F8B7A8; +$v2-orange-lightest: #FCDBD4; + +$v2-dark-grey: #333333; +$v2-medium-dark-grey: #444444; From 9dd81604e93325064a53e5e432ca151cae413044 Mon Sep 17 00:00:00 2001 From: Jean-Baptiste Bellet Date: Fri, 18 Nov 2022 09:48:58 +0100 Subject: [PATCH 3/6] Put navigation menu into span even if no icon next to it --- app/helpers/spree/admin/navigation_helper.rb | 1 + 1 file changed, 1 insertion(+) diff --git a/app/helpers/spree/admin/navigation_helper.rb b/app/helpers/spree/admin/navigation_helper.rb index 56fc759660..9e8bb6e97f 100644 --- a/app/helpers/spree/admin/navigation_helper.rb +++ b/app/helpers/spree/admin/navigation_helper.rb @@ -34,6 +34,7 @@ module Spree link = link_to_with_icon(options[:icon], titleized_label, destination_url) css_classes << 'tab-with-icon' else + titleized_label = raw("#{titleized_label}") link = link_to(titleized_label, destination_url) end From 85d3f5f9d765f93b7d809ed13e9165eea9b37437 Mon Sep 17 00:00:00 2001 From: Jean-Baptiste Bellet Date: Fri, 18 Nov 2022 09:49:29 +0100 Subject: [PATCH 4/6] Download OpenSans font also at 700 weight needed in the navigation --- app/views/spree/admin/shared/_head.html.haml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/views/spree/admin/shared/_head.html.haml b/app/views/spree/admin/shared/_head.html.haml index bd4989ef11..bad186fb78 100644 --- a/app/views/spree/admin/shared/_head.html.haml +++ b/app/views/spree/admin/shared/_head.html.haml @@ -10,7 +10,7 @@ = t(controller.controller_name, :default => controller.controller_name.titleize) = " - OFN #{t(:administration)}" -%link{:href => "https://fonts.googleapis.com/css?family=Open+Sans:400italic,600italic,400,600&subset=latin,cyrillic,greek,vietnamese", :rel => "stylesheet", :type => "text/css"} +%link{:href => "https://fonts.googleapis.com/css?family=Open+Sans:400italic,600italic,400,600,700&subset=latin,cyrillic,greek,vietnamese", :rel => "stylesheet", :type => "text/css"} = stylesheet_pack_tag 'admin-styles', media: "screen, print" = render "layouts/bugsnag_js" From 49e376f9b6d5ad61ca1d3cd214f04186c4fa6601 Mon Sep 17 00:00:00 2001 From: Jean-Baptiste Bellet Date: Fri, 18 Nov 2022 09:53:42 +0100 Subject: [PATCH 5/6] New design of the admin navigation menu! --- app/webpacker/css/admin/v2/main.scss | 3 + app/webpacker/css/admin/v2/navigation.scss | 69 ++++++++++++++++++++++ 2 files changed, 72 insertions(+) create mode 100644 app/webpacker/css/admin/v2/navigation.scss diff --git a/app/webpacker/css/admin/v2/main.scss b/app/webpacker/css/admin/v2/main.scss index b10eb9bb64..16c8b4370e 100644 --- a/app/webpacker/css/admin/v2/main.scss +++ b/app/webpacker/css/admin/v2/main.scss @@ -1,2 +1,5 @@ @import "variables.scss"; +body.admin.admin-v2 { + @import "navigation.scss"; +} diff --git a/app/webpacker/css/admin/v2/navigation.scss b/app/webpacker/css/admin/v2/navigation.scss new file mode 100644 index 0000000000..e2ca6f08c8 --- /dev/null +++ b/app/webpacker/css/admin/v2/navigation.scss @@ -0,0 +1,69 @@ +#header { + #login-nav { + li { + color: $v2-medium-dark-grey; + + &:hover { + a, i { + color: $v2-orange; + } + } + + a { + color: $v2-medium-dark-grey; + } + } + } +} + +#admin-menu { + background-color: $v2-orange; + + li a span.text { + font-weight: 700; + } + + li.tab-with-icon a:before { + display: none; + } + + li a:hover, li.selected a { + background-color: $v2-orange-light; + + span { + text-shadow: 1px 1px 9px $v2-orange; + } + + &:after { + display: none; + } + } +} + + +#sub-menu { + background-color: $v2-orange-light; + + li a { + font-size: 100%; + } + + li a:hover, li.selected a { + text-shadow: 1px 1px 9px $v2-orange; + background-color: $v2-orange-lighter; + + &:after { + display: none; + } + } +} + +.admin__section-header { + background-color: transparent; + border-bottom: none; + + h1.js-admin-page-title { + color: $v2-medium-dark-grey; + } +} + From 09bcc772ff089f911a56bb1038bb42d06b4e3545 Mon Sep 17 00:00:00 2001 From: Jean-Baptiste Bellet Date: Fri, 18 Nov 2022 09:54:07 +0100 Subject: [PATCH 6/6] Remove useless line Co-Authored-By: David Cook --- app/webpacker/css/admin/components/navigation.scss | 1 - 1 file changed, 1 deletion(-) diff --git a/app/webpacker/css/admin/components/navigation.scss b/app/webpacker/css/admin/components/navigation.scss index b8e84287b6..617b05ebe6 100644 --- a/app/webpacker/css/admin/components/navigation.scss +++ b/app/webpacker/css/admin/components/navigation.scss @@ -78,7 +78,6 @@ nav.menu { text-transform: uppercase; position: relative; text-align: center; - font-weight: 600; i { display: inline;