forked from coralproject/coralproject-site-2016
/
index.html
133 lines (122 loc) · 7.62 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
---
layout: default
---
<div class="center content-width flex justify-around items-center h3-l h3-m h2">
<div class="logo flex-auto tc">{% include logo-mozilla.svg %}</div>
<div class="logo flex-auto tc">{% include logo-nyt.svg %}</div>
<div class="logo flex-auto tc">{% include logo-wapo.svg %}</div>
<div class="logo flex-auto tc">{% include logo-knifo.svg %}</div>
</div>
<div class="flex items-center justify-center dark-bg h3">
<p class="f6-l f6-m f7 mh3 mh0-ns tc white ttu tracked">Open-source tools that make journalism better</p>
</div>
<div class="center tc flex flex-column items-center justify-center mt5-ns mt3 mh2 mh0-ns">
<h2 class="flex-auto f3 f2-ns ttu tracked coral">Newsrooms using our software</h2>
</div>
<br/><br/>
<div class="center content-width flex justify-around items-center h3-l h3-m h2">
<div class="logo flex-auto tc"><img src="images/logos/logo-univision.svg"/></div>
<div class="logo flex-auto tc"><img src="images/logos/logo-wapo-sq.svg"/></div>
<div class="logo flex-auto tc"><img src="images/logos/logo-WSJ.svg"/></div>
<div class="logo flex-auto tc"><img src="images/logos/logo-bostonglobe.svg"></div></div>
<br/><br/>
<div class="center content-width flex justify-around items-center h3-l h3-m h2">
<div class="logo flex-auto tc"><img src="images/logos/logo-civilbeat.svg"></div>
<div class="logo flex-auto tc"><img src="images/logos/logo-miamiherald.svg"></div>
<div class="logo flex-auto tc"><img src="images/logos/logo-deseret.svg"></div>
<div class="logo flex-auto tc"><img src="images/logos/logo-intercept.svg"></div>
</div>
<br/><br/>
<div class="center content-width flex justify-around items-center h3-l h3-m h2">
<div class="logo flex-auto tc"><img src="images/logos/logo-frontline-2.svg"></div>
<div class="logo flex-auto tc"><img src="images/logos/logo-ign.svg"></div>
<div class="logo flex-auto tc"><img src="images/logos/logo-staradvertiser.svg"></div>
<div class="logo flex-auto tc"><img src="images/logos/logo-newsday.svg"></div>
</div>
<br/><br/>
<div class="center content-width flex justify-around items-center h3-l h3-m h2">
<div class="logo flex-auto tc"><img src="images/logos/logo-100days.svg"></div>
<div class="logo flex-auto tc"><img src="images/logos/logo-register-guard.svg"></div>
<div class="logo flex-auto tc"><img src="images/logos/logo-brisbane.svg"/></div>
<div class="logo flex-auto tc"><img src="images/logos/logo-nationalreview.svg"/></div>
</div>
<br/><br/>
<div class="center content-width flex justify-around items-center h3-l h3-m h2">
<div class="logo flex-auto tc"><img src="images/logos/logo-rue89-3.svg"></div>
<div class="logo flex-auto tc"><img src="images/logos/logo-PRI.svg"></div>
<div class="logo flex-auto tc"><img src="images/logos/logo-nd.svg"/></div>
<div class="logo flex-auto tc"><img src="images/logos/logo-muckrock.svg"></div>
</div>
<br/><br/>
<div class="center content-width flex justify-around items-center h3-l h3-m h2">
<div class="logo flex-auto tc"><img src="images/logos/logo-wtf.svg"></div>
<div class="logo flex-auto tc"><img src="images/logos/logo-pagina12.svg"></div>
<div class="logo flex-auto tc"><img src="images/logos/logo-clickondetroit.svg"/></div>
<div class="logo flex-auto tc"><img src="images/logos/logo-estadao.svg"></div>
</div>
<br/><br/>
<div class="center content-width flex justify-around items-center h3-l h3-m h2">
<div class="logo flex-auto tc"><img src="images/logos/logo-chicagomag.svg"></div>
<div class="logo flex-auto tc"><img src="images/logos/logo-kqed.svg"></div>
<div class="logo flex-auto tc"><img src="images/logos/logo-philly.svg"></div>
<div class="logo flex-auto tc"><img src="images/logos/logo-adn.svg"></div>
</div>
<div id="products" class="coral-bg bg-cn">
<h2 class="f3 f2-ns white tc ttu tracked pt5-ns pt4">Tools</h2>
<div class="center content-width flex flex-wrap pv3">
{% for product in site.products %}
<div class="flex-100 flex-50-m flex-33 white tc h5 product-cell mb5-ns mb4">
<a href={{product.url | prepend: site.baseurl}}.html><img class="h4" src={{product.imgurl | prepend: site.baseurl}}></a>
<div class="b f3 pv2-ns pv3">{{product.title}}</div>
<div class="h3-ns b f6-ns f7 pb4-ns pb3">{{product.function}}</div>
<div class="mt3-ns mt2">
<a class="link b f6-ns f7 pa2 pa3-ns button-link" href="{{product.url | prepend: site.baseurl}}.html">Learn More</a>
</div>
</div>
{% endfor %}
</div>
</div>
<div class="center tc flex flex-column items-center justify-center mt5-ns mt3 mh2 mh0-ns">
<h2 class="flex-auto f3 f2-ns ttu tracked coral">Why use Coral?</h2>
<p class="flex-auto w-33-l w-50-m w-80 center f4 f7 mb3">Our tools are built by and for journalists, to help you work better.<br/> <br/>Our software contains no external trackers or surveillance – the only person who should own your data is you. </p>
<a class="flex-auto f5 f7 link coral-link b body-grey" href={{"about.html" | prepend: site.baseurl }}>Learn more about The Coral Project</a>
</div>
<div class="center content-width flex flex-wrap f6-ns f7 mv5-l mv5-m mv4">
{% for user in site.users %}
<div class="flex-100 flex-50-m flex-25-l tc ">
<img class="w3 h3 mt4" src = {{ user.imgurl }}>
<div class="ttu tracked f6 b mt4-ns mt3">For</div>
<div class="fw1 f2 h3-ns ">{{user.title}}</div>
<div class="f6-ns f7 mt5-l mt3 mb3">
{% for feature in user.features %}
<div class="pb2-ns pb3"><i class="icon-ok-circled check-grey" aria-hidden="true"></i>{{feature.text}}</div>
{% endfor %}
</div>
<a class="f6-ns f7 link coral-link body-grey b" href={{user.url | prepend: site.baseurl}}.html>Read more <i class="icon-right-dir body-grey pa0" aria-hidden="true"></i></a>
</div>
{% endfor %}
</div>
<div class="flex items-center justify-center dark-bg h3">
<p class="f6-l f6-m f7 mh3 mh0-ns tc white ttu tracked">Bringing communities closer to journalism</p>
</div>
<div class="center tc flex flex-column items-center justify-center mt5-ns mt3 mh2 mh0-ns">
<h2 class="coral ttu tracked f2-l f2i-m f3 ">How do I get your software?</h2>
<p class="flex-auto w-33-l w-50-m w-80 center f4 f7 mb3">All of The Coral Project’s software is free and open source. You can install it on your own servers or pay for external hosting.</p>
<a class="flex-auto f5 f7 link coral-link b body-grey" href={{"install.html" | prepend:site.baseurl}} >Read more</a>
<h2 class="coral ttu tracked f2-l f2i-m f3 pt4" id="contribute">How can I get involved?</h2>
<p class="flex-auto w-33-l w-50-m w-80 center f4 f7 mb3">We want your ideas, your requests, your experiences, your bug reports, your skills, your code.</p>
<a class="flex-auto f5 f7 link coral-link b body-grey" href={{"contribute.html" | prepend:site.baseurl}} >Join our community of contributors</a>
<br />
</p>
</div>
<div class="center tc flex flex-column items-center justify-center mt5-ns mt3 mh2 mh0-ns">
<h2 class="flex-auto f3 f2-ns ttu tracked coral">Our supporters</h2>
</div>
<div class="center content-width flex justify-around items-center h3-l h3-m h2">
<div class="logo flex-auto tc"><img src="images/mozilla-wordmark.svg"></div>
<div class="logo flex-auto tc">{% include logo-knifo.svg %}</div>
<div class="logo flex-auto tc"><img src="images/logos/sponsors/logo-democracy.svg"></div>
<div class="logo flex-auto tc"><img src="images/logos/sponsors/nii-logo.svg"></div>
<div class="logo flex-auto tc"><img src="images/logos/sponsors/logo-ritaallen.svg"></div>
</div>
<br/>