Merge pull request #4404 from consul/budget_styles
Change budgets section styles
This commit is contained in:
Javi Martín
@@ -98,6 +98,7 @@ linters:
|
||||
|
||||
PlaceholderInExtend:
|
||||
enabled: true
|
||||
exclude: "app/assets/stylesheets/mixins/icons.scss"
|
||||
|
||||
PrivateNamingConvention:
|
||||
enabled: true
|
||||
|
||||
@@ -17,7 +17,8 @@ $line-height: rem-calc(24);
|
||||
$tiny-font-size: rem-calc(12);
|
||||
|
||||
$brand: #004a83;
|
||||
$dark: darken($brand, 10%);
|
||||
$brand-secondary: darken($brand, 10%);
|
||||
$dark: $brand-secondary;
|
||||
|
||||
$text: #222;
|
||||
$text-medium: #515151;
|
||||
|
||||
@@ -204,8 +204,8 @@ $table-header: #ecf1f6;
|
||||
line-height: $line-height * 2;
|
||||
|
||||
.button {
|
||||
@include brand-text;
|
||||
background: #fff;
|
||||
color: $brand;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -677,7 +677,7 @@ code {
|
||||
display: block;
|
||||
|
||||
&.is-active {
|
||||
color: $brand;
|
||||
@include brand-text;
|
||||
font-weight: bold;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
@import "font-awesome-sprockets";
|
||||
@import "font-awesome";
|
||||
@import "icons";
|
||||
@import "mixins";
|
||||
@import "mixins/*";
|
||||
@import "admin";
|
||||
@import "advanced_search";
|
||||
@import "layout";
|
||||
@@ -33,7 +33,7 @@
|
||||
@import "sticky_overrides";
|
||||
@import "tags";
|
||||
@import "admin/**/*";
|
||||
@import "budgets/*";
|
||||
@import "budgets/**/*";
|
||||
@import "sdg/**/*";
|
||||
@import "sdg_management/*";
|
||||
@import "sdg_management/**/*";
|
||||
|
||||
52
app/assets/stylesheets/budgets/ballot/investment.scss
Normal file
52
app/assets/stylesheets/budgets/ballot/investment.scss
Normal file
@@ -0,0 +1,52 @@
|
||||
.ballot-list li {
|
||||
$side-padding: $line-height / 2;
|
||||
$close-icon-size: rem-calc(20);
|
||||
$close-icon-margin: rem-calc(6);
|
||||
|
||||
background: #f1f1f1;
|
||||
border-radius: rem-calc(12);
|
||||
line-height: $line-height;
|
||||
margin-bottom: $line-height / 4;
|
||||
padding: $line-height $side-padding;
|
||||
position: relative;
|
||||
|
||||
a {
|
||||
color: $text;
|
||||
}
|
||||
|
||||
.ballot-list-title {
|
||||
display: block;
|
||||
padding-right: calc(#{$close-icon-size} + #{$close-icon-margin} - #{$side-padding});
|
||||
}
|
||||
|
||||
.ballot-list-price {
|
||||
@include brand-text;
|
||||
display: block;
|
||||
font-weight: bold;
|
||||
margin-top: $line-height / 2;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.remove-budget-investment {
|
||||
@include has-fa-icon(times, solid);
|
||||
font-size: $close-icon-size;
|
||||
position: absolute;
|
||||
right: $close-icon-margin;
|
||||
top: $close-icon-margin;
|
||||
|
||||
&::before {
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&:hover {
|
||||
@include brand-background;
|
||||
|
||||
a,
|
||||
span {
|
||||
color: #fff;
|
||||
outline: 0;
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -9,6 +9,7 @@
|
||||
}
|
||||
|
||||
.heading {
|
||||
@include brand-text;
|
||||
border: 2px solid $border;
|
||||
border-radius: rem-calc(6);
|
||||
box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
|
||||
@@ -53,7 +54,7 @@
|
||||
}
|
||||
|
||||
&:hover::before {
|
||||
background: $highlight;
|
||||
background: $light;
|
||||
z-index: -1;
|
||||
}
|
||||
}
|
||||
|
||||
10
app/assets/stylesheets/budgets/investments/ballot.scss
Normal file
10
app/assets/stylesheets/budgets/investments/ballot.scss
Normal file
@@ -0,0 +1,10 @@
|
||||
.ballot {
|
||||
|
||||
.button-remove-support {
|
||||
@include has-fa-icon(times, solid);
|
||||
background: #e7eaec;
|
||||
color: $brand-secondary;
|
||||
font-weight: bold;
|
||||
margin-top: $line-height;
|
||||
}
|
||||
}
|
||||
17
app/assets/stylesheets/budgets/investments/sidebar.scss
Normal file
17
app/assets/stylesheets/budgets/investments/sidebar.scss
Normal file
@@ -0,0 +1,17 @@
|
||||
.my-ballot {
|
||||
border-top: 1px solid $border;
|
||||
|
||||
h2 + * {
|
||||
@include has-fa-icon(vote-yea, solid);
|
||||
|
||||
&::before {
|
||||
float: left;
|
||||
font-size: rem-calc(50);
|
||||
margin-right: rem-calc(10);
|
||||
}
|
||||
|
||||
+ * {
|
||||
clear: both;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -102,7 +102,7 @@
|
||||
}
|
||||
|
||||
&.current-phase-tab a {
|
||||
background: $brand;
|
||||
background: $brand-secondary;
|
||||
color: $white;
|
||||
padding-top: $line-height / 2;
|
||||
|
||||
@@ -141,9 +141,8 @@
|
||||
.budget-next-phase,
|
||||
.budget-prev-phase-disabled,
|
||||
.budget-next-phase-disabled {
|
||||
background: $brand;
|
||||
@extend %brand-background;
|
||||
border-radius: rem-calc(3);
|
||||
color: $white;
|
||||
display: flex;
|
||||
font-size: rem-calc(36);
|
||||
height: 1em * 4 / 3;
|
||||
|
||||
@@ -320,7 +320,7 @@
|
||||
}
|
||||
|
||||
.is-active {
|
||||
color: $brand;
|
||||
@include brand-text;
|
||||
position: relative;
|
||||
|
||||
&::before {
|
||||
@@ -335,7 +335,7 @@
|
||||
}
|
||||
|
||||
a {
|
||||
color: $brand;
|
||||
@include brand-text;
|
||||
|
||||
~ a {
|
||||
color: $text;
|
||||
@@ -343,7 +343,7 @@
|
||||
}
|
||||
|
||||
[class^="icon-"] {
|
||||
color: $brand;
|
||||
@include brand-text;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -358,7 +358,7 @@
|
||||
border-bottom: 2px solid $brand;
|
||||
|
||||
.has-tip {
|
||||
color: $brand;
|
||||
@include brand-text;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -2,8 +2,7 @@
|
||||
//
|
||||
|
||||
.ui-datepicker-header {
|
||||
background: $brand;
|
||||
color: #fff;
|
||||
@extend %brand-background;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
@@ -16,8 +15,7 @@
|
||||
|
||||
.ui-state-hover,
|
||||
.ui-state-active {
|
||||
background: $brand;
|
||||
color: #fff;
|
||||
@extend %brand-background;
|
||||
}
|
||||
|
||||
thead {
|
||||
|
||||
@@ -29,9 +29,8 @@
|
||||
// 01. Global styles
|
||||
// -----------------
|
||||
|
||||
::selection {
|
||||
color: #fff;
|
||||
background-color: $brand;
|
||||
* {
|
||||
@include normal-selection;
|
||||
}
|
||||
|
||||
html,
|
||||
@@ -83,6 +82,7 @@ a {
|
||||
|
||||
.button {
|
||||
@extend %button;
|
||||
@include inverted-selection;
|
||||
background: $brand;
|
||||
|
||||
&.warning,
|
||||
@@ -96,6 +96,7 @@ a {
|
||||
}
|
||||
|
||||
.button.hollow {
|
||||
@include normal-selection;
|
||||
border: 1px solid $link;
|
||||
color: $link;
|
||||
}
|
||||
@@ -248,12 +249,12 @@ a {
|
||||
}
|
||||
|
||||
&.is-active {
|
||||
@include brand-text;
|
||||
border-bottom: 2px solid $brand;
|
||||
color: $brand;
|
||||
padding-bottom: rem-calc(1);
|
||||
|
||||
h2 a {
|
||||
color: $brand;
|
||||
@include brand-text;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -279,8 +280,8 @@ a {
|
||||
padding: 0;
|
||||
|
||||
&.is-active {
|
||||
@include brand-text;
|
||||
font-weight: bold;
|
||||
color: $brand;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -289,8 +290,8 @@ a {
|
||||
}
|
||||
|
||||
&.is-active {
|
||||
@include brand-text;
|
||||
border-bottom: 2px solid $brand;
|
||||
color: $brand;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -352,15 +353,15 @@ a {
|
||||
position: relative;
|
||||
|
||||
&:hover {
|
||||
@include brand-text;
|
||||
background: none;
|
||||
color: $brand;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
&[aria-selected="true"],
|
||||
&.is-active {
|
||||
@include brand-text;
|
||||
border-bottom: 0;
|
||||
color: $brand;
|
||||
font-weight: bold;
|
||||
|
||||
&::after {
|
||||
@@ -386,7 +387,7 @@ a {
|
||||
}
|
||||
|
||||
.pagination .current {
|
||||
background: $brand;
|
||||
@extend %brand-background;
|
||||
}
|
||||
|
||||
.pagination li {
|
||||
@@ -489,7 +490,7 @@ a {
|
||||
|
||||
body > header,
|
||||
.wrapper > header {
|
||||
background: $brand;
|
||||
@extend %brand-background;
|
||||
border-bottom: 1px solid $border;
|
||||
margin-bottom: $line-height;
|
||||
|
||||
@@ -527,11 +528,11 @@ body > header,
|
||||
padding: rem-calc(6);
|
||||
|
||||
[type="submit"] {
|
||||
@include brand-text;
|
||||
background: none;
|
||||
border: 0;
|
||||
cursor: pointer;
|
||||
font-weight: bold;
|
||||
color: $brand;
|
||||
|
||||
&:hover {
|
||||
text-decoration: underline;
|
||||
@@ -552,8 +553,7 @@ body > header,
|
||||
}
|
||||
|
||||
.top-bar {
|
||||
background: $brand !important;
|
||||
color: #fff;
|
||||
@extend %brand-background;
|
||||
padding-bottom: 0;
|
||||
padding-top: 0;
|
||||
|
||||
@@ -616,8 +616,8 @@ body > header,
|
||||
text-align: left;
|
||||
|
||||
@include breakpoint(medium) {
|
||||
@include brand-text;
|
||||
background: #fff;
|
||||
color: $brand;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
@@ -777,8 +777,8 @@ body > header,
|
||||
color: #fff;
|
||||
|
||||
@include breakpoint(medium) {
|
||||
@include brand-text;
|
||||
border-bottom: 2px solid $brand;
|
||||
color: $brand;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -849,8 +849,8 @@ body > header,
|
||||
}
|
||||
|
||||
.is-active {
|
||||
@include brand-text;
|
||||
border-bottom: 2px solid $brand;
|
||||
color: $brand;
|
||||
|
||||
&:hover {
|
||||
text-decoration: none;
|
||||
@@ -941,8 +941,7 @@ footer {
|
||||
|
||||
&:hover,
|
||||
&.is-active {
|
||||
background: $brand;
|
||||
color: #fff;
|
||||
@extend %brand-background;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1640,7 +1639,7 @@ table {
|
||||
text-decoration: none;
|
||||
|
||||
&:hover {
|
||||
color: $brand;
|
||||
@include brand-text;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -2541,8 +2540,27 @@ table {
|
||||
// 22. Images
|
||||
// -----------------
|
||||
|
||||
.images .button {
|
||||
margin-top: $line-height / 2;
|
||||
.button {
|
||||
|
||||
&.upload-image {
|
||||
@include has-fa-icon(image, solid);
|
||||
}
|
||||
|
||||
&.upload-document {
|
||||
@include has-fa-icon(file, solid);
|
||||
}
|
||||
|
||||
&.upload-image,
|
||||
&.upload-document {
|
||||
font-weight: bold;
|
||||
margin-bottom: $line-height * 1.5;
|
||||
|
||||
&::before {
|
||||
$button-padding-left: nth($button-padding, 2);
|
||||
margin-left: -$button-padding-left / 2;
|
||||
margin-right: $button-padding-left / 2;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 23. Maps
|
||||
|
||||
@@ -1,29 +1,10 @@
|
||||
// Table of Contents
|
||||
//
|
||||
// 01. Hero
|
||||
// 02. Sidebar menu
|
||||
// 03. Legislation cards
|
||||
// 01. Sidebar menu
|
||||
// 02. Legislation cards
|
||||
//
|
||||
|
||||
// 01. Hero
|
||||
// -----------------
|
||||
.brand-heading {
|
||||
background: $brand;
|
||||
margin-bottom: 5rem;
|
||||
|
||||
.column {
|
||||
padding-top: 10rem;
|
||||
padding-bottom: 10rem;
|
||||
|
||||
h4 {
|
||||
font-weight: 400;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 02. Sidebar menu
|
||||
// 01. Sidebar menu
|
||||
// -----------------
|
||||
.legislation-categories {
|
||||
|
||||
@@ -55,7 +36,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
// 03. Legislation cards
|
||||
// 02. Legislation cards
|
||||
// -----------------
|
||||
.legislation {
|
||||
margin: 0 0 $line-height;
|
||||
|
||||
@@ -144,8 +144,8 @@
|
||||
margin-bottom: rem-calc(40);
|
||||
|
||||
.debate-type {
|
||||
@include brand-text;
|
||||
text-transform: uppercase;
|
||||
color: $brand;
|
||||
font-weight: 700;
|
||||
font-size: $small-font-size;
|
||||
|
||||
@@ -155,7 +155,7 @@
|
||||
}
|
||||
|
||||
.debate-title a {
|
||||
color: $brand;
|
||||
@include brand-text;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -208,7 +208,7 @@
|
||||
}
|
||||
|
||||
h4 a {
|
||||
color: $brand;
|
||||
@include brand-text;
|
||||
|
||||
&:hover {
|
||||
text-decoration: none;
|
||||
@@ -225,8 +225,8 @@
|
||||
}
|
||||
|
||||
.quiz-next {
|
||||
@include brand-text;
|
||||
background: #ccdbe5;
|
||||
color: $brand;
|
||||
font-size: $small-font-size;
|
||||
font-weight: bold;
|
||||
text-align: right;
|
||||
@@ -239,8 +239,7 @@
|
||||
|
||||
&:hover,
|
||||
&:active {
|
||||
background: $brand;
|
||||
color: #fff;
|
||||
@extend %brand-background;
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,322 +0,0 @@
|
||||
// Table of Contents
|
||||
//
|
||||
// 01. Logo
|
||||
// 02. Orbit bullets
|
||||
// 03. Direct uploads
|
||||
// 04. Admin layout
|
||||
// ------------------
|
||||
|
||||
// 01. Logo
|
||||
// --------
|
||||
|
||||
@mixin logo {
|
||||
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;
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
// 02. Orbit bullets
|
||||
// -----------------
|
||||
|
||||
@mixin orbit-bullets {
|
||||
@include disable-mouse-outline;
|
||||
position: relative;
|
||||
margin-top: $orbit-bullet-margin-top;
|
||||
margin-bottom: $orbit-bullet-margin-bottom;
|
||||
text-align: center;
|
||||
|
||||
button {
|
||||
width: $orbit-bullet-diameter;
|
||||
height: $orbit-bullet-diameter;
|
||||
margin: $orbit-bullet-margin;
|
||||
|
||||
border-radius: 50%;
|
||||
background-color: $orbit-bullet-background;
|
||||
|
||||
&:hover {
|
||||
background-color: $orbit-bullet-background-active;
|
||||
}
|
||||
|
||||
&.is-active {
|
||||
background-color: $orbit-bullet-background-active;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 03. Direct uploads
|
||||
// ------------------
|
||||
|
||||
@mixin direct-uploads {
|
||||
|
||||
.cached-image {
|
||||
max-width: rem-calc(150);
|
||||
max-height: rem-calc(150);
|
||||
}
|
||||
|
||||
.progress-bar-placeholder {
|
||||
display: none;
|
||||
margin-bottom: $line-height;
|
||||
}
|
||||
|
||||
.document,
|
||||
.image {
|
||||
|
||||
.document-attachment,
|
||||
.image-attachment {
|
||||
padding-left: 0;
|
||||
|
||||
p {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.attachment-errors {
|
||||
|
||||
> .js-image-attachment,
|
||||
> .js-document-attachment {
|
||||
display: none;
|
||||
|
||||
~ .error {
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.button {
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.progress-bar {
|
||||
width: 100%;
|
||||
background-color: $light-gray;
|
||||
}
|
||||
|
||||
.file-name {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.loading-bar {
|
||||
height: 5px;
|
||||
width: 0;
|
||||
transition: width 500ms ease-out;
|
||||
|
||||
&.uploading {
|
||||
background-color: $dark-gray;
|
||||
}
|
||||
|
||||
&.complete {
|
||||
background-color: $success-color;
|
||||
}
|
||||
|
||||
&.errors {
|
||||
background-color: $alert-color;
|
||||
margin-top: $line-height / 2;
|
||||
}
|
||||
}
|
||||
|
||||
.loading-bar.no-transition {
|
||||
transition: none;
|
||||
}
|
||||
}
|
||||
|
||||
// 04. Admin layout
|
||||
// ----------------
|
||||
|
||||
@mixin admin-layout {
|
||||
|
||||
> header {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
> .menu-and-content {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
|
||||
%font-icon {
|
||||
@extend %fa-icon;
|
||||
font-family: "Font Awesome 5 Free";
|
||||
margin-right: rem-calc(4);
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
%svg-icon {
|
||||
background: currentcolor;
|
||||
content: "";
|
||||
height: 1em;
|
||||
mask-repeat: no-repeat;
|
||||
mask-size: 100% 100%;
|
||||
width: 1em;
|
||||
}
|
||||
|
||||
%admin-menu-icon {
|
||||
font-size: rem-calc(20);
|
||||
margin-left: rem-calc(8);
|
||||
margin-right: rem-calc(10);
|
||||
}
|
||||
|
||||
@mixin has-fa-icon($icon, $style, $position: "before") {
|
||||
|
||||
&::#{$position} {
|
||||
@extend %font-icon;
|
||||
@extend .fa-#{$icon}:before;
|
||||
|
||||
@if $style == "solid" {
|
||||
font-weight: bold;
|
||||
} @else {
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
@if $style == "brands" {
|
||||
font-family: "Font Awesome 5 Brands";
|
||||
}
|
||||
}
|
||||
|
||||
@supports (mask-image: url()) {
|
||||
|
||||
&::#{$position} {
|
||||
@extend %svg-icon;
|
||||
mask-image: image-url("fontawesome/#{$style}/#{$icon}.svg");
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@mixin bottom-tooltip {
|
||||
@include tooltip;
|
||||
line-height: $global-lineheight;
|
||||
margin-top: $line-height / 8;
|
||||
width: max-content;
|
||||
|
||||
&::before {
|
||||
@include css-triangle($tooltip-pip-width, $tooltip-background-color, up);
|
||||
bottom: 100%;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
}
|
||||
|
||||
%button {
|
||||
font-size: $base-font-size;
|
||||
|
||||
&:focus,
|
||||
&:hover {
|
||||
text-decoration: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin regular-button($color: $brand) {
|
||||
@include button($background: $color);
|
||||
@extend %button;
|
||||
}
|
||||
|
||||
@mixin hollow-button($color: $link) {
|
||||
@include button($style: hollow, $background: $color);
|
||||
@extend %button;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
@mixin header-font-size($heading-tag) {
|
||||
@each $size, $headers in $header-styles {
|
||||
@include breakpoint($size) {
|
||||
font-size: rem-calc(map-get(map-get($headers, $heading-tag), font-size));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@mixin sdg-goal-list($spacing: 1ch) {
|
||||
$min-spacing: $sdg-icon-min-width / 10;
|
||||
$max-spacing: #{"Max(#{$min-spacing}, #{$spacing})"};
|
||||
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
list-style: none;
|
||||
margin: -$spacing 0 $line-height / 3 -#{$spacing};
|
||||
margin-left: calc(-1 * #{$max-spacing});
|
||||
margin-top: calc(-1 * #{$max-spacing});
|
||||
width: calc(100% + #{$spacing});
|
||||
width: calc(100% + #{$max-spacing});
|
||||
|
||||
> *,
|
||||
> .tabs-title {
|
||||
margin-bottom: 0;
|
||||
margin-left: $spacing;
|
||||
margin-left: $max-spacing;
|
||||
margin-right: 0;
|
||||
margin-top: $spacing;
|
||||
margin-top: $max-spacing;
|
||||
}
|
||||
|
||||
a:hover .sdg-goal-icon {
|
||||
filter: brightness(90%);
|
||||
}
|
||||
}
|
||||
|
||||
%sdg-goal-list {
|
||||
@include sdg-goal-list;
|
||||
}
|
||||
|
||||
%sdg-goal-list-expanded {
|
||||
$spacing: 0.5%;
|
||||
@include sdg-goal-list($spacing);
|
||||
|
||||
label,
|
||||
li {
|
||||
min-width: $sdg-icon-min-width;
|
||||
width: calc(100% / 17 - #{$spacing});
|
||||
|
||||
&:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.sdg-goal-icon {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
a:focus {
|
||||
outline: none;
|
||||
|
||||
img {
|
||||
outline: $outline-focus;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
%tags {
|
||||
margin-bottom: 0;
|
||||
margin-left: 0;
|
||||
|
||||
li {
|
||||
display: inline-block;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
a,
|
||||
span {
|
||||
@extend %tag;
|
||||
}
|
||||
}
|
||||
|
||||
%tag {
|
||||
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;
|
||||
text-decoration: none;
|
||||
|
||||
&:hover {
|
||||
background: #e0e0e0;
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
21
app/assets/stylesheets/mixins/buttons.scss
Normal file
21
app/assets/stylesheets/mixins/buttons.scss
Normal file
@@ -0,0 +1,21 @@
|
||||
%button {
|
||||
font-size: $base-font-size;
|
||||
|
||||
&:focus,
|
||||
&:hover {
|
||||
text-decoration: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin regular-button($color: $brand) {
|
||||
@include button($background: $color);
|
||||
@include inverted-selection;
|
||||
@extend %button;
|
||||
}
|
||||
|
||||
@mixin hollow-button($color: $link) {
|
||||
@include button($style: hollow, $background: $color);
|
||||
@include normal-selection;
|
||||
@extend %button;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
38
app/assets/stylesheets/mixins/colors.scss
Normal file
38
app/assets/stylesheets/mixins/colors.scss
Normal file
@@ -0,0 +1,38 @@
|
||||
@mixin brand-background($invert-selection: true) {
|
||||
background-color: $brand;
|
||||
color: $white;
|
||||
|
||||
@if $invert-selection {
|
||||
@include inverted-selection;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin brand-text {
|
||||
@include normal-selection;
|
||||
color: $brand;
|
||||
}
|
||||
|
||||
@mixin normal-selection {
|
||||
|
||||
&::selection,
|
||||
*::selection {
|
||||
@include brand-background($invert-selection: false);
|
||||
}
|
||||
}
|
||||
|
||||
@mixin inverted-selection {
|
||||
|
||||
&::selection,
|
||||
*::selection {
|
||||
background-color: rgba($white, 0.99);
|
||||
color: $brand;
|
||||
}
|
||||
}
|
||||
|
||||
%brand-background {
|
||||
@include brand-background;
|
||||
}
|
||||
|
||||
%brand-text {
|
||||
@include brand-text;
|
||||
}
|
||||
7
app/assets/stylesheets/mixins/headings.scss
Normal file
7
app/assets/stylesheets/mixins/headings.scss
Normal file
@@ -0,0 +1,7 @@
|
||||
@mixin header-font-size($heading-tag) {
|
||||
@each $size, $headers in $header-styles {
|
||||
@include breakpoint($size) {
|
||||
font-size: rem-calc(map-get(map-get($headers, $heading-tag), font-size));
|
||||
}
|
||||
}
|
||||
}
|
||||
47
app/assets/stylesheets/mixins/icons.scss
Normal file
47
app/assets/stylesheets/mixins/icons.scss
Normal file
@@ -0,0 +1,47 @@
|
||||
%font-icon {
|
||||
@extend %fa-icon;
|
||||
font-family: "Font Awesome 5 Free";
|
||||
margin-right: rem-calc(4);
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
%svg-icon {
|
||||
background: currentcolor;
|
||||
content: "";
|
||||
height: 1em;
|
||||
mask-repeat: no-repeat;
|
||||
mask-size: 100% 100%;
|
||||
width: 1em;
|
||||
}
|
||||
|
||||
%admin-menu-icon {
|
||||
font-size: rem-calc(20);
|
||||
margin-left: rem-calc(8);
|
||||
margin-right: rem-calc(10);
|
||||
}
|
||||
|
||||
@mixin has-fa-icon($icon, $style, $position: "before") {
|
||||
|
||||
&::#{$position} {
|
||||
@extend %font-icon;
|
||||
@extend .fa-#{$icon}:before;
|
||||
|
||||
@if $style == "solid" {
|
||||
font-weight: bold;
|
||||
} @else {
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
@if $style == "brands" {
|
||||
font-family: "Font Awesome 5 Brands";
|
||||
}
|
||||
}
|
||||
|
||||
@supports (mask-image: url()) {
|
||||
|
||||
&::#{$position} {
|
||||
@extend %svg-icon;
|
||||
mask-image: image-url("fontawesome/#{$style}/#{$icon}.svg");
|
||||
}
|
||||
}
|
||||
}
|
||||
23
app/assets/stylesheets/mixins/layouts.scss
Normal file
23
app/assets/stylesheets/mixins/layouts.scss
Normal file
@@ -0,0 +1,23 @@
|
||||
@mixin admin-layout {
|
||||
|
||||
> header {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
> .menu-and-content {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin logo {
|
||||
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;
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
24
app/assets/stylesheets/mixins/orbit_bullets.scss
Normal file
24
app/assets/stylesheets/mixins/orbit_bullets.scss
Normal file
@@ -0,0 +1,24 @@
|
||||
@mixin orbit-bullets {
|
||||
@include disable-mouse-outline;
|
||||
position: relative;
|
||||
margin-top: $orbit-bullet-margin-top;
|
||||
margin-bottom: $orbit-bullet-margin-bottom;
|
||||
text-align: center;
|
||||
|
||||
button {
|
||||
width: $orbit-bullet-diameter;
|
||||
height: $orbit-bullet-diameter;
|
||||
margin: $orbit-bullet-margin;
|
||||
|
||||
border-radius: 50%;
|
||||
background-color: $orbit-bullet-background;
|
||||
|
||||
&:hover {
|
||||
background-color: $orbit-bullet-background-active;
|
||||
}
|
||||
|
||||
&.is-active {
|
||||
background-color: $orbit-bullet-background-active;
|
||||
}
|
||||
}
|
||||
}
|
||||
58
app/assets/stylesheets/mixins/sdg.scss
Normal file
58
app/assets/stylesheets/mixins/sdg.scss
Normal file
@@ -0,0 +1,58 @@
|
||||
@mixin sdg-goal-list($spacing: 1ch) {
|
||||
$min-spacing: $sdg-icon-min-width / 10;
|
||||
$max-spacing: #{"Max(#{$min-spacing}, #{$spacing})"};
|
||||
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
list-style: none;
|
||||
margin: -$spacing 0 $line-height / 3 -#{$spacing};
|
||||
margin-left: calc(-1 * #{$max-spacing});
|
||||
margin-top: calc(-1 * #{$max-spacing});
|
||||
width: calc(100% + #{$spacing});
|
||||
width: calc(100% + #{$max-spacing});
|
||||
|
||||
> *,
|
||||
> .tabs-title {
|
||||
margin-bottom: 0;
|
||||
margin-left: $spacing;
|
||||
margin-left: $max-spacing;
|
||||
margin-right: 0;
|
||||
margin-top: $spacing;
|
||||
margin-top: $max-spacing;
|
||||
}
|
||||
|
||||
a:hover .sdg-goal-icon {
|
||||
filter: brightness(90%);
|
||||
}
|
||||
}
|
||||
|
||||
%sdg-goal-list {
|
||||
@include sdg-goal-list;
|
||||
}
|
||||
|
||||
%sdg-goal-list-expanded {
|
||||
$spacing: 0.5%;
|
||||
@include sdg-goal-list($spacing);
|
||||
|
||||
label,
|
||||
li {
|
||||
min-width: $sdg-icon-min-width;
|
||||
width: calc(100% / 17 - #{$spacing});
|
||||
|
||||
&:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.sdg-goal-icon {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
a:focus {
|
||||
outline: none;
|
||||
|
||||
img {
|
||||
outline: $outline-focus;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
31
app/assets/stylesheets/mixins/tags.scss
Normal file
31
app/assets/stylesheets/mixins/tags.scss
Normal file
@@ -0,0 +1,31 @@
|
||||
%tags {
|
||||
margin-bottom: 0;
|
||||
margin-left: 0;
|
||||
|
||||
li {
|
||||
display: inline-block;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
a,
|
||||
span {
|
||||
@extend %tag;
|
||||
}
|
||||
}
|
||||
|
||||
%tag {
|
||||
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;
|
||||
text-decoration: none;
|
||||
|
||||
&:hover {
|
||||
background: #e0e0e0;
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
|
||||
13
app/assets/stylesheets/mixins/tooltips.scss
Normal file
13
app/assets/stylesheets/mixins/tooltips.scss
Normal file
@@ -0,0 +1,13 @@
|
||||
@mixin bottom-tooltip {
|
||||
@include tooltip;
|
||||
line-height: $global-lineheight;
|
||||
margin-top: $line-height / 8;
|
||||
width: max-content;
|
||||
|
||||
&::before {
|
||||
@include css-triangle($tooltip-pip-width, $tooltip-background-color, up);
|
||||
bottom: 100%;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
}
|
||||
69
app/assets/stylesheets/mixins/uploads.scss
Normal file
69
app/assets/stylesheets/mixins/uploads.scss
Normal file
@@ -0,0 +1,69 @@
|
||||
@mixin direct-uploads {
|
||||
|
||||
.cached-image {
|
||||
max-width: rem-calc(150);
|
||||
max-height: rem-calc(150);
|
||||
}
|
||||
|
||||
.progress-bar-placeholder {
|
||||
display: none;
|
||||
margin-bottom: $line-height;
|
||||
}
|
||||
|
||||
.document,
|
||||
.image {
|
||||
|
||||
.document-attachment,
|
||||
.image-attachment {
|
||||
padding-left: 0;
|
||||
|
||||
p {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.attachment-errors {
|
||||
|
||||
> .js-image-attachment,
|
||||
> .js-document-attachment {
|
||||
display: none;
|
||||
|
||||
~ .error {
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.progress-bar {
|
||||
width: 100%;
|
||||
background-color: $light-gray;
|
||||
}
|
||||
|
||||
.file-name {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.loading-bar {
|
||||
height: 5px;
|
||||
width: 0;
|
||||
transition: width 500ms ease-out;
|
||||
|
||||
&.uploading {
|
||||
background-color: $dark-gray;
|
||||
}
|
||||
|
||||
&.complete {
|
||||
background-color: $success-color;
|
||||
}
|
||||
|
||||
&.errors {
|
||||
background-color: $alert-color;
|
||||
margin-top: $line-height / 2;
|
||||
}
|
||||
}
|
||||
|
||||
.loading-bar.no-transition {
|
||||
transition: none;
|
||||
}
|
||||
}
|
||||
@@ -52,7 +52,7 @@
|
||||
.more-info-content {
|
||||
|
||||
h3 {
|
||||
color: $brand;
|
||||
@include brand-text;
|
||||
}
|
||||
|
||||
.additional-info {
|
||||
|
||||
@@ -329,7 +329,6 @@
|
||||
.debate-show,
|
||||
.proposal-show,
|
||||
.poll-question-show,
|
||||
.investment-project-show,
|
||||
.budget-investment-show,
|
||||
.polls-show,
|
||||
.debate-quiz,
|
||||
@@ -491,13 +490,11 @@
|
||||
color: $text;
|
||||
}
|
||||
|
||||
.investment-project-show p,
|
||||
.budget-investment-show p {
|
||||
word-break: break-word;
|
||||
}
|
||||
|
||||
.proposal-show,
|
||||
.investment-project-show,
|
||||
.budget-investment-show {
|
||||
|
||||
.supports {
|
||||
@@ -644,7 +641,6 @@
|
||||
|
||||
.debate,
|
||||
.proposal,
|
||||
.investment-project,
|
||||
.budget-investment,
|
||||
.legislation,
|
||||
.communities-show {
|
||||
@@ -799,8 +795,6 @@
|
||||
}
|
||||
}
|
||||
|
||||
.investment-project,
|
||||
.investment-project-show,
|
||||
.budget-investment,
|
||||
.budget-investment-show {
|
||||
|
||||
@@ -818,6 +812,8 @@
|
||||
.button-support {
|
||||
background: $budget;
|
||||
color: #fff;
|
||||
font-size: $base-font-size;
|
||||
font-weight: bold;
|
||||
|
||||
&:hover {
|
||||
background: $budget-hover;
|
||||
@@ -858,7 +854,6 @@
|
||||
}
|
||||
}
|
||||
|
||||
.investment-project-show .supports,
|
||||
.budget-investment-show .supports {
|
||||
border: 0;
|
||||
}
|
||||
@@ -870,8 +865,6 @@
|
||||
}
|
||||
}
|
||||
|
||||
.investment-project .no-button,
|
||||
.investment-project-show .no-button,
|
||||
.budget-investment .no-button,
|
||||
.budget-investment-show .no-button {
|
||||
display: block;
|
||||
@@ -991,7 +984,7 @@
|
||||
}
|
||||
|
||||
.is-active {
|
||||
color: $brand;
|
||||
@include brand-text;
|
||||
|
||||
&::after {
|
||||
content: "\6c";
|
||||
@@ -1137,7 +1130,7 @@
|
||||
// -----------
|
||||
|
||||
.budget-header {
|
||||
background: $budget;
|
||||
@extend %brand-background;
|
||||
margin-top: -$line-height;
|
||||
padding-bottom: $line-height;
|
||||
padding-top: $line-height;
|
||||
@@ -1172,24 +1165,36 @@
|
||||
}
|
||||
|
||||
.jumbo-budget {
|
||||
background: $budget;
|
||||
border-bottom: 1px solid $budget;
|
||||
background: $white;
|
||||
border-bottom: 2px solid $border;
|
||||
|
||||
&.budget-heading {
|
||||
min-height: $line-height * 10;
|
||||
|
||||
.check-ballot {
|
||||
@include has-fa-icon(chevron-right, solid, after);
|
||||
float: right;
|
||||
min-width: rem-calc(240);
|
||||
|
||||
&::after {
|
||||
margin-left: $line-height / 4;
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
h2 {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
.back,
|
||||
.icon-angle-left,
|
||||
p,
|
||||
a {
|
||||
color: #fff;
|
||||
color: $text;
|
||||
}
|
||||
|
||||
.tagline {
|
||||
@@ -1211,62 +1216,77 @@
|
||||
}
|
||||
|
||||
.button {
|
||||
background: #fff;
|
||||
color: $brand;
|
||||
@extend %brand-background;
|
||||
margin-bottom: rem-calc(3);
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
|
||||
.current-phase {
|
||||
color: $brand;
|
||||
@include brand-text;
|
||||
}
|
||||
|
||||
.progress-votes {
|
||||
position: relative;
|
||||
|
||||
.progress {
|
||||
background: #212033;
|
||||
background: #bbcdd9;
|
||||
border-radius: rem-calc(12);
|
||||
clear: both;
|
||||
margin-bottom: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.progress-meter {
|
||||
background: #fdcb10;
|
||||
border-radius: 0;
|
||||
background: $brand;
|
||||
border-radius: rem-calc(12);
|
||||
border-bottom-right-radius: 0;
|
||||
border-top-right-radius: 0;
|
||||
transition: width 2s;
|
||||
}
|
||||
|
||||
.spent-amount-text {
|
||||
.total-amount,
|
||||
.amount-available {
|
||||
font-weight: bold;
|
||||
margin-bottom: 0;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.total-amount {
|
||||
font-size: $tiny-font-size;
|
||||
|
||||
@include breakpoint(medium) {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
span {
|
||||
@include brand-text;
|
||||
font-size: $base-font-size;
|
||||
}
|
||||
}
|
||||
|
||||
.amount-available {
|
||||
display: block;
|
||||
font-size: $small-font-size;
|
||||
margin-top: $line-height / 8;
|
||||
position: relative;
|
||||
text-align: right;
|
||||
white-space: nowrap;
|
||||
|
||||
&::before {
|
||||
color: #a5a1ff;
|
||||
color: $brand;
|
||||
content: "\57";
|
||||
font-family: "icons";
|
||||
font-size: $small-font-size;
|
||||
line-height: 0;
|
||||
position: absolute;
|
||||
right: -0.5em;
|
||||
top: -$line-height / 8;
|
||||
}
|
||||
}
|
||||
|
||||
.total-amount {
|
||||
color: #fff;
|
||||
font-size: rem-calc(18);
|
||||
font-weight: bold;
|
||||
float: right;
|
||||
}
|
||||
|
||||
.amount-available {
|
||||
display: block;
|
||||
|
||||
span {
|
||||
@include brand-text;
|
||||
font-size: rem-calc(24);
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1301,7 +1321,7 @@
|
||||
}
|
||||
|
||||
.subtitle {
|
||||
border-left: 2px solid $budget;
|
||||
border-left: 2px solid $brand;
|
||||
margin: $line-height / 2 0;
|
||||
padding-left: $line-height / 2;
|
||||
}
|
||||
@@ -1321,58 +1341,6 @@
|
||||
.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;
|
||||
position: relative;
|
||||
|
||||
a {
|
||||
color: $text;
|
||||
}
|
||||
|
||||
span {
|
||||
display: block;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.remove-investment-project {
|
||||
display: block;
|
||||
height: 0;
|
||||
|
||||
.icon-x {
|
||||
color: #9f9f9f;
|
||||
font-size: rem-calc(24);
|
||||
line-height: $line-height / 2;
|
||||
position: absolute;
|
||||
right: 6px;
|
||||
text-decoration: none;
|
||||
top: 6px;
|
||||
|
||||
@include breakpoint(medium) {
|
||||
font-size: $base-font-size;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background: $budget;
|
||||
color: #fff;
|
||||
|
||||
a,
|
||||
span {
|
||||
color: #fff;
|
||||
outline: 0;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.remove-investment-project .icon-x {
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.select-district a {
|
||||
@@ -1408,15 +1376,11 @@
|
||||
z-index: 3;
|
||||
|
||||
@include breakpoint(medium) {
|
||||
background-color: $budget;
|
||||
transition: height 0.3s;
|
||||
|
||||
h2 {
|
||||
margin-bottom: $line-height / 2;
|
||||
transition: font-size 0.3s;
|
||||
}
|
||||
|
||||
&.is-fixed {
|
||||
background: $white;
|
||||
border-bottom: 2px solid $border;
|
||||
height: auto;
|
||||
left: 0;
|
||||
padding: $line-height;
|
||||
@@ -1431,6 +1395,14 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
h2 {
|
||||
transition: font-size 0.3s;
|
||||
|
||||
@include breakpoint(small only) {
|
||||
margin: $line-height 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.budgets-stats {
|
||||
|
||||
14
app/components/budgets/ballot/investment_component.html.erb
Normal file
14
app/components/budgets/ballot/investment_component.html.erb
Normal file
@@ -0,0 +1,14 @@
|
||||
<li id="<%= list_item_id %>">
|
||||
<%= investment_title %>
|
||||
<%= investment_price %>
|
||||
|
||||
<% if budget.balloting? %>
|
||||
<%= link_to delete_path,
|
||||
title: t("budgets.ballots.show.remove"),
|
||||
class: "remove-budget-investment",
|
||||
method: :delete,
|
||||
remote: true do %>
|
||||
<span class="show-for-sr"><%= t("budgets.ballots.show.remove") %></span>
|
||||
<% end %>
|
||||
<% end %>
|
||||
</li>
|
||||
29
app/components/budgets/ballot/investment_component.rb
Normal file
29
app/components/budgets/ballot/investment_component.rb
Normal file
@@ -0,0 +1,29 @@
|
||||
class Budgets::Ballot::InvestmentComponent < ApplicationComponent
|
||||
attr_reader :investment
|
||||
|
||||
def initialize(investment:)
|
||||
@investment = investment
|
||||
end
|
||||
|
||||
private
|
||||
|
||||
def budget
|
||||
investment.budget
|
||||
end
|
||||
|
||||
def list_item_id
|
||||
dom_id(investment)
|
||||
end
|
||||
|
||||
def investment_title
|
||||
link_to investment.title, budget_investment_path(budget, investment)
|
||||
end
|
||||
|
||||
def investment_price
|
||||
tag.span investment.formatted_price, class: "ballot-list-price"
|
||||
end
|
||||
|
||||
def delete_path
|
||||
budget_ballot_line_path(budget, id: investment.id)
|
||||
end
|
||||
end
|
||||
@@ -0,0 +1,23 @@
|
||||
class Budgets::Ballot::InvestmentForSidebarComponent < Budgets::Ballot::InvestmentComponent
|
||||
with_collection_parameter :investment
|
||||
attr_reader :investment_ids
|
||||
|
||||
def initialize(investment:, investment_ids:)
|
||||
super(investment: investment)
|
||||
@investment_ids = investment_ids
|
||||
end
|
||||
|
||||
private
|
||||
|
||||
def list_item_id
|
||||
"#{super}_sidebar"
|
||||
end
|
||||
|
||||
def investment_title
|
||||
tag.span investment.title, class: "ballot-list-title"
|
||||
end
|
||||
|
||||
def delete_path
|
||||
budget_ballot_line_path(id: investment.id, investments_ids: investment_ids)
|
||||
end
|
||||
end
|
||||
@@ -63,10 +63,11 @@ class Budget
|
||||
def voting_style
|
||||
@voting_style ||= voting_style_class.new(self)
|
||||
end
|
||||
delegate :amount_available, :amount_available_info, :amount_spent, :amount_spent_info, :amount_limit,
|
||||
:amount_limit_info, :change_vote_info, :enough_resources?, :formatted_amount_available,
|
||||
:formatted_amount_limit, :formatted_amount_spent, :not_enough_resources_error,
|
||||
:percentage_spent, :reason_for_not_being_ballotable, :voted_info,
|
||||
delegate :amount_available, :amount_available_info, :amount_progress, :amount_spent,
|
||||
:amount_spent_info, :amount_limit, :amount_limit_info, :change_vote_info,
|
||||
:enough_resources?, :formatted_amount_available, :formatted_amount_limit,
|
||||
:formatted_amount_spent, :not_enough_resources_error, :percentage_spent,
|
||||
:reason_for_not_being_ballotable, :voted_info,
|
||||
to: :voting_style
|
||||
|
||||
private
|
||||
|
||||
@@ -10,13 +10,25 @@ class Budget::VotingStyles::Base
|
||||
end
|
||||
|
||||
def change_vote_info(link:)
|
||||
I18n.t("budgets.investments.index.sidebar.change_vote_info.#{name}", link: link)
|
||||
I18n.t(
|
||||
"budgets.investments.index.sidebar.change_vote_info.#{name}",
|
||||
link: link,
|
||||
phase_end_date: I18n.l(budget.current_phase.ends_at.to_date, format: :long)
|
||||
)
|
||||
end
|
||||
|
||||
def amount_progress(heading)
|
||||
I18n.t(
|
||||
"budgets.ballots.show.amount_progress",
|
||||
amount_spent: amount_spent_info(heading),
|
||||
amount_limit: amount_limit_info(heading)
|
||||
)
|
||||
end
|
||||
|
||||
def voted_info(heading)
|
||||
I18n.t("budgets.investments.index.sidebar.voted_info.#{name}",
|
||||
count: investments(heading).count,
|
||||
amount_spent: ballot.budget.formatted_amount(investments_price(heading)))
|
||||
amount_spent: budget.formatted_amount(investments_price(heading)))
|
||||
end
|
||||
|
||||
def amount_available_info(heading)
|
||||
@@ -56,6 +68,10 @@ class Budget::VotingStyles::Base
|
||||
|
||||
private
|
||||
|
||||
def budget
|
||||
ballot.budget
|
||||
end
|
||||
|
||||
def investments(heading)
|
||||
ballot.investments.by_heading(heading.id)
|
||||
end
|
||||
|
||||
@@ -40,8 +40,9 @@
|
||||
<% end %>
|
||||
|
||||
<ul class="ballot-list">
|
||||
<%= render partial: "budgets/ballot/investment",
|
||||
collection: @ballot.investments.by_group(group.id) %>
|
||||
<%= render Budgets::Ballot::InvestmentComponent.with_collection(
|
||||
@ballot.investments.by_group(group.id)
|
||||
) %>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,14 +0,0 @@
|
||||
<li id="<%= dom_id(investment) %>">
|
||||
<%= link_to investment.title, budget_investment_path(@budget, investment) %>
|
||||
<span><%= investment.formatted_price %></span>
|
||||
|
||||
<% if @budget.balloting? %>
|
||||
<%= link_to budget_ballot_line_path(@budget, id: investment.id),
|
||||
title: t("budgets.ballots.show.remove"),
|
||||
class: "remove-investment-project",
|
||||
method: :delete,
|
||||
remote: true do %>
|
||||
<span class="icon-x"></span>
|
||||
<% end %>
|
||||
<% end %>
|
||||
</li>
|
||||
@@ -1,16 +0,0 @@
|
||||
<li id="<%= dom_id(investment) %>_sidebar">
|
||||
<%= investment.title %>
|
||||
<span><%= investment.formatted_price %></span>
|
||||
|
||||
<% if @budget.balloting? %>
|
||||
<%= link_to budget_ballot_line_path(id: investment.id,
|
||||
investments_ids: investment_ids),
|
||||
title: t("budgets.ballots.show.remove"),
|
||||
class: "remove-investment-project",
|
||||
method: :delete,
|
||||
remote: true do %>
|
||||
<span class="show-for-sr"><%= t("budgets.ballots.show.remove") %></span>
|
||||
<span class="icon-x"></span>
|
||||
<% end %>
|
||||
<% end %>
|
||||
</li>
|
||||
@@ -1,6 +1,6 @@
|
||||
<span class="total-amount">
|
||||
<%= sanitize(ballot.amount_limit_info(heading)) %>
|
||||
</span>
|
||||
<p id="total_amount" class="total-amount">
|
||||
<%= sanitize(ballot.amount_progress(heading)) %>
|
||||
</p>
|
||||
|
||||
<div class="progress" role="progressbar" tabindex="0"
|
||||
aria-valuenow="<%= ballot.percentage_spent(heading) %>" aria-valuemin="0" aria-valuemax="100">
|
||||
@@ -9,6 +9,6 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p id="amount-spent" class="spent-amount-text" style="width: <%= ballot.percentage_spent(heading) %>%">
|
||||
<%= render "budgets/ballot/progress_bar/#{ballot.budget.voting_style}", ballot: ballot, heading: heading %>
|
||||
<p id="amount_available" class="amount-available" style="width: <%= ballot.percentage_spent(heading) %>%">
|
||||
<%= sanitize(ballot.amount_available_info(heading)) %>
|
||||
</p>
|
||||
|
||||
@@ -1,3 +0,0 @@
|
||||
<%= sanitize(t("budgets.progress_bar.votes",
|
||||
count: ballot.amount_spent(heading),
|
||||
limit: ballot.amount_limit(heading))) %>
|
||||
@@ -1,5 +0,0 @@
|
||||
<small><%= t("budgets.progress_bar.assigned") %></small><%= ballot.formatted_amount_spent(heading) %>
|
||||
<span id="amount-available" class="amount-available">
|
||||
<small><%= t("budgets.progress_bar.available") %></small>
|
||||
<span><%= ballot.formatted_amount_available(heading) %></span>
|
||||
</span>
|
||||
@@ -2,7 +2,7 @@
|
||||
<div class="js-participation supports ballot">
|
||||
<% if ballot.has_investment?(investment) %>
|
||||
|
||||
<div class="remove supported inline-block">
|
||||
<div class="remove supported">
|
||||
<span class="icon-check-circle"
|
||||
title="<%= t("budgets.investments.investment.already_added") %>">
|
||||
</span>
|
||||
@@ -14,7 +14,7 @@
|
||||
budget_ballot_line_path(id: investment.id,
|
||||
budget_id: investment.budget_id,
|
||||
investments_ids: investment_ids),
|
||||
class: "delete small expanded",
|
||||
class: "button button-remove-support expanded",
|
||||
method: :delete,
|
||||
remote: true %>
|
||||
<% end %>
|
||||
@@ -31,7 +31,7 @@
|
||||
budget_ballot_lines_path(investment_id: investment.id,
|
||||
budget_id: investment.budget_id,
|
||||
investments_ids: investment_ids),
|
||||
class: "button button-support small expanded",
|
||||
class: "button button-support expanded",
|
||||
title: t("budgets.investments.investment.support_title"),
|
||||
method: :post,
|
||||
remote: true %>
|
||||
|
||||
@@ -9,7 +9,7 @@
|
||||
<% if can? :show, @ballot %>
|
||||
<%= link_to t("budgets.investments.header.check_ballot"),
|
||||
budget_ballot_path(@budget),
|
||||
class: "button float-right" %>
|
||||
class: "check-ballot button" %>
|
||||
<% end %>
|
||||
</div>
|
||||
</div>
|
||||
@@ -26,7 +26,7 @@
|
||||
<h2>
|
||||
<%= t("budgets.investments.index.by_heading", heading: @heading.name) %>
|
||||
</h2>
|
||||
<div id="progress_bar" class="no-margin-top">
|
||||
<div id="progress_bar">
|
||||
<%= render "budgets/ballot/progress_bar", ballot: @ballot, heading: @heading %>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -13,11 +13,50 @@
|
||||
<% end %>
|
||||
|
||||
<% if @heading && can?(:show, @ballot) %>
|
||||
<p class="callout">
|
||||
<%= sanitize(@ballot.change_vote_info(
|
||||
link: link_to(t("budgets.investments.index.sidebar.change_vote_link"),
|
||||
budget_ballot_path(@budget)))) %>
|
||||
</p>
|
||||
<div class="my-ballot">
|
||||
<h2 class="sidebar-title">
|
||||
<%= t("budgets.investments.index.sidebar.my_ballot") %>
|
||||
</h2>
|
||||
|
||||
<% if @ballot.investments.by_heading(@heading.id).count > 0 %>
|
||||
<p>
|
||||
<em><%= sanitize(@ballot.voted_info(@heading)) %></em>
|
||||
</p>
|
||||
<% elsif @assigned_heading.present? %>
|
||||
<p>
|
||||
<%= sanitize(t("budgets.investments.index.sidebar.different_heading_assigned",
|
||||
heading_link: heading_link(@assigned_heading, @budget)
|
||||
)) %>
|
||||
<br>
|
||||
<small>
|
||||
<%= sanitize(t("budgets.investments.index.sidebar.change_ballot",
|
||||
check_ballot: link_to(t("budgets.investments.index.sidebar.check_ballot_link"),
|
||||
budget_ballot_path(@budget)))) %>
|
||||
</small>
|
||||
</p>
|
||||
<% else %>
|
||||
<p><strong><%= t("budgets.investments.index.sidebar.zero") %></strong></p>
|
||||
<% end %>
|
||||
|
||||
<p>
|
||||
<%= sanitize(@ballot.change_vote_info(
|
||||
link: link_to(t("budgets.investments.index.sidebar.change_vote_link"),
|
||||
budget_ballot_path(@budget)))) %>
|
||||
</p>
|
||||
|
||||
<ul class="ballot-list">
|
||||
<% if @heading %>
|
||||
<%= render Budgets::Ballot::InvestmentForSidebarComponent.with_collection(
|
||||
@ballot.investments.by_heading(@heading.id),
|
||||
investment_ids: @investment_ids
|
||||
) %>
|
||||
<% end %>
|
||||
</ul>
|
||||
|
||||
<%= link_to t("budgets.investments.header.check_ballot"),
|
||||
budget_ballot_path(@budget),
|
||||
class: "button hollow expanded" %>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
<% if @heading && !@heading.content_blocks.where(locale: I18n.locale).empty? %>
|
||||
@@ -28,46 +67,3 @@
|
||||
<% end %>
|
||||
<%= render "shared/tag_cloud", taggable: "Budget::Investment" %>
|
||||
<%= render "budgets/investments/categories" %>
|
||||
|
||||
<% if @heading && can?(:show, @ballot) %>
|
||||
|
||||
<div class="sidebar-divider"></div>
|
||||
|
||||
<h2 class="sidebar-title">
|
||||
<%= t("budgets.investments.index.sidebar.my_ballot") %>
|
||||
</h2>
|
||||
|
||||
<% if @ballot.investments.by_heading(@heading.id).count > 0 %>
|
||||
<p>
|
||||
<em><%= sanitize(@ballot.voted_info(@heading)) %></em>
|
||||
</p>
|
||||
<% elsif @assigned_heading.present? %>
|
||||
<p>
|
||||
<%= sanitize(t("budgets.investments.index.sidebar.different_heading_assigned",
|
||||
heading_link: heading_link(@assigned_heading, @budget)
|
||||
)) %>
|
||||
<br>
|
||||
<small>
|
||||
<%= sanitize(t("budgets.investments.index.sidebar.change_ballot",
|
||||
check_ballot: link_to(t("budgets.investments.index.sidebar.check_ballot_link"),
|
||||
budget_ballot_path(@budget)))) %>
|
||||
</small>
|
||||
</p>
|
||||
<% else %>
|
||||
<p><strong><%= t("budgets.investments.index.sidebar.zero") %></strong></p>
|
||||
<% end %>
|
||||
|
||||
<ul class="ballot-list">
|
||||
<% if @heading %>
|
||||
<% @ballot.investments.by_heading(@heading.id).each do |investment| %>
|
||||
<%= render "budgets/ballot/investment_for_sidebar",
|
||||
investment: investment,
|
||||
investment_ids: @investment_ids %>
|
||||
<% end %>
|
||||
<% end %>
|
||||
</ul>
|
||||
|
||||
<%= link_to t("budgets.investments.header.check_ballot"),
|
||||
budget_ballot_path(@budget),
|
||||
class: "button hollow expanded" %>
|
||||
<% end %>
|
||||
|
||||
@@ -94,7 +94,7 @@
|
||||
|
||||
<div class="small-12 medium-3 column">
|
||||
<aside class="margin-bottom">
|
||||
<div id="sidebar">
|
||||
<div id="sidebar" class="budget-investments-sidebar">
|
||||
<%= render "/budgets/investments/sidebar" %>
|
||||
</div>
|
||||
</aside>
|
||||
|
||||
@@ -11,7 +11,8 @@
|
||||
<%= link_to_add_association t("documents.form.add_new_document"), f, :documents,
|
||||
partial: "documents/document_fields",
|
||||
id: "new_document_link",
|
||||
class: "button hollow #{"hide" if documentable.documents.count >= documentable.class.max_documents_allowed}",
|
||||
class: "button upload-document
|
||||
#{"hide" if max_documents_allowed?(documentable)}",
|
||||
data: {
|
||||
association_insertion_node: "#nested-documents",
|
||||
association_insertion_method: "append"
|
||||
|
||||
@@ -13,7 +13,7 @@
|
||||
force_non_association_create: true,
|
||||
partial: "images/image_fields",
|
||||
id: "new_image_link",
|
||||
class: "button hollow
|
||||
class: "button upload-image
|
||||
#{"hide" if image_fields == :image && imageable.image.present?}",
|
||||
render_options: {
|
||||
locals: { imageable: imageable }
|
||||
|
||||
@@ -3,8 +3,9 @@ en:
|
||||
ballots:
|
||||
show:
|
||||
title: Your ballot
|
||||
amount_progress: "%{amount_spent} / %{amount_limit}"
|
||||
amount_available:
|
||||
knapsack: "You still have <span>%{count}</span> to invest."
|
||||
knapsack: "Still available to you <span>%{count}</span>"
|
||||
approval:
|
||||
zero: "You can still cast <span>%{count}</span> votes."
|
||||
one: "You can still cast <span>%{count}</span> vote."
|
||||
@@ -16,7 +17,7 @@ en:
|
||||
one: "Votes cast: <span>%{count}</span>"
|
||||
other: "Votes cast: <span>%{count}</span>"
|
||||
amount_limit:
|
||||
knapsack: "%{count}"
|
||||
knapsack: "Total budget <span>%{count}</span>"
|
||||
approval:
|
||||
one: "You can vote <span>1</span> project"
|
||||
other: "You can vote up to <span>%{count}</span> projects"
|
||||
@@ -107,12 +108,12 @@ en:
|
||||
one: "<strong>You voted one proposal</strong>"
|
||||
other: "<strong>You voted %{count} proposals</strong>"
|
||||
change_vote_info:
|
||||
knapsack: "You can %{link} at any time until the close of this phase. No need to spend all the money available."
|
||||
approval: "You can %{link} at any time until the close of this phase."
|
||||
knapsack: "You can %{link} at any time until %{phase_end_date}. No need to spend all the money available."
|
||||
approval: "You can %{link} at any time until %{phase_end_date}."
|
||||
change_vote_link: "change your vote"
|
||||
different_heading_assigned: "You have active votes in another heading: %{heading_link}"
|
||||
change_ballot: "If your change your mind you can remove your votes in %{check_ballot} and start again."
|
||||
check_ballot_link: "check and confirm my ballot"
|
||||
check_ballot_link: "submit my ballot"
|
||||
zero: You have not voted any investment project in this group.
|
||||
verified_only: "To create a new budget investment %{verify}."
|
||||
create: "Create a budget investment"
|
||||
@@ -165,18 +166,11 @@ en:
|
||||
zero: No supports
|
||||
give_support: Support
|
||||
header:
|
||||
check_ballot: Check and confirm my ballot
|
||||
check_ballot: "Submit my ballot"
|
||||
different_heading_assigned: "You have active votes in another heading: %{heading_link}"
|
||||
change_ballot: "If your change your mind you can remove your votes in %{check_ballot} and start again."
|
||||
check_ballot_link: "check and confirm my ballot"
|
||||
price: "This heading has a budget of"
|
||||
progress_bar:
|
||||
assigned: "You have assigned: "
|
||||
available: "Available budget: "
|
||||
votes:
|
||||
zero: "You have selected <strong>0</strong> projects out of <strong>%{limit}</strong>"
|
||||
one: "You have selected <strong>1</strong> project out of <strong>%{limit}</strong>"
|
||||
other: "You have selected <strong>%{count}</strong> projects out of <strong>%{limit}</strong>"
|
||||
check_ballot_link: "submit my ballot"
|
||||
price: "Total budget"
|
||||
show:
|
||||
see_results: See results
|
||||
results:
|
||||
|
||||
@@ -3,20 +3,21 @@ es:
|
||||
ballots:
|
||||
show:
|
||||
title: Mis votos
|
||||
amount_progress: "%{amount_spent} / %{amount_limit}"
|
||||
amount_available:
|
||||
knapsack: "Te quedan <span>%{count}</span> para invertir"
|
||||
knapsack: "Todavía disponible <span>%{count}</span>"
|
||||
approval:
|
||||
zero: "Te quedan <span>%{count}</span> votos disponibles"
|
||||
one: "Te queda <span>%{count}</span> voto disponible"
|
||||
other: "Te quedan <span>%{count}</span> votos disponibles"
|
||||
amount_spent:
|
||||
knapsack: "Coste total <span>%{count}</span>"
|
||||
knapsack: "Has asignado <span>%{count}</span>"
|
||||
approval:
|
||||
zero: "Votos: <span>%{count}</span>"
|
||||
one: "Votos: <span>%{count}</span>"
|
||||
other: "Votos: <span>%{count}</span>"
|
||||
amount_limit:
|
||||
knapsack: "%{count}"
|
||||
knapsack: "Presupuesto total <span>%{count}</span>"
|
||||
approval:
|
||||
one: "Puedes votar <span>1</span> proyecto"
|
||||
other: "Puedes votar hasta <span>%{count}</span> proyectos"
|
||||
@@ -107,8 +108,8 @@ es:
|
||||
one: "<strong>Has votado un proyecto</strong>"
|
||||
other: "<strong>Has votado %{count} proyectos</strong>"
|
||||
change_vote_info:
|
||||
knapsack: "Puedes %{link} en cualquier momento hasta el cierre de esta fase. No hace falta que gastes todo el dinero disponible."
|
||||
approval: "Puedes %{link} en cualquier momento hasta el cierre de esta fase."
|
||||
knapsack: "Puedes %{link} en cualquier momento hasta el %{phase_end_date}. No hace falta que gastes todo el dinero disponible."
|
||||
approval: "Puedes %{link} en cualquier momento hasta el %{phase_end_date}."
|
||||
change_vote_link: "cambiar tus votos"
|
||||
different_heading_assigned: "Ya apoyaste proyectos de otra sección del presupuesto: %{heading_link}"
|
||||
change_ballot: "Si cambias de opinión puedes borrar tus votos en %{check_ballot} y volver a empezar."
|
||||
@@ -169,14 +170,7 @@ es:
|
||||
different_heading_assigned: "Ya apoyaste proyectos de otra sección del presupuesto: %{heading_link}"
|
||||
change_ballot: "Si cambias de opinión puedes borrar tus votos en %{check_ballot} y volver a empezar."
|
||||
check_ballot_link: "revisar y confirmar mis votos"
|
||||
price: "Esta partida tiene un presupuesto de"
|
||||
progress_bar:
|
||||
assigned: "Has asignado: "
|
||||
available: "Presupuesto disponible: "
|
||||
votes:
|
||||
zero: "Has seleccionado <strong>0</strong> proyectos de <strong>%{limit}</strong>"
|
||||
one: "Has seleccionado <strong>1</strong> proyecto de <strong>%{limit}</strong>"
|
||||
other: "Has seleccionado <strong>%{count}</strong> proyectos de <strong>%{limit}</strong>"
|
||||
price: "Presupuesto total"
|
||||
show:
|
||||
see_results: Ver resultados
|
||||
results:
|
||||
|
||||
@@ -125,24 +125,24 @@ describe "Ballots" do
|
||||
visit budget_investments_path(budget, heading_id: new_york)
|
||||
add_to_ballot("Bring back King Kong")
|
||||
|
||||
expect(page).to have_css("#amount-spent", text: "€10,000")
|
||||
expect(page).to have_css("#amount-available", text: "€990,000")
|
||||
expect(page).to have_css("#total_amount", text: "€10,000")
|
||||
expect(page).to have_css("#amount_available", text: "€990,000")
|
||||
|
||||
within("#sidebar") do
|
||||
expect(page).to have_content "Bring back King Kong"
|
||||
expect(page).to have_content "€10,000"
|
||||
expect(page).to have_link("Check and confirm my ballot")
|
||||
expect(page).to have_link "Submit my ballot"
|
||||
end
|
||||
|
||||
add_to_ballot("Paint cabs black")
|
||||
|
||||
expect(page).to have_css("#amount-spent", text: "€30,000")
|
||||
expect(page).to have_css("#amount-available", text: "€970,000")
|
||||
expect(page).to have_css("#total_amount", text: "€30,000")
|
||||
expect(page).to have_css("#amount_available", text: "€970,000")
|
||||
|
||||
within("#sidebar") do
|
||||
expect(page).to have_content "Paint cabs black"
|
||||
expect(page).to have_content "€20,000"
|
||||
expect(page).to have_link("Check and confirm my ballot")
|
||||
expect(page).to have_link "Submit my ballot"
|
||||
end
|
||||
end
|
||||
|
||||
@@ -152,26 +152,26 @@ describe "Ballots" do
|
||||
visit budget_investments_path(budget, heading_id: new_york)
|
||||
|
||||
expect(page).to have_content investment.title
|
||||
expect(page).to have_css("#amount-spent", text: "€10,000")
|
||||
expect(page).to have_css("#amount-available", text: "€990,000")
|
||||
expect(page).to have_css("#total_amount", text: "€10,000")
|
||||
expect(page).to have_css("#amount_available", text: "€990,000")
|
||||
|
||||
within("#sidebar") do
|
||||
expect(page).to have_content investment.title
|
||||
expect(page).to have_content "€10,000"
|
||||
expect(page).to have_link("Check and confirm my ballot")
|
||||
expect(page).to have_link "Submit my ballot"
|
||||
end
|
||||
|
||||
within("#budget_investment_#{investment.id}") do
|
||||
find(".remove a").click
|
||||
end
|
||||
|
||||
expect(page).to have_css("#amount-spent", text: "€0")
|
||||
expect(page).to have_css("#amount-available", text: "€1,000,000")
|
||||
expect(page).to have_css("#total_amount", text: "€0")
|
||||
expect(page).to have_css("#amount_available", text: "€1,000,000")
|
||||
|
||||
within("#sidebar") do
|
||||
expect(page).not_to have_content investment.title
|
||||
expect(page).not_to have_content "€10,000"
|
||||
expect(page).to have_link("Check and confirm my ballot")
|
||||
expect(page).to have_link "Submit my ballot"
|
||||
end
|
||||
end
|
||||
|
||||
@@ -217,8 +217,8 @@ describe "Ballots" do
|
||||
|
||||
add_to_ballot("Cheap")
|
||||
|
||||
expect(page).to have_css("#amount-spent", text: "€10,000")
|
||||
expect(page).to have_css("#amount-available", text: "€9,990,000")
|
||||
expect(page).to have_css("#total_amount", text: "€10,000")
|
||||
expect(page).to have_css("#amount_available", text: "€9,990,000")
|
||||
|
||||
within("#sidebar") do
|
||||
expect(page).to have_content "Cheap"
|
||||
@@ -227,13 +227,13 @@ describe "Ballots" do
|
||||
|
||||
visit budget_investments_path(budget, heading_id: district_heading1)
|
||||
|
||||
expect(page).to have_css("#amount-spent", text: "€0")
|
||||
expect(page).to have_css("#amount-spent", text: "€1,000,000")
|
||||
expect(page).to have_css("#total_amount", text: "€0")
|
||||
expect(page).to have_css("#amount_available", text: "€1,000,000")
|
||||
|
||||
add_to_ballot("Average")
|
||||
|
||||
expect(page).to have_css("#amount-spent", text: "€20,000")
|
||||
expect(page).to have_css("#amount-available", text: "€980,000")
|
||||
expect(page).to have_css("#total_amount", text: "€20,000")
|
||||
expect(page).to have_css("#amount_available", text: "€980,000")
|
||||
|
||||
within("#sidebar") do
|
||||
expect(page).to have_content "Average"
|
||||
@@ -245,8 +245,8 @@ describe "Ballots" do
|
||||
|
||||
visit budget_investments_path(budget, heading_id: city_heading)
|
||||
|
||||
expect(page).to have_css("#amount-spent", text: "€10,000")
|
||||
expect(page).to have_css("#amount-available", text: "€9,990,000")
|
||||
expect(page).to have_css("#total_amount", text: "€10,000")
|
||||
expect(page).to have_css("#amount_available", text: "€9,990,000")
|
||||
|
||||
within("#sidebar") do
|
||||
expect(page).to have_content "Cheap"
|
||||
@@ -270,7 +270,7 @@ describe "Ballots" do
|
||||
add_to_ballot("Park expansion")
|
||||
|
||||
within("#progress_bar") do
|
||||
expect(page).to have_css("#amount-spent", text: "€10,000")
|
||||
expect(page).to have_css("#total_amount", text: "€10,000")
|
||||
end
|
||||
end
|
||||
end
|
||||
@@ -323,7 +323,7 @@ describe "Ballots" do
|
||||
end
|
||||
end
|
||||
|
||||
context "Showing the ballot" do
|
||||
context "Showing the ballot", :js do
|
||||
scenario "Displaying the correct group, heading, count & amount" do
|
||||
group1 = create(:budget_group, budget: budget)
|
||||
group2 = create(:budget_group, budget: budget)
|
||||
@@ -350,13 +350,13 @@ describe "Ballots" do
|
||||
within("#budget_group_#{group1.id}") do
|
||||
expect(page).to have_content "#{group1.name} - #{heading1.name}"
|
||||
expect(page).to have_content "Amount spent €20"
|
||||
expect(page).to have_link "You still have €80 to invest.", href: budget_group_path(budget, group1)
|
||||
expect(page).to have_link "Still available to you €80", href: budget_group_path(budget, group1)
|
||||
end
|
||||
|
||||
within("#budget_group_#{group2.id}") do
|
||||
expect(page).to have_content "#{group2.name} - #{heading2.name}"
|
||||
expect(page).to have_content "Amount spent €15"
|
||||
expect(page).to have_content "You still have €35 to invest"
|
||||
expect(page).to have_content "Still available to you €35"
|
||||
end
|
||||
end
|
||||
|
||||
@@ -380,7 +380,7 @@ describe "Ballots" do
|
||||
expect(page).to have_content("You have voted one investment")
|
||||
|
||||
within("#budget_investment_#{investment.id}") do
|
||||
find(".icon-x").click
|
||||
click_link "Remove vote"
|
||||
end
|
||||
|
||||
expect(page).to have_current_path(budget_ballot_path(budget))
|
||||
@@ -395,8 +395,8 @@ describe "Ballots" do
|
||||
login_as(user)
|
||||
visit budget_investments_path(budget, heading_id: new_york.id)
|
||||
|
||||
expect(page).to have_css("#amount-spent", text: "€30,000")
|
||||
expect(page).to have_css("#amount-available", text: "€970,000")
|
||||
expect(page).to have_css("#total_amount", text: "€30,000")
|
||||
expect(page).to have_css("#amount_available", text: "€970,000")
|
||||
|
||||
within("#sidebar") do
|
||||
expect(page).to have_content investment1.title
|
||||
@@ -407,11 +407,11 @@ describe "Ballots" do
|
||||
end
|
||||
|
||||
within("#sidebar #budget_investment_#{investment1.id}_sidebar") do
|
||||
find(".icon-x").click
|
||||
click_link "Remove vote"
|
||||
end
|
||||
|
||||
expect(page).to have_css("#amount-spent", text: "€20,000")
|
||||
expect(page).to have_css("#amount-available", text: "€980,000")
|
||||
expect(page).to have_css("#total_amount", text: "€20,000")
|
||||
expect(page).to have_css("#amount_available", text: "€980,000")
|
||||
|
||||
within("#sidebar") do
|
||||
expect(page).not_to have_content investment1.title
|
||||
@@ -431,13 +431,13 @@ describe "Ballots" do
|
||||
add_to_ballot("Sully monument")
|
||||
|
||||
within(".budget-heading") do
|
||||
click_link "Check and confirm my ballot"
|
||||
click_link "Submit my ballot"
|
||||
end
|
||||
|
||||
expect(page).to have_content("You have voted one investment")
|
||||
|
||||
within(".ballot-list li", text: "Sully monument") do
|
||||
find(".icon-x").click
|
||||
click_link "Remove vote"
|
||||
end
|
||||
|
||||
expect(page).to have_content("You have voted 0 investments")
|
||||
@@ -452,7 +452,7 @@ describe "Ballots" do
|
||||
visit budget_investments_path(budget, heading_id: new_york.id)
|
||||
|
||||
within(".budget-heading") do
|
||||
click_link "Check and confirm my ballot"
|
||||
click_link "Submit my ballot"
|
||||
end
|
||||
|
||||
expect(page).to have_content("You have voted 0 investments")
|
||||
@@ -627,7 +627,7 @@ describe "Ballots" do
|
||||
end
|
||||
|
||||
within("#budget_investment_#{bi1.id}_sidebar") do
|
||||
find(".icon-x").click
|
||||
click_link "Remove vote"
|
||||
end
|
||||
|
||||
expect(page).not_to have_css "#budget_investment_#{bi1.id}_sidebar"
|
||||
|
||||
@@ -692,12 +692,12 @@ describe "Budget Investments" do
|
||||
|
||||
visit budget_investments_path(budget, heading_id: heading.id)
|
||||
|
||||
expect(page).not_to have_link("Check and confirm my ballot")
|
||||
expect(page).not_to have_link("Submit my ballot")
|
||||
expect(page).not_to have_css("#progress_bar")
|
||||
|
||||
within("#sidebar") do
|
||||
expect(page).not_to have_content("My ballot")
|
||||
expect(page).not_to have_link("Check and confirm my ballot")
|
||||
expect(page).not_to have_link("Submit my ballot")
|
||||
end
|
||||
end
|
||||
|
||||
@@ -1332,12 +1332,12 @@ describe "Budget Investments" do
|
||||
|
||||
visit budget_investments_path(budget, heading_id: heading.id)
|
||||
|
||||
expect(page).to have_link("Check and confirm my ballot")
|
||||
expect(page).to have_link("Submit my ballot")
|
||||
expect(page).to have_css("#progress_bar")
|
||||
|
||||
within("#sidebar") do
|
||||
expect(page).to have_content("My ballot")
|
||||
expect(page).to have_link("Check and confirm my ballot")
|
||||
expect(page).to have_link("Submit my ballot")
|
||||
end
|
||||
end
|
||||
|
||||
|
||||
@@ -211,7 +211,7 @@ describe "Votes" do
|
||||
add_to_ballot(investment1.title)
|
||||
|
||||
expect(page).to have_content("Remove vote")
|
||||
expect(page).to have_content("You have selected 1 project out of 2")
|
||||
expect(page).to have_content("YOU CAN STILL CAST 1 VOTE")
|
||||
|
||||
within(".budget-investment", text: investment2.title) do
|
||||
find("div.ballot").hover
|
||||
|
||||
Reference in New Issue
Block a user