style client logos

This commit is contained in:
Aadil Ayub 2021-09-16 18:43:40 +05:00
parent 8a8f21536a
commit 0de1217f50
2 changed files with 60 additions and 33 deletions

View File

@ -272,20 +272,33 @@ footer .separator {
}
}
.cofunders{
margin-top: 2rem;
}
.who-is-involved-content {
.autonomic {
display: flex;
justify-content: space-between;
}
.cofunders p{
margin-left: 1rem;
margin-bottom: 0 !important;
}
.cofunders {
margin-top: 3rem;
p { margin-bottom: 0 !important; }
.client-logos{
margin-top: 2rem;
display: grid;
grid-template-rows: 1fr 1fr;
grid-template-columns: 1fr 1fr 1fr;
gap: 1rem;
justify-content: center;
.client-logos {
margin-top: 4rem;
display: flex;
flex-direction: column;
justify-content: center;
gap: 3rem;
.first-row{
display: grid;
grid-template-columns: 1fr 1fr 1fr;
place-items: center;
}
.second-row {
display: flex;
justify-content: center;
}
}
}
}

View File

@ -4,28 +4,42 @@
<h1 class="is-uppercase is-size-3 has-text-weight-bold">Who is involved</h1>
<hr class="hr-header has-background-white">
</div>
<div class="columns is-multiline is-tablet is-variable is-vcentered">
<div class="column is-one-quarter is-full-mobile">
<img id="autonomic-logo" alt="Autonomic Logo" width="350px" src="/svg/autonomic_logo_white.svg">
</div>
<div class="column is-half-widescreen is-two-thirds-tablet is-offset-1 is-desktop">
<p class="is-size-4 block">{{ site.Data.who_is_involved.text }}</p>
<a href="{{ site.Params.links.autonomicSite }}"><button class="button is-autonomic has-text-white is-large">visit: autonomic.zone</button></a>
</div>
<div class="columns is-multiline is-tablet is-variable is-vcentered">
<div class="who-is-involved-content">
<div class="autonomic">
<div class="column is-one-quarter is-full-mobile">
<img id="autonomic-logo" alt="Autonomic Logo" width="350px" src="/svg/autonomic_logo_white.svg">
</div>
<div class="columns is-multiline is-tablet is-variable is-vcentered cofunders">
<h2 class="is-uppercase is-size-4 has-text-weight-bold">co-funders:</h2>
<div class="column is-half-widescreen is-two-thirds-tablet is-offset-1 is-desktop">
<p class="is-size-4 block">{{ site.Data.who_is_involved.text }}</p>
<a href="{{ site.Params.links.autonomicSite }}"><button class="button is-autonomic has-text-white is-large">visit: autonomic.zone</button></a>
</div>
</div>
<div class="cofunders">
<div class="d-flex">
<h2 class="is-uppercase is-size-4 has-text-weight-bold">co-funders</h2>
<p class="is-size-4 block">Autonomic is providing Co-op Cloud hosted services for these fine folks:</p>
<div class="client-logos">
<div><a href="https://www.neuronicgames.com/"><img src='/logos/neuronic-games.png'></a></div>
<div><a href="https://www.fashionrevolution.org/"><img src='/logos/fashion-rev.svg' height="150px"></a></div>
<div><a href="https://biobulkbende.org/"><img src='/logos/biobulkbende.png'></a></div>
<div><a href="https://www.thirdsectoraccountancy.coop/"><img src='/logos/third-sector-accountancy.svg' style="height:150px;"></a></div>
<div><a href="https://anarchyrules.info/"><img src='/logos/anarchy-rules.png' style="height:150px;"></a></div>
</div>
<div class="client-logos">
<div class="first-row">
<div>
<a href="https://www.neuronicgames.com/"><img src='/logos/neuronic-games.png'></a>
</div>
<div>
<a href="https://www.fashionrevolution.org/"><img src='/logos/fashion-rev.svg' height="150px"></a>
</div>
<div>
<a href="https://biobulkbende.org/"><img src='/logos/biobulkbende.png'></a>
</div>
</div>
<div class="second-row">
<div>
<a href="https://www.thirdsectoraccountancy.coop/"><img src='/logos/third-sector-accountancy.svg' style="height:150px;"></a>
</div>
<div>
<a href="https://anarchyrules.info/"><img src='/logos/anarchy-rules.png' style="height:150px;"></a>
</div>
</div>
</div>
</div>