continue detail page
This commit is contained in:
ajuvercr
parent
6d0d10fea0
commit
980af43fd4
6 changed files with 128 additions and 73 deletions
|
Before Width: | Height: | Size: 2.2 KiB After Width: | Height: | Size: 2.2 KiB |
|
Before Width: | Height: | Size: 2 KiB After Width: | Height: | Size: 2 KiB |
|
|
@ -7,6 +7,7 @@ konvent: wvk
|
|||
website: https://wvk.ugent.be/
|
||||
contact: wvk@student.ugent.be
|
||||
---
|
||||
|
||||
Het WVK groepeert alle maatschappelijk-sociaal geïnspireerde studentenverenigingen en alle wetenschappelijke werkgroepen. Als konvent organiseert het WVK zelf (in tegenstelling tot sommige andere konventen) geen eigen activiteiten, maar richt het zich volledig op het samenbrengen en verdedigen van de belangen van de maatschappelijke verenigingen en wetenschappelijke werkgroepen aan de Universiteit Gent.
|
||||
|
||||
<iframe src="https://www.facebook.com/plugins/video.php?href=https%3A%2F%2Fwww.facebook.com%2Fwvkcentraal%2Fvideos%2F795092330635099%2F&show_text=0&width=560" width="560" height="315" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowTransparency="true" allowFullScreen="true"></iframe>
|
||||
<iframe src="https://www.facebook.com/plugins/video.php?href=https%3A%2F%2Fwww.facebook.com%2Fwvkcentraal%2Fvideos%2F795092330635099%2F&show_text=0&width=560" width="560" height="315" style="border:none;overflow:hidden; margin: auto;" scrolling="no" frameborder="0" allowTransparency="true" allowFullScreen="true"></iframe>
|
||||
|
|
|
|||
|
|
@ -110,8 +110,9 @@ footer {
|
|||
font-weight: bolder;
|
||||
}
|
||||
|
||||
.hidden{
|
||||
display: none;}
|
||||
.hidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.nav-link svg {
|
||||
width: 2rem;
|
||||
|
|
@ -239,7 +240,6 @@ header {
|
|||
background-color: var(--lightCyan);
|
||||
}
|
||||
|
||||
|
||||
h2 {
|
||||
font-family: futura, Avenir Next, Verdana, Geneva, Tahoma, sans-serif;
|
||||
font-size: 2.8rem;
|
||||
|
|
@ -542,7 +542,7 @@ fieldset p label input {
|
|||
opacity: 1;
|
||||
}
|
||||
|
||||
.title_link{
|
||||
.title_link {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
|
|
@ -598,117 +598,150 @@ fieldset p label input {
|
|||
min-width: 400px;
|
||||
}
|
||||
|
||||
.details-logo>img{
|
||||
.details-logo > img {
|
||||
width: 100px;
|
||||
}
|
||||
|
||||
.details-logo{
|
||||
.details-logo {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.detail_title{
|
||||
.detail_title {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
gap: 12px;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.social>a {
|
||||
.detail_title h2 {
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.social > a {
|
||||
display: block;
|
||||
background-size: 50px;
|
||||
background-repeat: no-repeat;
|
||||
background-position: top center;
|
||||
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
}
|
||||
|
||||
.social>a>.link{
|
||||
.social > a > .link {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.social>a>p{
|
||||
.social > a > p {
|
||||
padding-top: 65px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.social-facebook>a{
|
||||
.social-facebook > a {
|
||||
background-image: url(/assets/social/facebook_small.png);
|
||||
}
|
||||
|
||||
.social-instagram>a{
|
||||
.social-instagram > a {
|
||||
background-image: url(/assets/social/instagram_small.png);
|
||||
}
|
||||
|
||||
.social-twitter>a{
|
||||
.social-twitter > a {
|
||||
background-image: url(/assets/social/twitter_small.png);
|
||||
}
|
||||
|
||||
.social-youtube>a{
|
||||
.social-youtube > a {
|
||||
background-image: url(/assets/social/youtube_small.png);
|
||||
}
|
||||
|
||||
.social-tiktok>a{
|
||||
.social-tiktok > a {
|
||||
background-image: url(/assets/social/tiktok_small.png);
|
||||
}
|
||||
|
||||
.social-linkedin>a{
|
||||
.social-linkedin > a {
|
||||
background-image: url(/assets/social/linkedIn_small.png);
|
||||
}
|
||||
|
||||
.social-fetlife>a{
|
||||
.social-fetlife > a {
|
||||
background-image: url(/assets/social/fetLife_small.png);
|
||||
}
|
||||
|
||||
.social-container>ul{
|
||||
.social-container > ul {
|
||||
list-style: none;
|
||||
display: flex;
|
||||
padding: 0;
|
||||
gap: 1rem;
|
||||
/* gap: 0.5rem; */
|
||||
margin: auto;
|
||||
justify-content: space-around;
|
||||
}
|
||||
|
||||
.vereniging_themas{
|
||||
.detail-body {
|
||||
margin: auto;
|
||||
max-width: 1200px;
|
||||
padding: 2rem 10%;
|
||||
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.social {
|
||||
width: 52px;
|
||||
height: 52px;
|
||||
}
|
||||
|
||||
.social > img {
|
||||
width: 52px;
|
||||
height: 52px;
|
||||
}
|
||||
|
||||
.social + .social {
|
||||
margin-left: 20px;
|
||||
}
|
||||
|
||||
.vereniging_themas {
|
||||
list-style: none;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 0 3rem;
|
||||
padding: 0;
|
||||
}
|
||||
.vereniging_thema{
|
||||
/* .vereniging_thema {
|
||||
width: 4rem;
|
||||
height: 4rem;
|
||||
margin: 0 1rem 0 0;
|
||||
}
|
||||
} */
|
||||
|
||||
.vereniging_thema>a>svg:hover{
|
||||
.vereniging_thema > a > svg:hover {
|
||||
transform: scale(1.2);
|
||||
transform-origin: center center;
|
||||
transition: all 150ms ease;
|
||||
}
|
||||
|
||||
.vereniging_thema>a>svg{
|
||||
.vereniging_thema > a > svg {
|
||||
fill: #013e7a;
|
||||
width: 3rem;
|
||||
height: 3rem;
|
||||
}
|
||||
|
||||
footer{
|
||||
footer {
|
||||
padding-top: 1rem;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.showcase-image>img{
|
||||
.showcase-image > img {
|
||||
flex-grow: 3;
|
||||
height: 30rem;
|
||||
max-width: 80vw;
|
||||
}
|
||||
|
||||
.showcase-container{
|
||||
.showcase-container {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
|
||||
@media only screen and (max-width: 600px) {
|
||||
.tile-grid {
|
||||
grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
|
||||
|
|
@ -720,3 +753,27 @@ footer{
|
|||
grid-template-columns: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.detail-content {
|
||||
max-width: 1100px;
|
||||
}
|
||||
|
||||
.details-contact {
|
||||
padding: 1rem;
|
||||
float: right;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 700px) {
|
||||
.details-contact {
|
||||
float: none;
|
||||
width: 300px;
|
||||
padding-bottom: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 600px) {
|
||||
.detail-body {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -7,9 +7,10 @@ konvent: fk
|
|||
website: https://www.vlaamsebiomedischekring.be/
|
||||
contact: vbkgent@gmail.com
|
||||
social:
|
||||
- plaform: facebook
|
||||
- platform: facebook
|
||||
link: https://www.facebook.com/vlaamsebiomedischekring/
|
||||
themas:
|
||||
- faculteit
|
||||
---
|
||||
|
||||
V.B.K. simply the best! Voor alle studenten Biomedische wetenschappen organiseren wij tal van beestelijke feestjes in de Point Final, tevens ons kringcafe waar tal van promo's doorgaan. Ook hebben wij ons zalige galabal samen met VLAK. Naast feestjes doen we ook toffe sportactiviteiten, cultuuractiviteiten enz. Met ons zal je de leukste studententijd tegemoet gaan, twijfel dus niet om lid te worden van onze familie, je zal er zeker geen spijt van hebben!
|
||||
|
|
|
|||
|
|
@ -1,45 +1,41 @@
|
|||
<div class="details-container details-logo">
|
||||
<div class="detail-body">
|
||||
<div class="details-contact">
|
||||
<%if item[:deelname_link] || item[:contact] || item[:website]%>
|
||||
<h3>Contact</h3>
|
||||
<% if item[:deelname_link] %><a href="<%= item[:deelname_link] %>"><%= item[:deelname_link] %></a><% end %>
|
||||
<div class="contact-container">
|
||||
<% if item[:contact] %><p>Email-adres: <a href="<%= item[:contact] %>"><%= item[:contact] %></a></p><%end%>
|
||||
<% if item[:website] %><p>Website: <a href="<%= item[:website] %>"><%= item[:website] %></a></p><%end%>
|
||||
</div><%end%>
|
||||
<% if item[:social] %>
|
||||
<div class="social-container">
|
||||
<h4>Sociale media</h4>
|
||||
<ul>
|
||||
<% for social in item[:social] %>
|
||||
<a class="social" href="<%= social[:link] %>">
|
||||
<img src="/assets/social/<%= social[:platform].downcase %>_small.png">
|
||||
</a>
|
||||
<% end %>
|
||||
</ul>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
<div class="detail_title">
|
||||
<a target="_blank" href="<%= item[:website] %>"><img src="https://dsa.ugent.be/api/verenigingen/<%= abbreviation(item) %>/logo?size=small" alt="<%= item[:naam] %>"></a>
|
||||
</div>
|
||||
<div class="detail_title">
|
||||
<a class="title_link" target="_blank" href="<%= item[:website] %>"><h2>
|
||||
<%= item[:naam] %>
|
||||
</h2></a>
|
||||
<h2><%= item[:naam] %></h2>
|
||||
<% if item[:themas] %>
|
||||
<ul class="vereniging_themas">
|
||||
<% for thema in item[:themas] %>
|
||||
<li>
|
||||
<div class="vereniging_thema">
|
||||
<a href="/themas/<%= thema %>.html">
|
||||
<%= @items["/assets/themas_icon/"+thema+".svg"].compiled_content %>
|
||||
</a>
|
||||
</div>
|
||||
</li>
|
||||
<% end %>
|
||||
</ul>
|
||||
<% end %>
|
||||
</div>
|
||||
<div class="details-container details-contact">
|
||||
<h3>contact</h3>
|
||||
<% if item[:deelname_link] %>
|
||||
<a href="<%= item[:deelname_link] %>"><%= item[:deelname_link] %></a>
|
||||
<% end %>
|
||||
<div class="contact-container">
|
||||
<p>Email-adres: <a href="<%= item[:contact] %>"><%= item[:contact] %></a></p>
|
||||
<p>Website: <a href="<%= item[:website] %>"><%= item[:website] %></a></p>
|
||||
</div>
|
||||
<% if item[:social] %>
|
||||
<div class="social-container">
|
||||
<h4>sociale media</h4>
|
||||
<ul>
|
||||
<% for social in item[:social] %>
|
||||
<li class="social social-<%= social[:platform] %>">
|
||||
<a href="<%= social[:link] %>"><p class="link"><%= social[:link] %></p><p><%= social[:platform] %></p></a>
|
||||
</li>
|
||||
<% end %>
|
||||
</ul>
|
||||
<div class="detail-content">
|
||||
<%= yield%>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
<div class="details-container details-photo">
|
||||
<div class="showcase-container">
|
||||
|
|
@ -65,7 +61,7 @@
|
|||
<% if item.path.include? "konventen" %>
|
||||
<% for vereniging in verenigingen_voor_konvent(item[:id]) %>
|
||||
<div>
|
||||
<%= vereniging[:naam] %>
|
||||
<%= render '/partials/pretty_link.*', item: vereniging %>
|
||||
</div>
|
||||
<% end %>
|
||||
<% end %>
|
||||
Loading…
Reference in a new issue