Improve look of co-op logos

Before this commit the logos were a fairly garish mixture of different
colours, and many of the logos didn't work very well on a white
background.

In keeping with the new brand guidelines we've applied a greyscale
filter to the logos, and Natasha has created some variants of the
existing logos that work better on a black background. I've decided to
keep all the original logos and their variants in case we want to
switch again later, and chosen which one to used based on my taste.

This seems to improve things and we can ask co-ops to provide us with
higher res logos that work on black backgrounds later if we want to
improve things further.

Co-authored-by: Natasha Natarajan <natasha@outlandish.com>

_coops/agile-collective.md

@@ -3,6 +3,7 @@ title: Agile Collective
 name: Agile Collective
 members: 12
 website: https://agile.coop/
+logo: agile-collective.png
 email: hello@agile.coop
 twitter: AgileCollective
 github: agilecollective

_coops/animorph.md

@@ -3,6 +3,7 @@ title: Animorph
 name: Animorph
 members: 5
 website: https://www.animorph.coop
+logo: animorph-white.png
 email: we@animorph.coop
 twitter: animorphcoop
 github:

_coops/asterisk-labs.md

@@ -3,6 +3,7 @@ title: Asterisk Labs
 name: Asterisk Labs
 members: 3
 website: https://asterisk.coop/
+logo: asterisk-labs-white.png
 email: hello@asterisk.coop
 twitter: asterisk_labs
 address: 86-90 Paul Street, London, England, EC2A 4NE

_coops/autonomic.md

@@ -3,6 +3,7 @@ title: Autonomic
 name: Autonomic
 members: 12
 website: https://autonomic.zone/
+logo: autonomic-white
 email: boop@autonomic.zone
 github: https://git.autonomic.zone/
 twitter: https://sunbeam.city/@autonomic

_coops/calverts.md

@@ -3,6 +3,7 @@ title: Calverts
 name: Calverts
 members: 13
 website: http://www.calverts.coop/
+logo: calverts-white.png
 email: info@calverts.coop
 twitter: calverts_print_london
 github: calverts
@@ -73,7 +74,7 @@ Calverts is a creative design, print and production coop in Bethnal Green, east
 
 We design and produce all kinds of 2D media, from print to web, display, wayfinding and exhibition.
 
-Calverts design and reprographics studio creates and implements visual identities, brand graphics, campaigns, publications and websites. Our services range from communication strategy, design consultancy and workshops to copywriting, illustration, photography, artwork, typesetting and page makeup.  
+Calverts design and reprographics studio creates and implements visual identities, brand graphics, campaigns, publications and websites. Our services range from communication strategy, design consultancy and workshops to copywriting, illustration, photography, artwork, typesetting and page makeup.
 
 Calverts in house print includes Heidelberg offset litho, digital, large format inkjet, giclée and Risograph. We’re experts in the latest and best print technology, as well as traditional craft and special applications. We deliver, fulfill and mail out locally and across the world.
 

_coops/cbn.md

@@ -3,6 +3,7 @@ title: CBN
 name: CBN
 members: 5
 website: http://broadband.coop/
+logo: cbn-white.png
 email: info@broadband.coop
 twitter: cbn_team
 github:

_coops/cetis-llp.md

@@ -3,6 +3,7 @@ title: Cetis LLP
 name: Cetis LLP
 members: 12
 website: http://www.cetis.org.uk/
+logo: cetis-llp-white.png
 email: info@cetis.org.uk
 twitter: cetisllp
 github:

_coops/co-operative-web.md

@@ -3,6 +3,7 @@ title: Co-operative Web
 name: Co-operative Web
 members: 21
 website: http://web.coop
+logo: co-operative-web-white.png
 email: ask@web.coop
 twitter: cooperativeweb
 github: CooperativeWeb

_coops/common-knowledge.md

@@ -3,6 +3,7 @@ title: Common Knowledge
 name: Common Knowledge
 members: 4
 website: https://commonknowledge.coop/
+logo: common-knowledge-white.png
 email: hello@commonknowledge.coop
 twitter: cmmonknowledge
 github: commonknowledge

_coops/cooperative-it.md

@@ -3,10 +3,8 @@ title: Cooperative IT
 name: Cooperative IT
 members: 2
 website: https://cooperativeit.co.uk/
+logo: cooperative-it-white.png
 email: info@cooperativeit.co.uk/
-##witter: 
-#github: 
-#telephone: 
 address: 26 Myrtle Avenue, Bingley, BD16 1EW, United Kingdom
 latitude: 53.843633
 longitude: -1.835839
@@ -40,4 +38,3 @@ We have experience of looking after large multinational banking systems, small v
 We are advocates of open source software and open and transparent ways of working, which protects our customers, giving them freedom to choose their IT suppliers, and avoiding getting tied into a single vendor.
 
 As a Cooperative we're guided by the seven cooperative principles in the way we run our business and live in our communities.
-

_coops/creative-coop.md

@@ -3,6 +3,7 @@ title: Creative Coop
 name: Creative Coop
 members: 5
 website: https://creative.coop
+logo: creative-coop-white.png
 email: hello@creative.coop
 twitter:
 github:

_coops/datacontentreach.md

@@ -3,6 +3,7 @@ title: Data Content Reach
 name: Data Content Reach
 members: 3
 website: https://datacontentreach.co/
+logo: datacontentreach-white.png
 email: hello@datacontentreach.co
 telephone: '07714098369'
 address: Glossop Gasworks, Arundel Street, Glossop, SK138HZ

_coops/fractals.md

@@ -3,6 +3,7 @@ title: Fractals
 name: Fractals
 members: 4
 website: https://fractals.coop/
+logo: fractals-white.png
 email: hello@fractals.coop
 address: 17 Main Street, Ponteland, Newcastle Upon Tyne, United Kingdom, NE20 9NH
 latitude: 55.0497996

_coops/go-free-range.md

@@ -3,6 +3,7 @@ title: Go Free Range
 name: Go Free Range
 members: 4
 website: https://gofreerange.com/
+logo: go-free-range.png
 email: lets@gofreerange.com
 twitter: freerange
 github: freerange

_coops/impact-box.md

@@ -3,6 +3,7 @@ title: Impact Box
 name: Impact Box
 members: 7
 website: https://impactbox.coop/
+logo: impact-box-white.png
 email: hello@impactbox.coop
 address: Lytchett House Wareham Road, Lytchett Matravers, Poole, England, BH16 6FA
 latitude: 50.7588805

_coops/jarrow-insights.md

@@ -3,6 +3,7 @@ title: Jarrow Insights
 name: Jarrow Insights
 members: 2
 website: https://jarrow-insights.co/
+logo: jarrow-insights-white.png
 email: team@jarrow-insights.co
 address: 113-115 Fonthill Rd, Finsbury Park, London N4 3HH
 latitude: 51.564548

_coops/mc3.md

@@ -3,6 +3,7 @@ title: MC3
 name: MC3
 members: 2
 website: http://mc3.coop
+logo: mc3-white.png
 email: contact@mc3.coop
 twitter:
 github:

_coops/media-coop.md

@@ -3,6 +3,7 @@ title: media co-op
 name: media co-op
 members: 6
 website: http://mediaco-op.net/
+logo: media-coop-white.png
 email: hello@mediaco-op.net
 twitter: themediacoop.html
 github: mediaco_op.html

_coops/mediablaze-hosts.md

@@ -3,6 +3,7 @@ title: MediaBlaze Hosts
 name: MediaBlaze Hosts
 members:
 website: https://mediablazehosts.coop
+logo: mediablaze-hosts-white.png
 email: cs@mediablazehosts.coop
 twitter: MediaBlazeHosts
 github: mediablazehosts

_coops/open-ecommerce.md

@@ -3,6 +3,7 @@ title: Open-ecommerce
 name: Open-ecommerce
 members:
 website: http://open-ecommerce.org/
+logo: open-ecommerce-white.png
 email: info@open-ecommerce.org
 twitter: timeline
 github: open-ecommerce

_coops/outlandish.md

@@ -3,6 +3,7 @@ title: Outlandish
 name: Outlandish
 members: 9
 website: http://www.outlandish.com
+logo: outlandish.png
 email: hello@outlandish.com
 twitter: outlandish
 github: outlandishideas

_coops/principle_six.md

@@ -2,4 +2,5 @@
 title: Principle Six
 name: Principle Six
 email: caleb@principlesix.coop
+logo: principle_six-white.png
 ---

_coops/solidarity-economy-association.md

@@ -3,6 +3,7 @@ title: Solidarity Economy Association
 name: Solidarity Economy Association
 members: 3
 website: https://www.solidarityeconomy.coop/
+logo: solidarity-economy-association-white.png
 email: info@solidarityeconomy.coop
 twitter: solidarityecon
 address: Community Base, 113 Queens Road, Brighton, BN1 3XG

_coops/we-are-open.md

@@ -3,6 +3,7 @@ title: We Are Open Co-op
 name: We Are Open Co-op
 members: 4
 website: http://weareopen.coop/
+logo: we-are-open-white.png
 email: hello@weareopen.coop
 twitter: weareopen
 github: hello%40weareopen.html

_coops/webarchitects.md

@@ -3,6 +3,7 @@ title: Webarchitects Co-operative
 name: Webarchitects Co-operative
 members: 3
 website: https://www.webarchitects.coop/
+logo: webarchitects.png
 email: info@webarch.net
 twitter: webarchcoop
 github: webarch-coop

_layouts/coop.html

@@ -7,7 +7,7 @@
 
     <section class="slice">
       <a href="{{ page.website }}" target="_blank">
-        <img class="slice_logo" src="/images/coops/{{ page.slug }}" alt="{{ page.slug }}">
+        <img class="slice_logo" src="/images/coops/{{ page.logo }}" alt="{{ page.slug }}">
       </a>
       <h1 class="slice_title">{{ page.name }}</h1>
       <a class="slice_subtitle" href="{{ page.website }}" target="_blank">{{ page.website }}</a>

_layouts/service.html

@@ -19,7 +19,7 @@
         {% if coop.services contains page.slug %}
         <a class="logo-grid_link" href="{{ coop.url | relative_url }}">
           <div class="logo-grid_item">
-            <img class="logo-grid_img" src="/images/coops/{{ coop.slug }}" alt="{{ coop.name }}" />
+            <img class="logo-grid_img" src="/images/coops/{{ coop.logo }}" alt="{{ coop.name }}" />
           </div>
         </a>
         {% endif %}

_layouts/technology.html

@@ -19,7 +19,7 @@
       {% if coop.technologies contains page.slug %}
       <a class="logo-grid_link" href="{{ coop.url | relative_url }}">
         <div class="logo-grid_item">
-          <img class="logo-grid_img" src="/images/coops/{{ coop.slug }}" alt="{{ coop.name }}" />
+          <img class="logo-grid_img" src="/images/coops/{{ coop.logo }}" alt="{{ coop.name }}" />
         </div>
       </a>
       {% endif %}

assets/css/app.css

@@ -380,10 +380,13 @@ section.content h2 {
 }
 
 .logo-grid_item {
+  display: flex;
+  align-items: center;
+  justify-content: center;
   width: 240px;
   height: 120px;
   border: 1px solid var(--cotech-light-grey);
-  padding: var(--space-md);
+  padding: var(--space-sm);
 }
 
 .logo-grid_link {
@@ -394,6 +397,7 @@ section.content h2 {
   width: 100%;
   height: 100%;
   object-fit: contain;
+  filter: grayscale(100);
 }
 
 .logo-grid_img:hover {

index.html

@@ -47,7 +47,7 @@ layout: home
     {% for coop in site.coops %}
     <a class="logo-grid_link" href="{{ coop.url | relative_url }}">
       <div class="logo-grid_item">
-        <img class="logo-grid_img" src="/images/coops/{{ coop.slug }}" alt="{{ coop.name }}" />
+        <img class="logo-grid_img" src="/images/coops/{{ coop.logo }}" alt="{{ coop.name }}" />
       </div>
     </a>
     {% endfor %}