kawaiipunk/cotech-website
0
0
Fork 0
forked from autonomic-cooperative/cotech-website
Code Pull Requests Activity

First stab at realistic-looking home page

Browse Source
This commit is contained in:
James Mead
2017-07-01 13:57:10 +01:00
parent 636d1cc27f
commit a993d209ab
11 changed files with 173 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

71
_layouts/home.html Normal file
View File

@ -0,0 +1,71 @@
<!doctype html>
<html lang="en-US">
{% include head.html %}
<body>
<header>
<div data-sticky-container style="height: 82.7812px;">
<div class="top-bar sticky iss-stuck is-at-top" data-sticky data-margin-top=0>
<div class="top-bar-title">
<strong>
<a id="logo" href="https://www.coops.tech/">
<img src="https://www.coops.tech/app/themes/coop-tech-oowp-theme/public/img/CoTech-logo.png">CoTech
</a>
</strong>
<span data-responsive-toggle="responsive-menu" data-hide-for="medium"><button class="menu-icon dark" type="button" data-toggle></button></span>
</div>
<div id="responsive-menu">
<div class="top-bar-right">
<ul class="dropdown menu vertical medium-horizontal" data-magellan>
<li><a href="#members">Members</a></li>
<li><a href="#clients">Clients</a></li>
<li><a href="#services">Services</a></li>
<li><a href="#technologies">Technologies</a></li>
<li><a href="#contact" class="button">Get In Touch</a></li>
</ul>
</div>
</div>
</div>
</div>
</header>
<div class="home">
<div id="banner">
<div class="row">
<div class="small-12 columns">
<h1>Cooperative Technologists</h1>
<p>Building a tech industry that's better for its workers and customers through co-operation, democracy and worker ownership.</p>
<span>
<a id="video" data-open="video-modal"><i class="fi-play"></i>Watch video</a>
<a id="our-manifesto" href="manifesto">Our manifesto</a>
</span>
<div class="reveal large" id="video-modal" data-reveal>
<div class="flex-video widescreen">
<iframe width="420" height="315" src="https://player.vimeo.com/video/196080655" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
</div>
</div>
</div>
</div>
</div>
{{ content }}
</div>
{% include footer.html %}
<script type='text/javascript' src='{{ site.github.url }}/app/themes/coop-tech-oowp-theme/public/js/app.js?ver=4.8'></script>
<script type='text/javascript' src='{{ site.github.url }}/wp/wp-includes/js/wp-embed.min.js?ver=4.8'></script>
</body>
</html>

BIN
app/themes/coop-tech-oowp-theme/public/foundation-icons/foundation-icons.ttf Normal file
View File

Binary file not shown.

BIN
app/themes/coop-tech-oowp-theme/public/foundation-icons/foundation-icons.woff Normal file
View File

Binary file not shown.

BIN
app/themes/coop-tech-oowp-theme/public/img/banner-collage.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 327 KiB

BIN
app/themes/coop-tech-oowp-theme/public/img/icon-clients.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.6 KiB

BIN
app/themes/coop-tech-oowp-theme/public/img/icon-coops.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.0 KiB

BIN
app/themes/coop-tech-oowp-theme/public/img/icon-revenue.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.3 KiB

BIN
app/themes/coop-tech-oowp-theme/public/img/icon-staff.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.8 KiB

BIN
images/services/business-analysis.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 9.2 KiB

BIN
images/services/consultancy.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.2 KiB

123
index.html
View File

@ -1,29 +1,110 @@
---
title: CoTech
layout: home
---
<h1>CoTech</h1>
<div id="kpi">
<div class="row">
<div class="small-12 medium-10 large-8 small-centered columns">
Co-ops: {{ site.coops.size }}
<div class="small-3 columns">
<img src="app/themes/coop-tech-oowp-theme/public/img/icon-coops.png" class="float-center">
<h6>Co-ops</h6>
<h5>{{ site.coops.size }}</h5>
</div>
<div class="small-3 columns">
<img src="app/themes/coop-tech-oowp-theme/public/img/icon-staff.png" class="float-center">
<h6>Staff</h6>
<h5>159+</h5>
</div>
<div class="small-3 columns">
<img src="app/themes/coop-tech-oowp-theme/public/img/icon-revenue.png" class="float-center">
<h6>Revenue</h6>
<h5>£5.7m</h5>
</div>
<div class="small-3 columns">
<img src="app/themes/coop-tech-oowp-theme/public/img/icon-clients.png" class="float-center">
<h6>Clients</h6>
<h5>232+</h5>
</div>
<ul>
{% for coop in site.coops %}
<li>
<a href="{{ coop.url | relative_url }}">
{{ coop.name }}
</a>
</li>
{% endfor %}
</ul>
</div>
</div>
</div>
<h2>Services</h2>
<section id="members" data-magellan-target="members">
<div class="row">
<div class="small-12 columns">
<ul>
{% for service in site.services %}
<li>
<a href="{{ service.url | relative_url }}">
{{ service.name }}
</a>
</li>
{% endfor %}
</ul>
<h2>Members</h2>
<p>Take a look at who is part of the CoTech network</p>
<div class="view float-center">
<ul class="tabs" data-tabs id="coops-view-tabs">
<li class="tabs-title is-active"><a href="#grid" aria-selected="true">Grid</a></li>
<li class="separator">|</li>
<li class="tabs-title"><a href="#map">Map</a></li>
</ul>
</div>
<div class="tabs-content" data-tabs-content="coops-view-tabs">
<!-- START Grid View Content -->
<div class="tabs-panel is-active" id="grid">
<div class="row small-up-2 medium-up-4 large-up-6 small-collapse">
<div class="column">
{% for coop in site.coops %}
<a class="coop-thumb" href="{{ coop.url | relative_url }}">
<div class="coop-thumb-img has-tip tip-bottom radius" style="background-image: url(/images/coops/{{ coop.slug }}.png)" data-tooltip aria-haspopup="true" title="{{ coop.name }}"></div>
</a>
{% endfor %}
</div>
<div class="column">
<a href="join" class="coop-thumb">
<h5 id="join-us">Join CoTech</h5>
</a>
</div>
</div>
</div>
<!-- END Grid View Content -->
</div>
</div>
</div>
</section>
<section id="services" data-magellan-target="services">
<div class="row">
<div class="small-12 columns">
<h2>Services</h2>
<p>Here are the services the network are able to offer</p>
<div class="row small-up-3 medium-up-4 large-up-6 small-collapse">
{% for service in site.services %}
<div class="column">
<a href="{{ service.url | relative_url }}" class="service-thumb">
<div class="service-thumb-img float-center" style="background-image: url(/images/services/{{ service.slug }}.png)"></div>
<h5>{{ service.name }}</h5>
</a>
</div>
{% endfor %}
</div>
</div>
</section>
<section id="contact" data-magellan-target="contact">
<div class="row">
<div class="small-12 medium-6 small-centered columns">
<h2>Get In Touch</h2>
<p>
If you would like to work with us, or find out more,
<a href="mailto:contact@coops.tech">get in touch</a>.
<br/> Not sure which tech coop, or coops, are right for you? Drop us a message at
<a href="mailto:contact@coops.tech">contact@coops.tech</a>, and we will help you find the perfect match.
</p>
</div>
</div>
</section>