degeneralize box

This commit is contained in:
Lorin Werthen 2016-08-30 22:48:58 +02:00
parent 5f65118621
commit 564d71285e
2 changed files with 78 additions and 74 deletions

View file

@ -2,16 +2,18 @@ a.box {
color: #000;
}
.box {
background-color: $box-colour;
#homepage {
.box {
background-color: $box-colour;
&.highlighted {
background-color: $highlighted-box-colour;
color: $highlighted-text-colour;
&.highlighted {
background-color: $highlighted-box-colour;
color: $highlighted-text-colour;
.content {
h1 {
color: white;
.content {
h1 {
color: white;
}
}
}
}

View file

@ -1,76 +1,78 @@
<div class="tile is-vertical is-ancestor">
<div class="tile is-parent is-12">
<%= render '/partials/_tile.*', article: all_events[0] %>
</div>
<div class="tile">
<div class="tile is-parent is-4">
<%= render '/partials/_tile.*', article: all_events[1], htmlclass: "highlighted" %>
<div id="homepage">
<div class="tile is-vertical is-ancestor">
<div class="tile is-parent is-12">
<%= render '/partials/_tile.*', article: all_events[0] %>
</div>
<div class="tile is-parent is-4">
<div class="tile is-child box highlighted">
IDK LOL
<div class="tile">
<div class="tile is-parent is-4">
<%= render '/partials/_tile.*', article: all_events[1], htmlclass: "highlighted" %>
</div>
</div>
<div class="tile is-vertical is-2">
<div class="tile is-parent">
<div class="tile is-child box has-text-centered">
<%= fa 'wikipedia-w' %>
<div class="tile is-parent is-4">
<div class="tile is-child box highlighted">
IDK LOL
</div>
</div>
<div class="tile is-parent">
<div class="tile is-child box has-text-centered">
<%= fa 'video-camera' %>
</div>
</div>
</div>
<div class="tile is-vertical is-2">
<div class="tile is-parent">
<div class="tile is-child box has-text-centered">
<%= fa 'github' %>
</div>
</div>
<div class="tile is-parent">
<div class="tile is-child box has-text-centered">
<%= fa 'facebook-official' %>
</div>
</div>
</div>
</div>
<div class="tile">
<div class="tile is-4 is-parent">
<div class="tile is-child box">
<div class="content">
<h1><%= sorted_articles.first[:title] %></h1>
<%= sorted_articles.first[:description] %>
</div>
</div>
</div>
<div class="tile is-vertical">
<div class="tile is-parent">
<div class="tile is-child box">
<p>
Numero uno: @werthen
</p>
<p>
Numero dos: @myncke
</p>
<p>
Numero tres: @iepoev
</p>
<p>
Numero quatro: @becousae
</p>
</div>
</div>
<div class="tile">
<div class="tile is-6 is-parent">
<div class="tile is-child box">
GITHUB
<div class="tile is-vertical is-2">
<div class="tile is-parent">
<div class="tile is-child box has-text-centered">
<%= fa 'wikipedia-w' %>
</div>
</div>
<div class="tile is-6 is-parent">
<div class="tile is-parent">
<div class="tile is-child box has-text-centered">
<%= fa 'video-camera' %>
</div>
</div>
</div>
<div class="tile is-vertical is-2">
<div class="tile is-parent">
<div class="tile is-child box has-text-centered">
<%= fa 'github' %>
</div>
</div>
<div class="tile is-parent">
<div class="tile is-child box has-text-centered">
<%= fa 'facebook-official' %>
</div>
</div>
</div>
</div>
<div class="tile">
<div class="tile is-4 is-parent">
<div class="tile is-child box">
<div class="content">
<h1><%= sorted_articles.first[:title] %></h1>
<%= sorted_articles.first[:description] %>
</div>
</div>
</div>
<div class="tile is-vertical">
<div class="tile is-parent">
<div class="tile is-child box">
GITHUB
<p>
Numero uno: @werthen
</p>
<p>
Numero dos: @myncke
</p>
<p>
Numero tres: @iepoev
</p>
<p>
Numero quatro: @becousae
</p>
</div>
</div>
<div class="tile">
<div class="tile is-6 is-parent">
<div class="tile is-child box">
GITHUB
</div>
</div>
<div class="tile is-6 is-parent">
<div class="tile is-child box">
GITHUB
</div>
</div>
</div>
</div>