Clean-up sponsorende leden
- Simplified and clean-up html & css - It's "sponsorende leden", not "sponserende leden"
This commit is contained in:
parent
70c315e79e
commit
5ec2e56d1c
4 changed files with 111 additions and 113 deletions
|
@ -1,59 +0,0 @@
|
|||
---
|
||||
narrow_page: true
|
||||
---
|
||||
|
||||
<%= render '/partials/_about_sub_navbar.*', selected: 'sponsoring_members' %>
|
||||
<h1 class='title is-1 has-text-centered'>Sponserende leden</h1>
|
||||
|
||||
<div id='sponsoring_members' class="content">
|
||||
<% current_sponsoring_members.each do |member| %>
|
||||
<div id="<%= member[:nickname] %>" class="box sponsoring_member">
|
||||
<article class="columns is-mobile">
|
||||
<div class="column is-gapless is-narrow logo-wrapper">
|
||||
<% if member[:photo] %>
|
||||
<div class="sponserend_image">
|
||||
<img src="<%=member[:photo]%>">
|
||||
</div>
|
||||
<% else %>
|
||||
<div class="sponserend_image" style="background-color: #ff7f00">
|
||||
<div class="logo-initial has-text-centered">
|
||||
<%= member[:name].chars.first %>
|
||||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||
<p class="name"><%= member[:name] %></p>
|
||||
<p class="username">(<%= member[:nickname] %>)</p>
|
||||
</div>
|
||||
<div class="text_wrapper">
|
||||
<div class="column text_data">
|
||||
<div>
|
||||
<i class="quote">
|
||||
"<%= to_HTML(member[:quote]) %>"
|
||||
</i>
|
||||
</div>
|
||||
<div class="description_text" style="margin-top: 0.5em">
|
||||
<%= to_HTML(member[:description]) %>
|
||||
</div>
|
||||
</div>
|
||||
<div class="columns links">
|
||||
<% member[:links].each do |link| %>
|
||||
<% if link[:icon] %>
|
||||
<a style="padding: 5px" class="social-icon" href="<%= link[:url] %>" target="_blank">
|
||||
<span class="icon">
|
||||
<%= fa link[:icon], {:size => "2x"} %>
|
||||
</span>
|
||||
</a>
|
||||
<% else %>
|
||||
<a style="padding: 5px" class="social-icon" href="<%= link[:url] %>" target="_blank">
|
||||
<span class="icon">
|
||||
<%= fa :globe, {:size => "2x"} %>
|
||||
</span>
|
||||
</a>
|
||||
<% end %>
|
||||
<% end %>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
53
content/about/sponsorende-leden.erb
Normal file
53
content/about/sponsorende-leden.erb
Normal file
|
@ -0,0 +1,53 @@
|
|||
---
|
||||
narrow_page: true
|
||||
---
|
||||
|
||||
<%= render '/partials/_about_sub_navbar.*', selected: 'sponsoring-members' %>
|
||||
<h1 class='title is-1 has-text-centered'>Sponsorende leden</h1>
|
||||
|
||||
<div id='sponsoring-members' class="content">
|
||||
<% current_sponsoring_members.each do |member| %>
|
||||
<div id="<%= member[:nickname] %>" class="box sponsoring-member">
|
||||
<article class="columns is-mobile">
|
||||
<div class="column is-gapless is-narrow logo-wrapper">
|
||||
<% if member[:photo] %>
|
||||
<img src="<%= member[:photo] %>" alt="<%= member[:name] %>">
|
||||
<% else %>
|
||||
<div class="logo-initial has-text-centered">
|
||||
<%= member[:name].chars.first %>
|
||||
</div>
|
||||
<% end %>
|
||||
<div class="name"><%= member[:name] %></div>
|
||||
<div class="username">(<%= member[:nickname] %>)</div>
|
||||
</div>
|
||||
<div class="column">
|
||||
<div>
|
||||
<blockquote>
|
||||
<%= to_HTML(member[:quote]) %>
|
||||
</blockquote>
|
||||
<p class="description">
|
||||
<%= to_HTML(member[:description]) %>
|
||||
</p>
|
||||
</div>
|
||||
<div class="links">
|
||||
<% member[:links].each do |link| %>
|
||||
<% if link[:icon] %>
|
||||
<a class="social-icon" href="<%= link[:url] %>" target="_blank">
|
||||
<span class="icon">
|
||||
<%= fa link[:icon], {:size => "2x"} %>
|
||||
</span>
|
||||
</a>
|
||||
<% else %>
|
||||
<a class="social-icon" href="<%= link[:url] %>" target="_blank">
|
||||
<span class="icon">
|
||||
<%= fa :globe, {:size => "2x"} %>
|
||||
</span>
|
||||
</a>
|
||||
<% end %>
|
||||
<% end %>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
|
@ -162,60 +162,64 @@ table.board-table {
|
|||
}
|
||||
}
|
||||
|
||||
.name{
|
||||
padding-top: 0.75rem;
|
||||
font-size: 1.4rem;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.username{
|
||||
margin-top: -1.5rem;
|
||||
font-weight: lighter;
|
||||
font-size: 1.1rem;
|
||||
}
|
||||
|
||||
.logo-wrapper{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
width: 14rem;
|
||||
padding: 0.75rem 0;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 550px){
|
||||
.logo-wrapper{
|
||||
width: 10rem;
|
||||
.sponsoring-member {
|
||||
.name {
|
||||
padding-top: 0.75rem;
|
||||
font-size: 1.4rem;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
}
|
||||
.name{
|
||||
font-size: 1rem;
|
||||
|
||||
.username {
|
||||
font-weight: lighter;
|
||||
font-size: 1.1rem;
|
||||
}
|
||||
.username{
|
||||
font-size: 0.9rem;
|
||||
|
||||
.logo-wrapper {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
width: 14rem;
|
||||
padding: 0.75rem 0;
|
||||
|
||||
img {
|
||||
max-width: 9rem;
|
||||
max-height: 9rem;
|
||||
}
|
||||
}
|
||||
|
||||
.links {
|
||||
margin-top: 1.5rem;
|
||||
|
||||
.social-icon {
|
||||
margin-right: 0.6rem;
|
||||
}
|
||||
}
|
||||
|
||||
blockquote {
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
|
||||
.description {
|
||||
font-size: 1.1rem;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.logo-initial {
|
||||
background-color: #ff7f00;
|
||||
width: 7rem;
|
||||
height: 7rem;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 550px){
|
||||
.logo-wrapper {
|
||||
width: 10rem;
|
||||
}
|
||||
.name{
|
||||
font-size: 1rem;
|
||||
}
|
||||
.username{
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
.links{
|
||||
padding-left: 1rem;
|
||||
}
|
||||
|
||||
.quote {
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
|
||||
.text_data {
|
||||
margin: 2rem 0;
|
||||
border-left: 0.25rem solid #09C3FF;
|
||||
}
|
||||
|
||||
.description {
|
||||
font-size: 1.1rem;
|
||||
}
|
||||
|
||||
.sponserend_image {
|
||||
width: 8rem;
|
||||
height: 8rem;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border-radius: 100000000000000px;
|
||||
}
|
||||
|
|
|
@ -5,6 +5,6 @@
|
|||
<li class="<%= 'is-active' if @selected == 'historiek'%>"><a href="/about/historiek">Historiek</a></li>
|
||||
<li class="<%= 'is-active' if @selected == 'oud-bestuur'%>"><a href="/about/oud-bestuur">Oud-bestuur</a></li>
|
||||
<li class="<%= 'is-active' if @selected == 'verslagen'%>"><a href="/about/verslagen">Verslagen</a></li>
|
||||
<li class="<%= 'is-active' if @selected == 'sponsoring_members'%>"><a href="/about/sponserende_leden">Sponserende leden</a></li>
|
||||
<li class="<%= 'is-active' if @selected == 'sponsoring-members'%>"><a href="/about/sponsorende-leden">Sponsorende leden</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
|
Loading…
Reference in a new issue