consul/nairobi
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Styles for header,footer,filters, alerts and pages

Browse Source
This commit is contained in:
Alberto Garcia Cabeza
2015-09-04 15:19:50 +02:00
parent e0959f3e28
commit a75cbefe8d
7 changed files with 143 additions and 66 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
app/assets/stylesheets/debates.scss
View File

@@ -276,7 +276,7 @@
.panel {
border: 0;
border-radius: 0;
margin-bottom: 0;
margin-bottom: rem-calc(2);
min-height: rem-calc(192);
padding: 0 rem-calc(12) rem-calc(2) rem-calc(12);
@@ -418,6 +418,10 @@
margin: 0;
}
.edit-debate {
margin-bottom: 0;
}
.debate-info {
clear: both;
color: $text-medium;

114
app/assets/stylesheets/participacion.scss
View File

@@ -66,6 +66,10 @@
padding: 0;
}
html, body {
height: 100%;
}
body {
background: $body;
font-family: $font-family-sans-serif;
@@ -228,6 +232,22 @@ h6 {
border: 0;
}
.wrapper {
min-height: 100%;
margin: 0 auto rem-calc(-288);
height: auto !important;
height: 100%;
}
.footer, .push {
clear: both;
min-height: rem-calc(288);
}
.footer {
background: $brand;
}
// 04. Header
// - - - - - - - - - - - - - - - - - - - - - - - - -
@@ -460,7 +480,6 @@ header {
&:hover {
background: none;
// color: $link-hover;
color: white;
text-decoration: underline;
transition: text-decoration 275ms;
@@ -499,41 +518,58 @@ header {
}
.subnavigation {
background: rgba(255,255,255,.95);
background: white;
clear: both;
text-transform: lowercase;
@media (min-width: $small-breakpoint) {
text-align: center;
}
a {
color: $link;
display: inline-block;
color: $text;
display: block;
font-size: rem-calc(14);
font-weight: bold;
min-width: rem-calc(192);
position: relative;
text-align: left;
margin-left: rem-calc(12);
@media (min-width: $small-breakpoint) {
display: inline-block;
line-height: $line-height*2;
margin-left: 0;
min-width: rem-calc(192);
text-align: center;
}
&:hover {
color: $text;
text-decoration: underline;
color: $link;
@media (min-width: $small-breakpoint) {
background: rgba(0,119,185,.25);
}
}
&.active {
color: $text;
font-weight: bold;
color: $link;
&:after {
bottom: -16px;
left: 50%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
border-top-color: rgba(255,255,255,.95);
border-width: 8px;
margin-left: -8px;
@media (min-width: $small-breakpoint) {
background: $brand;
color: white;
&:after {
bottom: -16px;
left: 50%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
border-top-color: $brand;
border-width: 8px;
margin-left: -8px;
}
}
}
}
@@ -543,7 +579,6 @@ header {
// - - - - - - - - - - - - - - - - - - - - - - - - -
footer {
background: $brand;
color: white;
padding: rem-calc(24) 0 rem-calc(48) 0;
text-align: justify;
@@ -608,21 +643,20 @@ footer {
.tags {
a {
background: $background;
border: 1px solid $border;
border-radius: 3px;
color: $text-medium;
background: #f2f2f2;
border-radius: rem-calc(30);
color: #4d4d4d;
display: inline-block;
font-size: rem-calc(13);
font-weight: bold;
line-height: rem-calc(22);
margin-bottom: rem-calc(8);
padding: 0 rem-calc(6);
padding: 0 rem-calc(8);
&:hover {
color: $link;
cursor: pointer;
background: #E5F1F8;
border: 1px solid $brand;
}
}
}
@@ -742,6 +776,10 @@ form {
background: $input-bg;
height: rem-calc(48);
margin-bottom: rem-calc(16);
&.error {
margin-bottom: rem-calc(1);
}
}
input[type="checkbox"] + label,
@@ -834,6 +872,22 @@ form {
width: 100%;
}
span.error, small.error {
background: $alert-bg;
color: $alert-color;
}
.error small.error {
background: $alert-bg;
color: $alert-color;
display: inline-block;
margin: 0 rem-calc(6);
}
label.error, label.error a {
color: $alert-color;
}
// 10. User account
// - - - - - - - - - - - - - - - - - - - - - - - - -
@@ -1148,7 +1202,7 @@ table {
.page {
background: white;
min-height: rem-calc(600);
padding-bottom: rem-calc(48);
.menu {
margin-top: rem-calc(24);
@@ -1282,8 +1336,8 @@ table {
}
.verification-step {
font-size: rem-calc(11);
padding-top: rem-calc(10);
font-size: rem-calc(12);
padding-top: rem-calc(6);
@media (min-width: $small-breakpoint) {
line-height: $line-height;

14
app/views/debates/index.html.erb
View File

@@ -1,10 +1,10 @@
<section role="main">
<div class="filters row">
<div class="small-9 column">
<div class="small-12 medium-9 column">
<% if @tag_filter %>
<div class="inline-block small-8" >
<div class="inline-block small-12 medium-8" >
<h2>
<%= t("debates.index.filter_topic",
count: @debates.size,
@@ -14,13 +14,15 @@
<% end %>
<div class="inline-block <%= 'right' if @tag_filter %>">
<h6 class="inline-block">
<% if @tag_filter %>
<%= t("debates.index.select_order") %>
<h6 class="inline-block">
<%= t("debates.index.select_order") %>
</h6>
<% else %>
<%= t("debates.index.select_order_long") %>
<h2 class="inline-block">
<%= t("debates.index.select_order_long") %>
</h2>
<% end %>
</h6>
<form class="inline-block">
<select class="js-location-changer" name="order-selector">
<% @valid_orders.each do |order| %>

8
app/views/layouts/_header.html.erb
View File

@@ -29,10 +29,8 @@
<section class="subnavigation row text-center">
<%#= link_to t("layouts.header.welcome"), root_path %>
<%= link_to t("layouts.header.debates"), debates_path, class: ("active" if current_page?(controller: "/debates")) %>
<%#= link_to t("layouts.header.initiatives"), "#" %>
<%= link_to t("layouts.header.more_information"), "/more_information", class: ("active" if current_page?("/more_information")) %>
<%= link_to t("layouts.header.external_link_blog"), t("layouts.header.external_link_blog_url"), target: "_blank" %>
<%= link_to t("layouts.header.debates"), debates_path, class: ("active" if current_page?(controller: "/debates")) %><%= link_to t("layouts.header.more_information"), "/more_information", class: ("active" if current_page?("/more_information")) %><%= link_to t("layouts.header.external_link_blog"), t("layouts.header.external_link_blog_url"), target: "_blank" %>
</section>
</nav>
</div>
@@ -65,7 +63,7 @@
<%= link_to "Ir al Portal de Transparencia existente anteriormente", t("layouts.header.external_link_transparency_url"), target: "_blank", class: "button radius" %>
<p>Mientras acabamos el nuevo portal, te invitamos a visitar el <a href="http://diario.madrid.es/participa/" target="_blank">blog del Área de Participación Ciudadana, Transparencia y Gobierno Abierto</a> para conocer nuestros avances y novedades; o la <a href="/">sección de Participación Ciudadana</a> donde poder decidir qué ciudad es la que quieres.</p>
<p>Mientras acabamos el nuevo portal, te invitamos a visitar el <a href="http://diario.madrid.es/" target="_blank">blog del Área de Participación Ciudadana, Transparencia y Gobierno Abierto</a> para conocer nuestros avances y novedades; o la <a href="/">sección de Participación Ciudadana</a> donde poder decidir qué ciudad es la que quieres.</p>
</div>
</div>
</div>
@@ -81,7 +79,7 @@
<%= link_to "Ir al Portal de Datos Abiertos existente anteriormente", t("layouts.header.external_link_opendata_url"), target: "_blank", class: "button radius" %>
<p>Mientras acabamos el nuevo portal, te invitamos a visitar el <a href="http://diario.madrid.es/participa/" target="_blank">blog del Área de Participación Ciudadana, Transparencia y Gobierno Abierto</a> para conocer nuestros avances y novedades; o la <a href="/">sección de Participación Ciudadana</a> donde poder decidir qué ciudad es la que quieres.</p>
<p>Mientras acabamos el nuevo portal, te invitamos a visitar el <a href="http://diario.madrid.es/" target="_blank">blog del Área de Participación Ciudadana, Transparencia y Gobierno Abierto</a> para conocer nuestros avances y novedades; o la <a href="/">sección de Participación Ciudadana</a> donde poder decidir qué ciudad es la que quieres.</p>
</div>
</div>
<% end %>

51
app/views/layouts/application.html.erb
View File

@@ -1,30 +1,41 @@
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title><%= content_for?(:title) ? yield(:title) : "Participación" %></title>
<%= stylesheet_link_tag "application" %>
<%= javascript_include_tag "vendor/modernizr" %>
<%= javascript_include_tag "application", 'data-turbolinks-track' => true %>
<%= csrf_meta_tags %>
<%= favicon_link_tag "favicon.ico" %>
<title><%= content_for?(:title) ? yield(:title) : "Participación" %></title>
<%= stylesheet_link_tag "application" %>
<%= javascript_include_tag "vendor/modernizr" %>
<%= javascript_include_tag "application", 'data-turbolinks-track' => true %>
<%= csrf_meta_tags %>
<%= favicon_link_tag "favicon.ico" %>
</head>
<body class="<%= "bg-white" if current_page?(root_path) %>">
<div class="wrapper">
<%= render 'layouts/header' %>
<%= render 'layouts/header' %>
<% if notice %>
<div class="alert-box success alert-layout">
<div class="row">
<%= notice %>
</div>
</div>
<% end %>
<% if notice %>
<p class="alert-box success alert-layout"><%= notice %></p>
<% end %>
<% if alert %>
<div class="alert-box alert alert-layout">
<div class="row">
<%= alert %>
</div>
</div>
<% end %>
<% if alert %>
<p class="alert-box alert alert-layout"><%= alert %></p>
<% end %>
<%= yield %>
<%= render 'layouts/footer' %>
<%= yield %>
<div class="push"></div>
</div>
<div class="footer">
<%= render 'layouts/footer' %>
</div>
</body>
</html>

12
app/views/layouts/devise.html.erb
View File

@@ -15,11 +15,19 @@
<body class="auth-page">
<% if notice %>
<p class="alert-box success alert-layout"><%= notice %></p>
<div class="alert-box success alert-layout">
<div class="row">
<%= notice %>
</div>
</div>
<% end %>
<% if alert %>
<p class="alert-box alert alert-layout"><%= alert %></p>
<div class="alert-box alert alert-layout">
<div class="row">
<%= alert %>
</div>
</div>
<% end %>
<div class="row">

4
app/views/pages/census_terms.html.erb
View File

@@ -1,6 +1,6 @@
<div class="row-full page">
<div class="page row-full">
<div class="row">
<div class="small-12 column">
<div class="text small-12 column">
<%= simple_format t('pages.census_terms') %>
</div>
</div>