autonomic-cooperative/cotech-website
4
0
Fork 2
mirror of https://git.coop/cotech/website.git synced 2025-06-26 16:40:52 +00:00
Code Issues Releases Wiki Activity

Style metadata slice

Browse Source
This commit is contained in:
Chris Lowis
2025-06-20 15:15:59 +01:00
parent c320a15887
commit 33db3c91c7
2 changed files with 65 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
assets/css/app.css
View File

@ -23,13 +23,15 @@
--space-xxl: calc(5.25 * var(--space-unit)); --space-xxl: calc(5.25 * var(--space-unit));
--cotech-white: white; --cotech-white: white;
--cotech-grey: #1e2637; --cotech-light-grey: #f7f7f5;
--cotech-grey: #7b8290;
--cotech-dark-grey: #1e2637;
--cotech-blue: #38aad5; --cotech-blue: #38aad5;
} }
p, li, a { p, li, a {
font-family: "open_sansregular", "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif; font-family: "open_sansregular", "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
color: var(--cotech-grey); color: var(--cotech-dark-grey);
} }
h1, h2, h3, h4, h5, h6 { h1, h2, h3, h4, h5, h6 {
@ -103,3 +105,41 @@ h1, h2, h3, h4, h5, h6 {
.hero_button a { .hero_button a {
color: var(--cotech-white); color: var(--cotech-white);
} }
.slice {
width: 100%;
padding: var(--space-lg);
display: flex;
flex-direction: column;
align-items: center;
gap: var(--space-sm);
text-align: center;
}
.slice--light-grey {
background-color: var(--cotech-light-grey);
}
.metadata {
display: flex;
gap: var(--space-xl);
}
.metadata_item {
display: flex;
flex-direction: column;
align-items: center;
}
.metadata_heading {
font-family: "open_sansregular", "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
text-transform: uppercase;
color: var(--cotech-grey);
font-size: 0.95rem;
letter-spacing: 0.02em;
}
.metadata_value {
font-size: 2.2rem;
letter-spacing: 0.02em;
}

44
index.html
View File

@ -3,33 +3,35 @@ title: CoTech
layout: home layout: home
--- ---
<section> <section class="slice slice--light-grey">
<div> <div class="metadata">
<h6>Co-ops</h6> <div class="metadata_item">
<h5>{{ site.coops.size }}</h5> <h6 class="metadata_heading">Co-ops</h6>
</div> <h5 class="metadata_value">{{ site.coops.size }}</h5>
</div>
<div> <div class="metadata_item">
<h6>Staff</h6> <h6 class="metadata_heading">Staff</h6>
{% assign total_members = 0 %} {% assign total_members = 0 %}
{% for coop in site.coops %} {% for coop in site.coops %}
{% assign total_members = total_members | plus: coop.members %} {% assign total_members = total_members | plus: coop.members %}
{% endfor %} {% endfor %}
<h5>{{ total_members }}+</h5> <h5 class="metadata_value">{{ total_members }}+</h5>
</div> </div>
<div> <div class="metadata_item">
<h6>Revenue</h6> <h6 class="metadata_heading">Revenue</h6>
<h5>£10.3m</h5> <h5 class="metadata_value">£10.3m</h5>
</div> </div>
<div> <div class="metadata_item">
<h6>Clients</h6> <h6 class="metadata_heading">Clients</h6>
<h5>{{ site.clients.size }}+</h5> <h5 class="metadata_value">{{ site.clients.size }}+</h5>
</div>
</div> </div>
</section> </section>
<section> <section class="slice slice--light-grey">
<p>Co-tech is a network of ethical tech, digital and creative co-operatives.</p> <p>Co-tech is a network of ethical tech, digital and creative co-operatives.</p>
<p>We're part of <a href="https://www.workers.coop">workers.coop</a>, <a href="/join">join us!</a></p> <p>We're part of <a href="https://www.workers.coop">workers.coop</a>, <a href="/join">join us!</a></p>
<p>Working with co-operatives has major benefits: you’ll work directly with the people who own the business, who have a stake in making sure your project succeeds. With no private shareholders drawing out dividends, you’ll get genuine value for money. And on top of that, you’ll get the benefit of working with small and responsive businesses which draw on the skills, specialisms and security of a large network.</p> <p>Working with co-operatives has major benefits: you’ll work directly with the people who own the business, who have a stake in making sure your project succeeds. With no private shareholders drawing out dividends, you’ll get genuine value for money. And on top of that, you’ll get the benefit of working with small and responsive businesses which draw on the skills, specialisms and security of a large network.</p>