improves layout for items list with images
This commit is contained in:
@@ -655,29 +655,6 @@
|
||||
.budget-investments-list .budget-investment,
|
||||
.proposals-list .proposal {
|
||||
|
||||
.no-image {
|
||||
background: $brand;
|
||||
}
|
||||
}
|
||||
|
||||
.budget-investments-list .budget-investment,
|
||||
.proposals-list .proposal {
|
||||
|
||||
@include breakpoint(small) {
|
||||
|
||||
.no-image {
|
||||
width: 100%;
|
||||
max-width: rem-calc(300);
|
||||
margin: 0 auto;
|
||||
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
padding-top: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@include breakpoint(medium) {
|
||||
|
||||
.panel {
|
||||
@@ -685,12 +662,6 @@
|
||||
&.with-image {
|
||||
padding: 0 $line-height / 2 0 0;
|
||||
}
|
||||
|
||||
.no-image {
|
||||
height: 100%;
|
||||
min-height: rem-calc(245);
|
||||
width: rem-calc(140);
|
||||
}
|
||||
}
|
||||
|
||||
.column:first-child {
|
||||
|
||||
@@ -21,9 +21,11 @@
|
||||
<%= f.text_field :external_url %>
|
||||
</div>
|
||||
|
||||
<div class="images small-12 column">
|
||||
<%= render 'images/nested_image', imageable: @investment, f: f %>
|
||||
</div>
|
||||
<% if feature?(:allow_images) %>
|
||||
<div class="images small-12 column">
|
||||
<%= render 'images/nested_image', imageable: @investment, f: f %>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
<div class="documents small-12 column">
|
||||
<%= render 'documents/nested_documents', documentable: @investment, f: f %>
|
||||
|
||||
@@ -1,18 +1,20 @@
|
||||
<div id="<%= dom_id(investment) %>" class="budget-investment clear">
|
||||
<div class="panel with-image">
|
||||
<div class="panel <%= ('with-image' if feature?(:allow_images) && investment.image.present?) %>">
|
||||
|
||||
<% if feature?(:allow_images) && investment.image.present? %>
|
||||
<div class="row" data-equalizer>
|
||||
|
||||
<div class="small-12 medium-3 large-2 column text-center">
|
||||
<div data-equalizer-watch>
|
||||
<% if investment.image.present? %>
|
||||
<%= image_tag investment.image_url(:thumb), alt: investment.image.title %>
|
||||
<% else %>
|
||||
<div class="no-image"></div>
|
||||
<% end %>
|
||||
<%= image_tag investment.image_url(:thumb), alt: investment.image.title %>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="small-12 medium-6 large-7 column">
|
||||
<% else %>
|
||||
<div class="row">
|
||||
<div class="small-12 medium-9 column">
|
||||
<% end %>
|
||||
<div class="budget-investment-content">
|
||||
|
||||
<% cache [locale_and_user_status(investment), 'index', investment, investment.author] do %>
|
||||
@@ -55,7 +57,8 @@
|
||||
|
||||
<% if investment.should_show_votes? %>
|
||||
<div id="<%= dom_id(investment) %>_votes"
|
||||
class="small-12 medium-3 column text-center" data-equalizer-watch>
|
||||
class="small-12 medium-3 column text-center"
|
||||
<%= 'data-equalizer-watch' if feature?(:allow_images) && investment.image.present? %>>
|
||||
<%= render partial: '/budgets/investments/votes', locals: {
|
||||
investment: investment,
|
||||
investment_votes: investment_votes,
|
||||
@@ -64,7 +67,8 @@
|
||||
</div>
|
||||
<% elsif investment.should_show_vote_count? %>
|
||||
<div id="<%= dom_id(investment) %>_votes"
|
||||
class="small-12 medium-3 column text-center" data-equalizer-watch>
|
||||
class="small-12 medium-3 column text-center"
|
||||
<%= 'data-equalizer-watch' if feature?(:allow_images) && investment.image.present? %>>
|
||||
<div class="supports js-participation">
|
||||
<span class="total-supports no-button">
|
||||
<%= t("budgets.investments.investment.supports",
|
||||
@@ -74,7 +78,8 @@
|
||||
</div>
|
||||
<% elsif investment.should_show_ballots? %>
|
||||
<div id="<%= dom_id(investment) %>_ballot"
|
||||
class="small-12 medium-3 column text-center" data-equalizer-watch>
|
||||
class="small-12 medium-3 column text-center"
|
||||
<%= 'data-equalizer-watch' if feature?(:allow_images) && investment.image.present? %>>
|
||||
<%= render partial: '/budgets/investments/ballot', locals: {
|
||||
investment: investment,
|
||||
investment_ids: investment_ids,
|
||||
@@ -83,13 +88,14 @@
|
||||
</div>
|
||||
<% elsif investment.should_show_price? %>
|
||||
<div id="<%= dom_id(investment) %>_price"
|
||||
class="supports small-12 medium-3 column text-center" data-equalizer-watch>
|
||||
class="supports small-12 medium-3 column text-center"
|
||||
<%= 'data-equalizer-watch' if feature?(:allow_images) && investment.image.present? %>>
|
||||
<p class="investment-project-amount margin-top">
|
||||
<%= investment.formatted_price %>
|
||||
</p>
|
||||
</div>
|
||||
<% else %>
|
||||
<div data-equalizer-watch></div>
|
||||
<div <%= 'data-equalizer-watch' if feature?(:allow_images) && investment.image.present? %>></div>
|
||||
<% end %>
|
||||
|
||||
<% end %>
|
||||
|
||||
@@ -10,8 +10,6 @@
|
||||
<div class="image-container" data-equalizer-watch>
|
||||
<% if poll.image.present? %>
|
||||
<%= image_tag poll.image_url(:large), alt: poll.image.title %>
|
||||
<% else %>
|
||||
<div class="no-image"></div>
|
||||
<% end %>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -46,9 +46,11 @@
|
||||
<%= f.text_field :external_url, placeholder: t("proposals.form.proposal_external_url"), label: false %>
|
||||
</div>
|
||||
|
||||
<div class="images small-12 column">
|
||||
<%= render 'images/nested_image', imageable: @proposal, f: f %>
|
||||
</div>
|
||||
<% if feature?(:allow_images) %>
|
||||
<div class="images small-12 column">
|
||||
<%= render 'images/nested_image', imageable: @proposal, f: f %>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
<div class="documents small-12 column">
|
||||
<%= render 'documents/nested_documents', documentable: @proposal, f: f %>
|
||||
|
||||
@@ -1,21 +1,23 @@
|
||||
<div id="<%= dom_id(proposal) %>"
|
||||
class="proposal clear <%= ("successful" if proposal.total_votes > Proposal.votes_needed_for_success) %>"
|
||||
data-type="proposal">
|
||||
<div class="panel with-image">
|
||||
<div class="panel <%= ('with-image' if feature?(:allow_images) && proposal.image.present?) %>">
|
||||
<div class="icon-successful"></div>
|
||||
<div class="row" data-equalizer>
|
||||
|
||||
<div class="small-12 medium-3 large-2 column text-center">
|
||||
<div data-equalizer-watch>
|
||||
<% if proposal.image.present? %>
|
||||
<% if feature?(:allow_images) && proposal.image.present? %>
|
||||
<div class="row" data-equalizer>
|
||||
|
||||
<div class="small-12 medium-3 large-2 column text-center">
|
||||
<div data-equalizer-watch>
|
||||
<%= image_tag proposal.image_url(:thumb), alt: proposal.image.title %>
|
||||
<% else %>
|
||||
<div class="no-image"></div>
|
||||
<% end %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="small-12 medium-6 large-7 column">
|
||||
<div class="small-12 medium-6 large-7 column">
|
||||
<% else %>
|
||||
<div class="row">
|
||||
<div class="small-12 medium-9 column">
|
||||
<% end %>
|
||||
<div class="proposal-content">
|
||||
<% cache [locale_and_user_status(proposal), 'index', proposal, proposal.author] do %>
|
||||
<h3><%= link_to proposal.title, namespaced_proposal_path(proposal) %></h3>
|
||||
@@ -60,7 +62,9 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="<%= dom_id(proposal) %>_votes" class="small-12 medium-3 column supports-container" data-equalizer-watch>
|
||||
<div id="<%= dom_id(proposal) %>_votes"
|
||||
class="small-12 medium-3 column supports-container"
|
||||
<%= 'data-equalizer-watch' if feature?(:allow_images) && proposal.image.present? %>>
|
||||
<% if proposal.successful? %>
|
||||
<div class="padding text-center">
|
||||
|
||||
|
||||
Reference in New Issue
Block a user