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

Merge pull request #4225 from consul/forms-design

Browse Source 
New design of the forms for creating debates and proposals
This commit is contained in:
Javi Martín
2021-07-13 16:34:32 +02:00
committed by GitHub
parent 7324e34d30 0dfabc8939
commit 3f9614fbe1
49 changed files with 594 additions and 498 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
app/assets/stylesheets/admin.scss
View File

@@ -315,7 +315,7 @@ $table-header: #ecf1f6;
}
.admin-content {
.proposal-form {
.proposal-new {
padding-top: 0;
}
}

2
app/assets/stylesheets/application.scss
View File

@@ -38,7 +38,9 @@
@import "tags";
@import "admin/**/*";
@import "budgets/**/*";
@import "debates/**/*";
@import "layout/**/*";
@import "proposals/**/*";
@import "sdg/**/*";
@import "sdg_management/*";
@import "sdg_management/**/*";

61
app/assets/stylesheets/budgets/investments/form.scss
View File

@@ -1,62 +1,3 @@
.budget-investment-form {
.required-fields {
@include full-width-background($adjust-padding: true);
background: $light;
margin-bottom: $line-height;
padding-top: $line-height;
}
> fieldset > legend {
float: left;
font-size: rem-calc(36);
font-weight: bold;
margin-bottom: $line-height;
text-transform: uppercase;
+ * {
clear: left;
}
}
select {
min-height: $line-height * 2;
@include breakpoint(medium) {
&:not(.js-add-language):not(.js-select-language) {
width: 50%;
}
}
}
.globalize-languages,
.translatable-fields {
@include grid-row-nest;
@include grid-column-gutter;
}
.sdg-related-list-selector {
padding-left: 0;
padding-right: 0;
}
[type="submit"] {
@include regular-button;
font-size: map-get($button-sizes, large);
margin-top: $line-height;
}
.actions {
border: 6px solid $border;
border-radius: rem-calc(12);
margin-left: auto;
margin-right: auto;
margin-top: $line-height * 2;
padding: $line-height * 2 $line-height;
text-align: center;
@include breakpoint(medium) {
width: 75%;
}
}
@extend %public-form;
}

82
app/assets/stylesheets/budgets/investments/new.scss
View File

@@ -1,85 +1,7 @@
.budget-investment-new {
$border-width: 4px;
@include grid-column-gutter;
> :first-child:not(.print-info) {
@include full-width-background($adjust-padding: true);
background: $light;
margin-top: -$line-height;
padding-top: $line-height;
}
@extend %public-form-header;
h1 {
margin-bottom: 0;
}
header {
@include has-fa-icon(building, regular, after);
align-items: center;
background-color: $body-background;
border: $border-width solid;
color: $brand-secondary;
border-bottom-right-radius: rem-calc(12);
border-top-right-radius: rem-calc(12);
display: flex;
margin-top: $line-height * 2;
@include breakpoint(large) {
padding-right: $line-height;
}
&::after {
display: none;
@include breakpoint(large) {
display: block;
font-size: rem-calc(100);
margin-left: $line-height;
}
}
h1 {
@include brand-background($brand-secondary);
@include background-till-left-of-screen;
@include has-fa-icon(chart-pie, solid, after);
align-items: center;
display: flex;
flex: 1;
font-size: rem-calc(36);
padding: $line-height * 2 0;
@include breakpoint(large) {
clip-path: polygon(
-100vw -#{$border-width},
100% -#{$border-width},
calc(100% - #{rem-calc(20)}) 50%,
100% calc(100% + #{$border-width}),
-100vw calc(100% + #{$border-width})
);
font-size: rem-calc(44);
}
&::before {
top: -$border-width;
height: calc(100% + 2 * #{$border-width});
}
&::after {
display: none;
@include breakpoint(medium) {
display: block;
font-size: 2em;
margin-left: auto;
margin-right: rem-calc(60);
}
}
span span {
display: block;
font-size: 0.75em;
margin-top: $line-height / 2;
}
}
@include has-fa-icon(chart-pie, solid, after);
}
}

3
app/assets/stylesheets/debates/form.scss Normal file
View File

@@ -0,0 +1,3 @@
.debate-form {
@extend %public-form;
}

15
app/assets/stylesheets/debates/new.scss Normal file
View File

@@ -0,0 +1,15 @@
.debate-new {
@extend %public-form-header;
h1 {
@include has-fa-icon(comment-alt, regular, after);
}
aside {
margin-top: $line-height;
}
.recommendations li::before {
color: $debates;
}
}

14
app/assets/stylesheets/layout.scss
View File

@@ -64,6 +64,20 @@ body {
}
}
main {
display: block;
&.budget-investment-new,
&.debate-new,
&.proposal-new,
&.sdg-goals-index,
&.sdg-goal-show,
&.topic-edit,
&.topic-new {
@include grid-column-gutter;
}
}
h1,
h2,
h3,

178
app/assets/stylesheets/mixins/forms.scss Normal file
View File

@@ -0,0 +1,178 @@
@import "mixins/icons";
@import "mixins/layouts";
@mixin public-form-header {
$border-width: 4px;
h1 {
margin-bottom: 0;
}
header {
$icon-size: $line-height * 4;
$padding-right: rem-calc(20);
$icon-size-with-padding: $icon-size + $padding-right;
$polygon-size: $icon-size / 2;
@include background-till-left-of-screen;
@include brand-background($brand-secondary);
border: $border-width solid $brand-secondary;
border-bottom-right-radius: rem-calc(12);
border-top-right-radius: rem-calc(12);
margin-top: $line-height * 2;
padding: $line-height * 2 0;
position: relative;
@include breakpoint(small) {
&::after {
display: none;
}
}
@include breakpoint(large) {
$rounding-error: 6px;
padding-right: $icon-size-with-padding;
background-image: linear-gradient(
to right,
#{$brand-secondary} 0,
#{$brand-secondary} calc(100% - #{$icon-size-with-padding} - 1px),
#{$body-background} calc(100% - #{$icon-size-with-padding}),
#{$body-background} 100%
);
&::after {
background: $body-background;
content: "";
clip-path: polygon(50% 0, 100% 0, 100% 100%, 50% calc(100% + 1px), 0 50%);
display: block;
position: absolute;
right: calc(#{$icon-size-with-padding} - #{$rounding-error});
top: 0;
height: 100%;
width: $polygon-size;
}
}
&::before {
top: -$border-width;
height: calc(100% + #{$border-width * 2});
}
h1 {
$heading-icon-size: $icon-size * 0.85;
@include has-fa-icon(building, regular);
font-size: rem-calc(36);
@include breakpoint(small) {
&::after,
&::before {
display: none;
position: absolute;
top: 50%;
transform: translateY(-50%);
}
}
@include breakpoint(medium) {
padding-right: $heading-icon-size * 2.5;
&::after {
display: block;
font-size: $heading-icon-size;
right: $heading-icon-size;
}
}
@include breakpoint(large) {
font-size: rem-calc(44);
&::after {
right: $icon-size-with-padding + $polygon-size + $heading-icon-size / 2;
}
&::before {
color: $brand-secondary;
display: block;
font-size: $icon-size;
right: $padding-right;
}
}
span {
display: block;
font-size: 0.75em;
margin-top: $line-height / 2;
}
}
a {
color: inherit;
text-decoration: underline;
}
}
}
%public-form-header {
@include public-form-header;
}
@mixin public-form {
.required-fields {
@include full-width-background($adjust-padding: true);
background: $light;
margin-bottom: $line-height;
padding-top: $line-height;
}
> fieldset > legend {
float: left;
font-size: rem-calc(36);
font-weight: bold;
margin-bottom: $line-height;
text-transform: uppercase;
+ * {
clear: left;
}
}
select {
min-height: $line-height * 2;
@include breakpoint(medium) {
&:not(.js-add-language):not(.js-select-language) {
width: 50%;
}
}
}
.globalize-languages,
.translatable-fields {
@include grid-row-nest;
@include grid-column-gutter;
}
[type="submit"] {
@include regular-button;
font-size: map-get($button-sizes, large);
margin-top: $line-height;
}
.actions {
border: 6px solid $border;
border-radius: rem-calc(12);
margin-left: auto;
margin-right: auto;
margin-top: $line-height * 2;
padding: $line-height * 2 $line-height;
text-align: center;
@include breakpoint(medium) {
width: 75%;
}
}
}
%public-form {
@include public-form;
}

2
app/assets/stylesheets/mixins/layouts.scss
View File

@@ -87,7 +87,7 @@
position: relative;
&::before {
background: inherit;
background-color: inherit;
content: "";
height: 100%;
position: absolute;

54
app/assets/stylesheets/participation.scss
View File

@@ -244,71 +244,23 @@
// 02. New participation
// ---------------------
.debate-form,
.proposal-form,
.budget-investment-form,
.document-form,
.topic-new,
.topic-form {
.icon-debates,
.icon-proposals,
.icon-budget,
.icon-image {
font-size: rem-calc(50);
line-height: $line-height;
opacity: 0.5;
}
.icon-debates {
color: $debates;
}
.icon-proposals,
.icon-image {
color: $proposals;
}
.icon-budget {
color: $budget;
}
}
.recommendations {
list-style-type: none;
margin-left: 0;
margin-top: $line-height;
li {
font-size: $small-font-size;
@include has-fa-icon(check, solid);
margin: $line-height / 2 0;
&::before {
content: "l ";
font-family: "icons" !important;
margin-right: $font-icon-margin * 1.5;
}
}
}
.debate-form {
.recommendations li::before {
color: $debates;
}
}
.proposal-form,
.document-form,
.topic-form,
.topic-new {
.recommendations li::before {
color: $proposals;
}
}
.budget-investment-new,
.proposal-form,
.proposal-new,
.proposal-edit,
.polls-form,
.poll-question-form,

3
app/assets/stylesheets/proposals/form.scss Normal file
View File

@@ -0,0 +1,3 @@
.proposal-form {
@extend %public-form;
}

15
app/assets/stylesheets/proposals/new.scss Normal file
View File

@@ -0,0 +1,15 @@
.proposal-new {
@extend %public-form-header;
header h1 {
@include has-fa-icon(lightbulb, regular, after);
}
aside {
margin-top: $line-height;
}
.recommendations li::before {
color: $proposals;
}
}

1
app/assets/stylesheets/sdg/goals/index.scss
View File

@@ -1,5 +1,4 @@
.sdg-goals-index {
@include grid-column-gutter;
.section-header {

1
app/assets/stylesheets/sdg/goals/show.scss
View File

@@ -1,5 +1,4 @@
.sdg-goal-show {
@include grid-column-gutter;
.sdg-goal {

1
app/assets/stylesheets/sdg/related_list_selector.scss
View File

@@ -1,5 +1,4 @@
.sdg-related-list-selector {
@include grid-column-gutter;
clear: both;
> legend {

6
app/assets/stylesheets/sdg_management/relations/edit.scss
View File

@@ -1,6 +0,0 @@
.sdg-relations-edit {
.sdg-related-list-selector {
padding: 0;
}
}

7
app/components/budgets/investments/new_component.html.erb Normal file
View File

@@ -0,0 +1,7 @@
<main class="budget-investment-new">
<%= back_link_to budgets_path %>
<%= header %>
<%= render "/budgets/investments/form", form_url: budget_investments_path(budget) %>
</main>

26
app/components/budgets/investments/new_component.rb Normal file
View File

@@ -0,0 +1,26 @@
class Budgets::Investments::NewComponent < ApplicationComponent
include Header
attr_reader :budget
def initialize(budget)
@budget = budget
end
def title
safe_join([base_title, subtitle].compact, " ")
end
private
def base_title
sanitize(t("budgets.investments.form.title"))
end
def subtitle
if budget.single_heading?
tag.span t("budgets.investments.form.subtitle",
heading: budget.headings.first.name,
price: budget.formatted_heading_price(budget.headings.first))
end
end
end

16
app/components/concerns/header.rb
View File

@@ -3,14 +3,24 @@ module Header
def header(&block)
provide(:title) do
"#{t("#{namespace}.header.title")} - #{title}"
[
t("#{namespace}.header.title", default: ""),
strip_tags(title),
setting["org_name"]
].reject(&:blank?).join(" - ")
end
heading_tag = if %w[admin management moderation sdg_management valuation].include?(namespace)
"h2"
else
"h1"
end
tag.header do
if block_given?
tag.h2(title) + capture(&block)
content_tag(heading_tag, title) + capture(&block)
else
tag.h2(title)
content_tag(heading_tag, title)
end
end
end

55
app/components/debates/form_component.html.erb Normal file
View File

@@ -0,0 +1,55 @@
<%= translatable_form_for(debate, html: { class: "debate-form" }) do |f| %>
<%= render "shared/errors", resource: debate %>
<fieldset class="required-fields">
<legend><%= t("shared.required") %></legend>
<%= render "shared/globalize_locales", resource: debate %>
<%= f.translatable_fields do |translations_form| %>
<div>
<%= translations_form.text_field :title,
maxlength: Debate.title_max_length,
data: suggest_data(debate) %>
</div>
<div class="js-suggest" data-locale="<%= translations_form.locale %>"></div>
<div>
<%= translations_form.text_area :description,
maxlength: Debate.description_max_length,
class: "html-area" %>
</div>
<% end %>
</fieldset>
<%= f.invisible_captcha :subtitle %>
<fieldset>
<legend><%= t("shared.optional") %></legend>
<div>
<%= f.text_field :tag_list, value: debate.tag_list.to_s,
hint: t("debates.form.tags_instructions"),
placeholder: t("debates.form.tags_placeholder"),
data: { js_url: suggest_tags_path },
class: "tag-autocomplete" %>
</div>
<%= render SDG::RelatedListSelectorComponent.new(f) %>
</fieldset>
<div class="actions">
<% if debate.new_record? %>
<div>
<%= f.check_box :terms_of_service,
title: t("form.accept_terms_title"),
label: t("form.accept_terms",
policy: link_to(t("form.policy"), "/privacy", target: "blank"),
conditions: link_to(t("form.conditions"), "/conditions", target: "blank")
) %>
</div>
<% end %>
<%= f.submit(class: "button", value: t("debates.#{action_name}.form.submit_button")) %>
</div>
<% end %>

10
app/components/debates/form_component.rb Normal file
View File

@@ -0,0 +1,10 @@
class Debates::FormComponent < ApplicationComponent
include TranslatableFormHelper
include GlobalizeHelper
attr_reader :debate
delegate :suggest_data, to: :helpers
def initialize(debate)
@debate = debate
end
end

22
app/components/debates/new_component.html.erb Normal file
View File

@@ -0,0 +1,22 @@
<main class="debate-new">
<%= back_link_to debates_path, t("debates.index.section_header.title") %>
<%= header do %>
<%= link_to help_path(anchor: "debates"), title: t("shared.target_blank"), target: "_blank" do %>
<%= t("debates.new.more_info") %>
<% end %>
<% end %>
<aside>
<h2><%= t("debates.new.recommendations_title") %></h2>
<ul class="recommendations">
<li><%= t("debates.new.recommendation_one") %></li>
<li><%= t("debates.new.recommendation_two") %></li>
<li><%= t("debates.new.recommendation_three") %></li>
<li><%= t("debates.new.recommendation_four") %></li>
</ul>
</aside>
<%= render Debates::FormComponent.new(debate) %>
</main>

12
app/components/debates/new_component.rb Normal file
View File

@@ -0,0 +1,12 @@
class Debates::NewComponent < ApplicationComponent
include Header
attr_reader :debate
def initialize(debate)
@debate = debate
end
def title
t("debates.new.start_new")
end
end

114
app/components/proposals/form_component.html.erb Normal file
View File

@@ -0,0 +1,114 @@
<%= translatable_form_for(proposal, url: url, html: { class: "proposal-form" }) do |f| %>
<%= render "shared/errors", resource: proposal %>
<fieldset class="required-fields">
<legend><%= t("shared.required") %></legend>
<%= render "shared/globalize_locales", resource: proposal %>
<%= f.translatable_fields do |translations_form| %>
<div>
<%= translations_form.text_field :title,
maxlength: Proposal.title_max_length,
data: suggest_data(proposal) %>
</div>
<div class="js-suggest" data-locale="<%= translations_form.locale %>"></div>
<div>
<%= translations_form.text_area :summary,
rows: 4, maxlength: 200,
hint: t("proposals.form.proposal_summary_note") %>
</div>
<div>
<%= translations_form.text_area :description,
maxlength: Proposal.description_max_length,
class: "html-area" %>
</div>
<% end %>
</fieldset>
<%= f.invisible_captcha :subtitle %>
<fieldset>
<legend><%= t("shared.optional") %></legend>
<div>
<%= f.text_field :video_url, hint: t("proposals.form.proposal_video_url_note") %>
</div>
<% if feature?(:allow_images) %>
<div class="images">
<%= render "images/nested_image", imageable: proposal, f: f %>
</div>
<% end %>
<% if feature?(:allow_attached_documents) %>
<div class="documents">
<%= render "documents/nested_documents", documentable: proposal, f: f %>
</div>
<% end %>
<div>
<%= f.select :geozone_id, geozone_select_options,
include_blank: t("geozones.none") %>
</div>
<% if feature?(:map) %>
<div>
<%= render "map_locations/form_fields",
form: f,
map_location: proposal.map_location || MapLocation.new,
label: t("proposals.form.map_location"),
help: t("proposals.form.map_location_instructions"),
remove_marker_label: t("proposals.form.map_remove_marker"),
parent_class: "proposal",
i18n_namespace: "proposals" %>
</div>
<% end %>
<div>
<%= f.label :tag_list, t("proposals.form.tags_label") %>
<p class="help-text" id="tag-list-help-text"><%= t("proposals.form.tags_instructions") %></p>
<div id="category_tags" class="tags">
<%= f.label :category_tag_list, t("proposals.form.tag_category_label") %>
<% categories.each do |tag| %>
<a class="js-add-tag-link"><%= tag.name %></a>
<% end %>
</div>
<br>
<%= f.text_field :tag_list, value: proposal.tag_list.to_s,
label: false,
placeholder: t("proposals.form.tags_placeholder"),
class: "js-tag-list tag-autocomplete",
aria: { describedby: "tag-list-help-text" },
data: { js_url: suggest_tags_path } %>
</div>
<% if current_user.unverified? %>
<div>
<%= f.text_field :responsible_name,
hint: t("proposals.form.proposal_responsible_name_note") %>
</div>
<% end %>
<%= render SDG::RelatedListSelectorComponent.new(f) %>
</fieldset>
<div class="actions">
<% if proposal.new_record? %>
<div>
<%= f.check_box :terms_of_service,
title: t("form.accept_terms_title"),
label: t("form.accept_terms",
policy: link_to(t("form.policy"), "/privacy", target: "blank"),
conditions: link_to(t("form.conditions"), "/conditions", target: "blank")
) %>
</div>
<% end %>
<%= f.submit(class: "button", value: t("proposals.#{action_name}.form.submit_button")) %>
</div>
<% end %>

17
app/components/proposals/form_component.rb Normal file
View File

@@ -0,0 +1,17 @@
class Proposals::FormComponent < ApplicationComponent
include TranslatableFormHelper
include GlobalizeHelper
attr_reader :proposal, :url
delegate :current_user, :suggest_data, :geozone_select_options, to: :helpers
def initialize(proposal, url:)
@proposal = proposal
@url = url
end
private
def categories
Tag.category.order(:name)
end
end

21
app/components/proposals/new_component.html.erb Normal file
View File

@@ -0,0 +1,21 @@
<main class="proposal-new">
<%= back_link_to proposals_path, t("proposals.index.section_header.title") %>
<%= header do %>
<%= link_to help_path(anchor: "proposals"), title: t("shared.target_blank"), target: "_blank" do %>
<%= t("proposals.new.more_info") %>
<% end %>
<% end %>
<aside>
<h2><%= t("proposals.new.recommendations_title") %></h2>
<ul class="recommendations">
<li><%= t("proposals.new.recommendation_one") %></li>
<li><%= t("proposals.new.recommendation_two") %></li>
<li><%= t("proposals.new.recommendation_three") %></li>
</ul>
</aside>
<%= render Proposals::FormComponent.new(proposal, url: proposals_path) %>
</main>

12
app/components/proposals/new_component.rb Normal file
View File

@@ -0,0 +1,12 @@
class Proposals::NewComponent < ApplicationComponent
include Header
attr_reader :proposal
def initialize(proposal)
@proposal = proposal
end
def title
t("proposals.new.start_new")
end
end

4
app/components/sdg/goals/show_component.html.erb
View File

@@ -1,6 +1,6 @@
<% provide(:title) { goal.title } %>
<div class="sdg-goal-show">
<main class="sdg-goal-show">
<%= back_link_to sdg_goals_path %>
<article class="sdg-goal sdg-goal-<%= code %>">
@@ -36,4 +36,4 @@
<% end %>
<%= render SDG::Goals::TargetsComponent.new(goal) %>
</div>
</main>

2
app/controllers/concerns/commentable_actions.rb
View File

@@ -52,7 +52,6 @@ module CommentableActions
redirect_path = url_for(controller: controller_name, action: :show, id: @resource.id)
redirect_to redirect_path, notice: t("flash.actions.create.#{resource_name.underscore}")
else
load_categories
load_geozones
set_resource_instance
render :new
@@ -66,7 +65,6 @@ module CommentableActions
if resource.update(strong_params)
redirect_to resource, notice: t("flash.actions.update.#{resource_name.underscore}")
else
load_categories
load_geozones
set_resource_instance
render :edit

2
app/controllers/management/proposals_controller.rb
View File

@@ -7,7 +7,6 @@ class Management::ProposalsController < Management::BaseController
before_action :only_verified_users, except: :print
before_action :set_proposal, only: [:vote, :show]
before_action :parse_search_terms, only: :index
before_action :load_categories, only: [:new, :edit]
before_action :load_geozones, only: [:edit]
has_orders %w[confidence_score hot_score created_at most_commented random], only: [:index, :print]
@@ -22,7 +21,6 @@ class Management::ProposalsController < Management::BaseController
redirect_path = url_for(controller: controller_name, action: :show, id: @resource.id)
redirect_to redirect_path, notice: t("flash.actions.create.#{resource_name.underscore}")
else
load_categories
load_geozones
set_resource_instance
render :new

2
app/controllers/proposals_controller.rb
View File

@@ -7,7 +7,7 @@ class ProposalsController < ApplicationController
include MapLocationAttributes
include Translatable
before_action :load_categories, only: [:index, :new, :create, :edit, :map, :summary]
before_action :load_categories, only: [:index, :map, :summary]
before_action :load_geozones, only: [:edit, :map, :summary]
before_action :authenticate_user!, except: [:index, :show, :map, :summary]
before_action :destroy_map_location_association, only: :update

4
app/views/admin/legislation/processes/_form.html.erb
View File

@@ -187,7 +187,9 @@
</div>
<div class="row">
<%= render SDG::RelatedListSelectorComponent.new(f) %>
<div class="small-12 column">
<%= render SDG::RelatedListSelectorComponent.new(f) %>
</div>
</div>
<div class="row">

4
app/views/admin/poll/polls/_form.html.erb
View File

@@ -56,7 +56,9 @@
</div>
<div class="row">
<%= render SDG::RelatedListSelectorComponent.new(f) %>
<div class="small-12 column">
<%= render SDG::RelatedListSelectorComponent.new(f) %>
</div>
</div>
<div class="row">

24
app/views/budgets/investments/new.html.erb
View File

@@ -1,23 +1 @@
<main class="budget-investment-new">
<div>
<%= back_link_to budgets_path %>
<header>
<h1>
<span>
<%= t("budgets.investments.form.title") %>
<% if @budget.single_heading? %>
<span>
<%= t("budgets.investments.form.subtitle",
heading: @budget.headings.first.name,
price: @budget.formatted_heading_price(@budget.headings.first)) %>
</span>
<% end %>
</span>
</h1>
</header>
</div>
<%= render "/budgets/investments/form", form_url: budget_investments_path(@budget) %>
</main>
<%= render Budgets::Investments::NewComponent.new(@budget) %>

51
app/views/debates/_form.html.erb
View File

@@ -1,50 +1 @@
<%= render "shared/globalize_locales", resource: @debate %>
<%= translatable_form_for(@debate) do |f| %>
<%= render "shared/errors", resource: @debate %>
<div class="row column">
<%= f.translatable_fields do |translations_form| %>
<div class="small-12 column">
<%= translations_form.text_field :title,
maxlength: Debate.title_max_length,
data: suggest_data(@debate) %>
</div>
<div class="js-suggest" data-locale="<%= translations_form.locale %>"></div>
<div class="small-12 column">
<%= translations_form.text_area :description,
maxlength: Debate.description_max_length,
class: "html-area" %>
</div>
<% end %>
<%= f.invisible_captcha :subtitle %>
<div class="small-12 column">
<%= f.text_field :tag_list, value: @debate.tag_list.to_s,
hint: t("debates.form.tags_instructions"),
placeholder: t("debates.form.tags_placeholder"),
data: { js_url: suggest_tags_path },
class: "tag-autocomplete" %>
</div>
<%= render SDG::RelatedListSelectorComponent.new(f) %>
<div class="small-12 column">
<% if @debate.new_record? %>
<%= f.check_box :terms_of_service,
title: t("form.accept_terms_title"),
label: t("form.accept_terms",
policy: link_to(t("form.policy"), "/privacy", target: "blank"),
conditions: link_to(t("form.conditions"), "/conditions", target: "blank")
) %>
<% end %>
</div>
<div class="actions small-12 column">
<%= f.submit(class: "button", value: t("debates.#{action_name}.form.submit_button")) %>
</div>
</div>
<% end %>
<%= render Debates::FormComponent.new(@debate) %>

2
app/views/debates/edit.html.erb
View File

@@ -1,4 +1,4 @@
<div class="debate-form row">
<div class="debate-edit">
<div class="small-12 column">
<%= back_link_to %>

31
app/views/debates/new.html.erb
View File

@@ -1,30 +1 @@
<div class="debate-form row">
<div class="small-12 medium-9 column">
<%= back_link_to debates_path %>
<h1><%= t("debates.new.start_new") %></h1>
<div data-alert class="callout primary">
<%= sanitize(t("debates.new.info",
info_link: link_to(t("debates.new.info_link"), new_proposal_path))) %>
<% if feature?(:help_page) %>
<%= link_to help_path, title: t("shared.target_blank"), target: "_blank" do %>
<strong><%= t("debates.new.more_info") %></strong>
<% end %>
<% end %>
</div>
<%= render "form" %>
</div>
<div class="small-12 medium-3 column">
<span class="icon-debates float-right"></span>
<h2><%= t("debates.new.recommendations_title") %></h2>
<ul class="recommendations">
<li><%= t("debates.new.recommendation_one") %></li>
<li><%= t("debates.new.recommendation_two") %></li>
<li><%= t("debates.new.recommendation_three") %></li>
<li><%= t("debates.new.recommendation_four") %></li>
</ul>
</div>
</div>
<%= render Debates::NewComponent.new(@debate) %>

2
app/views/legislation/proposals/new.html.erb
View File

@@ -1,4 +1,4 @@
<div class="proposal-form row">
<div class="proposal-new row">
<div class="small-12 column">
<%= back_link_to %>

2
app/views/management/proposals/new.html.erb
View File

@@ -1,4 +1,4 @@
<div class="proposal-form">
<div class="proposal-new">
<div class="clear float-right">
<%= render "/shared/print" %>

112
app/views/proposals/_form.html.erb
View File

@@ -1,111 +1 @@
<%= render "shared/globalize_locales", resource: @proposal %>
<%= translatable_form_for(@proposal, url: form_url) do |f| %>
<%= render "shared/errors", resource: @proposal %>
<div class="row column">
<%= f.translatable_fields do |translations_form| %>
<div class="small-12 column">
<%= translations_form.text_field :title,
maxlength: Proposal.title_max_length,
data: suggest_data(@proposal) %>
</div>
<div class="js-suggest" data-locale="<%= translations_form.locale %>"></div>
<div class="small-12 column">
<%= translations_form.text_area :summary,
rows: 4, maxlength: 200,
hint: t("proposals.form.proposal_summary_note") %>
</div>
<div class="small-12 column">
<%= translations_form.text_area :description,
maxlength: Proposal.description_max_length,
class: "html-area" %>
</div>
<% end %>
<%= f.invisible_captcha :subtitle %>
<div class="small-12 column">
<%= f.text_field :video_url, hint: t("proposals.form.proposal_video_url_note") %>
</div>
<% if feature?(:allow_images) %>
<div class="images small-12 column">
<%= render "images/nested_image", imageable: @proposal, f: f %>
</div>
<% end %>
<% if feature?(:allow_attached_documents) %>
<div class="documents small-12 column">
<%= render "documents/nested_documents", documentable: @proposal, f: f %>
</div>
<% end %>
<div class="small-12 medium-6 column">
<%= f.select :geozone_id, geozone_select_options,
include_blank: t("geozones.none") %>
</div>
<% if feature?(:map) %>
<div class="small-12 column">
<%= render "map_locations/form_fields",
form: f,
map_location: @proposal.map_location || MapLocation.new,
label: t("proposals.form.map_location"),
help: t("proposals.form.map_location_instructions"),
remove_marker_label: t("proposals.form.map_remove_marker"),
parent_class: "proposal",
i18n_namespace: "proposals" %>
</div>
<% end %>
<div class="small-12 column">
<%= f.label :tag_list, t("proposals.form.tags_label") %>
<p class="help-text" id="tag-list-help-text"><%= t("proposals.form.tags_instructions") %></p>
<div id="category_tags" class="tags">
<%= f.label :category_tag_list, t("proposals.form.tag_category_label") %>
<% @categories.each do |tag| %>
<a class="js-add-tag-link"><%= tag.name %></a>
<% end %>
</div>
<br>
<%= f.text_field :tag_list, value: @proposal.tag_list.to_s,
label: false,
placeholder: t("proposals.form.tags_placeholder"),
class: "js-tag-list tag-autocomplete",
aria: { describedby: "tag-list-help-text" },
data: { js_url: suggest_tags_path } %>
</div>
<% if current_user.unverified? %>
<div class="small-12 column">
<%= f.text_field :responsible_name,
hint: t("proposals.form.proposal_responsible_name_note") %>
</div>
<% end %>
<%= render SDG::RelatedListSelectorComponent.new(f) %>
<div class="small-12 column">
<% if @proposal.new_record? %>
<%= f.check_box :terms_of_service,
title: t("form.accept_terms_title"),
label: t("form.accept_terms",
policy: link_to(t("form.policy"), "/privacy", target: "blank"),
conditions: link_to(t("form.conditions"), "/conditions", target: "blank")
) %>
<% end %>
</div>
<div class="actions small-12 column">
<%= f.submit(class: "button", value: t("proposals.#{action_name}.form.submit_button")) %>
</div>
</div>
<% end %>
<%= render Proposals::FormComponent.new(@proposal, url: form_url) %>

2
app/views/proposals/edit.html.erb
View File

@@ -1,4 +1,4 @@
<div class="proposal-edit row">
<div class="proposal-edit">
<div class="small-12 column">
<%= back_link_to %>

25
app/views/proposals/new.html.erb
View File

@@ -1,24 +1 @@
<div class="proposal-form row">
<div class="small-12 medium-9 column">
<%= back_link_to %>
<h1><%= t("proposals.new.start_new") %></h1>
<div data-alert class="callout primary">
<%= link_to help_path(anchor: "proposals"), title: t("shared.target_blank"), target: "_blank" do %>
<%= t("proposals.new.more_info") %>
<% end %>
</div>
<%= render "proposals/form", form_url: proposals_path %>
</div>
<div class="small-12 medium-3 column">
<span class="icon-proposals float-right"></span>
<h2><%= t("proposals.new.recommendations_title") %></h2>
<ul class="recommendations">
<li><%= t("proposals.new.recommendation_one") %></li>
<li><%= t("proposals.new.recommendation_two") %></li>
<li><%= t("proposals.new.recommendation_three") %></li>
</ul>
</div>
</div>
<%= render Proposals::NewComponent.new(@proposal) %>

11
app/views/topics/_form.html.erb
View File

@@ -2,13 +2,8 @@
<%= render "shared/errors", resource: @topic %>
<div class="row">
<div class="small-12 column">
<%= f.text_field :title %>
<%= f.text_area :description, rows: "5" %>
<%= f.submit(class: "button", value: t("community.topic.form.#{action_name}.submit_button")) %>
</div>
</div>
<%= f.text_field :title %>
<%= f.text_area :description, rows: "5" %>
<%= f.submit(class: "button", value: t("community.topic.form.#{action_name}.submit_button")) %>
<% end %>

7
app/views/topics/_recommendations.html.erb
View File

@@ -1,7 +0,0 @@
<h2><%= t("community.topic.sidebar.recommendations_title") %></h2>
<ul class="recommendations">
<li><%= t("community.topic.sidebar.recommendation_one") %></li>
<li><%= t("community.topic.sidebar.recommendation_two") %></li>
<li><%= t("community.topic.sidebar.recommendation_three") %></li>
</ul>

15
app/views/topics/edit.html.erb
View File

@@ -1,12 +1,7 @@
<div class="row">
<main class="topic-edit">
<%= back_link_to community_path(@community) %>
<div class="small-12 medium-9 column">
<%= back_link_to community_path(@community) %>
<h1><%= t("community.topic.edit") %></h1>
<%= render "form" %>
</div>
<h1><%= t("community.topic.edit") %></h1>
<div class="small-12 medium-3 column">
<%= render "recommendations" %>
</div>
</div>
<%= render "form" %>
</main>

25
app/views/topics/new.html.erb
View File

@@ -1,12 +1,17 @@
<div class="row">
<main class="topic-new">
<%= back_link_to community_path(@community) %>
<div class="small-12 medium-9 column">
<%= back_link_to community_path(@community) %>
<h1><%= t("community.topic.create") %></h1>
<%= render "form" %>
</div>
<h1><%= t("community.topic.create") %></h1>
<div class="small-12 medium-3 column">
<%= render "recommendations" %>
</div>
</div>
<aside>
<h2><%= t("community.topic.sidebar.recommendations_title") %></h2>
<ul class="recommendations">
<li><%= t("community.topic.sidebar.recommendation_one") %></li>
<li><%= t("community.topic.sidebar.recommendation_two") %></li>
<li><%= t("community.topic.sidebar.recommendation_three") %></li>
</ul>
</aside>
<%= render "form" %>
</main>

4
config/locales/en/general.yml
View File

@@ -127,9 +127,7 @@ en:
new:
form:
submit_button: Start a debate
info: If you want to make a proposal, this is the wrong section, enter %{info_link}.
info_link: create new proposal
more_info: More information
more_info: How do debates work?
recommendation_four: Enjoy this space and the voices that fill it. It belongs to you too.
recommendation_one: Do not use capital letters for the debate title or for whole sentences. On the internet, this is considered shouting. And nobody likes being shouted at.
recommendation_three: Ruthless criticism is very welcome. This is a space for reflection. But we recommend that you stick to elegance and intelligence. The world is a better place with these virtues in it.

4
config/locales/es/general.yml
View File

@@ -127,9 +127,7 @@ es:
new:
form:
submit_button: Empieza un debate
info: Si lo que quieres es hacer una propuesta, esta es la sección incorrecta, entra en %{info_link}.
info_link: crear nueva propuesta
more_info: Más información
more_info: "¿Cómo funcionan los debates?"
recommendation_four: Disfruta de este espacio, de las voces que lo llenan, también es tuyo.
recommendation_one: No escribas el título del debate o frases enteras en mayúsculas. En internet eso se considera gritar. Y a nadie le gusta que le griten.
recommendation_three: Las críticas despiadadas son muy bienvenidas. Este es un espacio de pensamiento. Pero te recomendamos conservar la elegancia y la inteligencia. El mundo es mejor con ellas presentes.

5
spec/system/ckeditor_spec.rb
View File

@@ -9,7 +9,10 @@ describe "CKEditor" do
expect(page).to have_css ".translatable-fields[data-locale='en'] .cke_wysiwyg_frame"
click_link "Debates"
within ".subnavigation" do
click_link "Debates"
end
click_link "Start a debate"
expect(page).to have_css ".translatable-fields[data-locale='en'] .cke_wysiwyg_frame"