Merge pull request #1120 from consul/refactor-scss

Refactor scss
This commit is contained in:
Juanjo Bazán
2016-05-19 18:48:11 +02:00
9 changed files with 181 additions and 400 deletions

View File

@@ -59,11 +59,11 @@ $foundation-palette: (
$light-gray: #e6e6e6;
$medium-gray: #cacaca;
$dark-gray: #8a8a8a;
$black: #0a0a0a;
$white: #fefefe;
$black: #222222;
$white: #ffffff;
$body-background: $white;
$body-font-color: $black;
$body-font-family: 'Helvetica Neue', Helvetica, Roboto, Arial, sans-serif;
$body-font-family: 'Source Sans Pro', 'Helvetica', 'Arial', sans-serif !important;
$body-antialiased: true;
$global-margin: 1rem;
$global-padding: 1rem;
@@ -83,8 +83,6 @@ $breakpoints: (
small: 0,
medium: 640px,
large: 1024px,
xlarge: 1200px,
xxlarge: 1440px,
);
$breakpoint-classes: (small medium large);
@@ -109,20 +107,20 @@ $header-font-style: normal;
$font-family-monospace: Consolas, 'Liberation Mono', Courier, monospace;
$header-sizes: (
small: (
'h1': 24,
'h2': 20,
'h3': 19,
'h1': 34,
'h2': 24,
'h3': 20,
'h4': 18,
'h5': 17,
'h6': 16,
'h5': 16,
'h6': 14,
),
medium: (
'h1': 48,
'h2': 40,
'h3': 31,
'h4': 25,
'h5': 20,
'h6': 16,
'h1': 44,
'h2': 34,
'h3': 24,
'h4': 19,
'h5': 16,
'h6': 13,
),
);
$header-color: inherit;
@@ -569,40 +567,11 @@ $topbar-unstack-breakpoint: medium;
// 37. Custom variables
// --------------------
$font-logo: 'Lato' !important;
$font-sans: 'Source Sans Pro', 'Helvetica', 'Arial', sans-serif !important;
$font-normal: 400;
$font-bold: 700;
$base-font-size: rem-calc(17);
$base-line-height: rem-calc(26);
$h1-font-size: rem-calc(44);
$h1-line-height: rem-calc(57);
$h2-font-size: rem-calc(34);
$h2-line-height: rem-calc(44);
$h3-font-size: rem-calc(24);
$h3-line-height: rem-calc(31);
$h4-font-size: rem-calc(19);
$h4-line-height: rem-calc(25);
$h5-font-size: rem-calc(16);
$h5-line-height: rem-calc(21);
$h6-font-size: rem-calc(13);
$h6-line-height: rem-calc(17);
$small-font-size: rem-calc(14);
$tiny-font-size: rem-calc(10);
$line-height: rem-calc(24);
// 02. Colors
// - - - - - - - - - - - - - - - - - - - - - - - - -
$brand: #004A83;
$body: #E9E9E9;
$background: #EDEFF0;
@@ -642,14 +611,6 @@ $footer-color: #171819;
$footer-link: #454A4C;
$footer-border: #BFC1C3;
// 03. Forms
// - - - - - - - - - - - - - - - - - - - - - - - - -
$input-bg: #F8F8F8;
// 04. Alerts
// - - - - - - - - - - - - - - - - - - - - - - - - -
$success-bg: #DFF0D8;
$success-border: #D6E9C6;
$color-success: #3C763D;
@@ -665,30 +626,3 @@ $color-warning: #8A6D3B;
$alert-bg: #F2DEDE;
$alert-border: #EBCCD1;
$color-alert: #A94442;
// 05. Levels
// - - - - - - - - - - - - - - - - - - - - - - - - -
$level-1: #1ABC9C;
$level-2: #43AC6A;
$level-3: #43AC6A;
$level-4: #43AC6A;
$level-5: #F08A24;
$author: #008CCF;
$association: #C0392B;
$deleted: #E7E7E7;
$comment-author: rgba(45,144,248,.15);
$comment-level-5: rgba(255,241,204,1);
$comment-admin: rgba(45,144,248,.15);
$comment-official: rgba(70,219,145,.3);
// 06. Responsive
// - - - - - - - - - - - - - - - - - - - - - - - - -
$small: rem-calc(480);
$small-breakpoint: rem-calc(640);
$medium-breakpoint: rem-calc(1024);
$large-breakpoint: rem-calc(1440);
$xlarge-breakpoint: rem-calc(1920);

View File

@@ -24,7 +24,7 @@
border-radius: 0;
bottom: $line-height;
box-shadow: 0 0 5px rgba(0,0,0,0.05);
font-family: $font-sans;
font-family: $body-font-family;
font-size: $base-font-size;
line-height: $line-height;
min-width: $line-height*13;
@@ -57,7 +57,7 @@
border: none;
box-shadow: none;
color: $link;
font-family: $font-sans;
font-family: $body-font-family;
font-size: $base-font-size;
font-weight: normal;
text-shadow: none;

View File

@@ -85,7 +85,7 @@
background: white;
.ui-state-default {
background: $input-bg;
background: #F8F8F8;
color: $text-medium;
}
}

View File

@@ -6,72 +6,34 @@
// 04. Tags
// 05. Auth pages
// 06. Forms
// 07. Alerts
// 07. Callout
// 08. User account
// 09. Search
// 10. Official levels
// 12. Tables
// 13. Social
// 14. Pages
// 15. Verification
// 16. Comments
// 17. Flags
// 18. Activity
// 11. Tables
// 12. Social
// 13. Pages
// 14. Verification
// 15. Comments
// 16. Flags
// 17. Activity
//
// 01. Global styles
// - - - - - - - - - - - - - - - - - - - - - - - - -
*, html {
margin: 0;
padding: 0;
}
html, body {
height: 100%;
}
// -----------------
body {
background: white;
color: $text;
font-family: $font-sans;
font-size: $base-font-size;
}
h1, h2, h3, h4, h5, h6 {
clear: both;
font-family: $font-sans;
font-weight: $font-bold;
}
h1 {
@include h1();
}
h2 {
@include h2();
}
h3 {
@include h3();
}
h4 {
@include h4();
}
h5 {
@include h5();
}
h6 {
@include h6();
font-weight: $font-normal;
font-weight: 700;
}
p {
font-size: $base-font-size;
font-weight: $font-normal;
font-weight: 400;
line-height: $base-line-height;
}
@@ -200,7 +162,7 @@ a {
width: 100%;
a.close {
font-size: $h2-font-size;
font-size: rem-calc(34);
top: 20%;
}
}
@@ -216,13 +178,6 @@ a {
border: 0;
}
#drop-help.f-dropdown.content {
@media (min-width: $small-breakpoint) {
max-width: $line-height*15;
}
}
.menu.simple {
border-bottom: 1px solid $border;
margin: $line-height 0;
@@ -258,11 +213,13 @@ a {
}
.back, .icon-angle-left {
@include back;
clear: both;
color: $text-medium;
float: left;
}
// 02. Header
// - - - - - - - - - - - - - - - - - - - - - - - - -
// ----------
header {
background: $brand;
@@ -274,13 +231,9 @@ header {
}
.locale {
float: none;
float: left;
height: $line-height*1.5;
@media (min-width: $small-breakpoint) {
float: left;
margin-left: $line-height/2;
}
margin-left: $line-height/2;
}
.external-links {
@@ -288,7 +241,7 @@ header {
padding: rem-calc(6) 0;
text-align: center;
@media (min-width: $small-breakpoint) {
@include breakpoint(medium) {
float: right;
}
}
@@ -302,7 +255,7 @@ header {
padding-bottom: 0;
padding-top: 0;
@media (min-width: $small-breakpoint) {
@include breakpoint(medium) {
padding: 0;
}
@@ -322,7 +275,7 @@ header {
&.menu > li {
display: block;
@media (min-width: $small-breakpoint) {
@include breakpoint(medium) {
display: table-cell;
height: $line-height*3.5;
}
@@ -331,7 +284,7 @@ header {
color: white;
padding-left: 0;
@media (min-width: $small-breakpoint) {
@include breakpoint(medium) {
font-size: $small-font-size;
padding: rem-calc(11) rem-calc(16);
}
@@ -339,7 +292,7 @@ header {
&.button {
text-align: left;
@media (min-width: $small-breakpoint) {
@include breakpoint(medium) {
background: white;
color: $brand;
text-align: center;
@@ -377,7 +330,7 @@ header {
.subnavigation {
@media (min-width: $small-breakpoint) {
@include breakpoint(medium) {
background: white;
padding-bottom: 0;
}
@@ -387,7 +340,7 @@ header {
margin: 0;
li {
@media (min-width: $small-breakpoint) {
@include breakpoint(medium) {
display: inline-block;
margin-right: rem-calc(36);
}
@@ -400,7 +353,7 @@ header {
text-align: left;
width: 100%;
@media (min-width: $small-breakpoint) {
@include breakpoint(medium) {
color: $text;
display: block;
font-weight: bold;
@@ -416,7 +369,7 @@ header {
&.active {
color: white;
@media (min-width: $small-breakpoint) {
@include breakpoint(medium) {
border-bottom: 2px solid $brand;
color: $brand;
}
@@ -428,7 +381,7 @@ header {
.input-group {
padding-top: $line-height/4;
@media (min-width: $small-breakpoint) {
@include breakpoint(medium) {
margin-bottom: 0;
}
}
@@ -473,7 +426,7 @@ header {
position: relative;
text-align: left;
@media (min-width: $small-breakpoint) {
@include breakpoint(medium) {
margin-right: $line-height*1.5;
}
@@ -493,13 +446,13 @@ header {
}
// 03. Footer
// - - - - - - - - - - - - - - - - - - - - - - - - -
// ----------
footer {
color: $footer-color;
.logo a {
font-family: $font-logo;
font-family: 'Lato' !important;
text-decoration: none;
&:hover {
@@ -528,11 +481,10 @@ footer {
}
h2 a {
border-bottom: 1px solid $footer-border;
display: block;
font-size: $h3-font-size;
line-height: $h3-line-height;
font-size: rem-calc(24);
line-height: rem-calc(31);
padding-bottom: $line-height/4;
text-decoration: none;
}
@@ -551,7 +503,7 @@ footer {
}
// 04. Tags
// - - - - - - - - - - - - - - - - - - - - - - - - -
// --------
.tags a , .tag-cloud a, .categories a, .geozone a, .sidebar-links a {
background: #ececec;
@@ -588,7 +540,7 @@ h3.sidebar-title {
}
// 05. Auth pages
// - - - - - - - - - - - - - - - - - - - - - - - - -
// --------------
.auth-page {
background: $brand image-url("auth_bg.jpg");
@@ -604,7 +556,7 @@ h3.sidebar-title {
line-height: rem-calc(80); // Same as logo image height
text-align: center;
@media (min-width: $small-breakpoint) {
@include breakpoint(medium) {
display: inline-block;
text-align: left;
}
@@ -625,7 +577,7 @@ h3.sidebar-title {
}
// 06. Forms
// - - - - - - - - - - - - - - - - - - - - - - - - -
// ---------
form.locale-form {
display: inline-block;
@@ -669,7 +621,6 @@ form.locale-form {
}
form {
font-family: $font-sans;
label {
font-size: $base-font-size;
@@ -710,7 +661,7 @@ form {
}
input[type]:not([type=submit]):not([type=file]):not([type=checkbox]):not([type=radio]) {
background: $input-bg;
background: #F8F8F8;
height: $line-height*2;
margin-bottom: rem-calc(16);
@@ -756,11 +707,10 @@ form {
}
}
// 07. Alerts
// - - - - - - - - - - - - - - - - - - - - - - - - -
// 07. Callout
// -----------
.callout {
font-family: $font-sans;
font-size: $small-font-size;
&.success, &.notice {
@@ -820,7 +770,7 @@ label.error, label.error a {
}
// 08. User account
// - - - - - - - - - - - - - - - - - - - - - - - - -
// ----------------
.account {
@@ -913,16 +863,16 @@ img.avatar, img.admin-avatar, img.moderator-avatar, img.initialjs-avatar {
}
[class^="icon-"] {
font-size: $h4-font-size;
font-size: rem-calc(19);
vertical-align: middle;
}
.icon-circle {
color: #ecf00b;
font-size: $tiny-font-size;
font-size: rem-calc(10);
position: absolute;
right: 4px;
top: -6px;
right: 8px;
top: 6px;
}
}
@@ -930,9 +880,9 @@ img.avatar, img.admin-avatar, img.moderator-avatar, img.initialjs-avatar {
background: $border;
content: '';
height: 100%;
left: 28px;
left: 22px;
position: absolute;
top: 84px;
top: 60px;
width: 2px;
}
@@ -961,7 +911,7 @@ img.avatar, img.admin-avatar, img.moderator-avatar, img.initialjs-avatar {
color: $brand;
content: "\4d";
font-family: "icons" !important;
left: 6px;
left: 0;
position: absolute;
}
@@ -977,32 +927,27 @@ img.avatar, img.admin-avatar, img.moderator-avatar, img.initialjs-avatar {
}
// 09. Search
// - - - - - - - - - - - - - - - - - - - - - - - - -
// ----------
.search-form {
h3 {
border-top: 1px solid $votes-border;
display: inline-block;
font-size: rem-calc(16);
margin: -1px 0 $line-height/2;
padding-top: $line-height/4;
text-transform: uppercase;
}
.search-form h3 {
border-top: 1px solid $votes-border;
display: inline-block;
font-size: rem-calc(16);
margin: -1px 0 $line-height/2;
padding-top: $line-height/4;
text-transform: uppercase;
}
.search-results {
h2 {
margin-bottom: 0;
}
.search-results h2 {
margin-bottom: 0;
}
.advanced-search {
float: left;
margin: $line-height 0;
position: inherit;
@media (min-width: $small-breakpoint) {
@include breakpoint(medium) {
float: right;
margin-bottom: 0;
margin-top: rem-calc(28);
@@ -1019,55 +964,46 @@ img.avatar, img.admin-avatar, img.moderator-avatar, img.initialjs-avatar {
height: $line-height*2;
}
@media (max-width: $medium-breakpoint) {
.column {
@include breakpoint(medium) {
& > .column {
padding: 0;
}
}
}
// 10. Officials levels
// - - - - - - - - - - - - - - - - - - - - - - - - -
// --------------------
[class^="level-"] {
color: white;
}
.is-author {
background: $author;
background: #008CCF;
}
.is-association {
background: $association;
background: #C0392B;
}
.is-deleted {
background: $deleted;
background: #E7E7E7;
}
.level-1 {
background: $level-1;
background: #1ABC9C;
}
.level-2 {
background: $level-2;
}
.level-3 {
background: $level-3;
}
.level-4 {
background: $level-4;
.level-2, .level-3, .level-4 {
background: #43AC6A;
}
.level-5 {
background: $level-5;
background: #F08A24;
}
// 12. Tables
// - - - - - - - - - - - - - - - - - - - - - - - - -
// 11. Tables
// ----------
table {
border: $border;
@@ -1100,8 +1036,8 @@ table {
}
}
// 13. Social
// - - - - - - - - - - - - - - - - - - - - - - - - -
// 12. Social
// ----------
.button.button-twitter,
.button.button-facebook,
@@ -1232,7 +1168,7 @@ table {
.social {
a {
font-size: $h3-font-size;
font-size: rem-calc(24);
margin: 0 $line-height/2;
text-decoration: none;
@@ -1318,8 +1254,8 @@ table {
}
}
// 14. Pages
// - - - - - - - - - - - - - - - - - - - - - - - - -
// 13. Pages
// ---------
.more-information {
@@ -1358,7 +1294,7 @@ table {
right: 0;
top: 24px;
@media (min-width: $small-breakpoint) {
@include breakpoint(medium) {
content: 'c';
}
}
@@ -1366,12 +1302,12 @@ table {
}
}
// 15. Verification
// - - - - - - - - - - - - - - - - - - - - - - - - -
// 14. Verification
// ----------------
.verification {
@media (min-width: $small-breakpoint) {
@include breakpoint(medium) {
.left + .left {
margin-left: $line-height/2;
}
@@ -1383,7 +1319,7 @@ table {
float: left;
width: 30%;
@media (min-width: $small-breakpoint) {
@include breakpoint(medium) {
width: 25%;
}
}
@@ -1392,7 +1328,7 @@ table {
.progress {
height: $line-height*3;
@media (min-width: $small-breakpoint) {
@include breakpoint(medium) {
height: $line-height*2;
}
@@ -1409,7 +1345,7 @@ table {
text-transform: uppercase;
vertical-align: top;
@media (min-width: $small-breakpoint) {
@include breakpoint(medium) {
line-height: $line-height*2;
padding: 0;
}
@@ -1417,7 +1353,7 @@ table {
.number {
display: block;
@media (min-width: $small-breakpoint) {
@include breakpoint(medium) {
background-color: white;
border-radius: rem-calc(30);
color: #43AC6A;
@@ -1517,8 +1453,8 @@ table {
}
}
// 16. Comments
// - - - - - - - - - - - - - - - - - - - - - - - - -
// 15. Comments
// ------------
.comments {
background: $white;
@@ -1547,7 +1483,6 @@ table {
.comment-votes {
color: $text-medium;
font-family: $font-sans;
font-size: $small-font-size;
line-height: $line-height;
@@ -1596,42 +1531,28 @@ table {
padding: $line-height/4 0;
overflow: hidden;
@each $n in ("1", "2", "3","4", "5") {
&.level-#{$n} {
@if $n == "5" {
background: $comment-level-5;
padding: $line-height/4 $line-height/2;
}
@elseif $n == "1" {
background: none;
padding: $line-height/4 $line-height/2;
}
@else {
background: $comment-official;
padding: $line-height/4 $line-height/2;
}
}
}
&.is-author {
background: $comment-author;
&.level-1, &.level-2, &.level-3, &.level-4, &.level-5,
&.is-author, &.is-admin, &.is-moderator {
background: rgba(70,219,145,.3);
padding: $line-height/4 $line-height/2;
}
&.is-admin, &.is-moderator {
background: $comment-admin;
padding: $line-height/4 $line-height/2;
&.level-1 {
background: none;
}
&.level-5 {
background: $comment-level-5;
padding: $line-height/4 $line-height/2;
background: rgba(255,241,204,1);
}
&.is-author, &.is-admin, &.is-moderator {
background: rgba(45,144,248,.15);
}
}
}
.is-deleted {
background: $deleted;
background: #E7E7E7;
margin-left: rem-calc(42);
padding: $line-height/4 $line-height/2;
}
@@ -1648,7 +1569,6 @@ table {
.comment-info {
color: $text-medium;
font-family: $font-sans;
font-size: $small-font-size;
margin-top: $line-height/4;
vertical-align: middle;
@@ -1669,7 +1589,7 @@ table {
float: none;
margin-top: 0;
@media (min-width: $small-breakpoint) {
@include breakpoint(medium) {
float: right;
margin-top: rem-calc(-24);
}
@@ -1678,14 +1598,14 @@ table {
padding-right: $line-height/2;
float: none;
@media (min-width: $small-breakpoint) {
@include breakpoint(medium) {
float: right;
}
}
}
// 17. Flags
// - - - - - - - - - - - - - - - - - - - - - - - - -
// 16. Flags
// ---------
.flag-content {
@@ -1712,8 +1632,8 @@ table {
color: $text-medium;
}
// 18. Activity
// - - - - - - - - - - - - - - - - - - - - - - - - -
// 17. Activity
// ------------
.activity {
margin-bottom: $line-height*2;

View File

@@ -1,24 +1,18 @@
// Table of Contents
//
// 01. Mixins
// 01. Logo
//
// 01. Mixins
// - - - - - - - - - - - - - - - - - - - - - - - - -
@mixin back {
clear: both;
color: $text-medium;
float: left;
}
// 01. Logo
// --------
@mixin logo {
color: white;
font-family: $font-logo;
font-size: $h3-font-size;
font-family: 'Lato' !important;
font-size: rem-calc(24);
font-weight: lighter;
@media (min-width: $small-breakpoint) {
@include breakpoint(small) {
line-height: $line-height*2;
margin-top: 0;
}
@@ -27,7 +21,7 @@
height: 48px;
width: 48px;
@media (min-width: $small-breakpoint) {
@include breakpoint(small) {
height: 80px;
margin-right: $line-height/2;
margin-top: 0;
@@ -35,59 +29,3 @@
}
}
}
@mixin h1 {
font-size: $h2-font-size;
line-height: $h2-line-height;
@media (min-width: $small-breakpoint) {
font-size: $h1-font-size;
line-height: $h1-line-height;
}
}
@mixin h2 {
font-size: $h3-font-size;
line-height: $h3-line-height;
@media (min-width: $small-breakpoint) {
font-size: $h2-font-size;
line-height: $h2-line-height;
}
}
@mixin h3 {
font-size: $h4-font-size;
line-height: $h4-line-height;
@media (min-width: $small-breakpoint) {
font-size: $h3-font-size;
line-height: $h3-line-height;
}
}
@mixin h4 {
font-size: $h5-font-size;
line-height: $h5-line-height;
@media (min-width: $small-breakpoint) {
font-size: $h4-font-size;
line-height: $h4-line-height;
}
}
@mixin h5 {
font-size: $h6-font-size;
line-height: $h6-line-height;
@media (min-width: $small-breakpoint) {
font-size: $h5-font-size;
line-height: $h5-line-height;
}
}
@mixin h6 {
font-size: $h6-font-size;
line-height: $h6-line-height;
text-transform: uppercase;
}

View File

@@ -1,4 +1,4 @@
// Table of Contents - Styles for debates and proposals
// Table of Contents
//
// 01. Votes and supports
// 02. New participation
@@ -8,12 +8,11 @@
//
// 01. Votes and supports
// - - - - - - - - - - - - - - - - - - - - - - - - -
// ----------------------
@mixin votes {
background: $votes-bg;
border-top: 1px solid $votes-border;
font-family: $font-sans;
margin: 0 rem-calc(-12);
padding: rem-calc(14) rem-calc(12);
position: relative;
@@ -157,7 +156,6 @@
@mixin supports {
background: $proposals;
border-top: 1px solid $proposals-border;
font-family: $font-sans;
margin: 0 rem-calc(-12);
padding: rem-calc(14) rem-calc(12);
position: relative;
@@ -272,16 +270,12 @@
}
// 02. New participation
// - - - - - - - - - - - - - - - - - - - - - - - - -
// ---------------------
.debate-new, .debate-edit,
.proposal-new, .proposal-edit,
.spending-proposal-new, .spending-proposal-edit {
.back {
@include back;
}
.icon-debates {
color: $debates;
font-size: rem-calc(60);
@@ -335,7 +329,7 @@
}
// 03. Show participation
// - - - - - - - - - - - - - - - - - - - - - - - - -
// ----------------------
.debate-show, .proposal-show, .investment-project-show {
@@ -491,7 +485,7 @@
padding: rem-calc(24);
}
@media (min-width: $small-breakpoint + rem-calc(1)) and (max-width:$medium-breakpoint) {
@include breakpoint(small + rem-calc(1) and medium down) {
.in-favor, .against {
text-align: left;
width: rem-calc(100);
@@ -502,7 +496,7 @@
display: none;
}
@media (min-width: $medium-breakpoint) {
@include breakpoint(medium) {
.divider {
display: inline-block;
}
@@ -550,18 +544,18 @@
}
// 04. List participation
// - - - - - - - - - - - - - - - - - - - - - - - - -
// ----------------------
.debates-list, .proposals-list, .investment-projects-list {
@media (min-width: $small-breakpoint) {
@include breakpoint(small) {
margin-bottom: rem-calc(48);
}
}
.investment-projects-list {
@media (min-width: $small-breakpoint) {
@include breakpoint(small) {
min-height: $line-height*15;
}
}
@@ -580,7 +574,7 @@
min-height: rem-calc(192);
padding: rem-calc(12) rem-calc(12) 0 rem-calc(12);
@media (min-width: $small-breakpoint) {
@include breakpoint(small) {
margin-bottom: rem-calc(-1);
padding-bottom: rem-calc(12);
}
@@ -589,7 +583,6 @@
background: none;
clear: both;
display: block;
font-family: $font-sans;
font-size: rem-calc(12);
font-weight: bold;
line-height: $line-height;
@@ -715,7 +708,7 @@
display: none;
}
@media (min-width: $medium-breakpoint) {
@include breakpoint(medium) {
.divider {
display: inline-block;
}
@@ -729,7 +722,7 @@
border: 1px solid $votes-border;
margin: 0 rem-calc(-12);
@media (min-width: $small-breakpoint) {
@include breakpoint(small) {
border-top-left-radius: 3px;
border-bottom-left-radius: 3px;
margin: 0 rem-calc(-25) 0 rem-calc(12);
@@ -747,7 +740,7 @@
right: -1px;
border-width: 13px 13px 0 0;
@media (min-width: $small-breakpoint) {
@include breakpoint(small) {
content: "";
}
}
@@ -759,7 +752,7 @@
padding-top: rem-calc(12);
vertical-align: top;
@media (min-width: $small-breakpoint) {
@include breakpoint(small) {
display: block;
float: none;
line-height: $line-height*2;
@@ -768,7 +761,7 @@
}
}
@media (min-width: $small-breakpoint) {
@include breakpoint(small) {
.like, .unlike {
span.percentage {
@@ -787,7 +780,7 @@
border: 1px solid $proposals-border;
margin: 0 rem-calc(-12);
@media (min-width: $small-breakpoint) {
@include breakpoint(small) {
border-top-left-radius: 3px;
border-bottom-left-radius: 3px;
margin: 0 rem-calc(-25) 0 rem-calc(12);
@@ -805,7 +798,7 @@
right: -1px;
border-width: 13px 13px 0 0;
@media (min-width: $small-breakpoint) {
@include breakpoint(small) {
content: "";
}
}
@@ -816,7 +809,7 @@
padding-top: rem-calc(12);
vertical-align: top;
@media (min-width: $small-breakpoint) {
@include breakpoint(small) {
display: block;
float: none;
margin-left: 0;
@@ -837,7 +830,7 @@
min-height: rem-calc(180);
padding-top: 0;
@media (min-width: $small-breakpoint) {
@include breakpoint(small) {
padding-top: $line-height*1.5;
}
@@ -924,12 +917,12 @@
}
// 05. Featured
// - - - - - - - - - - - - - - - - - - - - - - - - -
// ------------
.featured-debates, .featured-proposals {
padding: $line-height/2 0;
@media (min-width: $medium-breakpoint) {
@include breakpoint(medium) {
margin-left: 0 !important;
margin-right: 0 !important;
}
@@ -945,7 +938,7 @@
a {
color: $text;
font-size: $h3-font-size;
font-size: rem-calc(24);
}
}

View File

@@ -1,5 +1,5 @@
<div class="row">
<div class="small-12 column">
<div class="row margin-bottom">
<div class="small-12 column relative">
<h1 class="float-left"><%= t("notifications.index.title") %></h1>

View File

@@ -1,6 +1,6 @@
<% provide :title do %><%= t('pages.titles.more_information') %><% end %>
<div class="row">
<div class="more-information small-12 medium-7 column">
<div class="more-information small-12 medium-9 large-7 column">
<h1><%= t('pages.titles.more_information') %></h1>
<ul class="no-bullet">
<li>

View File

@@ -6,50 +6,46 @@
<%= form_tag search_path, method: :get do %>
<div id='js-advanced-search' data-advanced-search-terms=<%= @advanced_search_terms.present? %> style="display: none">
<div class="small-12">
<div class="small-12 column">
<label><%= t("shared.advanced_search.general") %></label>
<%= text_field_tag "search", params[:search],
placeholder: t("shared.advanced_search.general_placeholder") %>
</div>
<div class="row">
<div class="small-12 large-3 column">
<label><%= t("shared.advanced_search.author_type") %></label>
<%= select_tag('advanced_search[official_level]', official_level_search_options,
include_blank: t("shared.advanced_search.author_type_blank")) %>
<div class="small-12 large-3 column">
<label><%= t("shared.advanced_search.author_type") %></label>
<%= select_tag('advanced_search[official_level]', official_level_search_options,
include_blank: t("shared.advanced_search.author_type_blank")) %>
</div>
<div class="small-12 large-9">
<div class="small-12 large-4 column">
<label><%= t("shared.advanced_search.date") %></label>
<%= select_tag('advanced_search[date_min]', date_range_options,
include_blank: t("shared.advanced_search.date_range_blank"),
id: 'js-advanced-search-date-min') %>
</div>
<div class="small-12 large-9 column">
<div class="small-12 large-4 column">
<label><%= t("shared.advanced_search.date") %></label>
<%= select_tag('advanced_search[date_min]', date_range_options,
include_blank: t("shared.advanced_search.date_range_blank"),
id: 'js-advanced-search-date-min') %>
<div id='js-custom-date' class='small-12 large-8 column' style="display: none">
<div class='small-12 large-6 column'>
<label><%= t("shared.advanced_search.from") %></label>
<%= text_field_tag 'advanced_search[date_min]',
params[:advanced_search].try(:[], :date_min),
placeholder: t("shared.advanced_search.date_placeholder"),
class: 'js-calendar' %>
</div>
<div id='js-custom-date' class='small-12 large-8 column' style="display: none">
<div class='small-12 large-6 column'>
<label><%= t("shared.advanced_search.from") %></label>
<%= text_field_tag 'advanced_search[date_min]',
params[:advanced_search].try(:[], :date_min),
placeholder: t("shared.advanced_search.date_placeholder"),
class: 'js-calendar' %>
</div>
<div class='small-12 large-6 column'>
<label><%= t("shared.advanced_search.to") %></label>
<%= text_field_tag 'advanced_search[date_max]',
params[:advanced_search].try(:[], :date_max),
placeholder: t("shared.advanced_search.date_placeholder"),
class: 'js-calendar' %>
</div>
<div class='small-12 large-6 column'>
<label><%= t("shared.advanced_search.to") %></label>
<%= text_field_tag 'advanced_search[date_max]',
params[:advanced_search].try(:[], :date_max),
placeholder: t("shared.advanced_search.date_placeholder"),
class: 'js-calendar' %>
</div>
</div>
</div>
<div class="row medium-uncollapse">
<div class="small-12 medium-3 column end">
<%= submit_tag t("shared.advanced_search.search"), class: 'button expanded' %>
</div>
<div class="small-12 medium-3 column end clear">
<%= submit_tag t("shared.advanced_search.search"), class: 'button expanded' %>
</div>
</div>