diff --git a/.scss-lint.yml b/.scss-lint.yml
index 6c5785249..dfa46907b 100644
--- a/.scss-lint.yml
+++ b/.scss-lint.yml
@@ -94,7 +94,7 @@ linters:
NestingDepth:
enabled: true
- max_depth: 1
+ max_depth: 4
PlaceholderInExtend:
enabled: true
@@ -127,12 +127,11 @@ linters:
SelectorDepth:
enabled: true
- max_depth: 3
+ max_depth: 5
SelectorFormat:
enabled: true
convention: hyphenated_lowercase
- class_convention: '^(?:u|is|has)\-[a-z][a-zA-Z0-9]*$|^(?!u|is|has)[a-zA-Z][a-zA-Z0-9]*(?:\-[a-z][a-zA-Z0-9]*)?(?:\-\-[a-z][a-zA-Z0-9]*)?$'
Shorthand:
enabled: true
diff --git a/app/assets/stylesheets/_settings.scss b/app/assets/stylesheets/_settings.scss
index 613b1d123..00568ff51 100644
--- a/app/assets/stylesheets/_settings.scss
+++ b/app/assets/stylesheets/_settings.scss
@@ -53,53 +53,53 @@ $small-font-size: rem-calc(14);
$line-height: rem-calc(24);
$tiny-font-size: rem-calc(12);
-$brand: #004A83;
+$brand: #004a83;
$dark: darken($brand, 10%);
-$text: #222222;
+$text: #222;
$text-medium: #515151;
-$text-light: #BFBFBF;
+$text-light: #bfbfbf;
-$border: #DEE0E3;
+$border: #dee0e3;
$link: $brand;
$link-hover: darken($link, 20%);
$debates: $brand;
-$like: #7BD2A8;
-$unlike: #EF8585;
+$like: #7bd2a8;
+$unlike: #ef8585;
-$delete: #F04124;
-$check: #46DB91;
+$delete: #f04124;
+$check: #46db91;
-$proposals: #FFA42D;
+$proposals: #ffa42d;
$proposals-dark: #794500;
-$budget: #7E328A;
-$budget-hover: #7571BF;
+$budget: #7e328a;
+$budget-hover: #7571bf;
-$highlight: #E7F2FC;
-$light: #F5F7FA;
-$featured: #FFDC5C;
+$highlight: #e7f2fc;
+$light: #f5f7fa;
+$featured: #ffdc5c;
-$footer-border: #BFC1C3;
+$footer-border: #bfc1c3;
-$success-bg: #DFF0D8;
-$success-border: #D6E9C6;
-$color-success: #3C763D;
+$success-bg: #dff0d8;
+$success-border: #d6e9c6;
+$color-success: #3c763d;
-$info-bg: #D9EDF7;
-$info-border: #BCE8F1;
-$color-info: #31708F;
+$info-bg: #d9edf7;
+$info-border: #bce8f1;
+$color-info: #31708f;
-$warning-bg: #FCF8E3;
-$warning-border: #FAEBCC;
-$color-warning: #8A6D3B;
+$warning-bg: #fcf8e3;
+$warning-border: #faebcc;
+$color-warning: #8a6d3b;
-$alert-bg: #F2DEDE;
-$alert-border: #EBCCD1;
-$color-alert: #A94442;
+$alert-bg: #f2dede;
+$alert-border: #ebccd1;
+$color-alert: #a94442;
// 1. Global
@@ -118,8 +118,8 @@ $foundation-palette: (
$light-gray: #e6e6e6;
$medium-gray: #cacaca;
$dark-gray: #8a8a8a;
-$black: #222222;
-$white: #ffffff;
+$black: #222;
+$white: #fff;
$body-background: $white;
$body-font-color: $black;
$body-font-family: 'Source Sans Pro', 'Helvetica', 'Arial', sans-serif !important;
@@ -573,7 +573,7 @@ $tab-background: $white;
$tab-background-active: $white;
$tab-item-font-size: $base-font-size;
$tab-item-background-hover: $white;
-$tab-item-padding: $line-height/2 0;
+$tab-item-padding: $line-height / 2 0;
$tab-expand-max: 6;
$tab-content-background: $white;
$tab-content-border: $border;
diff --git a/app/assets/stylesheets/admin.scss b/app/assets/stylesheets/admin.scss
index 06d3e1983..9eff0e273 100644
--- a/app/assets/stylesheets/admin.scss
+++ b/app/assets/stylesheets/admin.scss
@@ -13,21 +13,21 @@
// 01. Global styles
// -----------------
-$admin-color: #CF3638;
+$admin-color: #cf3638;
-body.admin {
+.admin {
- header {
+ .header {
border: 0;
+ }
- .top-links {
- background: darken($admin-color, 15%);
- }
+ .top-links {
+ background: darken($admin-color, 15%);
+ }
- .back-web {
- padding-top: $line-height/4;
- text-decoration: underline;
- }
+ .back-web {
+ padding-top: $line-height / 4;
+ text-decoration: underline;
}
.top-bar {
@@ -42,62 +42,46 @@ body.admin {
}
}
- form {
+ .fieldset {
- .button {
- margin-top: 0;
-
- &.margin-top {
- margin-top: $line-height;
- }
+ select {
+ height: $line-height * 2;
}
- input[type="text"], textarea {
- width: 100%;
+ [type="text"] {
+ border-radius: 0;
+ margin-bottom: 0 !important;
+ }
+ }
+
+ th {
+ text-align: left;
+
+ &.text-center {
+ text-align: center;
}
- .fieldset {
+ &.text-right {
+ padding-right: $line-height;
+ text-align: right;
+ }
- select {
- height: $line-height*2;
- }
+ &.with-button {
+ line-height: $line-height * 2;
+ }
+ }
- .input-group input[type="text"] {
- border-radius: 0;
- margin-bottom: 0 !important;
- }
+ tr {
+ background: #fff;
+ border: 1px solid $border;
+
+ &:hover {
+ background: #f3f6f7;
}
}
table {
-
- th {
- text-align: left;
-
- &.text-center {
- text-align: center;
- }
-
- &.text-right {
- padding-right: $line-height;
- text-align: right;
- }
-
- &.with-button {
- line-height: $line-height*2;
- }
- }
-
- tr {
- background: white;
- border: 1px solid $border;
-
- &:hover {
- background: #f3f6f7;
- }
- }
-
- td.break {
+ .break {
word-break: break-word;
}
@@ -105,14 +89,15 @@ body.admin {
table-layout: fixed;
}
- input[type="submit"] ~ a, a ~ a {
+ [type="submit"] ~ a,
+ a ~ a {
margin-left: 0;
margin-right: 0;
- margin-top: $line-height/2;
+ margin-top: $line-height / 2;
@include breakpoint(medium) {
- margin-left: $line-height/2;
- margin-right: $line-height/2;
+ margin-left: $line-height / 2;
+ margin-right: $line-height / 2;
margin-top: 0;
}
}
@@ -122,7 +107,7 @@ body.admin {
max-width: none;
}
- .menu.simple li.active {
+ .menu.simple .active {
border-bottom: 2px solid $admin-color;
color: $admin-color;
}
@@ -132,10 +117,6 @@ body.admin {
padding-right: 0;
}
- #proposals {
- width: 100% !important;
- }
-
.accordion-title {
font-size: $base-font-size;
}
@@ -183,7 +164,7 @@ body.admin {
&:hover .on-hover-block {
display: block;
margin: 0;
- margin-top: $line-height/2;
+ margin-top: $line-height / 2;
width: 100%;
}
}
@@ -231,57 +212,53 @@ body.admin {
display: inline-block;
font-size: rem-calc(24);
line-height: $line-height;
- padding: $line-height/2 $line-height/4;
+ padding: $line-height / 2 $line-height / 4;
padding-left: 0;
vertical-align: middle;
}
+ }
- li {
- background: white;
- margin: 0;
- outline: 0;
+ li {
+ background: #fff;
+ margin: 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 {
- background: #f3f6f7;
- border-radius: rem-calc(6);
- -moz-border-radius: rem-calc(6);
- -webkit-border-radius: rem-calc(6);
- color: $admin-color;
- font-weight: bold;
- }
+ ul {
+ margin-left: $line-height / 1.5;
+ border-left: 1px solid $border;
+ padding-left: $line-height / 2;
}
- li a {
- color: $text;
- display: block;
- line-height: rem-calc(48);
- padding-left: rem-calc(12);
- vertical-align: top;
+ &.section-title {
+ border-bottom: 1px solid $border;
+ }
- &:hover {
- 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;
- }
+ &.active a {
+ background: #f3f6f7;
+ border-radius: rem-calc(6);
+ color: $admin-color;
+ font-weight: bold;
+ }
+ }
+
+ li a {
+ color: $text;
+ 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;
+ text-decoration: none;
}
}
.is-accordion-submenu-parent {
- & > a::after {
+ > a::after {
border-color: $admin-color transparent transparent;
}
}
@@ -291,11 +268,11 @@ body.admin {
margin-left: $line-height;
li:first-child {
- padding-top: $line-height/2;
+ padding-top: $line-height / 2;
}
li:last-child {
- padding-bottom: $line-height/2;
+ padding-bottom: $line-height / 2;
}
a {
@@ -308,12 +285,14 @@ body.admin {
// -----------------
.delete {
- border-bottom: 1px dotted #CF2A0E;
+ border-bottom: 1px dotted #cf2a0e;
color: $delete;
font-size: $small-font-size;
- &:hover, &:active, &:focus {
- border-bottom: 1px dotted white;
+ &:hover,
+ &:active,
+ &:focus {
+ border-bottom: 1px dotted #fff;
color: #cf2a0e;
}
}
@@ -376,8 +355,6 @@ body.admin {
&:hover {
max-height: rem-calc(1000);
transition: max-height 0.9s;
- -moz-transition: max-height 0.9s;
- -webkit-transition: max-height 0.9s;
}
}
@@ -385,7 +362,7 @@ body.admin {
// ---------
.stats {
- background: white;
+ background: #fff;
}
.stats-numbers {
@@ -417,34 +394,36 @@ body.admin {
ul {
list-style-type: none;
margin-left: 0;
+ }
- li {
- font-size: rem-calc(14);
- margin-bottom: rem-calc(12);
+ li {
+ font-size: rem-calc(14);
+ margin-bottom: rem-calc(12);
- span {
- color: $text-medium;
- font-size: rem-calc(12);
- }
+ span {
+ color: $text-medium;
+ font-size: rem-calc(12);
+ }
- .icon-check {
- color: $check;
- }
+ .icon-check {
+ color: $check;
+ }
- .icon-x {
- color: $delete;
- }
+ .icon-x {
+ color: $delete;
}
}
}
-.account-info, .login-as, .spending-proposal-info {
+.account-info,
+.login-as,
+.spending-proposal-info {
background-color: #e7e7e7;
border-radius: rem-calc(3);
font-size: rem-calc(16);
font-weight: normal;
margin: $line-height;
- padding: $line-height/2;
+ padding: $line-height / 2;
strong {
font-size: rem-calc(18);
@@ -455,40 +434,42 @@ body.admin {
margin-bottom: 0;
}
-body.admin {
+.admin {
.investment-projects-list.medium-9 {
width: 100%;
}
+}
- .investment-projects-summary {
+.investment-projects-summary {
- th, td {
- text-align: center;
+ th,
+ td {
+ text-align: center;
- &:first-child {
- font-weight: bold;
- text-align: left;
- }
-
- &:last-child {
- font-weight: bold;
- }
+ &:first-child {
+ font-weight: bold;
+ text-align: left;
}
- tr {
- &:nth-child(even) td:last-child {
- background: $success-border;
- }
+ &:last-child {
+ font-weight: bold;
+ }
+ }
- &:nth-child(odd) td:last-child {
- background: $success-bg;
- }
+ tr {
+ &:nth-child(even) td:last-child {
+ background: $success-border;
+ }
+
+ &:nth-child(odd) td:last-child {
+ background: $success-bg;
}
}
}
-.admin-content .select-geozone, .admin-content .select-heading {
+.admin-content .select-geozone,
+.admin-content .select-heading {
a {
display: block;
@@ -501,14 +482,14 @@ body.admin {
}
}
-table.investment-projects-summary {
+.investment-projects-summary {
- td.total-price {
+ .total-price {
white-space: nowrap;
}
}
-body.admin {
+.admin {
.geozone {
background: #ececec;
@@ -516,8 +497,8 @@ body.admin {
color: $text;
display: inline-block;
font-size: $small-font-size;
- margin-bottom: $line-height/3;
- padding: $line-height/4 $line-height/3;
+ margin-bottom: $line-height / 3;
+ padding: $line-height / 4 $line-height / 3;
text-decoration: none;
&:hover {
@@ -538,9 +519,9 @@ body.admin {
table {
.callout {
- height: $line-height*2;
- line-height: $line-height*2;
- padding: 0 $line-height/2;
+ height: $line-height * 2;
+ line-height: $line-height * 2;
+ padding: 0 $line-height / 2;
}
}
@@ -551,15 +532,15 @@ table {
// ---------------
.markdown-editor {
- background-color: white;
+ background-color: #fff;
.markdown-area,
- #markdown-preview {
+ .markdown-preview {
display: none;
}
}
-.markdown-editor #markdown-preview {
+.markdown-editor .markdown-preview {
overflow-y: auto;
height: 15em;
}
@@ -577,11 +558,11 @@ table {
left: 0;
}
-.markdown-editor.fullscreen #markdown-preview {
+.markdown-editor.fullscreen .markdown-preview {
height: 99%;
}
-.edit_legislation_draft_version .row {
+.edit-legislation-draft-version .row {
margin-bottom: 2rem;
}
@@ -614,7 +595,7 @@ table {
// 08. CMS
// --------------
-.cms_page_list {
+.cms-page-list {
[class^="icon-"] {
padding-right: $menu-icon-spacing;
@@ -624,17 +605,18 @@ table {
.legislation-process-edit {
- .edit_legislation_process {
+ .edit-legislation-process {
small {
color: $text-medium;
}
- input[type]:not([type="submit"]):not([type="file"]):not([type="checkbox"]):not([type="radio"]) {
+ [type]:not([type="submit"]):not([type="file"]):not([type="checkbox"]):not([type="radio"]) {
background: $white;
}
- .legislation-process-start, .legislation-process-end {
+ .legislation-process-start,
+ .legislation-process-end {
@include breakpoint(medium) {
line-height: 3rem;
}
@@ -664,7 +646,7 @@ table {
.legislation-questions-form {
- input[type]:not([type="submit"]):not([type="file"]):not([type="checkbox"]):not([type="radio"]) {
+ [type]:not([type="submit"]):not([type="file"]):not([type="checkbox"]):not([type="radio"]) {
background: $white;
margin-bottom: 0;
@@ -673,53 +655,113 @@ table {
}
}
- input::-webkit-input-placeholder {
- font-style: italic;
- }
-
- input:-moz-placeholder { /* Firefox 18- */
- font-style: italic;
- }
-
- input::-moz-placeholder { /* Firefox 19+ */
- font-style: italic;
- }
-
- input:-ms-input-placeholder {
+ input::placeholder {
font-style: italic;
}
.legislation-questions-answers {
margin-bottom: 1rem;
}
+}
- .field {
- margin-bottom: 1rem;
+.field {
+ margin-bottom: 1rem;
- @include breakpoint(medium) {
- margin-bottom: 0;
+ @include breakpoint(medium) {
+ margin-bottom: 0;
+ }
+
+ a {
+ line-height: 3rem;
+ color: $delete;
+
+ span {
+ text-decoration: underline;
}
+ .icon-x {
+ vertical-align: sub;
+ text-decoration: none;
+ line-height: 0;
+ }
+
+ &:active,
+ &:focus,
+ &:hover {
+ text-decoration: none;
+ }
+ }
+}
+
+.fullscreen-container {
+
+ a {
+ line-height: 8rem;
+
+ &:active,
+ &:focus,
+ &:hover {
+ text-decoration: none;
+ }
+ }
+}
+
+.fullscreen {
+
+ .fullscreen-container {
+
a {
line-height: 3rem;
- color: $delete;
- span {
- text-decoration: underline;
+ @include breakpoint(medium) {
+ float: right;
}
+ }
- .icon-x {
- vertical-align: sub;
- text-decoration: none;
- line-height: 0;
- }
+ .markdown-editor-header {
+ vertical-align: top;
+ display: inline-block;
+ color: $white;
- &:active,
- &:focus,
- &:hover {
- text-decoration: none;
+ @include breakpoint(medium) {
+ line-height: 3rem;
}
}
+
+ .truncate {
+ @include breakpoint(medium) {
+ width: 40vw;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ }
+ }
+
+ .markdown-editor-buttons {
+ display: block;
+
+ @include breakpoint(medium) {
+ display: inline-block;
+ float: right;
+ padding-left: 1rem;
+ }
+ }
+
+ input {
+ font-size: $small-font-size;
+ padding: 0.5em 1em;
+ margin-left: 0;
+ margin-bottom: 0;
+ margin-top: 1rem;
+
+ @include breakpoint(medium) {
+ margin: 0.5rem;
+ }
+ }
+
+ a {
+ color: $white;
+ }
}
}
@@ -731,7 +773,7 @@ table {
}
}
- input[type]:not([type="submit"]):not([type="file"]):not([type="checkbox"]):not([type="radio"]) {
+ [type]:not([type="submit"]):not([type="file"]):not([type="checkbox"]):not([type="radio"]) {
background: $white;
}
@@ -761,30 +803,20 @@ table {
display: none;
}
- a {
- line-height: 8rem;
+ span {
+ text-decoration: none;
+ font-size: $small-font-size;
+ }
- span {
- text-decoration: none;
- font-size: $small-font-size;
- }
-
- .icon-expand {
- margin-left: 0.25rem;
- vertical-align: sub;
- text-decoration: none;
- line-height: 0;
- }
-
- &:active,
- &:focus,
- &:hover {
- text-decoration: none;
- }
+ .icon-expand {
+ margin-left: 0.25rem;
+ vertical-align: sub;
+ text-decoration: none;
+ line-height: 0;
}
}
- #legislation_draft_version_body {
+ .legislation-draft-version-body {
font-family: $font-family-serif;
background: #f5f5f5;
height: 16em;
@@ -795,12 +827,17 @@ table {
}
}
- #markdown-preview {
+ .markdown-preview {
font-family: $font-family-serif;
border: 1px solid #cacaca;
margin-bottom: 2rem;
- h1, h2, h3, h4, h5, h6 {
+ h1,
+ h2,
+ h3,
+ h4,
+ h5,
+ h6 {
font-family: $font-family-serif !important;
font-size: 1rem;
line-height: 1.625rem;
@@ -816,7 +853,7 @@ table {
.fullscreen {
.markdown-area,
- #markdown-preview {
+ .markdown-preview {
display: block;
}
@@ -829,78 +866,21 @@ table {
background: $admin-color;
padding: 0.5rem 1rem;
margin-bottom: 0;
-
- a {
- line-height: 3rem;
-
- @include breakpoint(medium) {
- float: right;
- }
- }
-
- .markdown-editor-header {
- vertical-align: top;
- display: inline-block;
- color: $white;
-
- @include breakpoint(medium) {
- line-height: 3rem;
- }
- }
-
- .truncate {
- @include breakpoint(medium) {
- width: 40vw;
- white-space: nowrap;
- overflow: hidden;
- text-overflow: ellipsis;
- }
- }
-
- .markdown-editor-buttons {
- display: block;
-
- @include breakpoint(medium) {
- display: inline-block;
- float: right;
- padding-left: 1rem;
- }
-
- input {
- font-size: $small-font-size;
- padding: 0.5em 1em;
- margin-left: 0;
- margin-bottom: 0;
- margin-top: 1rem;
-
- @include breakpoint(medium) {
- margin: 0.5rem;
- }
- }
- }
-
- a {
- color: $white;
- }
}
- #legislation_draft_version_body {
+ .legislation-draft-version-body {
border-radius: 0;
padding: 1rem;
- border: none;
+ border: 0;
@include breakpoint(medium) {
padding: 1rem 2rem;
}
-
- &:focus {
- border: none;
- }
}
- #markdown-preview {
+ .markdown-preview {
padding: 1rem;
- border: none;
+ border: 0;
@include breakpoint(medium) {
padding: 1rem 2rem;
@@ -908,3 +888,9 @@ table {
}
}
}
+
+.legislation-draft-version-body {
+ &:focus {
+ border: 0;
+ }
+}
diff --git a/app/assets/stylesheets/annotator_overrides.scss b/app/assets/stylesheets/annotator_overrides.scss
index 5132d68eb..9bf27f22c 100644
--- a/app/assets/stylesheets/annotator_overrides.scss
+++ b/app/assets/stylesheets/annotator_overrides.scss
@@ -2,59 +2,59 @@
//
.annotator-editor .annotator-controls,
-.annotator-filter, .annotator-filter
-.annotator-filter-navigation button {
- background: #F3F3F3;
+.annotator-filter,
+.annotator-filter .annotator-filter-navigation button {
+ background: #f3f3f3;
background-image: none;
border: 0;
border-radius: 0;
border-top: 1px solid $border;
box-shadow: none;
- padding: $line-height/2 $line-height/4;
+ padding: $line-height / 2 $line-height / 4;
}
.annotator-adder {
- background-image: image-url("annotator_adder.png");
+ background-image: image-url('annotator_adder.png');
margin-top: -52px;
}
.annotator-widget {
- background: white;
+ background: #fff;
border: 1px solid $border;
border-radius: 0;
bottom: $line-height;
- box-shadow: 0 0 5px rgba(0,0,0,0.05);
+ box-shadow: 0 0 5px rgba(0, 0, 0, 0.05);
font-family: $body-font-family;
font-size: $base-font-size;
line-height: $line-height;
- min-width: $line-height*13;
+ min-width: $line-height * 13;
p {
color: $text;
- padding: $line-height/2;
+ padding: $line-height / 2;
}
}
.annotator-item,
.annotator-editor .annotator-item input:focus,
.annotator-editor .annotator-item textarea:focus {
- background: white;
+ background: #fff;
}
-.annotator-widget:after,
-.annotator-editor.annotator-invert-y .annotator-widget:after {
- background-image: image-url("annotator_items.png");
+.annotator-widget::after,
+.annotator-editor.annotator-invert-y .annotator-widget::after {
+ background-image: image-url('annotator_items.png');
}
.annotator-editor a,
.annotator-filter .annotator-filter-property label {
- padding: 0 $line-height/4;
+ padding: 0 $line-height / 4;
}
.annotator-editor a {
background: none;
background-image: none;
- border: none;
+ border: 0;
box-shadow: none;
color: $link;
font-family: $body-font-family;
@@ -63,7 +63,9 @@
text-shadow: none;
padding: 0;
- &:hover, &:active, &:focus {
+ &:hover,
+ &:active,
+ &:focus {
background: none;
background-image: none;
color: $link-hover;
@@ -71,28 +73,28 @@
text-shadow: none;
}
- &:after {
+ &::after {
content: none;
}
&.annotator-cancel {
- background: #F04124;
- color: white;
- padding: $line-height/4 $line-height/2;
+ background: #f04124;
+ color: #fff;
+ padding: $line-height / 4 $line-height / 2;
&:hover {
- background: darken(#F04124, 20);
+ background: darken(#f04124, 20);
text-decoration: none;
}
}
&.annotator-save {
- background: #43AC6A;
- color: white;
- padding: $line-height/4 $line-height/2;
+ background: #43ac6a;
+ color: #fff;
+ padding: $line-height / 4 $line-height / 2;
&:hover {
- background: darken(#43AC6A, 20);
+ background: darken(#43ac6a, 20);
text-decoration: none;
}
}
@@ -104,19 +106,23 @@
}
.annotator-hl.weight-1 {
- background: #FFF9DA;
+ background: #fff9da;
}
+
.annotator-hl.weight-2 {
- background: #FFF5BC;
+ background: #fff5bc;
}
+
.annotator-hl.weight-3 {
- background: #FFF1A2;
+ background: #fff1a2;
}
+
.annotator-hl.weight-4 {
- background: #FFEF8C;
+ background: #ffef8c;
}
+
.annotator-hl.weight-5 {
- background: #FFE95F;
+ background: #ffe95f;
}
.current-annotation {
diff --git a/app/assets/stylesheets/application.scss b/app/assets/stylesheets/application.scss
index c67d85471..a14cf3383 100644
--- a/app/assets/stylesheets/application.scss
+++ b/app/assets/stylesheets/application.scss
@@ -1,17 +1,17 @@
-@import "social-share-button";
-@import "foundation_and_overrides";
-@import "fonts";
-@import "icons";
-@import "mixins";
-@import "admin";
-@import "layout";
-@import "participation";
-@import "pages";
-@import "legislation";
-@import "legislation_process";
-@import "custom";
-@import "c3";
-@import "annotator.min";
-@import "annotator_overrides";
-@import "jquery-ui/datepicker";
-@import "datepicker_overrides";
+@import 'social-share-button';
+@import 'foundation_and_overrides';
+@import 'fonts';
+@import 'icons';
+@import 'mixins';
+@import 'admin';
+@import 'layout';
+@import 'participation';
+@import 'pages';
+@import 'legislation';
+@import 'legislation_process';
+@import 'custom';
+@import 'c3';
+@import 'annotator.min';
+@import 'annotator_overrides';
+@import 'jquery-ui/datepicker';
+@import 'datepicker_overrides';
diff --git a/app/assets/stylesheets/datepicker_overrides.scss b/app/assets/stylesheets/datepicker_overrides.scss
index dbbab4bd5..d4c07802e 100644
--- a/app/assets/stylesheets/datepicker_overrides.scss
+++ b/app/assets/stylesheets/datepicker_overrides.scss
@@ -3,7 +3,7 @@
.ui-datepicker-header {
background: $brand;
- color: white;
+ color: #fff;
font-weight: bold;
}
@@ -14,9 +14,17 @@
color: $text;
}
- .ui-state-hover, .ui-state-active {
+ .ui-state-hover,
+ .ui-state-active {
background: $brand;
- color: white;
+ color: #fff;
+ }
+
+ thead {
+
+ tr th {
+ color: $dark;
+ }
}
}
@@ -32,8 +40,9 @@
right: 12px;
}
- .ui-datepicker-prev, .ui-datepicker-next {
- color: white;
+ .ui-datepicker-prev,
+ .ui-datepicker-next {
+ color: #fff;
cursor: pointer;
font-weight: normal;
font-size: $small-font-size;
@@ -44,51 +53,42 @@
table {
border: 1px solid $border;
border-top: 0;
+ }
- thead {
- background: $dark;
- border-left: 1px solid $dark;
- border-right: 1px solid $dark;
+ tr {
+ border-bottom: 1px solid $border;
- tr th {
- color: $dark;
- }
+ &:last-child {
+ border-bottom: 0;
}
- tr {
- border-bottom: 1px solid $border;
+ &:nth-child(odd) {
+ background: none;
+ }
+ }
- &:last-child {
- border-bottom: 0px;
- }
+ td {
+ padding: 0;
+ border-right: 1px solid $border;
- &:nth-child(odd) {
- background: none;
- }
+ &:last-child {
+ border-right: 0;
}
- td {
- padding: 0;
- border-right: 1px solid $border;
-
- &:last-child {
- border-right: 0px;
- }
-
- span, a {
- text-align: center;
- line-height: $line-height;
- color: $text;
- }
-
- &.ui-datepicker-unselectable.ui-state-disabled {
- background: white;
-
- .ui-state-default {
- background: #F8F8F8;
- color: $text-medium;
- }
- }
+ span,
+ a {
+ text-align: center;
+ line-height: $line-height;
+ color: $text;
}
}
}
+
+.ui-datepicker-unselectable.ui-state-disabled {
+ background: #fff;
+
+ .ui-state-default {
+ background: #f8f8f8;
+ color: $text-medium;
+ }
+}
diff --git a/app/assets/stylesheets/fonts.scss b/app/assets/stylesheets/fonts.scss
index e8fe6a4bf..61429e800 100644
--- a/app/assets/stylesheets/fonts.scss
+++ b/app/assets/stylesheets/fonts.scss
@@ -16,7 +16,7 @@
font-url('sourcesanspro-light-webfont.woff2') format('woff2'),
font-url('sourcesanspro-light-webfont.woff') format('woff'),
font-url('sourcesanspro-light-webfont.ttf') format('truetype'),
- font-url('sourcesanspro-light-webfont.svg#source_sans_prolight') format('svg')
+ font-url('sourcesanspro-light-webfont.svg#source_sans_prolight') format('svg');
}
@font-face {
@@ -67,7 +67,7 @@
font-url('lato-light.ttf') format('truetype'),
font-url('lato-light.svg#latolight') format('svg');
font-weight: lighter;
- font-style: normal
+ font-style: normal;
}
@font-face {
@@ -79,7 +79,7 @@
font-url('lato-regular.ttf') format('truetype'),
font-url('lato-regular.svg#latoregular') format('svg');
font-weight: normal;
- font-style: normal
+ font-style: normal;
}
@font-face {
@@ -91,5 +91,5 @@
font-url('lato-bold.ttf') format('truetype'),
font-url('lato-bold.svg#latobold') format('svg');
font-weight: bold;
- font-style: normal
-}
\ No newline at end of file
+ font-style: normal;
+}
diff --git a/app/assets/stylesheets/icons.scss b/app/assets/stylesheets/icons.scss
index 5805fb090..782b5cdb2 100644
--- a/app/assets/stylesheets/icons.scss
+++ b/app/assets/stylesheets/icons.scss
@@ -1,4 +1,5 @@
@charset "UTF-8";
+
@font-face {
font-family: 'icons';
src: font-url('icons.eot');
@@ -9,7 +10,8 @@
font-weight: normal;
font-style: normal;
}
-[data-icon]:before {
+
+[data-icon]::before {
font-family: "icons" !important;
content: attr(data-icon);
font-style: normal !important;
@@ -21,8 +23,9 @@
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
-[class^="icon-"]:before,
-[class*=" icon-"]:before {
+
+[class^="icon-"]::before,
+[class*=" icon-"]::before {
font-family: "icons" !important;
font-style: normal !important;
font-weight: normal !important;
@@ -33,168 +36,223 @@
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
-.icon-angle-down:before {
- content: "\61";
+
+.icon-angle-down::before {
+ content: '\61';
}
-.icon-angle-left:before {
- content: "\62";
+
+.icon-angle-left::before {
+ content: '\62';
}
-.icon-angle-right:before {
- content: "\63";
+
+.icon-angle-right::before {
+ content: '\63';
}
-.icon-angle-up:before {
- content: "\64";
+
+.icon-angle-up::before {
+ content: '\64';
}
-.icon-comments:before {
- content: "\65";
+
+.icon-comments::before {
+ content: '\65';
}
-.icon-twitter:before {
- content: "\66";
+
+.icon-twitter::before {
+ content: '\66';
}
-.icon-calendar:before {
- content: "\67";
+
+.icon-calendar::before {
+ content: '\67';
}
-.icon-debates:before {
- content: "\69";
+
+.icon-debates::before {
+ content: '\69';
}
-.icon-unlike:before {
- content: "\6a";
+
+.icon-unlike::before {
+ content: '\6a';
}
-.icon-like:before {
- content: "\6b";
+
+.icon-like::before {
+ content: '\6b';
}
-.icon-check:before {
- content: "\6c";
+
+.icon-check::before {
+ content: '\6c';
}
-.icon-edit:before {
- content: "\6d";
+
+.icon-edit::before {
+ content: '\6d';
}
-.icon-user:before {
- content: "\6f";
+
+.icon-user::before {
+ content: '\6f';
}
-.icon-settings:before {
- content: "\71";
+
+.icon-settings::before {
+ content: '\71';
}
-.icon-stats:before {
- content: "\72";
+
+.icon-stats::before {
+ content: '\72';
}
-.icon-proposals:before {
- content: "\68";
+
+.icon-proposals::before {
+ content: '\68';
}
-.icon-organizations:before {
- content: "\73";
+
+.icon-organizations::before {
+ content: '\73';
}
-.icon-deleted:before {
- content: "\74";
+
+.icon-deleted::before {
+ content: '\74';
}
-.icon-tag:before {
- content: "\75";
+
+.icon-tag::before {
+ content: '\75';
}
-.icon-eye:before {
- content: "\70";
+
+.icon-eye::before {
+ content: '\70';
}
-.icon-x:before {
- content: "\76";
+
+.icon-x::before {
+ content: '\76';
}
-.icon-flag:before {
- content: "\77";
+
+.icon-flag::before {
+ content: '\77';
}
-.icon-comment:before {
- content: "\79";
+
+.icon-comment::before {
+ content: '\79';
}
-.icon-reply:before {
- content: "\7a";
+
+.icon-reply::before {
+ content: '\7a';
}
-.icon-facebook:before {
- content: "\41";
+
+.icon-facebook::before {
+ content: '\41';
}
-.icon-google-plus:before {
- content: "\42";
+
+.icon-google-plus::before {
+ content: '\42';
}
-.icon-search:before {
- content: "\45";
+
+.icon-search::before {
+ content: '\45';
}
-.icon-external:before {
- content: "\46";
+
+.icon-external::before {
+ content: '\46';
}
-.icon-video:before {
- content: "\44";
+
+.icon-video::before {
+ content: '\44';
}
-.icon-document:before {
- content: "\47";
+
+.icon-document::before {
+ content: '\47';
}
-.icon-print:before {
- content: "\48";
+
+.icon-print::before {
+ content: '\48';
}
-.icon-blog:before {
- content: "\4a";
+
+.icon-blog::before {
+ content: '\4a';
}
-.icon-box:before {
- content: "\49";
+
+.icon-box::before {
+ content: '\49';
}
-.icon-youtube:before {
- content: "\4b";
+
+.icon-youtube::before {
+ content: '\4b';
}
-.icon-letter:before {
- content: "\4c";
+
+.icon-letter::before {
+ content: '\4c';
}
-.icon-circle:before {
- content: "\43";
+
+.icon-circle::before {
+ content: '\43';
}
-.icon-circle-o:before {
- content: "\4d";
+
+.icon-circle-o::before {
+ content: '\4d';
}
-.icon-help:before {
- content: "\4e";
+
+.icon-help::before {
+ content: '\4e';
}
-.icon-budget:before {
- content: "\53";
+
+.icon-budget::before {
+ content: '\53';
}
-.icon-notification:before {
- content: "\6e";
+
+.icon-notification::before {
+ content: '\6e';
}
-.icon-no-notification:before {
- content: "\78";
+
+.icon-no-notification::before {
+ content: '\78';
}
-.icon-whatsapp:before {
- content: "\50";
+
+.icon-whatsapp::before {
+ content: '\50';
}
-.icon-zip:before {
- content: "\4f";
+
+.icon-zip::before {
+ content: '\4f';
}
-.icon-banner:before {
- content: "\51";
+
+.icon-banner::before {
+ content: '\51';
}
-.icon-arrow-down:before {
- content: "\52";
+
+.icon-arrow-down::before {
+ content: '\52';
}
-.icon-arrow-left:before {
- content: "\54";
+
+.icon-arrow-left::before {
+ content: '\54';
}
-.icon-arrow-right:before {
- content: "\55";
+
+.icon-arrow-right::before {
+ content: '\55';
}
-.icon-check-circle:before {
- content: "\56";
+
+.icon-check-circle::before {
+ content: '\56';
}
-.icon-arrow-top:before {
- content: "\57";
+
+.icon-arrow-top::before {
+ content: '\57';
}
-.icon-checkmark-circle:before {
- content: "\59";
+
+.icon-checkmark-circle::before {
+ content: '\59';
}
-.icon-minus-square:before {
- content: "\58";
+
+.icon-minus-square::before {
+ content: '\58';
}
-.icon-plus-square:before {
- content: "\5a";
+
+.icon-plus-square::before {
+ content: '\5a';
}
-.icon-expand:before {
- content: "\30";
+
+.icon-expand::before {
+ content: '\30';
}
-.icon-telegram:before {
- content: "\31";
+
+.icon-telegram::before {
+ content: '\31';
}
-.icon-instagram:before {
- content: "\32";
+
+.icon-instagram::before {
+ content: '\32';
}
diff --git a/app/assets/stylesheets/ie.scss b/app/assets/stylesheets/ie.scss
index 2c494747b..46f5916b2 100644
--- a/app/assets/stylesheets/ie.scss
+++ b/app/assets/stylesheets/ie.scss
@@ -8,7 +8,9 @@
// 01. Global styles
// -----------------
-*, *:before, *:after {
+*,
+*::before,
+*::after {
box-sizing: border-box !important;
}
@@ -23,96 +25,344 @@
display: block !important;
}
-.column, .columns {
+.column,
+.columns {
display: inline-block !important;
float: none !important;
box-sizing: border-box !important;
}
-.small-1, .row .small-1 { width: 7.33333%; }
-.small-2, .row .small-2 { width: 15.66667%; }
-.small-3, .row .small-3 { width: 24%; }
-.small-4, .row .small-4 { width: 32.33333%; }
-.small-5, .row .small-5 { width: 40.66667%; }
-.small-6, .row .small-6 { width: 49%; }
-.small-7, .row .small-7 { width: 57.33333%; }
-.small-8, .row .small-8 { width: 65.66667%; }
-.small-9, .row .small-9 { width: 74%; }
-.small-10, .row .small-10 { width: 82.33333%; }
-.small-11, .row .small-11 { width: 90.66667%; }
-.small-12, .row .small-12 { width: 99%; }
+.small-1,
+.row .small-1 {
+ width: 7.33333%;
+}
-.medium-1, .row .medium-1 { width: 7.33333%; }
-.medium-2, .row .medium-2 { width: 15.66667%; }
-.medium-3, .row .medium-3 { width: 24%; }
-.medium-4, .row .medium-4 { width: 32.33333%; }
-.medium-5, .row .medium-5 { width: 40.66667%; }
-.medium-6, .row .medium-6 { width: 49%; }
-.medium-7, .row .medium-7 { width: 57.33333%; }
-.medium-8, .row .medium-8 { width: 65.66667%; }
-.medium-9, .row .medium-9 { width: 74%; }
-.medium-10, .row .medium-10 { width: 82.33333%; }
-.medium-11, .row .medium-11 { width: 90.66667%; }
-.medium-12, .row .medium-12 { width: 99%; }
+.small-2,
+.row .small-2 {
+ width: 15.66667%;
+}
-.large-1, .row .large-1 { width: 7.33333%; }
-.large-2, .row .large-2 { width: 15.66667%; }
-.large-3, .row .large-3 { width: 24%; }
-.large-4, .row .large-4 { width: 32.33333%; }
-.large-5, .row .large-5 { width: 40.66667%; }
-.large-6, .row .large-6 { width: 49%; }
-.large-7, .row .large-7 { width: 57.33333%; }
-.large-8, .row .large-8 { width: 65.66667%; }
-.large-9, .row .large-9 { width: 74%; }
-.large-10, .row .large-10 { width: 82.33333%; }
-.large-11, .row .large-11 { width: 90.66667%; }
-.large-12, .row .large-12 { width: 99%; }
+.small-3,
+.row .small-3 {
+ width: 24%;
+}
-.row .small-offset-1 { margin-left: 7.33333%; }
-.row .small-offset-2 { margin-left: 15.66667%; }
-.row .small-offset-3 { margin-left: 24%; }
-.row .small-offset-4 { margin-left: 32.33333%; }
-.row .small-offset-5 { margin-left: 40.66667%; }
-.row .small-offset-6 { margin-left: 49%; }
-.row .small-offset-7 { margin-left: 57.33333%; }
-.row .small-offset-8 { margin-left: 65.66667%; }
-.row .small-offset-9 { margin-left: 74%; }
-.row .small-offset-10 { margin-left: 82.33333%; }
-.row .small-offset-11 { margin-left: 90.66667%; }
-.row .small-offset-12 { margin-left: 99%; }
+.small-4,
+.row .small-4 {
+ width: 32.33333%;
+}
-.row .medium-offset-1 { margin-left: 7.33333%; }
-.row .medium-offset-2 { margin-left: 15.66667%; }
-.row .medium-offset-3 { margin-left: 24%; }
-.row .medium-offset-4 { margin-left: 32.33333%; }
-.row .medium-offset-5 { margin-left: 40.66667%; }
-.row .medium-offset-6 { margin-left: 49%; }
-.row .medium-offset-7 { margin-left: 57.33333%; }
-.row .medium-offset-8 { margin-left: 65.66667%; }
-.row .medium-offset-9 { margin-left: 74%; }
-.row .medium-offset-10 { margin-left: 82.33333%; }
-.row .medium-offset-11 { margin-left: 90.66667%; }
-.row .medium-offset-12 { margin-left: 99%; }
+.small-5,
+.row .small-5 {
+ width: 40.66667%;
+}
-.row .large-offset-1 { margin-left: 7.33333%; }
-.row .large-offset-2 { margin-left: 15.66667%; }
-.row .large-offset-3 { margin-left: 24%; }
-.row .large-offset-4 { margin-left: 32.33333%; }
-.row .large-offset-5 { margin-left: 40.66667%; }
-.row .large-offset-6 { margin-left: 49%; }
-.row .large-offset-7 { margin-left: 57.33333%; }
-.row .large-offset-8 { margin-left: 65.66667%; }
-.row .large-offset-9 { margin-left: 74%; }
-.row .large-offset-10 { margin-left: 82.33333%; }
-.row .large-offset-11 { margin-left: 90.66667%; }
-.row .large-offset-12 { margin-left: 99%; }
+.small-6,
+.row .small-6 {
+ width: 49%;
+}
+
+.small-7,
+.row .small-7 {
+ width: 57.33333%;
+}
+
+.small-8,
+.row .small-8 {
+ width: 65.66667%;
+}
+
+.small-9,
+.row .small-9 {
+ width: 74%;
+}
+
+.small-10,
+.row .small-10 {
+ width: 82.33333%;
+}
+
+.small-11,
+.row .small-11 {
+ width: 90.66667%;
+}
+
+.small-12,
+.row .small-12 {
+ width: 99%;
+}
+
+.medium-1,
+.row .medium-1 {
+ width: 7.33333%;
+}
+
+.medium-2,
+.row .medium-2 {
+ width: 15.66667%;
+}
+
+.medium-3,
+.row .medium-3 {
+ width: 24%;
+}
+
+.medium-4,
+.row .medium-4 {
+ width: 32.33333%;
+}
+
+.medium-5,
+.row .medium-5 {
+ width: 40.66667%;
+}
+
+.medium-6,
+.row .medium-6 {
+ width: 49%;
+}
+
+.medium-7,
+.row .medium-7 {
+ width: 57.33333%;
+}
+
+.medium-8,
+.row .medium-8 {
+ width: 65.66667%;
+}
+
+.medium-9,
+.row .medium-9 {
+ width: 74%;
+}
+
+.medium-10,
+.row .medium-10 {
+ width: 82.33333%;
+}
+
+.medium-11,
+.row .medium-11 {
+ width: 90.66667%;
+}
+
+.medium-12,
+.row .medium-12 {
+ width: 99%;
+}
+
+.large-1,
+.row .large-1 {
+ width: 7.33333%;
+}
+
+.large-2,
+.row .large-2 {
+ width: 15.66667%;
+}
+
+.large-3,
+.row .large-3 {
+ width: 24%;
+}
+
+.large-4,
+.row .large-4 {
+ width: 32.33333%;
+}
+
+.large-5,
+.row .large-5 {
+ width: 40.66667%;
+}
+
+.large-6,
+.row .large-6 {
+ width: 49%;
+}
+
+.large-7,
+.row .large-7 {
+ width: 57.33333%;
+}
+
+.large-8,
+.row .large-8 {
+ width: 65.66667%;
+}
+
+.large-9,
+.row .large-9 {
+ width: 74%;
+}
+
+.large-10,
+.row .large-10 {
+ width: 82.33333%;
+}
+
+.large-11,
+.row .large-11 {
+ width: 90.66667%;
+}
+
+.large-12,
+.row .large-12 {
+ width: 99%;
+}
+
+.row .small-offset-1 {
+ margin-left: 7.33333%;
+}
+
+.row .small-offset-2 {
+ margin-left: 15.66667%;
+}
+
+.row .small-offset-3 {
+ margin-left: 24%;
+}
+
+.row .small-offset-4 {
+ margin-left: 32.33333%;
+}
+
+.row .small-offset-5 {
+ margin-left: 40.66667%;
+}
+
+.row .small-offset-6 {
+ margin-left: 49%;
+}
+
+.row .small-offset-7 {
+ margin-left: 57.33333%;
+}
+
+.row .small-offset-8 {
+ margin-left: 65.66667%;
+}
+
+.row .small-offset-9 {
+ margin-left: 74%;
+}
+
+.row .small-offset-10 {
+ margin-left: 82.33333%;
+}
+
+.row .small-offset-11 {
+ margin-left: 90.66667%;
+}
+
+.row .small-offset-12 {
+ margin-left: 99%;
+}
+
+.row .medium-offset-1 {
+ margin-left: 7.33333%;
+}
+
+.row .medium-offset-2 {
+ margin-left: 15.66667%;
+}
+
+.row .medium-offset-3 {
+ margin-left: 24%;
+}
+
+.row .medium-offset-4 {
+ margin-left: 32.33333%;
+}
+
+.row .medium-offset-5 {
+ margin-left: 40.66667%;
+}
+
+.row .medium-offset-6 {
+ margin-left: 49%;
+}
+
+.row .medium-offset-7 {
+ margin-left: 57.33333%;
+}
+
+.row .medium-offset-8 {
+ margin-left: 65.66667%;
+}
+
+.row .medium-offset-9 {
+ margin-left: 74%;
+}
+
+.row .medium-offset-10 {
+ margin-left: 82.33333%;
+}
+
+.row .medium-offset-11 {
+ margin-left: 90.66667%;
+}
+
+.row .medium-offset-12 {
+ margin-left: 99%;
+}
+
+.row .large-offset-1 {
+ margin-left: 7.33333%;
+}
+
+.row .large-offset-2 {
+ margin-left: 15.66667%;
+}
+
+.row .large-offset-3 {
+ margin-left: 24%;
+}
+
+.row .large-offset-4 {
+ margin-left: 32.33333%;
+}
+
+.row .large-offset-5 {
+ margin-left: 40.66667%;
+}
+
+.row .large-offset-6 {
+ margin-left: 49%;
+}
+
+.row .large-offset-7 {
+ margin-left: 57.33333%;
+}
+
+.row .large-offset-8 {
+ margin-left: 65.66667%;
+}
+
+.row .large-offset-9 {
+ margin-left: 74%;
+}
+
+.row .large-offset-10 {
+ margin-left: 82.33333%;
+}
+
+.row .large-offset-11 {
+ margin-left: 90.66667%;
+}
+
+.row .large-offset-12 {
+ margin-left: 99%;
+}
.top-bar {
clear: both !important;
height: 100px !important;
}
-.locale, .external-links {
+.locale,
+.external-links {
background: #002d50 !important;
}
@@ -121,11 +371,12 @@
}
.external-links {
- color: white !important;
+ color: #fff !important;
float: right !important;
}
-.top-bar-title, .top-bar-title a, .top-bar-title a {
+.top-bar-title,
+.top-bar-title a {
display: inline-block !important;
float: none !important;
}
@@ -140,28 +391,29 @@
margin: 0 !important;
position: inherit !important;
- &:after {
+ &::after {
content: none !important;
}
}
form {
- input, textarea {
+ input,
+ textarea {
height: 48px !important;
line-height: 48px !important;
margin-bottom: 24px !important;
width: 100% !important;
}
- input[type="checkbox"],
- input[type="radio"] {
+ [type="checkbox"],
+ [type="radio"] {
height: auto !important;
line-height: inherit !important;
width: auto !important;
}
- input[type="radio"] {
+ [type="radio"] {
width: 18px !important;
}
}
@@ -184,16 +436,17 @@ form {
// 02. Admin
// ---------
-body.admin form {
+.admin form {
- input[type="text"], textarea {
+ [type="text"],
+ textarea {
height: 48px !important;
line-height: 48px !important;
margin-bottom: 24px !important;
}
}
-.admin-sidebar ul [class^="icon-"] {
+.admin-sidebar [class^="icon-"] {
padding-left: 12px !important;
padding-right: 12px !important;
}
diff --git a/app/assets/stylesheets/layout.scss b/app/assets/stylesheets/layout.scss
index bf62319c4..1e420231b 100644
--- a/app/assets/stylesheets/layout.scss
+++ b/app/assets/stylesheets/layout.scss
@@ -24,7 +24,7 @@
// -----------------
::selection {
- color: white;
+ color: #fff;
background-color: $brand;
}
@@ -32,7 +32,12 @@ body {
font-size: $base-font-size;
}
-h1, h2, h3, h4, h5, h6 {
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
clear: both;
font-weight: 700;
}
@@ -46,11 +51,17 @@ p {
a {
color: $link;
- &:hover, &:active {
+ &:hover,
+ &:active {
color: $link-hover;
text-decoration: underline;
- h1, h2, h3, h4, h5, h6 {
+ h1,
+ h2,
+ h3,
+ h4,
+ h5,
+ h6 {
color: $link-hover;
}
}
@@ -69,8 +80,9 @@ a {
text-decoration: none !important;
}
- &.warning, &.warning:hover {
- color: black;
+ &.warning,
+ &.warning:hover {
+ color: #000;
}
}
@@ -113,8 +125,9 @@ a {
}
}
- li:hover, .f-dropdown li:focus {
- background: white;
+ li:hover,
+ .f-dropdown li:focus {
+ background: #fff;
}
&.open {
@@ -162,14 +175,15 @@ a {
.wrapper {
min-height: 100%;
- margin: 0 auto (-$line-height)*12;
+ margin: 0 auto (-$line-height) * 12;
height: auto !important;
height: 100%;
}
-.footer, .push {
+.footer,
+.push {
clear: both;
- min-height: $line-height*12;
+ min-height: $line-height * 12;
}
.ie-callout {
@@ -177,7 +191,7 @@ a {
top: 0;
width: 100%;
- a.close {
+ .close {
font-size: rem-calc(34);
top: 20%;
}
@@ -202,7 +216,7 @@ a {
}
.menu.vertical {
- background: white;
+ background: #fff;
margin: $line-height 0;
padding: $line-height;
@@ -247,10 +261,11 @@ a {
.close-button {
color: $text;
- top: $line-height/2;
+ top: $line-height / 2;
}
-.back, .icon-angle-left {
+.back,
+.icon-angle-left {
clear: both;
color: $text-medium;
float: left;
@@ -281,7 +296,8 @@ a {
}
}
- h2, h3 {
+ h2,
+ h3 {
font-size: $base-font-size;
}
}
@@ -291,7 +307,7 @@ a {
}
.button.float-right ~ .button.float-right {
- margin: 0 $line-height/2;
+ margin: 0 $line-height / 2;
}
.pagination .current {
@@ -307,13 +323,13 @@ header {
margin-bottom: $line-height;
.selected {
- border-bottom: 1px solid white;
+ border-bottom: 1px solid #fff;
}
.locale {
float: left;
- height: $line-height*1.5;
- margin-left: $line-height/2;
+ height: $line-height * 1.5;
+ margin-left: $line-height / 2;
}
.external-links {
@@ -329,9 +345,9 @@ header {
.top-bar {
background: $brand !important;
- color: white;
- height: $line-height*2;
- line-height: $line-height*2;
+ color: #fff;
+ height: $line-height * 2;
+ line-height: $line-height * 2;
padding-bottom: 0;
padding-top: 0;
@@ -351,33 +367,33 @@ header {
ul {
background: none;
padding-right: rem-calc(15);
+ }
- &.menu > li {
- display: block;
+ .menu > li {
+ display: block;
+
+ @include breakpoint(medium) {
+ display: table-cell;
+ height: $line-height * 3.5;
+ }
+
+ a {
+ color: #fff;
+ padding-left: 0;
@include breakpoint(medium) {
- display: table-cell;
- height: $line-height*3.5;
+ font-size: $small-font-size;
+ padding: rem-calc(11) rem-calc(16);
}
+ }
- a {
- color: white;
- padding-left: 0;
+ .button {
+ text-align: left;
- @include breakpoint(medium) {
- font-size: $small-font-size;
- padding: rem-calc(11) rem-calc(16);
- }
-
- &.button {
- text-align: left;
-
- @include breakpoint(medium) {
- background: white;
- color: $brand;
- text-align: center;
- }
- }
+ @include breakpoint(medium) {
+ background: #fff;
+ color: $brand;
+ text-align: center;
}
}
}
@@ -385,21 +401,22 @@ header {
.menu-icon.dark {
height: 20px;
- &::after, &:hover::after {
- background: white;
- box-shadow: 0 7px 0 white, 0 14px 0 white;
+ &::after,
+ &:hover::after {
+ background: #fff;
+ box-shadow: 0 7px 0 #fff, 0 14px 0 #fff;
}
}
}
.top-links {
background: $dark;
- color: white;
+ color: #fff;
font-size: $small-font-size;
- padding-right: $line-height/2;
+ padding-right: $line-height / 2;
a {
- color: white;
+ color: #fff;
margin: 0 rem-calc(6);
&:hover {
@@ -409,22 +426,20 @@ header {
ul {
margin-bottom: 0;
+ }
- li {
- display: block;
- }
+ li {
+ display: block;
@include breakpoint(medium) {
- li {
- display: inline-block;
+ display: inline-block;
- &:after {
- content: "|";
- }
+ &::after {
+ content: '|';
+ }
- &:last-child:after {
- content: none;
- }
+ &:last-child::after {
+ content: none;
}
}
}
@@ -433,7 +448,7 @@ header {
.subnavigation {
@include breakpoint(medium) {
- background: white;
+ background: #fff;
padding-bottom: 0;
}
@@ -446,40 +461,40 @@ header {
display: inline-block;
margin-right: rem-calc(20);
}
+ }
+ }
- a {
- color: white;
- display: inline-block;
- line-height: $line-height*2;
- position: relative;
- text-align: left;
- width: 100%;
+ a {
+ color: #fff;
+ display: inline-block;
+ line-height: $line-height * 2;
+ position: relative;
+ text-align: left;
+ width: 100%;
- @include breakpoint(medium) {
- color: $text;
- display: block;
- font-weight: bold;
- width: auto;
+ @include breakpoint(medium) {
+ color: $text;
+ display: block;
+ font-weight: bold;
+ width: auto;
- &:hover {
- color: $link;
- }
- }
+ &:hover {
+ color: $link;
+ }
+ }
- &.active {
- color: white;
+ &.active {
+ color: #fff;
- @include breakpoint(medium) {
- border-bottom: 2px solid $brand;
- color: $brand;
- }
- }
+ @include breakpoint(medium) {
+ border-bottom: 2px solid $brand;
+ color: $brand;
}
}
}
.input-group {
- padding-top: $line-height/4;
+ padding-top: $line-height / 4;
@include breakpoint(medium) {
margin-bottom: 0;
@@ -491,7 +506,7 @@ header {
}
.input-group-button {
- line-height: $line-height*1.5;
+ line-height: $line-height * 1.5;
padding-bottom: 0;
button {
@@ -499,14 +514,14 @@ header {
border: 1px solid #ccc;
border-left: 0;
color: $text;
- height: $line-height*1.5;
- line-height: $line-height*1.5;
+ height: $line-height * 1.5;
+ line-height: $line-height * 1.5;
padding-top: 0;
}
}
input {
- height: $line-height*1.5 !important;
+ height: $line-height * 1.5 !important;
margin-bottom: 0;
margin-right: 0;
width: 100%;
@@ -516,31 +531,31 @@ header {
.submenu {
border-bottom: 1px solid $border;
clear: both;
- margin-bottom: $line-height/2;
+ margin-bottom: $line-height / 2;
a {
color: $text;
display: inline-block;
font-weight: bold;
- margin-right: $line-height/2;
+ margin-right: $line-height / 2;
position: relative;
text-align: left;
@include breakpoint(medium) {
- margin-right: $line-height*1.5;
+ margin-right: $line-height * 1.5;
}
&:hover {
color: $link;
}
+ }
- &.active {
- border-bottom: 2px solid $brand;
- color: $brand;
+ .active {
+ border-bottom: 2px solid $brand;
+ color: $brand;
- &:hover {
- text-decoration: none;
- }
+ &:hover {
+ text-decoration: none;
}
}
@@ -549,7 +564,7 @@ header {
}
}
-.search-form-header input[type=text] {
+.search-form-header [type=text] {
max-width: none;
}
@@ -576,7 +591,9 @@ footer {
}
}
- a, a:active, a:focus {
+ a,
+ a:active,
+ a:focus {
color: $text;
text-decoration: underline;
@@ -589,7 +606,7 @@ footer {
padding-left: 0;
}
- a.title {
+ .title {
font-weight: bold;
text-decoration: none;
}
@@ -598,28 +615,32 @@ footer {
.footer {
background: $border;
border-top: 6px solid $brand;
- margin-top: $line-height*2;
+ margin-top: $line-height * 2;
padding-top: $line-height;
}
.subfooter {
border-top: 1px solid $text-light;
font-size: $small-font-size;
- padding-top: $line-height/2;
+ padding-top: $line-height / 2;
}
// 04. Tags
// --------
-.tags a , .tag-cloud a, .categories a, .geozone a, .sidebar-links a,
+.tags a ,
+.tag-cloud a,
+.categories a,
+.geozone a,
+.sidebar-links a,
.tags span {
background: #ececec;
border-radius: rem-calc(6);
color: $text;
display: inline-block;
font-size: $small-font-size;
- margin-bottom: $line-height/3;
- padding: $line-height/4 $line-height/3;
+ margin-bottom: $line-height / 3;
+ padding: $line-height / 4 $line-height / 3;
text-decoration: none;
&:hover {
@@ -627,13 +648,14 @@ footer {
}
}
-.categories a, .geozone a {
+.categories a,
+.geozone a {
background: $highlight;
color: $link;
&:hover {
background: $brand;
- color: white;
+ color: #fff;
}
}
@@ -642,8 +664,8 @@ footer {
display: inline-block;
font-size: rem-calc(16);
font-weight: bold;
- margin: -1px 0 $line-height/2;
- padding-top: $line-height/4;
+ margin: -1px 0 $line-height / 2;
+ padding-top: $line-height / 4;
text-transform: uppercase;
}
@@ -653,17 +675,17 @@ footer {
.auth-page {
.wrapper {
- margin: 0 auto (-$line-height)*14;
+ margin: 0 auto (-$line-height) * 14;
}
}
.auth-image {
- background: $brand image-url("auth_bg.jpg");
+ background: $brand image-url('auth_bg.jpg');
background-repeat: no-repeat;
background-size: cover;
@include breakpoint(medium) {
- min-height: $line-height*42;
+ min-height: $line-height * 42;
}
h1 {
@@ -675,7 +697,7 @@ footer {
}
a {
- color: white;
+ color: #fff;
display: block;
line-height: rem-calc(80); // Same as logo image height
text-align: center;
@@ -691,10 +713,12 @@ footer {
.auth-form {
@include breakpoint(medium) {
- padding-top: $line-height*4;
+ padding-top: $line-height * 4;
}
- p, a, .checkbox {
+ p,
+ a,
+ .checkbox {
font-size: $small-font-size;
}
}
@@ -706,52 +730,52 @@ footer {
text-align: center;
span {
- background: white;
+ background: #fff;
font-weight: bold;
- padding: 0 $line-height/2;
+ padding: 0 $line-height / 2;
}
}
// 06. Forms
// ---------
-form.locale-form {
+.locale-form {
display: inline-block;
position: relative;
label {
- color: white;
+ color: #fff;
font-size: $small-font-size;
font-weight: normal;
}
select {
- background-image: image-url("language_select.png");
+ background-image: image-url('language_select.png');
background-origin: border-box;
background-position: right;
background-size: 24px 24px;
option {
- background: white;
+ background: #fff;
color: $text;
border: 0;
outline: none;
}
+ }
- &.locale-switcher {
- background-color: transparent;
- border: 0;
- color: white;
- font-size: $small-font-size;
- margin-bottom: 0;
- outline: none;
- padding-left: rem-calc(3);
- padding-right: $line-height;
- width: auto;
+ .locale-switcher {
+ background-color: transparent;
+ border: 0;
+ color: #fff;
+ font-size: $small-font-size;
+ margin-bottom: 0;
+ outline: none;
+ padding-left: rem-calc(3);
+ padding-right: $line-height;
+ width: auto;
- &:focus {
- outline: 3px solid #ffbf47;
- }
+ &:focus {
+ outline: 3px solid #ffbf47;
}
}
}
@@ -768,7 +792,7 @@ form {
font-weight: bold;
}
- input[type="radio"] {
+ [type="radio"] {
height: $line-height !important;
vertical-align: top;
@@ -781,9 +805,9 @@ form {
}
}
- input[type]:not([type=submit]):not([type=file]):not([type=checkbox]):not([type=radio]) {
- background: #F8F8F8;
- height: $line-height*2;
+ [type]:not([type=submit]):not([type=file]):not([type=checkbox]):not([type=radio]) {
+ background: #f8f8f8;
+ height: $line-height * 2;
margin-bottom: rem-calc(16);
&.error {
@@ -791,36 +815,38 @@ form {
}
}
- input[type="checkbox"] + label,
- input[type="radio"] + label {
+ [type="checkbox"] + label,
+ [type="radio"] + label {
margin-right: 0;
}
- input[type=file] {
- margin: $line-height/2 0 $line-height/2 $line-height/4;
+ [type=file] {
+ margin: $line-height / 2 0 $line-height / 2 $line-height / 4;
}
- .note, .note-marked {
+ .note,
+ .note-marked {
display: block;
font-size: rem-calc(13);
- margin-bottom: $line-height/2;
+ margin-bottom: $line-height / 2;
}
.note-marked {
- background: yellow;
+ background: #ff0;
display: inline-block;
em {
- background: white;
+ background: #fff;
display: block;
}
}
.ckeditor {
- min-height: $line-height*13;
+ min-height: $line-height * 13;
}
- .checkbox, .radio {
+ .checkbox,
+ .radio {
display: inline-block;
font-weight: normal;
line-height: $line-height;
@@ -833,47 +859,29 @@ form {
.callout-slide {
animation-duration: 1s;
- -webkit-animation-duration: 1s;
animation-fill-mode: both;
- -webkit-animation-fill-mode: both;
animation-name: slide;
- -webkit-animation-name: slide;
-}
-
-@-webkit-keyframes slide {
- from {
- -webkit-transform: translate3d(100%, 0, 0);
- transform: translate3d(100%, 0, 0);
- visibility: visible;
- }
-
- to {
- -webkit-transform: translate3d(0, 0, 0);
- transform: translate3d(0, 0, 0);
- }
}
@keyframes slide {
from {
- -webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
visibility: visible;
}
to {
- -webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.notice-container {
- min-width: $line-height*12;
+ min-width: $line-height * 12;
position: absolute;
right: 24px;
top: 24px;
.notice {
- height: $line-height*4;
+ height: $line-height * 4;
.notice-text {
width: 95%;
@@ -889,7 +897,8 @@ form {
text-decoration: underline;
}
- &.success, &.notice {
+ &.success,
+ &.notice {
background-color: $success-bg;
border-color: $success-border;
color: $color-success;
@@ -907,7 +916,8 @@ form {
color: $color-warning;
}
- &.alert, &.error {
+ &.alert,
+ &.error {
background-color: $alert-bg;
border-color: $alert-border;
color: $color-alert;
@@ -918,25 +928,20 @@ form {
}
}
-span.error, small.error {
- background: $alert-bg;
- color: $color-alert;
-}
-
-span.no-error, small.no-error {
+.no-error {
background: $success-bg;
color: $color-success;
}
-.error small.error {
+.error {
background: $alert-bg;
color: $color-alert;
display: inline-block;
- margin: 0 $line-height/4;
-}
+ margin: 0 $line-height / 4;
-label.error, label.error a {
- color: $color-alert;
+ a {
+ color: $color-alert;
+ }
}
// 08. User account
@@ -945,12 +950,12 @@ label.error, label.error a {
.account {
select {
- height: $line-height*2;
- margin-right: $line-height/2;
+ height: $line-height * 2;
+ margin-right: $line-height / 2;
}
.verify-account {
- padding-right: $line-height/2;
+ padding-right: $line-height / 2;
}
.final-votes-info {
@@ -958,14 +963,14 @@ label.error, label.error a {
border: 1px solid $warning-border;
color: $color-warning;
margin-top: $line-height;
- padding: $line-height/2;
+ padding: $line-height / 2;
ul li {
- margin: $line-height/2 0;
+ margin: $line-height / 2 0;
}
.icon-box {
- color: #D4A26D;
+ color: #d4a26d;
font-size: rem-calc(120);
line-height: rem-calc(120);
vertical-align: top;
@@ -973,13 +978,17 @@ label.error, label.error a {
}
}
-img.avatar, img.admin-avatar, img.moderator-avatar, img.initialjs-avatar {
+.avatar,
+.admin-avatar,
+.moderator-avatar,
+.initialjs-avatar {
border-radius: rem-calc(1000);
position: relative;
}
-.author-deleted, .user-deleted {
- color: rgba(0,0,0,.4);
+.author-deleted,
+.user-deleted {
+ color: rgba(0, 0, 0, 0.4);
display: inline-block;
font-size: rem-calc(32);
line-height: rem-calc(32);
@@ -1000,23 +1009,23 @@ img.avatar, img.admin-avatar, img.moderator-avatar, img.initialjs-avatar {
list-style-type: none;
margin-bottom: 0;
margin-left: 0;
+ }
- li {
- font-size: $small-font-size;
- margin-bottom: $line-height/2;
+ li {
+ font-size: $small-font-size;
+ margin-bottom: $line-height / 2;
- span {
- color: $text-medium;
- font-size: rem-calc(12);
- }
+ span {
+ color: $text-medium;
+ font-size: rem-calc(12);
+ }
- .icon-check {
- color: $check;
- }
+ .icon-check {
+ color: $check;
+ }
- .icon-x {
- color: $delete;
- }
+ .icon-x {
+ color: $delete;
}
}
}
@@ -1042,7 +1051,7 @@ img.avatar, img.admin-avatar, img.moderator-avatar, img.initialjs-avatar {
}
}
-.notifications-list:before {
+.notifications-list::before {
background: $border;
content: '';
height: 100%;
@@ -1054,7 +1063,7 @@ img.avatar, img.admin-avatar, img.moderator-avatar, img.initialjs-avatar {
.notification {
display: block;
- padding: $line-height/2 0 $line-height/2 $line-height*1.5;
+ padding: $line-height / 2 0 $line-height / 2 $line-height * 1.5;
position: relative;
&:hover {
@@ -1067,15 +1076,15 @@ img.avatar, img.admin-avatar, img.moderator-avatar, img.initialjs-avatar {
color: $link;
}
- &:before {
- content: "\43";
+ &::before {
+ content: '\43';
}
}
- &:before {
- background: white;
+ &::before {
+ background: #fff;
color: $brand;
- content: "\4d";
+ content: '\4d';
font-family: "icons" !important;
left: 0;
position: absolute;
@@ -1103,7 +1112,7 @@ img.avatar, img.admin-avatar, img.moderator-avatar, img.initialjs-avatar {
@include breakpoint(medium) {
float: right;
margin-bottom: 0;
- margin-top: $line-height/4;
+ margin-top: $line-height / 4;
position: absolute;
right: 0;
z-index: 2;
@@ -1112,44 +1121,50 @@ img.avatar, img.admin-avatar, img.moderator-avatar, img.initialjs-avatar {
.advanced-search-form {
- select {
- height: $line-height*2;
- }
-
@include breakpoint(medium) {
- & > .column {
+ > .column {
padding: 0;
}
}
+
+ select {
+ height: $line-height * 2;
+ }
}
// 10. Officials levels
// --------------------
-.level-1, .level-2, .level-3,
-.level-4, .level-5,
-.is-author, .is-association {
- color: black;
+.level-1,
+.level-2,
+.level-3,
+.level-4,
+.level-5,
+.is-author,
+.is-association {
+ color: #000;
}
.is-author {
- background: #00A5F1;
+ background: #00a5f1;
}
.is-association {
- background: #E38D83;
+ background: #e38d83;
}
.level-1 {
- background: #1ABC9C;
+ background: #1abc9c;
}
-.level-2, .level-3, .level-4 {
- background: #43AC6A;
+.level-2,
+.level-3,
+.level-4 {
+ background: #43ac6a;
}
.level-5 {
- background: #F08A24;
+ background: #f08a24;
}
// 11. Tables
@@ -1169,11 +1184,11 @@ table {
td {
line-height: $line-height;
- padding: $line-height/2 $line-height/4;
+ padding: $line-height / 2 $line-height / 4;
}
&:nth-child(odd) {
- background: white;
+ background: #fff;
}
&:nth-child(even) {
@@ -1189,7 +1204,8 @@ table {
.table-for-mobile {
@include breakpoint(medium down) {
- th, td {
+ th,
+ td {
display: block;
text-align: left;
}
@@ -1203,26 +1219,26 @@ table {
.button.button-facebook,
.button.button-google,
.button.button-telegram {
- background: white;
+ background: #fff;
color: $text;
font-weight: bold;
- height: $line-height*2;
- line-height: $line-height*2;
+ height: $line-height * 2;
+ line-height: $line-height * 2;
padding: 0;
position: relative;
}
.button.button-twitter {
- background: #ECF7FC;
- border-left: 3px solid #45B0E3;
+ background: #ecf7fc;
+ border-left: 3px solid #45b0e3;
- &:before {
- color: #45B0E3;
- content: "f";
+ &::before {
+ color: #45b0e3;
+ content: 'f';
font-family: "icons" !important;
font-size: rem-calc(24);
left: 0;
- line-height: $line-height*2;
+ line-height: $line-height * 2;
padding: 0 rem-calc(20);
position: absolute;
top: 0;
@@ -1230,41 +1246,42 @@ table {
}
.ssb-twitter {
- background: #45B0E3;
+ background: #45b0e3;
background-image: none !important;
- color: white;
- height: $line-height*2 !important;
+ color: #fff;
+ height: $line-height * 2 !important;
position: relative;
- width: $line-height*2 !important;
+ width: $line-height * 2 !important;
- &:before {
- content: "f";
+ &::before {
+ content: 'f';
font-family: "icons" !important;
font-size: rem-calc(24);
left: 50%;
- line-height: $line-height*2;
+ line-height: $line-height * 2;
margin-left: rem-calc(-11);
position: absolute;
top: 0;
}
- &:hover, &:focus {
- background: white;
- color: #40A2D1;
+ &:hover,
+ &:focus {
+ background: #fff;
+ color: #40a2d1;
}
}
.button.button-facebook {
- background: #EBEEF4;
- border-left: 3px solid #3B5998;
+ background: #ebeef4;
+ border-left: 3px solid #3b5998;
- &:before {
- color: #3B5998;
- content: "A";
+ &::before {
+ color: #3b5998;
+ content: 'A';
font-family: "icons" !important;
font-size: rem-calc(24);
left: 0;
- line-height: $line-height*2;
+ line-height: $line-height * 2;
padding: 0 rem-calc(20);
position: absolute;
top: 0;
@@ -1272,83 +1289,85 @@ table {
}
.ssb-facebook {
- background: #3B5998;
+ background: #3b5998;
background-image: none !important;
- color: white;
+ color: #fff;
height: rem-calc(48) !important;
position: relative;
width: rem-calc(48) !important;
- &:before {
- content: "A";
+ &::before {
+ content: 'A';
font-family: "icons" !important;
font-size: rem-calc(24);
left: 50%;
- line-height: $line-height*2;
+ line-height: $line-height * 2;
margin-left: rem-calc(-11);
position: absolute;
top: 0;
}
- &:hover, &:focus {
- background: white;
- color: #354F88;
+ &:hover,
+ &:focus {
+ background: #fff;
+ color: #354f88;
}
}
.button.button-google {
- background: #FCEDEA;
- border-left: 3px solid #DE4C34;
+ background: #fcedea;
+ border-left: 3px solid #de4c34;
- &:before {
- color: #DE4C34;
- content: "B";
+ &::before {
+ color: #de4c34;
+ content: 'B';
font-family: "icons" !important;
font-size: rem-calc(24);
left: 0;
- line-height: $line-height*2;
+ line-height: $line-height * 2;
padding: 0 rem-calc(20);
position: absolute;
top: 0;
}
}
-.ssb-google_plus {
- background: #DE4C34;
+[class^="ssb-icon ssb-google"] {
+ background: #de4c34;
background-image: none !important;
- color: white;
- height: $line-height*2 !important;
+ color: #fff;
+ height: $line-height * 2 !important;
position: relative;
- width: $line-height*2 !important;
+ width: $line-height * 2 !important;
- &:before {
- content: "B";
+ &::before {
+ content: 'B';
font-family: "icons" !important;
font-size: rem-calc(24);
left: 50%;
- line-height: $line-height*2;
+ line-height: $line-height * 2;
margin-left: rem-calc(-11);
position: absolute;
top: 0;
}
- &:hover, &:focus {
- background: white;
- color: #CE3E26;
+ &:hover,
+ &:focus {
+ background: #fff;
+ color: #ce3e26;
}
}
.button.button-telegram {
- background: #ECF7FC;
- border-left: 3px solid #0088cc;
+ background: #ecf7fc;
+ border-left: 3px solid #08c;
- &:before {
- color: #0088cc;
- content: "1";
+ &::before {
+ color: #08c;
+ content: '1';
font-family: "icons" !important;
font-size: rem-calc(24);
left: 0;
- line-height: $line-height*2;
+ line-height: $line-height * 2;
padding: 0 rem-calc(20);
position: absolute;
top: 0;
@@ -1356,33 +1375,35 @@ table {
}
.ssb-telegram {
- background: #0088cc;
+ background: #08c;
background-image: none !important;
- color: white;
- height: $line-height*2 !important;
+ color: #fff;
+ height: $line-height * 2 !important;
position: relative;
- width: $line-height*2 !important;
+ width: $line-height * 2 !important;
- &:before {
- content: "1";
+ &::before {
+ content: '1';
font-family: "icons" !important;
font-size: rem-calc(24);
left: 50%;
- line-height: $line-height*2;
+ line-height: $line-height * 2;
margin-left: rem-calc(-11);
position: absolute;
top: 0;
}
- &:hover, &:focus {
- background: white;
- color: #40A2D1;
+ &:hover,
+ &:focus {
+ background: #fff;
+ color: #40a2d1;
}
}
@include breakpoint(medium) {
- .button.button-telegram, .ssb-telegram {
+ .button.button-telegram,
+ .ssb-telegram {
display: none !important;
}
}
@@ -1391,7 +1412,7 @@ table {
a {
font-size: rem-calc(24);
- margin: 0 $line-height/2;
+ margin: 0 $line-height / 2;
text-decoration: none;
&:hover {
@@ -1408,98 +1429,102 @@ table {
}
.ssb-twitter {
- background: #45B0E3;
- color: white;
+ background: #45b0e3;
+ color: #fff;
height: $line-height;
position: relative;
- width: $line-height*2;
+ width: $line-height * 2;
- &:before {
- content: "f";
+ &::before {
+ content: 'f';
font-family: "icons" !important;
font-size: rem-calc(24);
left: 50%;
- line-height: $line-height*2;
+ line-height: $line-height * 2;
margin-left: rem-calc(-11);
position: absolute;
top: 0;
}
- &:hover, &:focus {
- background: white;
- color: #40A2D1;
+ &:hover,
+ &:focus {
+ background: #fff;
+ color: #40a2d1;
}
}
.ssb-facebook {
- background: #3B5998;
- color: white;
+ background: #3b5998;
+ color: #fff;
height: rem-calc(24);
position: relative;
width: rem-calc(48);
- &:before {
- content: "A";
+ &::before {
+ content: 'A';
font-family: "icons" !important;
font-size: rem-calc(24);
left: 50%;
- line-height: $line-height*2;
+ line-height: $line-height * 2;
margin-left: rem-calc(-11);
position: absolute;
top: 0;
}
- &:hover, &:focus {
- background: white;
- color: #354F88;
+ &:hover,
+ &:focus {
+ background: #fff;
+ color: #354f88;
}
}
- .ssb-google_plus {
- background: #DE4C34;
- color: white;
+ [class^="ssb-icon ssb-google"] {
+ background: #de4c34;
+ color: #fff;
height: rem-calc(24);
position: relative;
width: rem-calc(48);
- &:before {
- content: "B";
+ &::before {
+ content: 'B';
font-family: "icons" !important;
font-size: rem-calc(24);
left: 50%;
- line-height: $line-height*2;
+ line-height: $line-height * 2;
margin-left: rem-calc(-11);
position: absolute;
top: 0;
}
- &:hover, &:focus {
- background: white;
- color: #CE3E26;
+ &:hover,
+ &:focus {
+ background: #fff;
+ color: #ce3e26;
}
}
.ssb-telegram {
- background: #0088cc;
- color: white;
+ background: #08c;
+ color: #fff;
height: $line-height;
position: relative;
- width: $line-height*2;
+ width: $line-height * 2;
- &:before {
- content: "1";
+ &::before {
+ content: '1';
font-family: "icons" !important;
font-size: rem-calc(24);
left: 50%;
- line-height: $line-height*2;
+ line-height: $line-height * 2;
margin-left: rem-calc(-11);
position: absolute;
top: 0;
}
- &:hover, &:focus {
- background: white;
- color: #40A2D1;
+ &:hover,
+ &:focus {
+ background: #fff;
+ color: #40a2d1;
}
}
}
@@ -1509,45 +1534,42 @@ table {
.more-information {
- ul {
+ li {
+ border-bottom: 1px solid $border;
+ font-weight: bold;
+ margin-left: rem-calc(-12);
+ position: relative;
- li {
- border-bottom: 1px solid $border;
- font-weight: bold;
- margin-left: rem-calc(-12);
- position: relative;
+ span {
+ color: $text;
+ display: inline-block;
+ font-weight: normal;
+ }
- span {
- color: $text;
- display: inline-block;
- font-weight: normal;
+ &::after {
+ content: none;
+ color: $text-medium;
+ font-family: "icons" !important;
+ position: absolute;
+ right: 0;
+ top: 24px;
+
+ @include breakpoint(medium) {
+ content: 'c';
}
+ }
+ }
- a {
- display: block;
- padding: $line-height/2;
+ a {
+ display: block;
+ padding: $line-height / 2;
+ }
- &:hover {
- background: $highlight;
+ a:hover {
+ background: $highlight;
- span {
- text-decoration: none;
- }
- }
- }
-
- &:after {
- content: none;
- color: $text-medium;
- font-family: "icons" !important;
- position: absolute;
- right: 0;
- top: 24px;
-
- @include breakpoint(medium) {
- content: 'c';
- }
- }
+ span {
+ text-decoration: none;
}
}
}
@@ -1559,7 +1581,7 @@ table {
@include breakpoint(medium) {
.left + .left {
- margin-left: $line-height/2;
+ margin-left: $line-height / 2;
}
}
@@ -1576,10 +1598,10 @@ table {
}
.progress {
- height: $line-height*3;
+ height: $line-height * 3;
@include breakpoint(medium) {
- height: $line-height*2;
+ height: $line-height * 2;
}
&.success .meter {
@@ -1591,12 +1613,12 @@ table {
background: #f6f6f6;
font-weight: bold;
line-height: rem-calc(20);
- padding-top: $line-height/4;
+ padding-top: $line-height / 4;
text-transform: uppercase;
vertical-align: top;
@include breakpoint(medium) {
- line-height: $line-height*2;
+ line-height: $line-height * 2;
padding: 0;
}
@@ -1604,9 +1626,9 @@ table {
display: block;
@include breakpoint(medium) {
- background-color: white;
+ background-color: #fff;
border-radius: rem-calc(30);
- color: #43AC6A;
+ color: #43ac6a;
display: inline-block;
height: rem-calc(30);
line-height: rem-calc(30);
@@ -1616,17 +1638,8 @@ table {
}
&.active {
- background: #43AC6A;
- color: white;
- }
-
- &.completed {
- background: #43AC6A;
- color: rgba(255,255,255,.5);
-
- .number {
- opacity: .5;
- }
+ background: #43ac6a;
+ color: #fff;
}
}
@@ -1641,7 +1654,7 @@ table {
.button + form {
display: inline-block;
- margin-left: $line-height/2;
+ margin-left: $line-height / 2;
}
.verification-list {
@@ -1651,17 +1664,26 @@ table {
span {
display: inline-block;
- min-width: $line-height*12;
+ min-width: $line-height * 12;
}
}
}
+.verification-step .completed {
+ background: #43ac6a;
+ color: rgba(255, 255, 255, 0.5);
+
+ .number {
+ opacity: 0.5;
+ }
+}
+
.verify-account {
- padding-right: $line-height/2;
+ padding-right: $line-height / 2;
.already-verified {
color: $check;
- line-height: $line-height*2;
+ line-height: $line-height * 2;
.icon-check {
font-size: rem-calc(24);
@@ -1672,7 +1694,7 @@ table {
}
.verify {
- margin-bottom: $line-height*2;
+ margin-bottom: $line-height * 2;
margin-top: $line-height;
h1 {
@@ -1685,18 +1707,18 @@ table {
}
.letter-divider {
- border-top: 1px solid #DDDDDD;
+ border-top: 1px solid #ddd;
clear: both;
height: 0;
margin: rem-calc(24) 0;
position: relative;
.icon-letter {
- background: white;
+ background: #fff;
color: $color-info;
font-size: rem-calc(24);
margin-left: -27px;
- padding: 0 $line-height/2;
+ padding: 0 $line-height / 2;
position: absolute;
top: -12px;
}
@@ -1707,9 +1729,9 @@ table {
// ------------
.comments {
- background: $white;
+ background: #fff;
background-repeat: repeat-x;
- padding-bottom: $line-height*4;
+ padding-bottom: $line-height * 4;
h2 {
margin: 0;
@@ -1718,127 +1740,133 @@ table {
span {
font-size: rem-calc(18);
font-weight: normal;
- opacity: .8;
+ opacity: 0.8;
}
}
.comment {
- margin: $line-height/4 0;
+ margin: $line-height / 4 0;
position: relative;
p {
margin-bottom: 0;
}
- .comment-votes {
- color: $text-medium;
- font-size: $small-font-size;
- line-height: $line-height;
+ [class^="icon-"] {
+ font-size: $base-font-size;
+ vertical-align: sub;
+ }
+ }
+}
- a {
- color: $text-light;
- display: inline-block;
- vertical-align: top;
+.comment-body {
- &:hover {
- color: $text-medium;
- text-decoration: none;
+ img {
+ margin-right: $line-height / 2;
+ }
- .icon-like {
- color: $like;
- }
+ .reply {
+ background: #fff;
+ border: 1px solid $border;
+ border-left: 0;
+ border-right: 0;
+ font-size: $small-font-size;
+ margin: $line-height / 4 0;
+ padding: $line-height / 4;
+ position: relative;
- .icon-unlike {
- color: $unlike;
- }
- }
- }
-
- [class^="icon-"] {
- font-size: $base-font-size;
- vertical-align: sub;
- }
+ .relative,
+ [class^="icon-arrow"] {
+ padding-left: $line-height / 2;
}
- .comment-body {
-
- img {
- margin-right: $line-height/2;
- }
-
- .reply {
- background: white;
- border: 1px solid $border;
- border-left: 0;
- border-right: 0;
- font-size: $small-font-size;
- margin: $line-height/4 0;
- padding: $line-height/4;
- position: relative;
-
- a.relative, [class^="icon-arrow"] {
- padding-left: $line-height/2;
- }
-
- [class^="icon-arrow"] {
- font-size: $base-font-size;
- left: -20px;
- position: absolute;
- top: -1px;
- }
-
- .divider {
- color: $text-light;
- }
-
- form {
- margin-top: $line-height/2;
- }
- }
-
- .comment-user {
- margin-top: $line-height/4;
- padding: $line-height/4 0;
- overflow: hidden;
-
- &.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;
- }
-
- &.level-1 {
- background: none;
- }
-
- &.level-5 {
- background: rgba(255,241,204,1);
- }
-
- &.is-author, &.is-admin, &.is-moderator {
- background: rgba(45,144,248,.15);
- }
- }
+ [class^="icon-arrow"] {
+ font-size: $base-font-size;
+ left: -20px;
+ position: absolute;
+ top: -1px;
}
- .comment-children {
- border-left: 1px dashed $border;
- display: inline-block;
- margin-left: rem-calc(16);
- padding-left: rem-calc(8);
- width: 100%;
+ .divider {
+ color: $text-light;
}
- .comment-info {
- color: $text-medium;
- display: inline-block;
- font-size: $small-font-size;
- line-height: rem-calc(32); // Same as avatar height
+ form {
+ margin-top: $line-height / 2;
+ }
+ }
- span.user-name {
- color: $text;
- font-weight: bold;
- }
+ .comment-user {
+ margin-top: $line-height / 4;
+ padding: $line-height / 4 0;
+ overflow: hidden;
+
+ &.level-1,
+ &.level-2,
+ &.level-3,
+ &.level-4,
+ &.level-5,
+ &.is-author,
+ &.is-admin,
+ &.is-moderator {
+ background: rgba(70, 219, 145, 0.3);
+ padding: $line-height / 4 $line-height / 2;
+ }
+
+ &.level-1 {
+ background: none;
+ }
+
+ &.level-5 {
+ background: rgba(255, 241, 204, 1);
+ }
+
+ &.is-author,
+ &.is-admin,
+ &.is-moderator {
+ background: rgba(45, 144, 248, 0.15);
+ }
+ }
+}
+
+.comment-children {
+ border-left: 1px dashed $border;
+ display: inline-block;
+ margin-left: rem-calc(16);
+ padding-left: rem-calc(8);
+ width: 100%;
+}
+
+.comment-info {
+ color: $text-medium;
+ display: inline-block;
+ font-size: $small-font-size;
+ line-height: rem-calc(32); // Same as avatar height
+
+ .user-name {
+ color: $text;
+ font-weight: bold;
+ }
+}
+
+.comment-votes {
+
+ a {
+ color: $text-light;
+ display: inline-block;
+ vertical-align: top;
+ }
+
+ a:hover {
+ color: $text-medium;
+ text-decoration: none;
+
+ .icon-like {
+ color: $like;
+ }
+
+ .icon-unlike {
+ color: $unlike;
}
}
}
@@ -1857,7 +1885,7 @@ table {
}
label {
- padding-right: $line-height/2;
+ padding-right: $line-height / 2;
float: none;
@include breakpoint(medium) {
@@ -1883,7 +1911,8 @@ table {
}
}
-.flag-disable, .flag-active {
+.flag-disable,
+.flag-active {
line-height: 0;
vertical-align: sub;
}
@@ -1904,54 +1933,55 @@ table {
// ------------
.activity {
- margin-bottom: $line-height*2;
+ margin-bottom: $line-height * 2;
table {
border: 0;
+ }
- td {
- position: relative;
+ td {
+ position: relative;
- &:first-child {
- padding-left: $line-height*1.5;
- width: 75%;
- }
-
- &:before {
- color: $brand;
- font-family: "icons" !important;
- font-size: rem-calc(24);
- left: 4px;
- position: absolute;
- }
+ &:first-child {
+ padding-left: $line-height * 1.5;
+ width: 75%;
}
- &.activity-comments td:first-child:before {
- content: "e";
+ &::before {
+ color: $brand;
+ font-family: "icons" !important;
+ font-size: rem-calc(24);
+ left: 4px;
+ position: absolute;
+ }
+ }
+
+ .activity-comments td:first-child::before {
+ content: 'e';
+ top: 18px;
+ }
+
+ .activity-debates td:first-child::before {
+ content: 'i';
+ top: 14px;
+ }
+
+ .activity-proposals {
+
+ td:first-child::before {
+ content: 'h';
top: 18px;
}
- &.activity-debates td:first-child:before {
- content: "i";
- top: 14px;
+ .retired {
+ text-decoration: line-through;
}
+ }
- &.activity-proposals {
-
- td:first-child:before {
- content: "h";
- top: 18px;
- }
-
- .retired {
- text-decoration: line-through;
- }
- }
-
- &.activity-investment-projects td:first-child:before, &.activity-ballot td:first-child:before {
- content: "\53";
- top: 10px;
- }
+ .activity-investment-projects td:first-child::before,
+ .activity-ballot td:first-child::before {
+ content: '\53';
+ top: 10px;
}
}
@@ -1967,7 +1997,7 @@ table {
}
.banner-style-three {
- background-color: #33DADF;
+ background-color: #33dadf;
}
@include breakpoint(large) {
@@ -1985,38 +2015,45 @@ table {
}
}
-.banner-img-one, .banner-img-two, .banner-img-three {
+.banner-img-one,
+.banner-img-two,
+.banner-img-three {
background-position: bottom right;
background-repeat: no-repeat;
}
-.banner-style-one, .banner-style-two, .banner-style-three {
+.banner-style-one,
+.banner-style-two,
+.banner-style-three {
margin: 0;
margin-bottom: $line-height;
- h2, h3, a {
- color: #eaeaf2;
- }
-
- h2 {
- padding: $line-height/2;
- padding-bottom: 0;
- }
-
- h3 {
- padding: $line-height/2;
- padding-top: 0;
- }
-
- a:hover h2, a:hover h3 {
- color: #eaeaf2 !important;
- text-decoration: none;
- }
-
@include breakpoint(large) {
h3 {
width: 80%;
}
}
+
+ h2,
+ h3,
+ a {
+ color: #eaeaf2;
+ }
+
+ h2 {
+ padding: $line-height / 2;
+ padding-bottom: 0;
+ }
+
+ h3 {
+ padding: $line-height / 2;
+ padding-top: 0;
+ }
+
+ a:hover h2,
+ a:hover h3 {
+ color: #eaeaf2 !important;
+ text-decoration: none;
+ }
}
diff --git a/app/assets/stylesheets/legislation.scss b/app/assets/stylesheets/legislation.scss
index c3917ad8c..60f6d0030 100644
--- a/app/assets/stylesheets/legislation.scss
+++ b/app/assets/stylesheets/legislation.scss
@@ -18,7 +18,7 @@
h4 {
font-weight: 400;
text-align: center;
- color: white;
+ color: #fff;
}
}
}
@@ -28,7 +28,7 @@
.legislation-categories {
.menu.simple {
- border-bottom: none;
+ border-bottom: 0;
list-style: none;
padding-left: 0;
margin-left: 0;
@@ -37,19 +37,19 @@
@include breakpoint(medium) {
margin: 1.5rem 0;
}
+ }
- li {
- display: block;
- cursor: pointer;
- margin-bottom: 1rem;
+ li {
+ display: block;
+ cursor: pointer;
+ margin-bottom: 1rem;
- @include breakpoint(medium) {
- margin-bottom: 2rem;
- max-width: 80%;
- }
+ @include breakpoint(medium) {
+ margin-bottom: 2rem;
+ max-width: 80%;
}
- li.active {
+ &.active {
font-weight: 700;
}
}
@@ -58,14 +58,14 @@
// 03. Legislation cards
// -----------------
.legislation {
- margin: 0 0 $line-height 0;
- background: white;
+ margin: 0 0 $line-height;
+ background: #fff;
border: 1px solid;
border-color: #e5e6e9 #dfe0e4 #d0d1d5;
border-radius: 0;
- box-shadow: 0px 1px 3px 0 #DEE0E3;
+ box-shadow: 0 1px 3px 0 #dee0e3;
min-height: 12rem;
- padding: 2rem 0 0 0;
+ padding: 2rem 0 0;
}
.legislation-text {
@@ -83,13 +83,13 @@
}
.legislation-calendar {
- background: #E5ECF2;
+ background: #e5ecf2;
padding-top: 1rem;
h5 {
margin-left: 0.25rem;
margin-bottom: 0;
- color: #61686E;
+ color: #61686e;
@include breakpoint(medium) {
margin-left: 0;
diff --git a/app/assets/stylesheets/legislation_process.scss b/app/assets/stylesheets/legislation_process.scss
index c9f4a4739..15846943c 100644
--- a/app/assets/stylesheets/legislation_process.scss
+++ b/app/assets/stylesheets/legislation_process.scss
@@ -16,7 +16,7 @@
// -----------------
.grey-heading {
- background: #E6E6E6;
+ background: #e6e6e6;
}
$epigraph-font-size: rem-calc(15);
@@ -39,15 +39,15 @@ $epigraph-line-height: rem-calc(22);
list-style: none;
margin-left: 0;
- li:before {
+ li::before {
vertical-align: text-bottom;
padding-right: 0.5rem;
- content: "■";
- color: #8AA8BE;
+ content: '■';
+ color: #8aa8be;
}
}
- #debate-show {
+ .legislation-debate-show {
display: none;
}
@@ -82,12 +82,9 @@ $epigraph-line-height: rem-calc(22);
}
.half-gradient {
- /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#e6e6e6+0,e6e6e6+50,ffffff+50 */
- background: #e6e6e6; /* Old browsers */
- background: -moz-linear-gradient(top, #e6e6e6 0%, #e6e6e6 50%, #ffffff 50%); /* FF3.6-15 */
- background: -webkit-linear-gradient(top, #e6e6e6 0%,#e6e6e6 50%,#ffffff 50%); /* Chrome10-25,Safari5.1-6 */
- background: linear-gradient(to bottom, #e6e6e6 0%,#e6e6e6 50%,#ffffff 50%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
- filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e6e6e6', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
+ background: #e6e6e6;
+ background: linear-gradient(to bottom, #e6e6e6 0%, #e6e6e6 50%, #fff 50%);
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e6e6e6', endColorstr='#fff', GradientType=0);
}
.text-center .button {
@@ -115,14 +112,14 @@ $epigraph-line-height: rem-calc(22);
ul {
font-size: $epigraph-font-size;
line-height: $epigraph-line-height;
+ }
- li {
- margin-bottom: 1rem;
+ li {
+ margin-bottom: 1rem;
- p {
- display: inline;
- margin-bottom: 0;
- }
+ p {
+ display: inline;
+ margin-bottom: 0;
}
}
@@ -134,6 +131,11 @@ $epigraph-line-height: rem-calc(22);
.button-subscribe {
margin-top: 1rem;
+ @include breakpoint(medium) {
+ padding: 0.5em 1em;
+ margin-top: 3rem;
+ }
+
h3 {
margin-bottom: 0;
}
@@ -144,12 +146,7 @@ $epigraph-line-height: rem-calc(22);
}
&:hover h3 {
- color: white;
- }
-
- @include breakpoint(medium) {
- padding: 0.5em 1em;
- margin-top: 3rem;
+ color: #fff;
}
}
}
@@ -161,7 +158,7 @@ $epigraph-line-height: rem-calc(22);
.legislation-process-list {
border-bottom: 1px solid $medium-gray;
- margin: 0 1rem 1rem 1rem;
+ margin: 0 1rem 1rem;
padding-top: 4rem;
@include breakpoint(medium) {
@@ -190,53 +187,54 @@ $epigraph-line-height: rem-calc(22);
left: -1rem;
}
}
+ }
- li {
- cursor: pointer;
- display: inline-block;
- margin: 0 1rem 1rem 0;
- transition: all 0.4s;
- border-bottom: 2px solid transparent;
+ li {
+ cursor: pointer;
+ display: inline-block;
+ margin: 0 1rem 1rem 0;
+ transition: all 0.4s;
+ border-bottom: 2px solid transparent;
- &:first-of-type {
- margin-left: 0;
- }
-
- &:hover,
- &:active,
- &:focus {
- border-bottom: 2px solid $brand;
- }
-
- @media (min-width: 950px) {
- margin: 0 0 0 3rem;
- }
-
- a,
- h4 {
- display: block;
- color: #6D6D6D;
- margin-bottom: 0;
- }
-
- a {
- &:hover, &:active {
- text-decoration: none;
- }
-
- p {
- margin-bottom: 0;
-
- @include breakpoint(medium) {
- margin-bottom: 1rem;
- }
- }
- }
+ &:first-of-type {
+ margin-left: 0;
}
- .active {
+ &:hover,
+ &:active,
+ &:focus {
border-bottom: 2px solid $brand;
}
+
+ @media (min-width: 950px) {
+ margin: 0 0 0 3rem;
+ }
+
+ a,
+ h4 {
+ display: block;
+ color: #6d6d6d;
+ margin-bottom: 0;
+ }
+
+ a {
+ &:hover,
+ &:active {
+ text-decoration: none;
+ }
+
+ p {
+ margin-bottom: 0;
+
+ @include breakpoint(medium) {
+ margin-bottom: 1rem;
+ }
+ }
+ }
+ }
+
+ .active {
+ border-bottom: 2px solid $brand;
}
}
}
@@ -269,21 +267,21 @@ $epigraph-line-height: rem-calc(22);
.debate-title a {
color: $brand;
}
+ }
- .debate-meta,
- .debate-meta a {
- font-size: $small-font-size;
- color: #6D6D6D;
+ .debate-meta,
+ .debate-meta a {
+ font-size: $small-font-size;
+ color: #6d6d6d;
- .icon-comments {
- margin-right: 0.2rem;
- }
+ .icon-comments {
+ margin-right: 0.2rem;
}
}
.debate-info {
padding: 1rem;
- background: #F4F4F4;
+ background: #f4f4f4;
}
}
@@ -297,13 +295,14 @@ $epigraph-line-height: rem-calc(22);
.quiz-header {
margin-bottom: 2rem;
- .quiz-title, .quiz-next {
+ .quiz-title,
+ .quiz-next {
padding: 1rem;
height: 6rem;
}
.quiz-title {
- background: #E5ECF2;
+ background: #e5ecf2;
.quiz-header-title {
margin-bottom: 0;
@@ -324,12 +323,13 @@ $epigraph-line-height: rem-calc(22);
.quiz-next-link {
display: block;
- &:hover, &:active {
+ &:hover,
+ &:active {
text-decoration: none;
}
.quiz-next {
- background: #CCDBE5;
+ background: #ccdbe5;
font-weight: 700;
color: $brand;
font-size: $small-font-size;
@@ -341,13 +341,14 @@ $epigraph-line-height: rem-calc(22);
vertical-align: sub;
}
- &:hover, &:active {
+ &:hover,
+ &:active {
text-decoration: none;
background: $brand;
- color: white;
+ color: #fff;
.icon-angle-right {
- color: white;
+ color: #fff;
}
}
}
@@ -380,8 +381,8 @@ $epigraph-line-height: rem-calc(22);
}
.active {
- background: #CCDBE6;
- border: none;
+ background: #ccdbe6;
+ border: 0;
}
.control input {
@@ -392,7 +393,7 @@ $epigraph-line-height: rem-calc(22);
.control input:checked ~ .control-indicator {
background-color: $brand;
- border: none;
+ border: 0;
}
.radio .control-indicator {
@@ -409,11 +410,8 @@ $epigraph-line-height: rem-calc(22);
line-height: 1rem;
font-size: 65%;
text-align: center;
- border: 2px solid #9C9C9C;
+ border: 2px solid #9c9c9c;
pointer-events: none;
- -webkit-user-select: none;
- -moz-user-select: none;
- -ms-user-select: none;
user-select: none;
}
}
@@ -422,9 +420,9 @@ $epigraph-line-height: rem-calc(22);
// 06. Legislation draft
// -----------------
.debate-draft {
- padding: 10rem 2rem 15rem 2rem;
+ padding: 10rem 2rem 15rem;
display: block;
- background: #F2F2F2;
+ background: #f2f2f2;
button {
height: 90px;
@@ -445,7 +443,7 @@ $epigraph-line-height: rem-calc(22);
.legislation-allegation {
padding-top: 1rem;
- #debate-show {
+ .legislation-debate-show {
margin-top: 2rem;
}
@@ -459,7 +457,7 @@ $epigraph-line-height: rem-calc(22);
.button-circle {
line-height: 0;
- padding: 0em;
+ padding: 0;
width: 30px;
height: 30px;
border-radius: 50%;
@@ -467,7 +465,7 @@ $epigraph-line-height: rem-calc(22);
span {
padding-left: 1px;
- &:before {
+ &::before {
line-height: 1.55;
}
}
@@ -482,8 +480,12 @@ $epigraph-line-height: rem-calc(22);
.button-subscribed {
margin-top: 1rem;
- border: 1px solid #D1D1D1;
- background: #F2F2F2;
+ border: 1px solid #d1d1d1;
+ background: #f2f2f2;
+
+ @include breakpoint(medium) {
+ padding: 0.5em 1em;
+ }
h3 {
display: inline-block;
@@ -499,10 +501,6 @@ $epigraph-line-height: rem-calc(22);
&:hover h3 {
color: $text;
}
-
- @include breakpoint(medium) {
- padding: 0.5em 1em;
- }
}
}
@@ -547,7 +545,7 @@ $epigraph-line-height: rem-calc(22);
a {
text-decoration: underline;
- color: $text-medium
+ color: $text-medium;
}
}
}
@@ -585,12 +583,12 @@ $epigraph-line-height: rem-calc(22);
}
.calc-text {
- width: calc(65% - 25px)
+ width: calc(65% - 25px);
}
.calc-comments {
cursor: pointer;
- background: #F2F2F2;
+ background: #f2f2f2;
width: 50px;
.draft-panel {
@@ -618,7 +616,7 @@ $epigraph-line-height: rem-calc(22);
font-weight: 700;
padding: 0.5rem 1rem;
color: #696969;
- background: #F2F2F2;
+ background: #f2f2f2;
font-size: $small-font-size;
.icon-comments {
@@ -647,21 +645,23 @@ $epigraph-line-height: rem-calc(22);
li {
margin-bottom: 1rem;
}
+
.open::before {
cursor: pointer;
position: absolute;
margin-left: -1.25rem;
- font-family: "icons";
- content: "\58";
+ font-family: 'icons';
+ content: '\58';
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
+
.closed::before {
cursor: pointer;
position: absolute;
margin-left: -1.25rem;
- font-family: "icons";
- content: "\5a";
+ font-family: 'icons';
+ content: '\5a';
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
@@ -689,7 +689,7 @@ $epigraph-line-height: rem-calc(22);
.anchor::before {
display: none;
- content: "#";
+ content: '#';
color: $text-medium;
position: absolute;
left: 0;
@@ -732,10 +732,7 @@ $epigraph-line-height: rem-calc(22);
font-weight: 700;
color: #696969;
margin-top: 4rem;
- -webkit-transform: rotate(-90deg);
- -moz-transform: rotate(-90deg);
- -ms-transform: rotate(-90deg);
- -o-transform: rotate(-90deg);
+ transform: rotate(-90deg);
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
}
}
@@ -746,7 +743,7 @@ $epigraph-line-height: rem-calc(22);
.comments-on {
.calc-index {
width: 50px;
- background: #F2F2F2;
+ background: #f2f2f2;
cursor: pointer;
.panel-title {
@@ -766,10 +763,7 @@ $epigraph-line-height: rem-calc(22);
font-weight: 700;
color: #696969;
margin-top: $line-height;
- -webkit-transform: rotate(-90deg);
- -moz-transform: rotate(-90deg);
- -ms-transform: rotate(-90deg);
- -o-transform: rotate(-90deg);
+ transform: rotate(-90deg);
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
.panel-title {
@@ -781,11 +775,11 @@ $epigraph-line-height: rem-calc(22);
.calc-text {
width: calc(65% - 25px);
- border-right: none;
+ border-right: 0;
.show-comments {
width: 105%;
- background: #FAFAFA;
+ background: #fafafa;
padding: 0.25rem 2.5rem 0.25rem 0.25rem;
border: 1px solid $border;
margin-bottom: 1rem;
@@ -798,7 +792,7 @@ $epigraph-line-height: rem-calc(22);
}
.calc-comments {
- background: white;
+ background: #fff;
cursor: auto;
width: calc(35% - 25px);
@@ -810,7 +804,7 @@ $epigraph-line-height: rem-calc(22);
display: none;
}
- #comments-box {
+ .comments-box-container {
position: absolute;
top: 230px;
}
@@ -818,7 +812,7 @@ $epigraph-line-height: rem-calc(22);
.comment-box {
width: 375px;
padding: 1rem;
- background: #F9F9F9;
+ background: #f9f9f9;
border: 1px solid $border;
display: block;
margin-bottom: 2rem;
@@ -868,7 +862,7 @@ $epigraph-line-height: rem-calc(22);
.participation-not-allowed {
font-size: 0.875rem;
height: 50px;
- padding: .85rem 0.75rem;
+ padding: 0.85rem 0.75rem;
top: -18px;
}
}
@@ -880,31 +874,31 @@ $epigraph-line-height: rem-calc(22);
border-bottom: 1px solid $border;
.comment-advice {
- border-top: 1px solid #D0D0D0;
- border-right: 1px solid #D0D0D0;
- border-left: 1px solid #D0D0D0;
+ border-top: 1px solid #d0d0d0;
+ border-right: 1px solid #d0d0d0;
+ border-left: 1px solid #d0d0d0;
width: 100%;
padding: 0.5rem;
display: inline-block;
font-size: $small-font-size;
- background: #DFDFDF;
+ background: #dfdfdf;
.icon-proposals {
color: #838383;
}
a {
- color: #87A3B9;
- text-decoration: underline;
- }
+ color: #87a3b9;
+ text-decoration: underline;
+ }
}
textarea {
border-radius: 0;
box-shadow: none;
- border-bottom: 1px solid #D0D0D0;
- border-right: 1px solid #D0D0D0;
- border-left: 1px solid #D0D0D0;
+ border-bottom: 1px solid #d0d0d0;
+ border-right: 1px solid #d0d0d0;
+ border-left: 1px solid #d0d0d0;
width: 100%;
height: 200px;
margin-bottom: 0.5rem;
@@ -912,7 +906,7 @@ $epigraph-line-height: rem-calc(22);
.comment-actions {
.cancel-comment {
- color: #87A3B9;
+ color: #87a3b9;
text-decoration: underline;
font-size: $small-font-size;
display: inline-block;
@@ -948,10 +942,11 @@ $epigraph-line-height: rem-calc(22);
display: inline-block;
&::after {
- content: "|";
+ content: '|';
color: #838383;
}
}
+
.comment-replies {
display: inline-block;
}
@@ -968,14 +963,14 @@ $epigraph-line-height: rem-calc(22);
&::after {
margin-left: 0.25rem;
- content: "|";
+ content: '|';
}
}
.icon-like,
.icon-unlike {
cursor: pointer;
- color: #C7C7C7;
+ color: #c7c7c7;
&:hover,
&:active,
@@ -993,8 +988,8 @@ $epigraph-line-height: rem-calc(22);
}
.draft-panel {
- background: #E5E5E5;
- border-left: 1px solid #D4D4D4;
+ background: #e5e5e5;
+ border-left: 1px solid #d4d4d4;
.panel-title {
display: inline-block;
@@ -1022,7 +1017,7 @@ $epigraph-line-height: rem-calc(22);
&::before {
margin-right: 0.25rem;
- content: "—"
+ content: '—';
}
.changes-link {
@@ -1041,7 +1036,7 @@ $epigraph-line-height: rem-calc(22);
.icon-external {
text-decoration: none;
- color: #999999;
+ color: #999;
line-height: 0;
vertical-align: sub;
margin-left: 0.5rem;
@@ -1067,9 +1062,9 @@ $epigraph-line-height: rem-calc(22);
}
.comment-section {
- background: #FAFAFA;
+ background: #fafafa;
padding: 1rem;
- border: 1px solid #DEE0E3;
+ border: 1px solid #dee0e3;
margin-top: 0.25rem;
margin-bottom: 1rem;
}
@@ -1085,7 +1080,7 @@ $epigraph-line-height: rem-calc(22);
.icon-expand,
.icon-comments {
text-decoration: none;
- color: #999999;
+ color: #999;
line-height: 0;
}
@@ -1119,9 +1114,9 @@ $epigraph-line-height: rem-calc(22);
}
.comment-section {
- background: #FAFAFA;
+ background: #fafafa;
padding: 1rem;
- border: 1px solid #DEE0E3;
+ border: 1px solid #dee0e3;
margin-top: 0.25rem;
margin-bottom: 1rem;
}
@@ -1137,7 +1132,7 @@ $epigraph-line-height: rem-calc(22);
.icon-expand,
.icon-comments {
text-decoration: none;
- color: #999999;
+ color: #999;
line-height: 0;
}
diff --git a/app/assets/stylesheets/mixins.scss b/app/assets/stylesheets/mixins.scss
index 5ffc534cb..401a2ec81 100644
--- a/app/assets/stylesheets/mixins.scss
+++ b/app/assets/stylesheets/mixins.scss
@@ -7,14 +7,14 @@
// --------
@mixin logo {
- color: white;
+ color: #fff;
display: inline-block;
font-family: 'Lato' !important;
font-size: rem-calc(24);
font-weight: lighter;
@include breakpoint(medium) {
- line-height: $line-height*2;
+ line-height: $line-height * 2;
margin-top: 0;
}
@@ -24,7 +24,7 @@
@include breakpoint(medium) {
height: 80px;
- margin-right: $line-height/2;
+ margin-right: $line-height / 2;
margin-top: 0;
width: 80px;
}
diff --git a/app/assets/stylesheets/pages.scss b/app/assets/stylesheets/pages.scss
index f8bf6c7cd..d3db7e9b2 100644
--- a/app/assets/stylesheets/pages.scss
+++ b/app/assets/stylesheets/pages.scss
@@ -16,7 +16,7 @@
padding-top: $line-height;
&.light {
- background: #ECF0F1;
+ background: #ecf0f1;
}
}
@@ -36,7 +36,7 @@
@include breakpoint(medium) {
display: inline-block;
- margin-right: $line-height/2;
+ margin-right: $line-height / 2;
}
}
}
@@ -50,7 +50,7 @@
color: $brand;
}
- .additional-info {
+ .additional-info {
margin-bottom: $line-height;
}
@@ -68,23 +68,23 @@
}
}
- ul.features {
+ .features {
list-style-type: circle;
margin-left: $line-height;
@include breakpoint(medium) {
- margin: $line-height 0 $line-height $line-height*2.5;
+ margin: $line-height 0 $line-height $line-height * 2.5;
}
li {
- margin-bottom: $line-height
+ margin-bottom: $line-height;
}
}
.section-content {
border-top: 1px solid $medium-gray;
- padding-bottom: $line-height*2;
- padding-top: $line-height*2;
+ padding-bottom: $line-height * 2;
+ padding-top: $line-height * 2;
&:first-child {
border-top: 0;
@@ -101,10 +101,10 @@
.sidebar-card {
border: 1px solid $border;
margin-bottom: $line-height;
- padding: $line-height/2;
+ padding: $line-height / 2;
&.light {
- background: #ECF0F1;
+ background: #ecf0f1;
border: 0;
}
}
diff --git a/app/assets/stylesheets/participation.scss b/app/assets/stylesheets/participation.scss
index 75bbba32c..a9cde9f55 100644
--- a/app/assets/stylesheets/participation.scss
+++ b/app/assets/stylesheets/participation.scss
@@ -16,7 +16,7 @@
@mixin votes {
border-top: 1px solid $border;
margin-top: $line-height;
- padding: $line-height/2 0;
+ padding: $line-height / 2 0;
position: relative;
@include breakpoint(medium) {
@@ -25,8 +25,9 @@
margin-top: 0;
}
- .icon-like, .icon-unlike {
- background: white;
+ .icon-like,
+ .icon-unlike {
+ background: #fff;
border: 2px solid $text-light;
border-radius: rem-calc(3);
color: $text-light;
@@ -36,8 +37,9 @@
padding: rem-calc(3) rem-calc(6);
position: relative;
- &:hover, &:active {
- color: white;
+ &:hover,
+ &:active {
+ color: #fff;
cursor: pointer;
opacity: 1 !important;
}
@@ -45,7 +47,8 @@
.icon-like {
- &:hover, &:active {
+ &:hover,
+ &:active {
background: $like;
border: 2px solid $like;
}
@@ -53,23 +56,25 @@
.icon-unlike {
- &:hover, &:active {
+ &:hover,
+ &:active {
background: $unlike;
border: 2px solid $unlike;
}
}
- .like, .unlike {
+ .like,
+ .unlike {
line-height: rem-calc(48);
vertical-align: super;
text-decoration: none;
- span.percentage {
+ .percentage {
color: $text;
display: inline-block;
font-size: $small-font-size;
- line-height: $line-height*2;
- padding-right: $line-height/2;
+ line-height: $line-height * 2;
+ padding-right: $line-height / 2;
vertical-align: top;
@include breakpoint(medium) {
@@ -82,8 +87,9 @@
.voted {
- .icon-like, .icon-unlike {
- color: white;
+ .icon-like,
+ .icon-unlike {
+ color: #fff;
}
.icon-like {
@@ -99,15 +105,16 @@
.no-voted {
- .icon-like, .icon-unlike {
- opacity: .3;
+ .icon-like,
+ .icon-unlike {
+ opacity: 0.3;
}
}
.total-votes {
font-weight: bold;
float: right;
- line-height: $line-height*2;
+ line-height: $line-height * 2;
@include breakpoint(medium) {
display: block;
@@ -136,7 +143,7 @@
border-bottom-right-radius: rem-calc(3);
border-top-right-radius: rem-calc(3);
display: block;
- height: $line-height/2;
+ height: $line-height / 2;
}
}
@@ -153,7 +160,7 @@
color: $text-medium;
&[title] {
- border-bottom: none;
+ border-bottom: 0;
}
}
@@ -164,7 +171,8 @@
font-size: $small-font-size;
margin-top: rem-calc(12);
- &:hover, &:active {
+ &:hover,
+ &:active {
background: lighten($proposals, 25%);
cursor: pointer;
}
@@ -208,7 +216,7 @@
left: 0;
line-height: $line-height;
min-height: 100%;
- padding: $line-height $line-height/2;
+ padding: $line-height $line-height / 2;
position: absolute;
text-align: center;
top: 0;
@@ -229,8 +237,8 @@
}
.reply .participation-not-allowed {
- padding-right: $line-height/2;
- padding-top: $line-height/6;
+ padding-right: $line-height / 2;
+ padding-top: $line-height / 6;
text-align: right;
}
@@ -242,10 +250,12 @@
.budget-investment-form,
.spending-proposal-form {
- .icon-debates, .icon-proposals, .icon-budget {
+ .icon-debates,
+ .icon-proposals,
+ .icon-budget {
font-size: rem-calc(50);
line-height: $line-height;
- opacity: .5;
+ opacity: 0.5;
}
.icon-debates {
@@ -259,34 +269,34 @@
.icon-budget {
color: $budget;
}
+}
- .recommendations {
- list-style-type: none;
- margin-left: 0;
- margin-top: $line-height;
+.recommendations {
+ list-style-type: none;
+ margin-left: 0;
+ margin-top: $line-height;
- li {
- font-size: $small-font-size;
- margin: $line-height/2 0;
+ li {
+ font-size: $small-font-size;
+ margin: $line-height / 2 0;
- &:before {
- content: "l ";
- font-family: "icons" !important;
- }
+ &::before {
+ content: 'l ';
+ font-family: "icons" !important;
}
}
}
.debate-form {
- .recommendations li:before {
+ .recommendations li::before {
color: $debates;
}
}
.proposal-form {
- .recommendations li:before {
+ .recommendations li::before {
color: $proposals;
}
}
@@ -312,27 +322,31 @@
}
.social-share-full .social-share-button {
- display:inline;
+ display: inline;
}
- .whatsapp:before {
+ .whatsapp::before {
background-color: #43d854;
- color: white;
+ color: #fff;
font-size: 1.7em;
margin-left: rem-calc(0.5);
padding: rem-calc(9.5) rem-calc(9.8);
vertical-align: rem-calc(10);
}
- .edit-debate, .edit-proposal {
+ .edit-debate,
+ .edit-proposal {
margin-bottom: 0;
}
- .debate-info, .proposal-info, .investment-project-info, .budget-investment-show {
+ .debate-info,
+ .proposal-info,
+ .investment-project-info,
+ .budget-investment-show {
clear: both;
color: $text-medium;
font-size: $small-font-size;
- margin-bottom: $line-height/2;
+ margin-bottom: $line-height / 2;
position: relative;
span:not(.label) {
@@ -350,24 +364,26 @@
}
}
- .debate-description, .proposal-description {
+ .debate-description,
+ .proposal-description {
font-size: rem-calc(15);
line-height: rem-calc(30);
}
- ul, ol {
- margin: rem-calc(12) 0;
+ ul,
+ ol {
li {
font-size: rem-calc(15);
margin-bottom: rem-calc(15);
}
+ }
- &.tags, &.geozone {
+ &.tags,
+ &.geozone {
- li {
- margin-bottom: 0;
- }
+ li {
+ margin-bottom: 0;
}
}
@@ -383,10 +399,6 @@
a {
color: $link !important;
-
- &:hover {
- color: $link-hover !important;
- }
}
}
@@ -403,27 +415,28 @@
}
blockquote {
- color: #4C4C4C;
+ color: #4c4c4c;
margin-top: rem-calc(12);
padding-top: 0;
font-size: rem-calc(15);
line-height: rem-calc(30);
}
- .document-link, .video-link {
+ .document-link,
+ .video-link {
border: 1px solid $border;
display: block;
- margin: $line-height/2 0;
- padding: $line-height/2;
+ margin: $line-height / 2 0;
+ padding: $line-height / 2;
position: relative;
a {
padding-left: rem-calc(24);
}
- :before {
- color: #007BB7;
- content: "G";
+ ::before {
+ color: #007bb7;
+ content: 'G';
font-family: "icons" !important;
font-size: rem-calc(24);
left: rem-calc(6);
@@ -435,9 +448,9 @@
.video-link {
- :before {
- color: #CC181E;
- content: "D";
+ ::before {
+ color: #cc181e;
+ content: 'D';
}
}
@@ -463,14 +476,17 @@
color: $text;
}
-.investment-project-show p, .budget-investment-show p {
+.investment-project-show p,
+.budget-investment-show p {
word-break: break-word;
}
-.proposal-show, .investment-project-show, .budget-investment-show {
+.proposal-show,
+.investment-project-show,
+.budget-investment-show {
.supports {
- padding: $line-height/2 0 0;
+ padding: $line-height / 2 0 0;
}
.share-supported {
@@ -481,141 +497,151 @@
// 04. List participation
// ----------------------
-.debates-list, .proposals-list, .investment-projects-list, .budget-investments-list {
+.debates-list,
+.proposals-list,
+.investment-projects-list,
+.budget-investments-list {
@include breakpoint(medium) {
margin-bottom: rem-calc(48);
}
}
-.investment-projects-list, .budget-investments-list {
+.investment-projects-list,
+.budget-investments-list {
@include breakpoint(medium) {
- min-height: $line-height*15;
+ min-height: $line-height * 15;
}
}
-.debate, .proposal, .investment-project, .budget-investment, .legislation {
- margin: $line-height/4 0;
+.debate,
+.proposal,
+.investment-project,
+.budget-investment,
+.legislation {
+ margin: $line-height / 4 0;
.panel {
- background: white;
+ background: #fff;
border: 1px solid;
border-color: #e5e6e9 #dfe0e4 #d0d1d5;
border-radius: 0;
- box-shadow: 0px 1px 3px 0 $border;
+ box-shadow: 0 1px 3px 0 $border;
margin-bottom: rem-calc(12);
min-height: rem-calc(192);
- padding: rem-calc(12) rem-calc(12) 0 rem-calc(12);
+ padding: rem-calc(12) rem-calc(12) 0;
@include breakpoint(medium) {
margin-bottom: rem-calc(-1);
padding-bottom: rem-calc(12);
}
+ @include breakpoint(medium) {
+ .divider {
+ display: inline-block;
+ }
+ }
+
h3 {
font-weight: bold;
- margin-top: $line-height/2;
+ margin-top: $line-height / 2;
a {
color: $text;
}
}
+ }
- .debate-content, .proposal-content,
- .investment-project-content, .budget-investment-content {
- margin: 0;
- min-height: rem-calc(180);
- position: relative;
+ .debate-content,
+ .proposal-content,
+ .investment-project-content,
+ .budget-investment-content {
+ margin: 0;
+ min-height: rem-calc(180);
+ position: relative;
+ }
- .tags {
- display: block;
- }
+ .tags {
+ display: block;
+ }
+
+ .icon-debates,
+ .icon-proposals,
+ .icon-budget {
+ font-size: rem-calc(18);
+ line-height: $line-height;
+ margin-left: rem-calc(6);
+ top: 0;
+ }
+
+ .icon-debates {
+ color: $debates;
+ }
+
+ .icon-proposals {
+ color: $proposals-dark;
+ }
+
+ .icon-budget {
+ color: $budget;
+ font-size: $small-font-size;
+ }
+
+ .debate-info,
+ .proposal-info,
+ .investment-project-info,
+ .budget-investment-info {
+ color: $text-medium;
+ font-size: $small-font-size;
+ margin: rem-calc(6) 0 0;
+
+ .icon-comments {
+ font-size: rem-calc(16);
+ vertical-align: top;
}
- .icon-debates, .icon-proposals, .icon-budget {
- font-size: rem-calc(18);
- line-height: $line-height;
- margin-left: rem-calc(6);
- top: 0;
- }
-
- .icon-debates {
- color: $debates;
- }
-
- .icon-proposals {
- color: $proposals-dark;
- }
-
- .icon-budget {
- color: $budget;
- font-size: $small-font-size;
- }
-
- .debate-info, .proposal-info, .investment-project-info, .budget-investment-info {
+ a {
color: $text-medium;
- font-size: $small-font-size;
- margin: rem-calc(6) 0 0;
-
- .icon-comments {
- font-size: rem-calc(16);
- vertical-align: top;
- }
-
- a {
- color: $text-medium;
- }
}
+ }
- .debate-description, .proposal-description, .investment-project-description, .budget-investment-description {
- color: $text;
- font-size: rem-calc(13);
- height: rem-calc(72);
- line-height: $line-height;
- margin-bottom: rem-calc(12);
- margin-top: 0;
- overflow: hidden;
- position: relative;
+ .debate-description,
+ .proposal-description,
+ .investment-project-description,
+ .budget-investment-description {
+ color: $text;
+ font-size: rem-calc(13);
+ height: rem-calc(72);
+ line-height: $line-height;
+ margin-bottom: rem-calc(12);
+ margin-top: 0;
+ 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 {
+ a {
color: $text;
}
}
- .divider {
- display: none;
+ .truncate {
+ background: image-url('truncate.png');
+ background-repeat: repeat-x;
+ bottom: 0;
+ height: 24px;
+ position: absolute;
+ width: 100%;
}
- @include breakpoint(medium) {
- .divider {
- display: inline-block;
- }
+ p {
+ color: $text;
}
}
+.divider {
+ display: none;
+}
+
.more-info {
clear: both;
color: $text-medium;
@@ -626,24 +652,25 @@
}
}
-.debate, .debate-show {
+.debate,
+.debate-show {
.votes {
@include votes;
- .against {
- margin-left: $line-height/4;
- }
-
@include breakpoint(medium) {
text-align: center;
}
+
+ .against {
+ margin-left: $line-height / 4;
+ }
}
}
.debate-show .votes {
border: 0;
- padding: $line-height/2 0;
+ padding: $line-height / 2 0;
}
.proposal {
@@ -653,8 +680,10 @@
}
}
-.investment-project, .investment-project-show,
-.budget-investment, .budget-investment-show {
+.investment-project,
+.investment-project-show,
+.budget-investment,
+.budget-investment-show {
.supports {
@include supports;
@@ -669,16 +698,16 @@
.button-support {
background: $budget;
- color: white;
+ color: #fff;
&:hover {
background: $budget-hover;
- color: white;
+ color: #fff;
cursor: pointer;
}
&:active {
- opacity: .75;
+ opacity: 0.75;
}
}
@@ -714,7 +743,7 @@
.budget-investment .supports .total-supports.no-button,
.budget-investment-show .supports .total-supports.no-button {
display: block;
- margin-top: $line-height*1.5;
+ margin-top: $line-height * 1.5;
}
.budget-investment-show {
@@ -745,9 +774,10 @@
// 05. Featured
// ------------
-.featured-debates, .featured-proposals,
+.featured-debates,
+.featured-proposals,
.enquiries-list {
- padding: $line-height/2 0;
+ padding: $line-height / 2 0;
@include breakpoint(medium) {
margin-left: 0 !important;
@@ -769,11 +799,11 @@
}
}
- a, .info {
+ a,
+ .info {
color: lighten($text, 15%);
font-size: $small-font-size;
}
-
}
.featured-debates {
@@ -784,7 +814,7 @@
background: $featured;
.proposal-featured {
- min-height: $line-height*3.5;
+ min-height: $line-height * 3.5;
}
.supports {
@@ -794,7 +824,7 @@
padding-bottom: 0;
padding-top: 0;
- &:after {
+ &::after {
content: none;
}
@@ -808,7 +838,7 @@
margin-top: 0;
&:hover {
- background: white;
+ background: #fff;
color: $text;
}
}
@@ -833,21 +863,21 @@
margin-top: 0;
font-size: $small-font-size;
}
+ }
- .share-supported {
+ .share-supported {
- .ssb-twitter,
- .ssb-facebook,
- .ssb-google_plus {
- background: none;
- color: $text;
- height: rem-calc(33) !important;
+ .ssb-twitter,
+ .ssb-facebook,
+ [class^="ssb-icon ssb-google"] {
+ background: none;
+ color: $text;
+ height: rem-calc(33) !important;
- &:before {
- font-size: rem-calc(18);
- line-height: rem-calc(33);
- }
+ &::before {
+ font-size: rem-calc(18);
+ line-height: rem-calc(33);
}
}
}
@@ -859,26 +889,26 @@
.expanded.budget {
background: $budget;
- h1, h2, p, a.back, .icon-angle-left {
- color: white;
+ h1,
+ h2,
+ p,
+ .back,
+ .icon-angle-left {
+ color: #fff;
}
.button {
- background: white;
+ background: #fff;
color: $budget;
}
.info {
- background: #6A2A72;
+ background: #6a2a72;
p {
margin-bottom: 0;
text-transform: uppercase;
}
-
- @include breakpoint(medium) {
- border-top: rem-calc(6) solid #54225C;
- }
}
}
@@ -887,15 +917,20 @@
border-bottom: 1px solid $budget;
&.budget-heading {
- min-height: $line-height*10;
+ min-height: $line-height * 10;
}
h1 {
margin-bottom: 0;
}
- h1, h2, .back, .icon-angle-left, p, a {
- color: white;
+ h1,
+ h2,
+ .back,
+ .icon-angle-left,
+ p,
+ a {
+ color: #fff;
}
.callout.warning {
@@ -914,46 +949,46 @@
.spending-proposal-timeline {
padding-top: $line-height;
+ }
- ul li {
- margin-right: $line-height;
- padding-top: $line-height/2;
+ ul li {
+ margin-right: $line-height;
+ padding-top: $line-height / 2;
- .icon-calendar {
- display: none;
- }
+ .icon-calendar {
+ display: none;
}
}
}
a {
text-decoration: underline;
+ }
- &.button {
- background: white;
- color: $brand;
- margin-bottom: rem-calc(3);
- text-decoration: none;
- }
+ .button {
+ background: #fff;
+ color: $brand;
+ margin-bottom: rem-calc(3);
+ text-decoration: none;
}
.social-share-button a {
- color: white;
+ color: #fff;
&.social-share-button-twitter:hover {
- color: #40A2D1;
+ color: #40a2d1;
}
&.social-share-button-facebook:hover {
- color: #354F88;
+ color: #354f88;
}
- &.social-share-button-google_plus:hover {
- color: #CE3E26;
+ &[class^="social-share-button-google"] {
+ color: #ce3e26;
}
&.social-share-button-telegram:hover {
- color: #CE3E26;
+ color: #ce3e26;
}
}
}
@@ -969,7 +1004,6 @@
.progress-meter {
background: #fdcb10;
border-radius: 0;
- -webkit-transition: width 2s;
transition: width 2s;
}
@@ -979,7 +1013,7 @@
}
.spent-amount-text {
- color: white;
+ color: #fff;
font-size: $base-font-size;
font-weight: normal;
position: absolute;
@@ -988,9 +1022,9 @@
top: 16px;
width: 100%;
- &:before {
+ &::before {
color: #a5a1ff;
- content: "\57";
+ content: '\57';
font-family: 'icons';
font-size: $small-font-size;
position: absolute;
@@ -1000,7 +1034,7 @@
}
.total-amount {
- color: white;
+ color: #fff;
font-size: rem-calc(18);
font-weight: bold;
float: right;
@@ -1030,7 +1064,8 @@
.ballot {
- h2, h3 {
+ h2,
+ h3 {
font-weight: normal;
span {
@@ -1040,21 +1075,21 @@
}
.ballot-content {
- border: 2px solid #F9F9F9;
+ border: 2px solid #f9f9f9;
border-radius: rem-calc(6);
- padding: $line-height/2;
+ padding: $line-height / 2;
}
.subtitle {
border-left: 2px solid $budget;
- margin: $line-height/2 0;
- padding-left: $line-height/2;
+ margin: $line-height / 2 0;
+ padding-left: $line-height / 2;
}
.amount-spent {
background: $success-bg;
font-weight: normal;
- padding: $line-height/2;
+ padding: $line-height / 2;
span {
font-size: rem-calc(24);
@@ -1063,15 +1098,15 @@
}
}
-ul.ballot-list {
+.ballot-list {
list-style: none;
margin-left: 0;
li {
background: #f9f9f9;
line-height: $line-height;
- margin-bottom: $line-height/4;
- padding: $line-height $line-height/2;
+ margin-bottom: $line-height / 4;
+ padding: $line-height $line-height / 2;
position: relative;
a {
@@ -1090,7 +1125,7 @@ ul.ballot-list {
.icon-x {
color: #9f9f9f;
font-size: rem-calc(24);
- line-height: $line-height/2;
+ line-height: $line-height / 2;
position: absolute;
right: 6px;
text-decoration: none;
@@ -1104,16 +1139,17 @@ ul.ballot-list {
&:hover {
background: $budget;
- color: white;
+ color: #fff;
- a, span {
- color: white;
+ a,
+ span {
+ color: #fff;
outline: 0;
text-decoration: none;
}
.remove-investment-project .icon-x {
- color: white;
+ color: #fff;
}
}
}
@@ -1121,8 +1157,8 @@ ul.ballot-list {
.select-district a {
display: inline-block;
- margin: $line-height/4 0;
- padding: $line-height/4;
+ margin: $line-height / 4 0;
+ padding: $line-height / 4;
}
.select-district .active a {
@@ -1131,9 +1167,9 @@ ul.ballot-list {
color: $budget;
font-weight: bold;
- &:after {
- content: "\56";
- font-family: "icons";
+ &::after {
+ content: '\56';
+ font-family: 'icons';
font-size: $small-font-size;
font-weight: normal;
line-height: $line-height;
@@ -1153,13 +1189,9 @@ ul.ballot-list {
@include breakpoint(medium) {
background-color: $budget;
- -webkit-transition: height 0.3s;
- -moz-transition: height 0.3s;
transition: height 0.3s;
h1 {
- -webkit-transition: font-size 0.3s;
- -moz-transition: font-size 0.3s;
transition: font-size 0.3s;
}
@@ -1177,8 +1209,6 @@ ul.ballot-list {
h1 {
font-size: rem-calc(24);
- -webkit-transition: font-size 0.3s;
- -moz-transition: font-size 0.3s;
transition: font-size 0.3s;
}
}
@@ -1189,8 +1219,8 @@ ul.ballot-list {
// -------------------------
.dark-heading {
- background: #2D3E50;
- color: white;
+ background: #2d3e50;
+ color: #fff;
@include breakpoint(medium) {
padding-bottom: $line-height;
@@ -1199,7 +1229,7 @@ ul.ballot-list {
p {
&.title {
- color: #FFD200;
+ color: #ffd200;
}
&.title-date {
@@ -1213,40 +1243,42 @@ ul.ballot-list {
padding-top: $line-height;
@include breakpoint(medium) {
- border-top: rem-calc(6) solid #FFD200;
+ border-top: rem-calc(6) solid #ffd200;
}
}
}
-.featured-proposals-ballot-banner, .sucessfull-proposals-banner {
- background: #2D3E50 image-url("ballot_tiny.gif") no-repeat;
+.featured-proposals-ballot-banner,
+.sucessfull-proposals-banner {
+ background: #2d3e50 image-url('ballot_tiny.gif') no-repeat;
background-position: 75% 0;
position: relative;
- h2, a:hover h2 {
- color: #FFD200 !important;
- }
-
- p {
- color: white;
- }
-
@include breakpoint(medium) {
margin-left: 0 !important;
margin-right: 0 !important;
}
@include breakpoint(large) {
- background: #2D3E50 image-url("ballot.gif") no-repeat;
+ background: #2d3e50 image-url('ballot.gif') no-repeat;
background-position: 90% 0;
}
+
+ h2,
+ a:hover h2 {
+ color: #ffd200 !important;
+ }
+
+ p {
+ color: #fff;
+ }
}
.sucessfull-proposals-banner,
.successful .panel {
.icon-successful {
- border-right: 60px solid #FFD200;
+ border-right: 60px solid #ffd200;
border-top: 0;
border-bottom: 60px solid transparent;
height: 0;
@@ -1255,9 +1287,9 @@ ul.ballot-list {
top: 0;
width: 0;
- &:after {
- color: #1B254C;
- content: "\59";
+ &::after {
+ color: #1b254c;
+ content: '\59';
font-family: "icons" !important;
left: 34px;
position: absolute;
@@ -1292,15 +1324,15 @@ ul.ballot-list {
// ----------------------
.dark-heading {
- background: #2D3E50;
- color: white;
+ background: #2d3e50;
+ color: #fff;
.title {
- color: #92BA48;
+ color: #92ba48;
}
.button {
- background: white;
+ background: #fff;
color: $brand;
}
@@ -1324,28 +1356,30 @@ ul.ballot-list {
padding: $line-height;
@include breakpoint(medium) {
- border-top: rem-calc(6) solid #92BA48;
+ border-top: rem-calc(6) solid #92ba48;
}
}
a:not(.button) {
- color: white;
+ color: #fff;
text-decoration: underline;
}
- .back, .icon-angle-left {
- color: white;
+ .back,
+ .icon-angle-left {
+ color: #fff;
}
&.polls-show-header {
- min-height: $line-height*8;
+ min-height: $line-height * 8;
}
}
-.poll, .poll-question {
- background: white;
+.poll,
+.poll-question {
+ background: #fff;
border-radius: rem-calc(6);
- margin-bottom: $line-height/2;
+ margin-bottom: $line-height / 2;
}
.poll {
@@ -1361,11 +1395,11 @@ ul.ballot-list {
top: 0;
width: 0;
- &.can-answer:after,
- &.cant-answer:after,
- &.not-logged-in:after,
- &.already-answer:after,
- &.unverified:after {
+ &.can-answer::after,
+ &.cant-answer::after,
+ &.not-logged-in::after,
+ &.already-answer::after,
+ &.unverified::after {
font-family: "icons" !important;
left: 34px;
position: absolute;
@@ -1375,45 +1409,45 @@ ul.ballot-list {
&.can-answer {
border-right: 60px solid $info-bg;
- &:after {
+ &::after {
color: $color-info;
- content: "\6c";
+ content: '\6c';
}
}
&.cant-answer {
border-right: 60px solid $alert-bg;
- &:after {
+ &::after {
color: $color-alert;
- content: "\74";
+ content: '\74';
}
}
&.not-logged-in {
border-right: 60px solid $info-bg;
- &:after {
+ &::after {
color: $color-info;
- content: "\6f";
+ content: '\6f';
}
}
&.unverified {
border-right: 60px solid $warning-bg;
- &:after {
+ &::after {
color: $color-warning;
- content: "\6f";
+ content: '\6f';
}
}
&.already-answer {
border-right: 60px solid $success-bg;
- &:after {
+ &::after {
color: $color-success;
- content: "\59";
+ content: '\59';
}
}
}
@@ -1421,12 +1455,12 @@ ul.ballot-list {
.dates {
color: $text-medium;
font-size: $small-font-size;
- margin-bottom: $line-height/2;
+ margin-bottom: $line-height / 2;
}
h4 {
font-size: rem-calc(30);
- line-height: $line-height*1.5;
+ line-height: $line-height * 1.5;
a {
color: $text;
@@ -1434,11 +1468,11 @@ ul.ballot-list {
}
}
-h2.questions-callout {
+.questions-callout {
font-size: $base-font-size;
}
-h3.section-title-divider {
+.section-title-divider {
border-bottom: 2px solid $brand;
color: $brand;
margin-bottom: $line-height;
@@ -1459,23 +1493,23 @@ h3.section-title-divider {
.poll-question-answers {
.button {
- margin-right: $line-height/4;
+ margin-right: $line-height / 4;
min-width: rem-calc(168);
&.answered {
- background: #F4F8EC;
- border: 2px solid #92BA48;
+ background: #f4f8ec;
+ border: 2px solid #92ba48;
color: $text;
position: relative;
- &:after {
- background: #92BA48;
+ &::after {
+ background: #92ba48;
border-radius: rem-calc(20);
- content: "\6c";
- color: white;
+ content: '\6c';
+ color: #fff;
font-family: "icons" !important;
font-size: rem-calc(12);
- padding: $line-height/4;
+ padding: $line-height / 4;
position: absolute;
right: -6px;
top: -6px;
diff --git a/app/views/admin/legislation/draft_versions/_form.html.erb b/app/views/admin/legislation/draft_versions/_form.html.erb
index af96412a8..5dfd86e33 100644
--- a/app/views/admin/legislation/draft_versions/_form.html.erb
+++ b/app/views/admin/legislation/draft_versions/_form.html.erb
@@ -79,7 +79,7 @@
<%= f.text_area :body, label: false, placeholder: t('admin.legislation.draft_versions.form.body_placeholder') %>
-
diff --git a/app/views/admin/site_customization/content_blocks/index.html.erb b/app/views/admin/site_customization/content_blocks/index.html.erb
index e9fc664d1..455ac634f 100644
--- a/app/views/admin/site_customization/content_blocks/index.html.erb
+++ b/app/views/admin/site_customization/content_blocks/index.html.erb
@@ -6,7 +6,7 @@
<%= t("admin.site_customization.content_blocks.index.title") %>
-
+
| <%= t("admin.site_customization.content_blocks.content_block.name") %> |
diff --git a/app/views/admin/site_customization/pages/index.html.erb b/app/views/admin/site_customization/pages/index.html.erb
index 7be817acb..18ba5a9b7 100644
--- a/app/views/admin/site_customization/pages/index.html.erb
+++ b/app/views/admin/site_customization/pages/index.html.erb
@@ -8,7 +8,7 @@
<% if @pages.any? %>
<%= page_entries_info @pages %>
-
+
| <%= t("admin.site_customization.pages.page.title") %> |
diff --git a/app/views/layouts/_admin_header.html.erb b/app/views/layouts/_admin_header.html.erb
index 8597b41de..8207ca2f1 100644
--- a/app/views/layouts/_admin_header.html.erb
+++ b/app/views/layouts/_admin_header.html.erb
@@ -1,4 +1,4 @@
-
<%= t('legislation.processes.header_full.description') %>
diff --git a/app/views/legislation/processes/_header_full.html.erb b/app/views/legislation/processes/_header_full.html.erb index 67ca474a9..a50278c39 100644 --- a/app/views/legislation/processes/_header_full.html.erb +++ b/app/views/legislation/processes/_header_full.html.erb @@ -16,7 +16,7 @@ <% end %>Editar páginas
-Licencias urbanísticas, declaraciones responsables y comunicaciones previas
@@ -35,8 +35,8 @@ Borrar - -