centering issue contact page

This commit is contained in:
Lorin Werthen 2021-03-20 10:15:00 +01:00
parent c651c6d4be
commit bc855375e4
No known key found for this signature in database
GPG key ID: F11FFC921E0E08E0
2 changed files with 9 additions and 14 deletions

View file

@ -66,20 +66,13 @@ table.board-table {
} }
#contact-icons { #contact-icons {
display: flex;
justify-content: center;
align-items: center;
margin-left: 0;
margin-top: 0;
> .column { > .column {
max-width: 70vw; max-width: 40vw;
} }
.contact-circle-option { .contact-circle-option {
display: block; //display: block;
max-width: 200px; //max-width: 200px;
.contact-circle-wrapper { .contact-circle-wrapper {
display: block; display: block;

View file

@ -47,9 +47,10 @@ contact_links:
<h2 class='subtitle is-4 has-text-centered has-text-weight-light'>bleep bloop</h2> <h2 class='subtitle is-4 has-text-centered has-text-weight-light'>bleep bloop</h2>
<!-- Contact buttons --> <!-- Contact buttons -->
<ul id='contact-icons' class='columns is-centered is-multiline'> <div id='contact-icons' class='columns is-centered is-multiline is-mobile'>
<% @item[:contact_links].each do |option| %> <% @item[:contact_links].each do |option| %>
<li id='<%= option[:description] %>' class='contact-circle-option column is-one-quarter-desktop is-one-third-tablet is-half-mobile'> <div class='column is-one-quarter-desktop is-one-third-tablet is-half-mobile'>
<div id='<%= option[:description] %>' class='contact-circle-option'>
<a href='<%= option[:link] %>' class='contact-circle-wrapper'> <a href='<%= option[:link] %>' class='contact-circle-wrapper'>
<div class='contact-circle is-centered'> <div class='contact-circle is-centered'>
<div class='contact-circle-pulse grow'></div> <div class='contact-circle-pulse grow'></div>
@ -60,9 +61,10 @@ contact_links:
<p class='has-text-centered'> <p class='has-text-centered'>
<a href='<%= option[:link] %>' class='contact-text-link is-link'><%= option[:action] %></a> <a href='<%= option[:link] %>' class='contact-text-link is-link'><%= option[:action] %></a>
</p> </p>
</li> </div>
</div>
<% end %> <% end %>
</ul> </div>
<div id="board"> <div id="board">
<h2>The board (<%= pretty_year @config[:academic_year] %>)</h2> <h2>The board (<%= pretty_year @config[:academic_year] %>)</h2>