Improvement on event cards, we'll revamp this later

This commit is contained in:
Lorin Werthen 2018-04-09 22:09:11 +02:00
parent 803554f731
commit b9143d74c4
No known key found for this signature in database
GPG key ID: F11FFC921E0E08E0
4 changed files with 57 additions and 45 deletions

View file

@ -55,3 +55,13 @@
width: 100%; width: 100%;
} }
} }
.event-tile-image {
// For now, don't show the event tile image on mobile, takes too much space
@include mobile {
display: none;
}
max-width:200px;
max-height:200px;
}

View file

@ -11,55 +11,54 @@
<div id="homepage"> <div id="homepage">
<div class="tile is-vertical is-ancestor"> <div class="tile is-vertical is-ancestor">
<%= if studytime? then render '/tiles/blokmap.*'end %> <%= if studytime? then render '/tiles/blokmap.*'end %>
<div class="tile"> <!--next event -->
<!--top coders --> <div class="tile is-parent">
<div class="tile is-parent is-4"> <%= render '/partials/_events_tile.*', event: upcoming_events[0] || all_events[-1] %>
<div class="tile is-child box gamification-tile"> </div>
<div class="content"> <div class="tile">
<div class="tile-header"> <!--top coders -->
<h1 class="has-text-centered"> <div class="tile is-parent is-6">
<a href="https://zeus.ugent.be/game"> <div class="tile is-child box gamification-tile">
<i class="fa fa-trophy" aria-hidden="true"></i> <div class="content">
</a> <div class="tile-header">
</h1> <h1 class="has-text-centered">
</div> <a href="https://zeus.ugent.be/game">
<div id="gamification-coders" > <i class="fa fa-trophy" aria-hidden="true"></i>
<!-- EMPTY --> </a>
</div> </h1>
</div>
<div id="gamification-coders" >
<!-- EMPTY -->
</div> </div>
</div> </div>
</div> </div>
<!--next event -->
<div class="tile is-parent is-4">
<%= render '/partials/_events_tile.*', event: upcoming_events[0] || all_events[-1] %>
</div>
<!-- latest blogpost -->
<div class="tile is-4 is-parent">
<%= render '/partials/_tile.*',
article: sorted_articles.first,
small_text: "Latest blogpost",
htmlclass:"highlighted"%>
</div>
</div> </div>
<div class="tile"> <!-- latest blogpost -->
<div class="tile is-vertical"> <div class="tile is-6 is-parent">
<% all_events.reject { |x| x == (upcoming_events[0] || all_events[-1]) }.reverse[0..2].each do |event| %> <%= render '/partials/_tile.*',
<div class="tile is-parent "> article: sorted_articles.first,
<%= render '/partials/_events_tile.*', event: event %> small_text: "Latest blogpost",
</div> htmlclass:"highlighted"%>
<%end%> </div>
</div>
<div class="tile">
<div class="tile is-vertical">
<% all_events.reject { |x| x == (upcoming_events[0] || all_events[-1]) }.reverse[0..2].each do |event| %>
<div class="tile is-parent ">
<%= render '/partials/_events_tile.*', event: event %>
</div> </div>
<div class="tile is-vertical">
<% sorted_articles[1..3].each do |post| %>
<div class="tile is-parent ">
<%= render '/partials/_tile.*',
article: post,
small_text: "Blogpost"%>
</div>
<%end%> <%end%>
</div>
</div> </div>
<div class="tile is-vertical">
<% sorted_articles[1..3].each do |post| %>
<div class="tile is-parent ">
<%= render '/partials/_tile.*',
article: post,
small_text: "Blogpost"%>
</div>
<%end%>
</div>
</div>
</div> </div>
</div> </div>

View file

@ -27,7 +27,7 @@
<div class="content"> <div class="content">
<h1>Upcoming events</h1> <h1>Upcoming events</h1>
</div> </div>
<% upcoming_events(@item[:academic_year]).each_slice(2) do |slice| %> <% upcoming_events(@item[:academic_year]).each_slice(1) do |slice| %>
<div class="columns"> <div class="columns">
<% slice.each do |event| %> <% slice.each do |event| %>
<div class="tile is-parent "> <div class="tile is-parent ">
@ -42,7 +42,7 @@
<div class="content"> <div class="content">
<h1>Past events</h1> <h1>Past events</h1>
</div> </div>
<% past_events(@item[:academic_year]).each_slice(2) do |slice| %> <% past_events(@item[:academic_year]).each_slice(1) do |slice| %>
<div class="columns"> <div class="columns">
<% slice.each do |event| %> <% slice.each do |event| %>
<div class="tile is-parent "> <div class="tile is-parent ">

View file

@ -8,6 +8,9 @@
<a href="<%= @event.path %>" class="tile event-tile is-child box backgroundimg"> <a href="<%= @event.path %>" class="tile event-tile is-child box backgroundimg">
<% end %> <% end %>
<div class="content event-content"> <div class="content event-content">
<% if @event[:image] %>
<img class="event-tile-image" src="<%= @event[:image] %>" alt="">
<% end %>
<div class="event-text"> <div class="event-text">
<h1 class="has-text-centered"> <h1 class="has-text-centered">
<%= @event[:title] %> <%= @event[:title] %>