diff --git a/app/assets/stylesheets/admin.scss b/app/assets/stylesheets/admin.scss index 6ac728e2c..964e1348e 100644 --- a/app/assets/stylesheets/admin.scss +++ b/app/assets/stylesheets/admin.scss @@ -13,33 +13,99 @@ // 01. Global styles // ----------------- -$admin-color: #cf3638; +$admin-color: #245b80; +$sidebar: #245b80; +$sidebar-hover: #25597c; +$sidebar-active: #f4fcd0; .admin { + h2 { + font-weight: 100; + margin-bottom: $line-height; + + &.title { + text-transform: uppercase; + } + } + + .back { + float: none; + } + .header { border: 0; } .top-links { - background: darken($admin-color, 15%); - } - - .back-web { - padding-top: $line-height / 4; - text-decoration: underline; + background: #000; } .top-bar { - background: $admin-color !important; + background: #fff !important; + border-bottom: 1px solid #eee; + box-shadow: 0 2px 2px #eee; + color: #000; height: auto; + + span { + padding-top: $line-height / 2; + } + + [class^="icon-"] { + font-size: $base-font-size; + } } .top-bar-title { h1 { margin-bottom: 0; + margin-top: $line-height / 2; + + @include breakpoint(medium) { + margin-left: $line-height / 2; + } + + small { + color: #000; + text-transform: uppercase; + } } + + a { + color: #000 !important; + line-height: $line-height !important; + + @include breakpoint(medium) { + line-height: $line-height !important; + } + } + } + + .top-bar .menu > li { + + @include breakpoint(medium) { + height: auto !important; + padding-top: $line-height / 2; + } + + a { + color: #000 !important; + } + } + + .menu-icon.dark { + + &::after, + &:hover::after { + background: #000 !important; + box-shadow: 0 7px 0 #000, 0 14px 0 #000 !important; + } + } + + .dropdown.menu > .is-dropdown-submenu-parent > a::after { + border-color: #000 transparent transparent; } .fieldset { @@ -54,7 +120,8 @@ $admin-color: #cf3638; } } - th, td { + th, + td { text-align: left; &.text-center { @@ -110,6 +177,7 @@ $admin-color: #cf3638; .menu.simple .active { border-bottom: 2px solid $admin-color; color: $admin-color; + font-weight: bold; } .tabs-panel { @@ -195,6 +263,8 @@ $admin-color: #cf3638; // ----------- .admin-sidebar { + background: $sidebar; + background: linear-gradient(to bottom, #245b80 0%, #488fb5 100%); border-right: 1px solid $border; @include breakpoint(medium) { @@ -208,7 +278,7 @@ $admin-color: #cf3638; padding: 0; [class^="icon-"] { - color: $admin-color; + color: #fff; display: inline-block; font-size: rem-calc(24); line-height: $line-height; @@ -219,39 +289,32 @@ $admin-color: #cf3638; } li { - background: #fff; margin: 0; outline: 0; ul { margin-left: $line-height / 1.5; - border-left: 1px solid $border; + border-left: 1px solid $sidebar-hover; padding-left: $line-height / 2; } - &.section-title { - border-bottom: 1px solid $border; - } - &.active a { - background: #f3f6f7; - border-radius: rem-calc(6); - color: $admin-color; + background: $sidebar-hover; + border-left: 2px solid $sidebar-active; font-weight: bold; } } li a { - color: $text; + color: #fff; display: block; line-height: rem-calc(48); padding-left: rem-calc(12); vertical-align: top; &:hover { - background: #f3f6f7; - border-radius: rem-calc(6); - color: $admin-color; + background: $sidebar-hover; + color: #fff; text-decoration: none; } } @@ -259,7 +322,13 @@ $admin-color: #cf3638; .is-accordion-submenu-parent { > a::after { - border-color: $admin-color transparent transparent; + border: 0; + content: '\61' !important; + font-family: "icons" !important; + height: auto; + position: absolute !important; + right: 30px; + top: 6px !important; } } diff --git a/app/assets/stylesheets/layout.scss b/app/assets/stylesheets/layout.scss index 9ecf74442..3144d4e79 100644 --- a/app/assets/stylesheets/layout.scss +++ b/app/assets/stylesheets/layout.scss @@ -367,7 +367,11 @@ header { .top-bar-title a { @include logo; - line-height: rem-calc(80) !important; + line-height: rem-calc(80); + + @include breakpoint(medium) { + line-height: rem-calc(80); + } &:hover { text-decoration: none; diff --git a/app/views/admin/dashboard/index.html.erb b/app/views/admin/dashboard/index.html.erb index 2a2ed1c56..ca64da28d 100644 --- a/app/views/admin/dashboard/index.html.erb +++ b/app/views/admin/dashboard/index.html.erb @@ -1,99 +1,9 @@ -<%= link_to admin_settings_path, class: "button float-right" do %> - - <%= t("admin.menu.settings") %> -<% end %> - -<%= link_to admin_stats_path, class: "button float-right" do %> - - <%= t("admin.menu.stats") %> -<% end %> - -

<%= t("admin.dashboard.index.title") %>

- -

Desde aquí puedes administrar el sistema, a través de las siguientes acciones:

- -
- +
+ <%= link_to root_path do %> + <%= t("admin.dashboard.index.back", org: setting['org_name']) %> + <% end %>
+ +

<%= t("admin.dashboard.index.title") %>

+ +

<%= t("admin.dashboard.index.description", org: setting['org_name']) %>

diff --git a/app/views/admin/shared/_admin_shortcuts.html.erb b/app/views/admin/shared/_admin_shortcuts.html.erb new file mode 100644 index 000000000..7ead6d419 --- /dev/null +++ b/app/views/admin/shared/_admin_shortcuts.html.erb @@ -0,0 +1,10 @@ +
  • + <%= link_to admin_stats_path, title: t("admin.menu.stats") do %> + + <% end %> +
    • +
  • + <%= link_to admin_settings_path, title: t("admin.menu.settings") do %> + + <% end %> +
    • diff --git a/app/views/layouts/_admin_header.html.erb b/app/views/layouts/_admin_header.html.erb index bd4f09074..e9ccdd998 100644 --- a/app/views/layouts/_admin_header.html.erb +++ b/app/views/layouts/_admin_header.html.erb @@ -2,34 +2,31 @@
    <%= render 'shared/locale_switcher' %> - <%= link_to t("admin.dashboard.index.back") + " " + setting['org_name'], - root_path, class: "float-right back-web" %>
    - <%= link_to setting['org_name'], namespaced_root_path, class: "logo show-for-small-only" %> - <%= t("application.menu")%> -
    +

    - <%= link_to namespaced_root_path, class: "hide-for-small-only" do %> - <%= image_tag(image_path_for('logo_header.png'), class: 'hide-for-small-only float-left', size: '80x80', alt: t("layouts.header.logo")) %> + <%= link_to namespaced_root_path do %> <%= setting['org_name'] %> -  | <%= namespaced_header_title %> +
    <%= namespaced_header_title %> <% end %>

    +
      + <%= render "admin/shared/admin_shortcuts" %> <%= render "shared/admin_login_items" %> <%= render "devise/menu/login_items" %>
    diff --git a/config/locales/en/admin.yml b/config/locales/en/admin.yml index d9b91b01c..8bbe1a5c8 100644 --- a/config/locales/en/admin.yml +++ b/config/locales/en/admin.yml @@ -214,8 +214,9 @@ en: title: Hidden comments dashboard: index: - back: Go back to + back: Go back to %{org} title: Administration + description: Welcome to the %{org} admin panel. debates: index: filter: Filter diff --git a/config/locales/es/admin.yml b/config/locales/es/admin.yml index 5f8c73341..93d2d6532 100644 --- a/config/locales/es/admin.yml +++ b/config/locales/es/admin.yml @@ -214,8 +214,9 @@ es: title: Comentarios ocultos dashboard: index: - back: Volver a + back: Volver a %{org} title: Administración + description: Bienvenido al panel de administración de %{org}. debates: index: filter: Filtro diff --git a/spec/features/admin/site_customization/images_spec.rb b/spec/features/admin/site_customization/images_spec.rb index 6d180fe8e..fc81bf246 100644 --- a/spec/features/admin/site_customization/images_spec.rb +++ b/spec/features/admin/site_customization/images_spec.rb @@ -20,7 +20,7 @@ feature "Admin custom images" do end expect(page).to have_css("tr.logo_header img[src*='logo_header.png']") - expect(page).to have_css("img[src*='logo_header.png']", count: 2) # one in the admin form an one in the page header + expect(page).to have_css("img[src*='logo_header.png']", count: 1) end scenario "Upload invalid image" do