improves styles for admin menu

This commit is contained in:
Alberto Garcia Cabeza
2016-11-30 18:46:35 +01:00
parent 7a7bdb75d8
commit 7056487f3d
11 changed files with 225 additions and 130 deletions

View File

@@ -20,6 +20,11 @@ body.admin {
.top-links { .top-links {
background: darken($admin-color, 15%); background: darken($admin-color, 15%);
} }
.back-web {
padding-top: $line-height/4;
text-decoration: underline;
}
} }
.top-bar { .top-bar {
@@ -150,7 +155,7 @@ body.admin {
border-right: 1px solid $border; border-right: 1px solid $border;
@include breakpoint(medium) { @include breakpoint(medium) {
padding-bottom: $line-height*3; min-height: rem-calc(1100);
} }
ul { ul {
@@ -160,10 +165,12 @@ body.admin {
padding: 0; padding: 0;
[class^="icon-"] { [class^="icon-"] {
color: $admin-color;
display: inline-block; display: inline-block;
font-size: rem-calc(24); font-size: rem-calc(24);
padding-right: rem-calc(12); line-height: $line-height;
padding-top: rem-calc(4); padding: $line-height/2 $line-height/4;
padding-left: 0;
vertical-align: middle; vertical-align: middle;
} }
@@ -172,19 +179,26 @@ body.admin {
margin: 0; margin: 0;
outline: 0; outline: 0;
ul {
margin-left: $line-height/1.5;
border-left: 1px solid $border;
padding-left: $line-height/2;
}
&.section-title {
border-bottom: 1px solid $border;
}
&.active a { &.active a {
background: #f3f6f7; background: #f3f6f7;
border-radius: rem-calc(6);
-moz-border-radius: rem-calc(6);
-webkit-border-radius: rem-calc(6);
color: $admin-color; color: $admin-color;
font-weight: bold; font-weight: bold;
} }
} }
li.section {
border-bottom: 1px dotted #d5d5d5;
border-top: 1px dotted #d5d5d5;
height: $line-height/2;
}
li a { li a {
color: $text; color: $text;
display: block; display: block;
@@ -194,10 +208,38 @@ body.admin {
&:hover { &:hover {
background: #f3f6f7; background: #f3f6f7;
border-radius: rem-calc(6);
-moz-border-radius: rem-calc(6);
-webkit-border-radius: rem-calc(6);
color: $admin-color;
text-decoration: none; text-decoration: none;
} }
} }
} }
.is-accordion-submenu-parent {
& > a::after {
border-color: $admin-color transparent transparent;
}
}
.submenu {
border-bottom: 0;
margin-left: $line-height;
li:first-child {
padding-top: $line-height/2;
}
li:last-child {
padding-bottom: $line-height/2;
}
a {
font-weight: normal;
}
}
} }
// 03. List elements // 03. List elements

View File

@@ -163,6 +163,12 @@
.icon-whatsapp:before { .icon-whatsapp:before {
content: "\50"; content: "\50";
} }
.icon-zip:before {
content: "\4f";
}
.icon-banner:before {
content: "\51";
}
.icon-arrow-down:before { .icon-arrow-down:before {
content: "\52"; content: "\52";
} }
@@ -172,6 +178,12 @@
.icon-arrow-right:before { .icon-arrow-right:before {
content: "\55"; content: "\55";
} }
.icon-check-circle:before {
content: "\56";
}
.icon-arrow-top:before {
content: "\57";
}
.icon-checkmark-circle:before { .icon-checkmark-circle:before {
content: "\59"; content: "\59";
} }

View File

@@ -4,6 +4,30 @@ module AdminHelper
render "/#{namespace}/menu" render "/#{namespace}/menu"
end end
def menu_tags
["tags"].include? controller_name
end
def menu_moderated_content
["proposals", "debates", "comments", "users"].include? controller_name
end
def menu_budget
["spending_proposals"].include? controller_name
end
def menu_polls
["polls", "questions", "officers", "booths"].include? controller_name
end
def menu_profiles
["organizations", "officials", "moderators", "valuators", "managers"].include? controller_name
end
def menu_banners
["banners"].include? controller_name
end
def official_level_options def official_level_options
options = [["",0]] options = [["",0]]
(1..5).each do |i| (1..5).each do |i|

View File

@@ -1,130 +1,122 @@
<nav class="admin-sidebar"> <nav class="admin-sidebar" data-equalizer-watch>
<ul id="admin_menu"> <ul id="admin_menu" data-accordion-menu>
<li class="section-title">
<a href="#">
<span class="icon-proposals"></span>
<strong><%= t("admin.menu.title_categories") %></strong>
</a>
<ul <%= "class=is-active" if menu_tags %>>
<li <%= "class=active" if controller_name == "tags" %>> <li <%= "class=active" if controller_name == "tags" %>>
<%= link_to admin_tags_path do %> <%= link_to t("admin.menu.proposals_topics"), admin_tags_path %>
<span class="icon-tag"></span><%= t("admin.menu.debate_topics") %> </li>
<% end %> </ul>
</li> </li>
<li class="section-title">
<a href="#">
<span class="icon-eye"></span>
<strong><%= t("admin.menu.title_moderated_content") %></strong>
</a>
<ul <%= "class=is-active" if menu_moderated_content %>>
<li <%= "class=active" if controller_name == "proposals" %>> <li <%= "class=active" if controller_name == "proposals" %>>
<%= link_to admin_proposals_path do %> <%= link_to t("admin.menu.hidden_proposals"), admin_proposals_path %>
<span class="icon-proposals"></span><%= t("admin.menu.hidden_proposals") %>
<% end %>
</li> </li>
<% if feature?(:debates) %> <% if feature?(:debates) %>
<li <%= "class=active" if controller_name == "debates" %>> <li <%= "class=active" if controller_name == "debates" %>>
<%= link_to admin_debates_path do %> <%= link_to t("admin.menu.hidden_debates"), admin_debates_path %>
<span class="icon-debates"></span><%= t("admin.menu.hidden_debates") %>
<% end %>
</li> </li>
<% end %> <% end %>
<li <%= "class=active" if controller_name == "comments" %>> <li <%= "class=active" if controller_name == "comments" %>>
<%= link_to admin_comments_path do %> <%= link_to t("admin.menu.hidden_comments"), admin_comments_path %>
<span class="icon-comments"></span><%= t("admin.menu.hidden_comments") %> </li>
<% end %>
<li <%= "class=active" if controller_name == "users" %>>
<%= link_to t("admin.menu.hidden_users"), admin_users_path %>
</li>
</ul>
</li> </li>
<% if feature?(:spending_proposals) %> <% if feature?(:spending_proposals) %>
<li class="section-title">
<a href="#">
<span class="icon-budget"></span>
<strong><%= t("admin.menu.title_budgets") %></strong>
</a>
<ul <%= "class=is-active" if menu_budget %>>
<li <%= "class=active" if controller_name == "spending_proposals" %>> <li <%= "class=active" if controller_name == "spending_proposals" %>>
<%= link_to admin_spending_proposals_path do %> <%= link_to t("admin.menu.spending_proposals"), admin_spending_proposals_path %>
<span class="icon-budget"></span><%= t("admin.menu.spending_proposals") %> </li>
<% end %> </ul>
</li> </li>
<% end %> <% end %>
<% if feature?(:polls) %> <% if feature?(:polls) %>
<li class="section-title">
<a href="#">
<span class="icon-checkmark-circle"></span>
<strong><%= t("admin.menu.title_polls") %></strong>
</a>
<ul <%= "class=is-active" if menu_polls %>>
<li <%= 'class=active' if controller_name == 'polls' %>> <li <%= 'class=active' if controller_name == 'polls' %>>
<%= link_to admin_polls_path do %> <%= link_to t('admin.menu.polls'), admin_polls_path %>
<span class="icon-user"></span><%= t('admin.menu.polls') %>
<% end %>
</li> </li>
<li <%= "class=active" if controller_name == "poll_questions" %>> <li <%= "class=active" if controller_name == "questions" %>>
<%= link_to admin_questions_path do %> <%= link_to t("admin.menu.poll_questions"), admin_questions_path %>
<span class="icon-checkmark-circle"></span><%= t("admin.menu.poll_questions") %>
<% end %>
</li> </li>
<li <%= 'class=active' if controller_name == 'officers' %>> <li <%= 'class=active' if controller_name == 'officers' %>>
<%= link_to admin_officers_path do %> <%= link_to t('admin.menu.poll_officers'), admin_officers_path %>
<span class="icon-user"></span><%= t('admin.menu.poll_officers') %>
<% end %>
</li> </li>
<li <%= 'class=active' if controller_name == 'booths' %>> <li <%= 'class=active' if controller_name == 'booths' %>>
<%= link_to admin_booths_path do %> <%= link_to t('admin.menu.booths'), admin_booths_path %>
<span class="icon-user"></span><%= t('admin.menu.booths') %> </li>
<% end %> </ul>
</li> </li>
<% end %> <% end %>
<li <%= "class=active" if controller_name == "banners" %>> <li class="section-title">
<%= link_to admin_banners_path do %> <a href="#">
<span class="icon-eye"></span><%= t("admin.menu.banner") %> <span class="icon-organizations"></span>
<% end %> <strong><%= t("admin.menu.title_profiles") %></strong>
</li> </a>
<ul <%= "class=is-active" if menu_profiles %>>
<li <%= "class=active" if controller_name == "users" %>>
<%= link_to admin_users_path do %>
<span class="icon-eye"></span><%= t("admin.menu.hidden_users") %>
<% end %>
</li>
<li <%= "class=active" if controller_name == "verifications" %>>
<%= link_to admin_verifications_path do %>
<span class="icon-eye"></span><%= t("admin.menu.incomplete_verifications") %>
<% end %>
</li>
<li <%= "class=active" if controller_name == "organizations" %>> <li <%= "class=active" if controller_name == "organizations" %>>
<%= link_to admin_organizations_path do %> <%= link_to t("admin.menu.organizations"), admin_organizations_path %>
<span class="icon-organizations"></span><%= t("admin.menu.organizations") %>
<% end %>
</li> </li>
<li <%= "class=active" if controller_name == "officials" %>> <li <%= "class=active" if controller_name == "officials" %>>
<%= link_to admin_officials_path do %> <%= link_to t("admin.menu.officials"), admin_officials_path %>
<span class="icon-user"></span><%= t("admin.menu.officials") %>
<% end %>
</li> </li>
<li <%= 'class=active' if controller_name == 'moderators' %>> <li <%= 'class=active' if controller_name == 'moderators' %>>
<%= link_to admin_moderators_path do %> <%= link_to t('admin.menu.moderators'), admin_moderators_path%>
<span class="icon-user"></span><%= t('admin.menu.moderators') %>
<% end %>
</li> </li>
<li <%= 'class=active' if controller_name == 'valuators' %>> <li <%= 'class=active' if controller_name == 'valuators' %>>
<%= link_to admin_valuators_path do %> <%= link_to t('admin.menu.valuators'), admin_valuators_path %>
<span class="icon-user"></span><%= t('admin.menu.valuators') %>
<% end %>
</li> </li>
<li <%= 'class=active' if controller_name == 'managers' %>> <li <%= 'class=active' if controller_name == 'managers' %>>
<%= link_to admin_managers_path do %> <%= link_to t('admin.menu.managers'), admin_managers_path %>
<span class="icon-user"></span><%= t('admin.menu.managers') %> </li>
<% end %> </ul>
</li> </li>
<li <%= 'class=active' if controller_name == 'activity' %>> <li class="section-title">
<%= link_to admin_activity_path do %> <a href="#">
<span class="icon-eye"></span><%= t('admin.menu.activity') %> <span class="icon-banner"></span>
<% end %> <strong><%= t("admin.menu.title_banners") %></strong>
</a>
<ul <%= "class=is-active" if menu_banners %>>
<li <%= "class=active" if controller_name == "banners" %>>
<%= link_to t("admin.menu.banner"), admin_banners_path %>
</li> </li>
</ul>
<li <%= 'class=active' if controller_name == 'settings' %>>
<%= link_to admin_settings_path do %>
<span class="icon-settings"></span><%= t("admin.menu.settings") %>
<% end %>
</li>
<li <%= "class=active" if controller_name == "stats" %>>
<%= link_to admin_stats_path do %>
<span class="icon-stats"></span><%= t("admin.menu.stats") %>
<% end %>
</li> </li>
</ul> </ul>
</nav> </nav>

View File

@@ -1,4 +1,12 @@
<%= link_to t("admin.dashboard.index.back") + " " + setting['org_name'], root_path, class: "button float-right" %> <%= link_to admin_settings_path, class: "button float-right" do %>
<span class="icon-settings"></span>
<%= t("admin.menu.settings") %>
<% end %>
<%= link_to admin_stats_path, class: "button float-right" do %>
<span class="icon-stats"></span>
<%= t("admin.menu.stats") %>
<% end %>
<h2 class="inline-block"><%= t("admin.dashboard.index.title") %></h2> <h2 class="inline-block"><%= t("admin.dashboard.index.title") %></h2>

View File

@@ -1,4 +1,6 @@
<h2><%= t("admin.moderators.index.title") %></h2> <%= link_to t('admin.menu.activity'), admin_activity_path, class: "button hollow float-right" %>
<h2 class="inline-block"><%= t("admin.moderators.index.title") %></h2>
<div class="row"> <div class="row">
<%= form_tag search_admin_moderators_path, method: :get, remote: true do %> <%= form_tag search_admin_moderators_path, method: :get, remote: true do %>

View File

@@ -11,7 +11,8 @@
direct_messages_admin_stats_path, class: "button hollow" %> direct_messages_admin_stats_path, class: "button hollow" %>
<%= link_to t("admin.stats.show.proposal_notifications"), <%= link_to t("admin.stats.show.proposal_notifications"),
proposal_notifications_admin_stats_path, class: "button hollow" %> proposal_notifications_admin_stats_path, class: "button hollow" %>
<%= link_to t("admin.stats.show.incomplete_verifications"),
admin_verifications_path, class: "button hollow" %>
</div> </div>
<div class="clear"></div> <div class="clear"></div>

View File

@@ -2,6 +2,8 @@
<section class="top-links"> <section class="top-links">
<div class="expanded row"> <div class="expanded row">
<%= render 'shared/locale_switcher' %> <%= render 'shared/locale_switcher' %>
<%= link_to t("admin.dashboard.index.back") + " " + setting['org_name'],
root_path, class: "float-right back-web" %>
</div> </div>
</section> </section>

View File

@@ -30,7 +30,7 @@
<div class="off-canvas-content" data-off-canvas-content> <div class="off-canvas-content" data-off-canvas-content>
<%= render 'layouts/admin_header' %> <%= render 'layouts/admin_header' %>
<main class="no-margin-top row no-max-width collapse"> <main class="no-margin-top row no-max-width collapse" data-equalizer>
<div class="small-12 medium-3 column"> <div class="small-12 medium-3 column">
<div class="show-for-small-only"> <div class="show-for-small-only">
@@ -42,7 +42,7 @@
</div> </div>
</div> </div>
<div class="admin-content small-12 medium-9 column"> <div class="admin-content small-12 medium-9 column" data-equalizer-watch>
<%= render 'layouts/flash' %> <%= render 'layouts/flash' %>
<%= yield %> <%= yield %>
</div> </div>

View File

@@ -96,12 +96,11 @@ en:
admin: Admin menu admin: Admin menu
banner: Manage banners banner: Manage banners
poll_questions: Poll questions poll_questions: Poll questions
debate_topics: Debate topics proposals_topics: Proposals topics
hidden_comments: Hidden comments hidden_comments: Hidden comments
hidden_debates: Hidden debates hidden_debates: Hidden debates
hidden_proposals: Hidden proposals hidden_proposals: Hidden proposals
hidden_users: Hidden users hidden_users: Hidden users
incomplete_verifications: Incomplete verifications
managers: Managers managers: Managers
moderators: Moderators moderators: Moderators
valuators: Valuators valuators: Valuators
@@ -112,6 +111,12 @@ en:
settings: Configuration settings settings: Configuration settings
spending_proposals: Spending proposals spending_proposals: Spending proposals
stats: Statistics stats: Statistics
title_categories: Categories
title_moderated_content: Moderated content
title_budgets: Budgets
title_polls: Polls
title_profiles: Profiles
title_banners: Banners
moderators: moderators:
index: index:
title: Moderators title: Moderators
@@ -373,6 +378,7 @@ en:
visits_title: Visits visits_title: Visits
direct_messages: Direct messages direct_messages: Direct messages
proposal_notifications: Proposal notifications proposal_notifications: Proposal notifications
incomplete_verifications: Incomplete verifications
direct_messages: direct_messages:
title: Direct messages title: Direct messages
total: Total total: Total
@@ -385,9 +391,9 @@ en:
create: Create Topic create: Create Topic
destroy: Destroy Topic destroy: Destroy Topic
index: index:
add_tag: Add a new debate topic add_tag: Add a new proposal topic
title: Debate topics title: Proposal topics
mark_as_featured: Propose topic upon creating debate mark_as_featured: Propose topic upon creating proposal
name: name:
placeholder: Type the name of the topic placeholder: Type the name of the topic
update: Update Topic update: Update Topic

View File

@@ -95,13 +95,12 @@ es:
activity: Actividad de moderadores activity: Actividad de moderadores
admin: Menú de administración admin: Menú de administración
banner: Gestionar banners banner: Gestionar banners
debate_topics: Temas de debate proposals_topics: Temas de propuestas
poll_questions: Preguntas ciudadanas poll_questions: Preguntas ciudadanas
hidden_comments: Comentarios ocultos hidden_comments: Comentarios ocultos
hidden_debates: Debates ocultos hidden_debates: Debates ocultos
hidden_proposals: Propuestas ocultas hidden_proposals: Propuestas ocultas
hidden_users: Usuarios bloqueados hidden_users: Usuarios bloqueados
incomplete_verifications: Verificaciones incompletas
managers: Gestores managers: Gestores
moderators: Moderadores moderators: Moderadores
valuators: Evaluadores valuators: Evaluadores
@@ -112,6 +111,12 @@ es:
settings: Configuración global settings: Configuración global
spending_proposals: Propuestas de inversión spending_proposals: Propuestas de inversión
stats: Estadísticas stats: Estadísticas
title_categories: Categorías
title_moderated_content: Contenido moderado
title_budgets: Presupuestos
title_polls: Votaciones
title_profiles: Perfiles
title_banners: Banners
moderators: moderators:
index: index:
title: Moderadores title: Moderadores
@@ -373,6 +378,7 @@ es:
visits_title: Visitas visits_title: Visitas
direct_messages: Mensajes directos direct_messages: Mensajes directos
proposal_notifications: Notificaciones de propuestas proposal_notifications: Notificaciones de propuestas
incomplete_verifications: Verificaciones incompletas
direct_messages: direct_messages:
title: Mensajes directos title: Mensajes directos
total: Total total: Total
@@ -385,9 +391,9 @@ es:
create: Crear Tema create: Crear Tema
destroy: Eliminar Tema destroy: Eliminar Tema
index: index:
add_tag: Añade un nuevo tema de debate add_tag: Añade un nuevo tema de propuesta
title: Temas de debate title: Temas de propuesta
mark_as_featured: Proponer tema al crear debate mark_as_featured: Proponer tema al crear propuesta
name: name:
placeholder: Escribe el nombre del tema placeholder: Escribe el nombre del tema
update: Actualizar Tema update: Actualizar Tema