commit
439e397ab0
6 changed files with 233 additions and 44 deletions
|
@ -25,12 +25,15 @@ narrow_page: true
|
|||
</p>
|
||||
|
||||
<h2>The board</h2>
|
||||
|
||||
<p>
|
||||
<p id="board">
|
||||
The board is the oil in the machine and is the driving force behind the organization of events and projects.
|
||||
The Zeus WPI board for the <%= pretty_year @config[:academic_year] %> academic year is:
|
||||
</p>
|
||||
|
||||
<blockquote>
|
||||
Mail us all at: <a href='mailto:bestuur@zeus.ugent.be'>bestuur@zeus.ugent.be</a>
|
||||
</blockquote>
|
||||
|
||||
<table class="table">
|
||||
<thead>
|
||||
<tr>
|
||||
|
|
|
@ -1,49 +1,129 @@
|
|||
---
|
||||
narrow_page: true
|
||||
icon_size: 2x
|
||||
contact_links:
|
||||
- icon: facebook
|
||||
link: https://www.facebook.com/zeus.wpi/
|
||||
description: Facebook
|
||||
action: Like us
|
||||
- icon: envelope
|
||||
link: ../about#board
|
||||
description: Email
|
||||
action: Mail us
|
||||
- icon: twitter
|
||||
link: https://twitter.com/zeuswpi
|
||||
description: Twitter
|
||||
action: Follow us
|
||||
- icon: slack
|
||||
link: https://zeuswpi.slack.com/
|
||||
description: Slack
|
||||
action: Message us
|
||||
- icon: commenting
|
||||
link: irc://wina.ugent.be/#zeus
|
||||
description: irc
|
||||
action: Chat with us
|
||||
- icon: inbox
|
||||
link: http://lists.zeus.ugent.be/mailman/listinfo/leden
|
||||
description: Mailinglist
|
||||
action: Keep up to date
|
||||
- icon: github
|
||||
link: https://github.com/ZeusWPI/
|
||||
description: GitHub
|
||||
action: Fork us
|
||||
- icon: phone
|
||||
link: 'tel:+3292644751'
|
||||
description: Phone
|
||||
action: Call us
|
||||
---
|
||||
|
||||
<%= render '/partials/_about_sub_navbar.*', selected: 'contact' %>
|
||||
<h1 class="title is-1 has-text-centered">Contact</h1>
|
||||
<h1 class='title is-1 has-text-centered'>Contact us</h1>
|
||||
<h2 class='subtitle is-4 has-text-centered has-text-weight-light'>bleep bloop</h1>
|
||||
|
||||
<div class="content">
|
||||
<!-- Contact buttons -->
|
||||
<ul id='contact-icons' class='columns is-centered is-multiline'>
|
||||
<% @item[:contact_links].each do |option| %>
|
||||
<div class='column is-one-quarter-desktop is-one-third-tablet is-half-mobile'>
|
||||
<li id='<%= option[:description] %>' class='contact-circle-option'>
|
||||
<a href='<%= option[:link] %>' class='contact-circle-wrapper'>
|
||||
<div class='contact-circle is-centered'>
|
||||
<div class='contact-circle-pulse grow'></div>
|
||||
<%= fa option[:icon], size: @item[:icon_size], class: 'grow-large' %>
|
||||
</div>
|
||||
</a>
|
||||
<h4 class='contact-description is-uppercase'><%= option[:description] %></h3>
|
||||
<p class='has-text-centered'>
|
||||
<a href='<%= option[:link] %>' class='contact-text-link is-link'><%= option[:action] %></a>
|
||||
</p>
|
||||
</li>
|
||||
</div>
|
||||
<% end %>
|
||||
</ul>
|
||||
|
||||
<p>
|
||||
Zeus WPI is located in the basement of the S9 building on Campus Sterre, by it's members often named “de kelder”.
|
||||
</p>
|
||||
<!-- Extra information tiles -->
|
||||
<div id='contact-info' class='tile is-ancestor is-vertical'>
|
||||
<div class='tile is-parent'>
|
||||
<div class='tile is-parent is-vertical'>
|
||||
|
||||
<p>Reach us:</p>
|
||||
<!-- Payment information -->
|
||||
<div id='payment-info' class='tile is-child box content has-text-centered'>
|
||||
<h1 class='title has-text-centered'>Pay us</h1>
|
||||
<div class='is-divider'></div>
|
||||
<p id='banknumber' class='is-size-5'>
|
||||
BE32 9799 9370 6502
|
||||
</p>
|
||||
<a class='button' href='https://zeus.ugent.be/tab/'>
|
||||
<%= fa :euro, fw: true %> Use Tab
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
come to “de kelder” and say hi! (find us <a href="https://soleway.ugent.be/routes/4370"> here</a>).
|
||||
</li>
|
||||
<li>
|
||||
mail <a href="mailto:bestuur@zeus.ugent.be">the board</a> (bestuur@zeus.ugent.be), or some <a href="../about"> specific members </a>
|
||||
</li>
|
||||
<li>
|
||||
join our <a href="https://zeuswpi.slack.com/">Slack team</a> (by *ugent.be mail or invite)
|
||||
</li>
|
||||
<li>
|
||||
send a yellow postcard “Zeus WPI – Krijgslaan 281, S9 – 9000 Gent”
|
||||
</li>
|
||||
<li>
|
||||
keep up to date trough our <a href="http://lists.zeus.ugent.be/mailman/listinfo/leden">mailinglist</a>
|
||||
</li>
|
||||
<li>
|
||||
check out our <a href="irc://wina.ugent.be/#zeus">IRC-channel</a>
|
||||
</li>
|
||||
<li>
|
||||
call us at <a href="tel://+3292644751">09 264 4751</a> (intern: 4751)
|
||||
</li>
|
||||
<li>
|
||||
deposit at BE32 9799 9370 6502 (BIC: ARSP BE 22)
|
||||
</li>
|
||||
<li>
|
||||
follow us on Twitter: <a href="http://twitter.com/ZeusWPI">@ZeusWPI</a>
|
||||
</li>
|
||||
<li>
|
||||
like us on <a href="https://www.facebook.com/zeus.wpi">Facebook</a>
|
||||
</li>
|
||||
</ul>
|
||||
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d1156.8611760710044!2d3.7102397000000003!3d51.023149499999995!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x47c373c271502d9b%3A0x49fd54f81cafeb5f!2sZeus+WPI!5e0!3m2!1sen!2sbe!4v1481415854540" height="450" style="border:0;width:100%" allowfullscreen></iframe>
|
||||
</div>
|
||||
<!-- Calling information -->
|
||||
<div id='calling-info' class='tile is-child box content has-text-centered'>
|
||||
<h1 class='title has-text-centered'>Call us</h1>
|
||||
<div class='is-divider'></div>
|
||||
<p id='phone-number' class='is-size-5'>
|
||||
+32 92 64 47 5</br>
|
||||
Intern: 4751
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Address information -->
|
||||
<div id='address-info' class='tile is-parent'>
|
||||
<div class='tile is-child box content'>
|
||||
<h1 class='title has-text-centered'>Find us</h1>
|
||||
<div class='is-divider'></div>
|
||||
<p class='is-size-5'>
|
||||
You can find our hiding place, or what we call <strong>'de kelder'</strong> at the basement level of following address:
|
||||
</p>
|
||||
<blockquote id='address' class='is-size-5'>
|
||||
Krijgslaan 281 </br>
|
||||
Campus Sterre S9 </br>
|
||||
9000 Gent </br>
|
||||
</blockquote>
|
||||
<div id='contact-location-buttons'>
|
||||
<a class='button' href='https://www.google.com/maps/place/Zeus+WPI/@51.023115,3.7103,17z/data=!4m5!3m4!1s0x0:0x49fd54f81cafeb5f!8m2!3d51.0231149!4d3.7103?hl=en-US'>
|
||||
<%= fa :'map-marker', fw: true %> Google Maps
|
||||
</a>
|
||||
<a class='button' href='https://soleway.ugent.be/routes/4370'>
|
||||
<%= fa :'map-signs', fw: true %> Soleway
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Slack information -->
|
||||
<div id='slack-info' class='tile is-parent'>
|
||||
<div class='tile is-child box content'>
|
||||
<h1 class='title has-text-centered'>Slack info</h1>
|
||||
<div class='is-divider'></div>
|
||||
<p id='slack-info-text' class='is-size-5'>
|
||||
You can register with any <strong>*.zeus.ugent.be</strong> or even <strong>*.ugent.be</strong> email address.
|
||||
If you don't have one, try to reach us on one of our other channels and ask for an invitation.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Embedded Google Maps -->
|
||||
<iframe id='google-maps' src='https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d1156.8611760710044!2d3.7102397000000003!3d51.023149499999995!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x47c373c271502d9b%3A0x49fd54f81cafeb5f!2sZeus+WPI!5e0!3m2!1sen!2sbe!4v1481415854540' height='450' style='border:0;width:100%' allowfullscreen></iframe>
|
98
content/assets/stylesheets/includes/about.scss
Normal file
98
content/assets/stylesheets/includes/about.scss
Normal file
|
@ -0,0 +1,98 @@
|
|||
#contact-icons {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
> .column {
|
||||
max-width: 70vw;
|
||||
}
|
||||
|
||||
.contact-circle-option {
|
||||
display: block;
|
||||
max-width: 200px;
|
||||
|
||||
.contact-circle-wrapper {
|
||||
display: block;
|
||||
position: relative;
|
||||
width: 60%;
|
||||
padding-bottom: 60%;
|
||||
height: 0;
|
||||
margin: 0 auto;
|
||||
|
||||
.contact-circle-pulse {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 50%;
|
||||
border: 1px solid $secondary;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.contact-circle {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 50%;
|
||||
background-color: $secondary;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin: 0 auto;
|
||||
color: $highlighted-text-colour;
|
||||
}
|
||||
}
|
||||
|
||||
.contact-circle-wrapper:hover, .contact-circle-wrapper:focus {
|
||||
|
||||
.grow {
|
||||
transition: all .2s ease-in-out;
|
||||
-moz-transform: scale(1.2);
|
||||
-webkit-transform: scale(1.2);
|
||||
transform: scale(1.2);
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
.contact-description {
|
||||
display: block;
|
||||
text-align: center;
|
||||
margin-top: 20px;
|
||||
color: $primary;
|
||||
}
|
||||
|
||||
.contact-text-link {
|
||||
color: $text;
|
||||
border-bottom: 1px solid $secondary;
|
||||
margin-top: 7px;
|
||||
//font-size: 1.5em;
|
||||
}
|
||||
|
||||
.contact-text-link:hover {
|
||||
color: $secondary;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
#contact-info {
|
||||
h1 {
|
||||
margin-bottom: 0.3em;
|
||||
}
|
||||
|
||||
.is-divider {
|
||||
margin-bottom: 0.7em;
|
||||
margin-top: 0.7em;
|
||||
}
|
||||
|
||||
#contact-location-buttons {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.button:hover, .button:focus {
|
||||
border-color: $primary;
|
||||
}
|
||||
}
|
|
@ -174,6 +174,10 @@ footer.footer {
|
|||
}
|
||||
|
||||
.content {
|
||||
blockquote {
|
||||
border-left-color: $secondary;
|
||||
}
|
||||
|
||||
// Bold definition types in <dl></dl>
|
||||
dt {
|
||||
font-weight: bold;
|
||||
|
@ -181,9 +185,11 @@ footer.footer {
|
|||
|
||||
figure {
|
||||
position: relative;
|
||||
|
||||
img {
|
||||
display: block;
|
||||
}
|
||||
|
||||
figcaption {
|
||||
position: absolute;
|
||||
background-color: rgba(0,0,0,.7);
|
||||
|
@ -196,6 +202,7 @@ footer.footer {
|
|||
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
figcaption {
|
||||
opacity: 1;
|
||||
|
|
|
@ -24,7 +24,7 @@ a.box {
|
|||
filter: grayscale(30%);
|
||||
|
||||
.event-content {
|
||||
color: #4a4a4a;
|
||||
color: $text;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
background: rgba($tertiary, 0.2);
|
||||
|
|
|
@ -34,3 +34,4 @@ body.site {
|
|||
@import "includes/projects";
|
||||
@import "includes/navbar";
|
||||
@import "includes/search";
|
||||
@import "includes/about"
|
||||
|
|
Loading…
Reference in a new issue