midgard/zeus.ugent.be
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

Designed the 'Sponserende Leden' page

Browse source
This commit is contained in:
kindtanton 2019-11-05 20:05:42 +01:00
parent 8f6eee34cc
commit 69c7b45eb8
2 changed files with 61 additions and 16 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

23
content/about/sponserende_leden.erb
View file

@ -7,7 +7,7 @@ narrow_page: true
<div id='sponsoring_members' class="content">
<% current_sponsoring_members.each do |member| %>
<div id="<%= member[:nickname] %>" class="box">
<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] %>
@ -21,22 +21,21 @@ narrow_page: true
</div>
</div>
<% end %>
<p class="name"><%= member[:name] %></p>
<p class="username">(<%= member[:nickname] %>)</p>
</div>
<div class="column">
<span style="margin-bottom:0" class="title"><%= member[:name] %></span>
<span class="subtitle">
(<%= member[:nickname] %>)
</span>
<div class="text_wrapper">
<div class="column text_data">
<div>
<i>
-
<%= member[:quote] %>
<i class="quote">
"<%= member[:quote] %>"
</i>
</div>
<blockquote style="margin-top: 0.5em">
<div class="description_text" style="margin-top: 0.5em">
<%= member[:description] %>
</blockquote>
<div class="columns">
</div>
</div>
<div class="columns links">
<% if member[:github] %>
<a style="padding: 5px" class="social-icon" href="https://github.com/<%= member[:github] %>" target="_blank">
<span class="icon">

54
content/assets/stylesheets/includes/about.scss
View file

@ -152,11 +152,57 @@
}
}
.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;
}
.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: 10vw;
height: 10vw;
min-width: 100px;
min-height: 100px;
width: 8rem;
height: 8rem;
margin-left: auto;
margin-right: auto;
display: flex;