Merge pull request #594 from AyuntamientoMadrid/refactor_css
Refactor css
This commit is contained in:
Raimond Garcia
@@ -4,7 +4,6 @@
|
||||
@import "icons";
|
||||
@import "variables";
|
||||
@import "admin";
|
||||
@import "participacion";
|
||||
@import "debates";
|
||||
@import "proposals";
|
||||
@import "layout";
|
||||
@import "participation";
|
||||
@import "c3";
|
||||
@@ -17,6 +17,8 @@
|
||||
// 15. Social
|
||||
// 16. Pages
|
||||
// 17. Verification
|
||||
// 18. Comments
|
||||
// 19. Flags
|
||||
//
|
||||
|
||||
// 01. Variables
|
||||
@@ -442,7 +444,7 @@ header {
|
||||
}
|
||||
|
||||
.contain-to-grid {
|
||||
background: rgba(0,0,0,.5);
|
||||
background: #112E51;
|
||||
}
|
||||
|
||||
.top-bar {
|
||||
@@ -772,15 +774,14 @@ footer {
|
||||
// 06. Tags
|
||||
// - - - - - - - - - - - - - - - - - - - - - - - - -
|
||||
|
||||
.tags {
|
||||
.tags, .tag-cloud {
|
||||
|
||||
a {
|
||||
background: $border;
|
||||
border-radius: rem-calc(30);
|
||||
border-radius: rem-calc(6);
|
||||
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(8);
|
||||
@@ -794,7 +795,6 @@ footer {
|
||||
}
|
||||
|
||||
.tag-cloud {
|
||||
@extend .tags;
|
||||
|
||||
h3 {
|
||||
border-top: 2px solid $brand;
|
||||
@@ -944,14 +944,13 @@ form {
|
||||
margin: rem-calc(12) 0 rem-calc(12) rem-calc(6);
|
||||
}
|
||||
|
||||
.note {
|
||||
.note, .note-marked {
|
||||
display: block;
|
||||
font-size: rem-calc(13);
|
||||
margin-bottom: rem-calc(12);
|
||||
}
|
||||
|
||||
.note-marked {
|
||||
@extend .note;
|
||||
background: yellow;
|
||||
display: inline-block;
|
||||
|
||||
@@ -1137,16 +1136,12 @@ label.error, label.error a {
|
||||
}
|
||||
}
|
||||
|
||||
img.avatar, img.admin-avatar, img.moderator-avatar {
|
||||
img.avatar, img.admin-avatar, img.moderator-avatar, img.initialjs-avatar {
|
||||
border-radius: rem-calc(1000);
|
||||
position: relative;
|
||||
}
|
||||
|
||||
img.initialjs-avatar {
|
||||
@extend .avatar;
|
||||
}
|
||||
|
||||
.author-deleted {
|
||||
.author-deleted, .user-deleted {
|
||||
background-color: rgba(255,255,255,.5);
|
||||
color: rgba(0,0,0,.4);
|
||||
font-size: rem-calc(40);
|
||||
@@ -1156,7 +1151,6 @@ img.initialjs-avatar {
|
||||
}
|
||||
|
||||
.user-deleted {
|
||||
@extend .author-deleted;
|
||||
top: -9px;
|
||||
}
|
||||
|
||||
@@ -1197,7 +1191,7 @@ img.initialjs-avatar {
|
||||
// 11. Filters & search
|
||||
// - - - - - - - - - - - - - - - - - - - - - - - - -
|
||||
|
||||
.filters {
|
||||
.filters, .search-results {
|
||||
|
||||
h2 {
|
||||
display: inline-block;
|
||||
@@ -1248,10 +1242,6 @@ img.initialjs-avatar {
|
||||
}
|
||||
}
|
||||
|
||||
.search-results {
|
||||
@extend .filters;
|
||||
}
|
||||
|
||||
.search-form {
|
||||
|
||||
h3 {
|
||||
@@ -1378,6 +1368,7 @@ table {
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background: white;
|
||||
color: #40A2D1;
|
||||
}
|
||||
}
|
||||
@@ -1417,6 +1408,7 @@ table {
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background: white;
|
||||
color: #354F88;
|
||||
}
|
||||
}
|
||||
@@ -1456,6 +1448,7 @@ table {
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background: white;
|
||||
color: #CE3E26;
|
||||
}
|
||||
}
|
||||
@@ -1498,27 +1491,72 @@ table {
|
||||
}
|
||||
|
||||
.social-share-button-twitter {
|
||||
@extend .social-share-button-twitter;
|
||||
background: none;
|
||||
color: white;
|
||||
height: rem-calc(24);
|
||||
position: relative;
|
||||
width: rem-calc(48);
|
||||
|
||||
&:before {
|
||||
content: "f";
|
||||
font-family: "icons" !important;
|
||||
font-size: rem-calc(24);
|
||||
left: 50%;
|
||||
line-height: $line-height*2;
|
||||
margin-left: rem-calc(-11);
|
||||
position: absolute;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
color: #40A2D1;
|
||||
}
|
||||
}
|
||||
|
||||
.social-share-button-facebook {
|
||||
@extend .social-share-button-facebook;
|
||||
background: none;
|
||||
color: white;
|
||||
height: rem-calc(24);
|
||||
position: relative;
|
||||
width: rem-calc(48);
|
||||
|
||||
&:before {
|
||||
content: "A";
|
||||
font-family: "icons" !important;
|
||||
font-size: rem-calc(24);
|
||||
left: 50%;
|
||||
line-height: $line-height*2;
|
||||
margin-left: rem-calc(-11);
|
||||
position: absolute;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
color: #354F88;
|
||||
}
|
||||
}
|
||||
|
||||
.social-share-button-google_plus {
|
||||
@extend .social-share-button-google_plus;
|
||||
background: none;
|
||||
color: white;
|
||||
height: rem-calc(24);
|
||||
position: relative;
|
||||
width: rem-calc(48);
|
||||
|
||||
&:before {
|
||||
content: "B";
|
||||
font-family: "icons" !important;
|
||||
font-size: rem-calc(24);
|
||||
left: 50%;
|
||||
line-height: $line-height*2;
|
||||
margin-left: rem-calc(-11);
|
||||
position: absolute;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
color: #CE3E26;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1727,3 +1765,170 @@ table {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 18. Comments
|
||||
// - - - - - - - - - - - - - - - - - - - - - - - - -
|
||||
|
||||
.comments {
|
||||
background: $white;
|
||||
background-repeat: repeat-x;
|
||||
padding-top: rem-calc(24);
|
||||
padding-bottom: rem-calc(96);
|
||||
|
||||
h2 {
|
||||
margin: 0;
|
||||
font-weight: bold;
|
||||
|
||||
span {
|
||||
font-size: rem-calc(18);
|
||||
font-weight: normal;
|
||||
opacity: .8;
|
||||
}
|
||||
}
|
||||
|
||||
.comment {
|
||||
margin: rem-calc(6) 0;
|
||||
|
||||
p {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.comment-votes {
|
||||
color: $text-medium;
|
||||
font-weight: lighter;
|
||||
line-height: rem-calc(24);
|
||||
margin: rem-calc(10) rem-calc(12) rem-calc(6) 0;
|
||||
|
||||
a {
|
||||
color: $text-light;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
|
||||
&:hover {
|
||||
color: $text-medium;
|
||||
}
|
||||
}
|
||||
|
||||
[class^="icon-"] {
|
||||
font-size: rem-calc(20);
|
||||
vertical-align: middle;
|
||||
}
|
||||
}
|
||||
|
||||
.comment-body {
|
||||
margin-left: rem-calc(42);
|
||||
|
||||
p {
|
||||
font-size: rem-calc(14);
|
||||
}
|
||||
|
||||
.reply {
|
||||
background: white;
|
||||
border: 1px solid $border;
|
||||
font-size: rem-calc(12);
|
||||
margin: rem-calc(6) 0;
|
||||
padding: rem-calc(6);
|
||||
|
||||
.divider {
|
||||
color: $text-light;
|
||||
}
|
||||
}
|
||||
|
||||
.comment-user {
|
||||
margin-top: rem-calc(6);
|
||||
padding: rem-calc(6) 0;
|
||||
overflow: hidden;
|
||||
|
||||
@each $n in ("1", "2", "3","4", "5") {
|
||||
&.level-#{$n} {
|
||||
@if $n == "5" {
|
||||
background: $comment-level-5;
|
||||
padding: rem-calc(6) rem-calc(12);
|
||||
}
|
||||
@elseif $n == "1" {
|
||||
background: none;
|
||||
padding: rem-calc(6) rem-calc(12);
|
||||
}
|
||||
@else {
|
||||
background: $comment-official;
|
||||
padding: rem-calc(6) rem-calc(12);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.is-author {
|
||||
background: $comment-author;
|
||||
padding: rem-calc(6) rem-calc(12);
|
||||
}
|
||||
|
||||
&.is-admin, &.is-moderator {
|
||||
background: $comment-admin;
|
||||
padding: rem-calc(6) rem-calc(12);
|
||||
}
|
||||
|
||||
&.level-5 {
|
||||
background: $comment-level-5;
|
||||
padding: rem-calc(6) rem-calc(12);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.is-deleted {
|
||||
background: $deleted;
|
||||
margin-left: rem-calc(42);
|
||||
padding: rem-calc(6) rem-calc(12);
|
||||
}
|
||||
|
||||
.comment-children {
|
||||
border-left: 1px dashed $border;
|
||||
margin-left: rem-calc(42);
|
||||
padding-left: rem-calc(6);
|
||||
|
||||
@media only screen and (max-width: 40em) {
|
||||
margin-left: rem-calc(16);
|
||||
}
|
||||
}
|
||||
|
||||
.comment-info {
|
||||
color: $text-light;
|
||||
font-size: rem-calc(13);
|
||||
font-weight: lighter;
|
||||
margin-top: rem-calc(6);
|
||||
vertical-align: middle;
|
||||
|
||||
span.user-name {
|
||||
color: $text;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.faded {
|
||||
opacity: 0.4;
|
||||
}
|
||||
|
||||
// 19. Flags
|
||||
// - - - - - - - - - - - - - - - - - - - - - - - - -
|
||||
|
||||
.flag-content {
|
||||
|
||||
.button {
|
||||
background: none;
|
||||
margin-bottom: 0;
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.flag-disable, .flag-active {
|
||||
line-height: rem-calc(24);
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.flag-disable {
|
||||
color: $text-medium;
|
||||
}
|
||||
|
||||
.flag-active {
|
||||
color: $delete;
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
@@ -1,776 +0,0 @@
|
||||
// Table of Contents
|
||||
//
|
||||
// 01. Debates
|
||||
// 02. Index
|
||||
// 02.1. Featured
|
||||
// 02.2. List
|
||||
// 03. Show
|
||||
// 04. New
|
||||
// 05. Comments
|
||||
// 06. Flags
|
||||
//
|
||||
|
||||
// 01. Proposals
|
||||
// - - - - - - - - - - - - - - - - - - - - - - - - -
|
||||
|
||||
.button-proposal {
|
||||
background: $proposals;
|
||||
|
||||
&:hover {
|
||||
background: $proposals-border;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin supports {
|
||||
background: $proposals;
|
||||
border-top: 1px solid $proposals-border;
|
||||
margin: 0 rem-calc(-12);
|
||||
padding: rem-calc(14) rem-calc(12);
|
||||
position: relative;
|
||||
|
||||
.progress {
|
||||
background-color: rgba(255,255,255,.8);
|
||||
height: rem-calc(12);
|
||||
margin-bottom: rem-calc(6);
|
||||
margin-top: rem-calc(4);
|
||||
|
||||
.meter {
|
||||
background: $votes-like;
|
||||
}
|
||||
}
|
||||
|
||||
.percentage {
|
||||
font-size: rem-calc(10);
|
||||
color: $brand;
|
||||
vertical-align: top;
|
||||
position: absolute;
|
||||
top: 17px;
|
||||
right: 18px;
|
||||
}
|
||||
|
||||
abbr {
|
||||
color: white;
|
||||
|
||||
&[title] {
|
||||
border-bottom: 1px dotted white;
|
||||
}
|
||||
}
|
||||
|
||||
.button-support {
|
||||
background: white;
|
||||
color: $proposals;
|
||||
display: inline-block;
|
||||
font-size: rem-calc(14);
|
||||
margin-top: rem-calc(12);
|
||||
|
||||
&:hover {
|
||||
background: $proposals-border;
|
||||
color: white;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
&:active {
|
||||
opacity: .75;
|
||||
}
|
||||
}
|
||||
|
||||
.total-supports {
|
||||
color: white;
|
||||
text-align: center;
|
||||
font-size: rem-calc(14);
|
||||
|
||||
span {
|
||||
display: block;
|
||||
font-size: rem-calc(11);
|
||||
opacity: .75;
|
||||
}
|
||||
}
|
||||
|
||||
.divider {
|
||||
margin: 0 rem-calc(6);
|
||||
}
|
||||
|
||||
.not-logged {
|
||||
background: rgba(255,164,45,.9);
|
||||
color: white;
|
||||
height: 100%;
|
||||
left: 0;
|
||||
line-height: $line-height*2;
|
||||
padding-top: rem-calc(12);
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#222222', endColorstr='#222222'); /* IE */
|
||||
|
||||
a {
|
||||
color: white;
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
|
||||
.anonymous-votes, .organizations-votes {
|
||||
background: $warning-bg;
|
||||
color: $warning-color;
|
||||
height: 100%;
|
||||
left: 0;
|
||||
line-height: $line-height;
|
||||
padding-top: rem-calc(12);
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
|
||||
p {
|
||||
color: $warning-color;
|
||||
margin: 0 rem-calc(12);
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
a {
|
||||
color: $warning-color;
|
||||
font-weight: bold;
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
|
||||
.supported {
|
||||
color: white;
|
||||
margin-top: rem-calc(12);
|
||||
}
|
||||
}
|
||||
|
||||
// 02. Index
|
||||
// - - - - - - - - - - - - - - - - - - - - - - - - -
|
||||
|
||||
// 02.1. Featured
|
||||
// - - - - - - - - - - - - -
|
||||
|
||||
.proposal-featured {
|
||||
|
||||
.panel {
|
||||
background: white;
|
||||
border: 1px solid;
|
||||
border-color: #e5e6e9 #dfe0e4 #d0d1d5;
|
||||
border-radius: rem-calc(3);
|
||||
margin-bottom: rem-calc(24);
|
||||
padding: rem-calc(24) rem-calc(12) 0 rem-calc(12);
|
||||
|
||||
.proposal-content {
|
||||
min-height: rem-calc(353);
|
||||
}
|
||||
|
||||
.label-proposal {
|
||||
background: none;
|
||||
clear: both;
|
||||
color: $proposals;
|
||||
display: block;
|
||||
font-size: rem-calc(12);
|
||||
font-weight: bold;
|
||||
text-transform: uppercase;
|
||||
padding-left: 0;
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
.icon-proposals {
|
||||
color: $proposals;
|
||||
font-size: rem-calc(36);
|
||||
line-height: $line-height;
|
||||
position: absolute;
|
||||
right: rem-calc(18);
|
||||
top: rem-calc(12);
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-weight: bold;
|
||||
margin: rem-calc(8) 0 0 0;
|
||||
min-height: rem-calc(65);
|
||||
|
||||
a {
|
||||
clear: both;
|
||||
color: $text;
|
||||
display: block;
|
||||
font-size: rem-calc(16);
|
||||
line-height: $line-height;
|
||||
text-transform: lowercase;
|
||||
|
||||
&:first-letter {
|
||||
text-transform: uppercase;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.proposal-info {
|
||||
color: $text-medium;
|
||||
font-weight: lighter;
|
||||
margin-bottom: 0;
|
||||
|
||||
.icon-comments {
|
||||
font-size: rem-calc(16);
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
a {
|
||||
color: $text-medium;
|
||||
}
|
||||
}
|
||||
|
||||
.proposal-description {
|
||||
color: $text;
|
||||
font-size: rem-calc(13);
|
||||
height: rem-calc(156);
|
||||
line-height: $line-height;
|
||||
margin-bottom: rem-calc(12);
|
||||
margin-top: rem-calc(24);
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
|
||||
a {
|
||||
color: $text;
|
||||
}
|
||||
|
||||
ul, ol {
|
||||
|
||||
li {
|
||||
font-size: rem-calc(13);
|
||||
margin-bottom: rem-calc(12);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.truncate {
|
||||
background: image-url('truncate.png');
|
||||
background-repeat: repeat-x;
|
||||
bottom: 0;
|
||||
height: 24px;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
p {
|
||||
color: $text;
|
||||
font-size: rem-calc(14);
|
||||
line-height: $line-height;
|
||||
margin-bottom: rem-calc(12);
|
||||
|
||||
&.debate-info {
|
||||
font-size: rem-calc(13);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.supports {
|
||||
@include supports;
|
||||
}
|
||||
}
|
||||
|
||||
// 02.2. List
|
||||
// - - - - - - - - - - - - -
|
||||
|
||||
.proposals-list {
|
||||
|
||||
@media (min-width: $small-breakpoint) {
|
||||
margin-bottom: rem-calc(48);
|
||||
}
|
||||
}
|
||||
|
||||
.proposal {
|
||||
@extend .proposal-featured;
|
||||
margin-bottom: 0;
|
||||
margin-top: 0;
|
||||
|
||||
.panel {
|
||||
border-radius: 0;
|
||||
box-shadow: 0px 1px 3px 0 $border;
|
||||
margin-bottom: rem-calc(12);
|
||||
min-height: rem-calc(192);
|
||||
padding-top: rem-calc(12);
|
||||
|
||||
@media (min-width: $small-breakpoint) {
|
||||
margin-bottom: rem-calc(-1);
|
||||
padding-bottom: rem-calc(12);
|
||||
}
|
||||
|
||||
.label-proposal {
|
||||
line-height: $line-height;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
h3 {
|
||||
margin-top: 0;
|
||||
min-height: rem-calc(48);
|
||||
}
|
||||
|
||||
.proposal-content {
|
||||
margin: 0;
|
||||
min-height: rem-calc(180);
|
||||
|
||||
.tags {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
.icon-proposals {
|
||||
font-size: rem-calc(18);
|
||||
left: rem-calc(88);
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.proposal-description {
|
||||
height: rem-calc(72);
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.supports {
|
||||
border: 1px solid $proposals-border;
|
||||
margin: 0 rem-calc(-12);
|
||||
|
||||
@media (min-width: $small-breakpoint) {
|
||||
border-top-left-radius: 3px;
|
||||
border-bottom-left-radius: 3px;
|
||||
margin: 0 rem-calc(-25) 0 rem-calc(12);
|
||||
}
|
||||
|
||||
&:after {
|
||||
content: none;
|
||||
position: absolute;
|
||||
display: block;
|
||||
border-style: solid;
|
||||
border-color: #664212 transparent transparent transparent;
|
||||
bottom: rem-calc(-14);
|
||||
border-left-width: 0;
|
||||
border-right-color: transparent;
|
||||
right: rem-calc(-1);
|
||||
border-width: 1em 1em 0 0;
|
||||
|
||||
@media (min-width: $small-breakpoint) {
|
||||
content: "";
|
||||
}
|
||||
}
|
||||
|
||||
.total-supports {
|
||||
display: inline-block;
|
||||
line-height: $line-height;
|
||||
padding-top: rem-calc(12);
|
||||
vertical-align: top;
|
||||
|
||||
@media (min-width: $small-breakpoint) {
|
||||
display: block;
|
||||
float: none;
|
||||
margin-left: 0;
|
||||
padding-top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.not-logged {
|
||||
line-height: $line-height;
|
||||
padding-top: rem-calc(24);
|
||||
}
|
||||
|
||||
.anonymous-votes, .organizations-votes {
|
||||
padding-top: rem-calc(24);
|
||||
}
|
||||
|
||||
.divider {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@media (min-width: $medium-breakpoint) {
|
||||
.divider {
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 03. Show
|
||||
// - - - - - - - - - - - - - - - - - - - - - - - - -
|
||||
|
||||
.proposal-show {
|
||||
padding-top: rem-calc(12);
|
||||
|
||||
.back {
|
||||
@include back;
|
||||
}
|
||||
|
||||
.icon-angle-left {
|
||||
@extend .back;
|
||||
}
|
||||
|
||||
h1 {
|
||||
clear: both;
|
||||
font-size: rem-calc(30);
|
||||
font-weight: bold;
|
||||
margin: 0;
|
||||
text-transform: lowercase;
|
||||
|
||||
&:first-letter {
|
||||
text-transform: uppercase;
|
||||
}
|
||||
}
|
||||
|
||||
h4 {
|
||||
margin: rem-calc(12) 0;
|
||||
}
|
||||
|
||||
.edit-proposal {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.proposal-info {
|
||||
clear: both;
|
||||
color: $text-medium;
|
||||
font-weight: lighter;
|
||||
line-height: $line-height*2;
|
||||
text-align: justify;
|
||||
|
||||
a {
|
||||
color: $text-medium;
|
||||
}
|
||||
|
||||
p {
|
||||
font-size: rem-calc(15);
|
||||
line-height: $line-height;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.proposal-description {
|
||||
font-size: rem-calc(15);
|
||||
line-height: rem-calc(30);
|
||||
}
|
||||
|
||||
ul, ol {
|
||||
margin: rem-calc(12) 0;
|
||||
|
||||
li {
|
||||
font-size: rem-calc(15);
|
||||
margin-bottom: rem-calc(15);
|
||||
}
|
||||
}
|
||||
|
||||
.author-photo {
|
||||
line-height: $line-height*2;
|
||||
margin-right: rem-calc(6);
|
||||
vertical-align: middle;
|
||||
width: 32px;
|
||||
}
|
||||
|
||||
.author {
|
||||
color: $text;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
aside {
|
||||
|
||||
h3 {
|
||||
border-top: 2px solid $brand;
|
||||
display: inline-block;
|
||||
font-size: rem-calc(16);
|
||||
margin: -1px 0 rem-calc(12);
|
||||
padding-top: rem-calc(6);
|
||||
text-transform: uppercase;
|
||||
}
|
||||
}
|
||||
|
||||
blockquote {
|
||||
margin-top: rem-calc(12);
|
||||
padding-top: 0;
|
||||
font-size: rem-calc(15);
|
||||
line-height: rem-calc(30);
|
||||
}
|
||||
|
||||
.document-link {
|
||||
border: 1px solid $border;
|
||||
display: block;
|
||||
margin-top: rem-calc(12);
|
||||
padding: rem-calc(12);
|
||||
position: relative;
|
||||
|
||||
a {
|
||||
padding-left: rem-calc(24);
|
||||
}
|
||||
|
||||
:before {
|
||||
color: #007BB7;
|
||||
content: "G";
|
||||
font-family: "icons" !important;
|
||||
font-size: rem-calc(24);
|
||||
left: rem-calc(6);
|
||||
padding-top: rem-calc(3);
|
||||
position: absolute;
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.video-link {
|
||||
@extend .document-link;
|
||||
|
||||
:before {
|
||||
color: #CC181E;
|
||||
content: "D";
|
||||
}
|
||||
}
|
||||
|
||||
.supports {
|
||||
@include supports;
|
||||
border: 0;
|
||||
border-radius: 0;
|
||||
margin: 0;
|
||||
|
||||
.total-supports {
|
||||
display: block;
|
||||
float: none;
|
||||
line-height: $line-height;
|
||||
}
|
||||
|
||||
.not-logged {
|
||||
line-height: $line-height;
|
||||
padding: rem-calc(24);
|
||||
}
|
||||
}
|
||||
|
||||
.leave-comment {
|
||||
display: inline-block;
|
||||
margin-top: rem-calc(24);
|
||||
}
|
||||
|
||||
.tags {
|
||||
display: block;
|
||||
margin: rem-calc(24) 0;
|
||||
|
||||
a {
|
||||
margin-right: rem-calc(6);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.bullet {
|
||||
color: $border;
|
||||
}
|
||||
|
||||
// 04. New
|
||||
// - - - - - - - - - - - - - - - - - - - - - - - - -
|
||||
|
||||
.proposal-new {
|
||||
background: white;
|
||||
padding-top: rem-calc(24);
|
||||
|
||||
.back {
|
||||
@include back;
|
||||
}
|
||||
|
||||
h1 {
|
||||
clear: both;
|
||||
font-size: rem-calc(36);
|
||||
font-weight: bold;
|
||||
line-height: $line-height*2;
|
||||
margin-bottom: rem-calc(24);
|
||||
}
|
||||
|
||||
.icon-proposals {
|
||||
color: $proposals;
|
||||
font-size: rem-calc(50);
|
||||
line-height: $line-height;
|
||||
opacity: .5;
|
||||
}
|
||||
|
||||
h2 {
|
||||
clear: both;
|
||||
font-size: rem-calc(20);
|
||||
font-weight: bold;
|
||||
line-height: $line-height;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.recommendations {
|
||||
list-style-type: none;
|
||||
margin-left: 0;
|
||||
margin-top: rem-calc(24);
|
||||
|
||||
li {
|
||||
font-size: rem-calc(12);
|
||||
margin: rem-calc(12) 0;
|
||||
|
||||
&:before {
|
||||
color: $proposals;
|
||||
content: "l ";
|
||||
font-family: "icons" !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.proposal-edit {
|
||||
@extend .proposal-new;
|
||||
}
|
||||
|
||||
// 05. Comments
|
||||
// - - - - - - - - - - - - - - - - - - - - - - - - -
|
||||
|
||||
.comments {
|
||||
background: $white;
|
||||
background-repeat: repeat-x;
|
||||
padding-top: rem-calc(24);
|
||||
padding-bottom: rem-calc(96);
|
||||
|
||||
h2 {
|
||||
margin: 0;
|
||||
font-weight: bold;
|
||||
|
||||
span {
|
||||
font-size: rem-calc(18);
|
||||
font-weight: normal;
|
||||
opacity: .8;
|
||||
}
|
||||
}
|
||||
|
||||
.comment {
|
||||
margin: rem-calc(6) 0;
|
||||
|
||||
p {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.comment-votes {
|
||||
color: $text-medium;
|
||||
font-weight: lighter;
|
||||
line-height: rem-calc(24);
|
||||
margin: rem-calc(10) rem-calc(12) rem-calc(6) 0;
|
||||
|
||||
a {
|
||||
color: $text-light;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
|
||||
&:hover {
|
||||
color: $text-medium;
|
||||
}
|
||||
}
|
||||
|
||||
[class^="icon-"] {
|
||||
font-size: rem-calc(20);
|
||||
vertical-align: middle;
|
||||
}
|
||||
}
|
||||
|
||||
.comment-body {
|
||||
margin-left: rem-calc(42);
|
||||
|
||||
p {
|
||||
font-size: rem-calc(14);
|
||||
}
|
||||
|
||||
.reply {
|
||||
background: white;
|
||||
border: 1px solid $border;
|
||||
font-size: rem-calc(12);
|
||||
margin: rem-calc(6) 0;
|
||||
padding: rem-calc(6);
|
||||
|
||||
.divider {
|
||||
color: $text-light;
|
||||
}
|
||||
}
|
||||
|
||||
.comment-user {
|
||||
margin-top: rem-calc(6);
|
||||
padding: rem-calc(6) 0;
|
||||
overflow: hidden;
|
||||
|
||||
@each $n in ("1", "2", "3","4", "5") {
|
||||
&.level-#{$n} {
|
||||
@if $n == "5" {
|
||||
background: $comment-level-5;
|
||||
padding: rem-calc(6) rem-calc(12);
|
||||
}
|
||||
@elseif $n == "1" {
|
||||
background: none;
|
||||
padding: rem-calc(6) rem-calc(12);
|
||||
}
|
||||
@else {
|
||||
background: $comment-official;
|
||||
padding: rem-calc(6) rem-calc(12);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.is-author {
|
||||
background: $comment-author;
|
||||
padding: rem-calc(6) rem-calc(12);
|
||||
}
|
||||
|
||||
&.is-admin {
|
||||
background: $comment-admin;
|
||||
padding: rem-calc(6) rem-calc(12);
|
||||
}
|
||||
|
||||
&.is-moderator {
|
||||
@extend .is-admin;
|
||||
}
|
||||
|
||||
&.level-5 {
|
||||
background: $comment-level-5;
|
||||
padding: rem-calc(6) rem-calc(12);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.is-deleted {
|
||||
background: $deleted;
|
||||
margin-left: rem-calc(42);
|
||||
padding: rem-calc(6) rem-calc(12);
|
||||
}
|
||||
|
||||
.comment-children {
|
||||
border-left: 1px dashed $border;
|
||||
margin-left: rem-calc(42);
|
||||
padding-left: rem-calc(6);
|
||||
|
||||
@media only screen and (max-width: 40em) {
|
||||
margin-left: rem-calc(16);
|
||||
}
|
||||
}
|
||||
|
||||
.comment-info {
|
||||
color: $text-light;
|
||||
font-size: rem-calc(13);
|
||||
font-weight: lighter;
|
||||
margin-top: rem-calc(6);
|
||||
vertical-align: middle;
|
||||
|
||||
span.user-name {
|
||||
color: $text;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.faded {
|
||||
opacity: 0.4;
|
||||
}
|
||||
|
||||
// 06. Flags
|
||||
// - - - - - - - - - - - - - - - - - - - - - - - - -
|
||||
|
||||
.flag-content {
|
||||
|
||||
.button {
|
||||
background: none;
|
||||
margin-bottom: 0;
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.flag-disable {
|
||||
color: $text-medium;
|
||||
line-height: rem-calc(24);
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.flag-active {
|
||||
@extend .flag-disable;
|
||||
color: $delete;
|
||||
}
|
||||
@@ -32,7 +32,16 @@
|
||||
<li class="name">
|
||||
<%= link_to root_path do %>
|
||||
<%= image_tag('header_logo_madrid.png', class: 'show-for-medium-up left', size: '96x96') %>
|
||||
<%= t("layouts.header.open_gov", open: "#{t('layouts.header.open')}").html_safe %> <span>|</span> <span class="logo-site"><%= t("layouts.header.participation") %></span>
|
||||
<%= t("layouts.header.open_gov", open: "#{t('layouts.header.open')}").html_safe %> <span>|</span>
|
||||
<span class="logo-site">
|
||||
<% if transparency_page? %>
|
||||
<%= t("layouts.header.transparency") %>
|
||||
<% elsif opendata_page? %>
|
||||
<%= t("layouts.header.open_data") %>
|
||||
<% else %>
|
||||
<%= t("layouts.header.participation") %>
|
||||
<% end %>
|
||||
</span>
|
||||
<% end %>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
@@ -10,7 +10,9 @@ en:
|
||||
external_link_blog_url: "/blog"
|
||||
open_gov: "%{open} government"
|
||||
open: "Open"
|
||||
participation: Participation
|
||||
participation: "Participation"
|
||||
transparency: "Transparency"
|
||||
open_data: "Open data"
|
||||
open_city_title: "The city you want, it will be the city you want."
|
||||
open_city_slogan_html:
|
||||
"Start listening to Madrid.
|
||||
@@ -118,7 +120,7 @@ en:
|
||||
one: 1 Comment
|
||||
other: "%{count} Comments"
|
||||
login_to_comment: "You need to %{signin} or %{signup} to comment."
|
||||
edit_debate_link: Edit
|
||||
edit_debate_link: "Edit debate"
|
||||
share: Share
|
||||
flag: "This debate has been flag as innapropiate for some users."
|
||||
edit:
|
||||
@@ -209,7 +211,7 @@ en:
|
||||
one: 1 Comment
|
||||
other: "%{count} Comments"
|
||||
login_to_comment: "You need to %{signin} or %{signup} to comment."
|
||||
edit_proposal_link: Edit
|
||||
edit_proposal_link: "Edit proposal"
|
||||
share: Share
|
||||
flag: "This proposal has been flag as innapropiate for some users."
|
||||
edit:
|
||||
|
||||
@@ -10,7 +10,9 @@ es:
|
||||
external_link_blog_url: "/blog"
|
||||
open_gov: "Gobierno %{open}"
|
||||
open: "abierto"
|
||||
participation: Participación
|
||||
participation: "Participación"
|
||||
transparency: "Transparencia"
|
||||
open_data: "Datos abiertos"
|
||||
open_city_title: "La ciudad que quieres será la ciudad que quieras."
|
||||
open_city_slogan_html:
|
||||
"Existen ciudades gobernadas directamente por sus habitantes, que <b>debaten</b> sobre temas que les preocupan, <b>proponen</b> ideas para mejorar
|
||||
@@ -118,7 +120,7 @@ es:
|
||||
one: 1 Comentario
|
||||
other: "%{count} Comentarios"
|
||||
login_to_comment: "Necesitas %{signin} o %{signup} para comentar."
|
||||
edit_debate_link: Editar
|
||||
edit_debate_link: "Editar debate"
|
||||
share: Compartir
|
||||
flag: "Este debate ha sido marcado como inapropiado por varios usuarios."
|
||||
edit:
|
||||
@@ -209,7 +211,7 @@ es:
|
||||
one: 1 Comentario
|
||||
other: "%{count} Comentarios"
|
||||
login_to_comment: "Necesitas %{signin} o %{signup} para comentar."
|
||||
edit_proposal_link: Editar
|
||||
edit_proposal_link: "Editar propuesta"
|
||||
share: Compartir
|
||||
flag: "Esta propuesta ha sido marcada como inapropiada por varios usuarios."
|
||||
edit:
|
||||
|
||||
@@ -184,7 +184,7 @@ feature 'Debates' do
|
||||
expect(page).not_to have_link('click me')
|
||||
expect(page.html).to_not include "<script>alert('hey')</script>"
|
||||
|
||||
click_link 'Edit'
|
||||
click_link 'Edit debate'
|
||||
|
||||
expect(current_path).to eq edit_debate_path(Debate.last)
|
||||
expect(page).not_to have_link('click me')
|
||||
|
||||
@@ -253,7 +253,7 @@ feature 'Proposals' do
|
||||
expect(page).not_to have_link('click me')
|
||||
expect(page.html).to_not include "<script>alert('hey')</script>"
|
||||
|
||||
click_link 'Edit'
|
||||
click_link 'Edit proposal'
|
||||
|
||||
expect(current_path).to eq edit_proposal_path(Proposal.last)
|
||||
expect(page).not_to have_link('click me')
|
||||
|
||||
Reference in New Issue
Block a user