-
Notifications
You must be signed in to change notification settings - Fork 19
/
Copy pathlanding-page.html
260 lines (200 loc) · 13.6 KB
/
landing-page.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
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
<div class="landing-page" layout="column" layout-fill>
<landing-page-toolbar></landing-page-toolbar>
<main class="landing-page__top-content" layout="row" layout-align="center center" flex>
<div class="landing-page__form-container" layout="column">
<div class="" layout="row">
<img class="landing-page__logo" ng-src="/img/logo_inline.svg" alt=""/>
<em class="landing-page__beta">beta</em>
</div>
<h1 class="landing-page__form-header" id="createGroup">Collaborative funding made easy</h1>
<!-- <h2 class="landing-page__form-subheader">Cobudget helps groups allocate funds</h2> -->
<form class="landing-page__take-tour">
<div class="landing-page__input-container">
<md-button class="md-raised md-primary landing-page__tour-btn" ng-click="scrollTo('tour')">take tour</md-button>
</div>
</form>
</div>
<div class="landing-page__mobile-preview">
<img class="landing-page__smartphone-img" src="./img/landing_laptop.png" alt="">
</div>
</main>
<h1 class="landing-page__about-section-header-second-text hide-sm hide-xs">Cobudget makes it easy for organizations and groups<br> to allocate funds collaboratively and transparently.</h1>
<h1 class="landing-page__about-section-header-second-text hide-md hide-lg">Cobudget makes it easy for organizations and groups to allocate funds collaboratively and transparently.</h1>
<form novalidate name="emailForm" class="landing-page__form" ng-submit="emailForm.$valid && startGroup()">
<div class="landing-page__input-container">
<input required class="landing-page__email-field" type="email" name="email" placeholder="Email Address" ng-model="formData.email">
<md-button class="md-raised md-primary landing-page__submit-btn" type="submit">create group</md-button>
<div ng-if="emailForm.email.$error.required && emailForm.$submitted" class="landing-page__input-error">Email is required.</div>
<div ng-if="emailForm.email.$error.email && emailForm.$submitted" class="landing-page__input-error">Email address must be valid.</div>
</div>
<p class="landing-page__signin-text">Already joined a Cobudget group? <a ng-click="redirectToLoginPage()">Log in</a></p>
<!-- <a ng-if="false" class="landing-page__virtual-tour-link" ng-click="openVirtualTourDialog()" href="">or take a virtual tour</a> -->
</form>
<div class="landing-page__about-section">
<h1 class="landing-page__resources-section-header-text">What is Cobudget?</h1>
<div class="landing-page__about-section-content" layout="column" flex>
<div layout-gt-sm="row" layout-align="start start">
<img class="landing-page__about-section-img" src="/img/how-cobudget-works.png" />
<div>
<!-- <p class="landing-page__about-section-subheader-text"><b>Cobudget</b> helps organisations and groups allocate funds <b>collaboratively and transparently</b>.</p> -->
<p class="landing-page__about-section-subheader-text landing-page__about-section-subheader-text-starting">
Cobudget is a tool and a methodology that makes resource allocation participatory. It enables all members of an organization to get involved in decision-making by proposing projects and allocating funds to the proposals they like.
</p>
</div>
</div>
<div layout="row" layout-align="center center" class="landing-page__about-section-video" id="tour">
<iframe width="630" height="394" loading="lazy" src="https://www.loom.com/embed/418dd9460b6a43ce9fb0227cd8efcf13" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
</div>
<div layout="row" layout-align="center center">
<a href="https://guide.cobudget.co/" target="_blank">
<md-button class="md-raised md-primary landing-page__about-section-btn">tell me more</md-button>
</a>
</div>
<div flex></div>
</div>
</div>
<div class="landing-page__how-section" id="pricing">
<h1 class="landing-page__resources-section-header-text">Pricing</h1>
<h1 class="landing-page__about-section-header-second-text">You only pay for Cobudget when it’s bringing you value.</h1>
<div class="landing-page__how-section-content" flex>
<div layout-gt-sm="row" layout-align="start start">
<!-- <img class="landing-page__how-section-img" src="/img/services_fran.jpg" /> -->
<div class="landing-page__how-section-free-container" layout="column">
<div class="landing-page__how-section-free-header">
<h1 class="landing-page__how-section-header">Explore</h1>
<p class="landing-page__how-section-header-info">For evaluating the software</p>
<h2 class="landing-page__how-section-header-price">FREE</h2>
<md-input-container class="md-block">
<md-button class="md-raised md-primary landing-page__how-section-free-price-cta" ng-click="createGroupDialog()">create group</md-button>
</md-input-container>
</div>
<div class="landing-page__how-section-price-body">
<p><ng-md-icon icon="done" size="12"></ng-md-icon>
Unlimited users</p>
<p><ng-md-icon icon="done" size="12"></ng-md-icon>
All basic Cobudget features</p>
<p><ng-md-icon icon="done" size="12"></ng-md-icon>
Up to 5 completed budgets (buckets)</p>
<p><ng-md-icon icon="done" size="12"></ng-md-icon>
Access to our open source resources</p>
</div>
</div>
<div class="landing-page__how-section-paid-container" layout="column">
<div class="landing-page__how-section-paid-header">
<h1 class="landing-page__how-section-header">Take Off</h1>
<p class="landing-page__how-section-header-info">To ramp up your Cobudgeting</p>
<h2 class="landing-page__how-section-header-price">49,99 €/month <br>
<small class="landing-page__how-section-header-price-sub">per group or 500 € per year</small>
</h2>
<md-input-container class="md-block">
<md-button class="md-raised md-primary landing-page__how-section-paid-price-cta" ng-click="createGroupDialog()">create group</md-button>
</md-input-container>
</div>
<div class="landing-page__how-section-price-body">
<p class="landing-page__how-section-price-body-header">Everything in EXPLORE, and:</p>
<p><ng-md-icon icon="done" size="12"></ng-md-icon>
Unlimited completed budgets (buckets)</p>
<p><ng-md-icon icon="done" size="12"></ng-md-icon>
Individual support</p>
<p><ng-md-icon icon="done" size="12"></ng-md-icon>
1 hour support session with a Cobudget expert</p>
<p><ng-md-icon icon="done" size="12"></ng-md-icon>
Access to our curated Community of Practice</p>
</div>
</div>
<div class="landing-page__how-section-enterprise-container" layout="column">
<div class="landing-page__how-section-enterprise-header">
<h1 class="landing-page__how-section-header">Let's Talk</h1>
<p class="landing-page__how-section-header-info">Cobudget with expert support</p>
<h2 class="landing-page__how-section-header-price">CUSTOM</h2>
<md-input-container class="md-block">
<md-button class="md-raised md-primary landing-page__how-section-enterprise-price-cta" ng-click="redirectToServicesPage()">learn more</md-button>
</md-input-container>
</div>
<div class="landing-page__how-section-price-body">
<p class="landing-page__how-section-price-body-header">Everything in TAKE OFF, and:</p>
<p><ng-md-icon icon="done" size="12"></ng-md-icon>
Setup, onboarding assistance & user training</p>
<p><ng-md-icon icon="done" size="12"></ng-md-icon>
Tailored support materials</p>
<p><ng-md-icon icon="done" size="12"></ng-md-icon>
Innovation process diagnostic</p>
<p><ng-md-icon icon="done" size="12"></ng-md-icon>
Governance consulting</p>
<p><ng-md-icon icon="done" size="12"></ng-md-icon>
Ongoing support & facilitation</p>
<p><ng-md-icon icon="done" size="12"></ng-md-icon>
Custom Development</p>
<p><ng-md-icon icon="done" size="12"></ng-md-icon>
Usage Analytics</p>
</div>
</div>
<!-- <div>
<p class="landing-page__about-section-subheader-text landing-page__about-section-subheader-text-starting">
The <b>Greaterthan</b> team offers services to help you get started with Cobudget and optimize it for your needs. We cater to all types of organizations, from emerging networks, to cooperatives, to corporates.
</p>
</div> -->
</div>
<div flex></div>
</div>
</div>
<div class="landing-page__resources-section" id="studies">
<h1 class="landing-page__resources-section-header-text">Organizations Using Cobudget</h1>
<div class="landing-page__resources-section-content" layout="column" flex>
<div layout="row" layout-align="start start">
<img class="landing-page__resources-section-img-1" loading="lazy" src="/img/outlandish1.jpg" />
<div>
<h1 class="landing-page__resources-section-subheader-text"><a href="https://medium.com/greaterthanworks/investing-surplus-for-impact-cobudgeting-at-outlandish-efa9890d0d4f" target="_blank">Outlandish</a></h1>
<p class="landing-page__resources-section-text">Outlandish is a web services consultancy and worker-owned cooperative.</p>
<p class="landing-page__resources-section-text"><b>How do they use Cobudget?</b></p>
<p class="landing-page__resources-section-text">To democratically distribute their dividends to everyone in the organization and make it easy for them to invest in work they care about.</p>
<p class="landing-page__resources-section-text"><b>What type of activities do they fund?</b></p>
<p class="landing-page__resources-section-text">New tech products and platforms, social impact projects in need of software and political activism.</p>
</div>
</div>
<div flex></div>
<div layout="row" layout-align="start start" class="landing-page__resources-section-testimonial">
<img class="landing-page__resources-section-testimonial-img" src="/img/testimonial-brian.jpg" />
<blockquote class="landing-page__resources-section-text landing-page__resources-section-text-blockquote">
Pre-Cobudget, there was a lack of transparency and the authority to spend surplus was limited.
<br><cite>- Brian Spurling, Outlandish Collaborator</cite>
</blockquote>
</div>
</div>
<div class="landing-page__resources-section-content" layout="column" flex>
<div layout="row" layout-align="start start">
<div>
<h1 class="landing-page__resources-section-subheader-text"><a href="https://medium.com/greaterthanworks/cobudgeting-for-member-engagement-bd1c54ed434" target="_blank">Institute for Evolutionary Leadership</a></h1>
<p class="landing-page__resources-section-text">IEL is a consulting company and community of thought leaders working towards a more just, sustainable, and flourishing world.</p>
<p class="landing-page__resources-section-text"><b>How do they use Cobudget?</b></p>
<p class="landing-page__resources-section-text">To offer their member community a way to participate directly in the organization's financial decisions and empower them to fund each others workshops.</p>
<p class="landing-page__resources-section-text"><b>What type of activities do they fund?</b></p>
<p class="landing-page__resources-section-text">Events such as workshops and trainings, travel expenses and systemic change work.</p>
</div>
<img class="landing-page__resources-section-img-2" loading="lazy" src="/img/evoleadership1.jpg" />
</div>
<div flex></div>
<div layout="row" layout-align="start start" class="landing-page__resources-section-testimonial">
<img class="landing-page__resources-section-testimonial-img" src="/img/testimonial-fedor.jpg" />
<blockquote class="landing-page__resources-section-text landing-page__resources-section-text-blockquote">
This technology is an enabler of new ways of doing things. Without it we would be using ugly spreadsheets.
<br><cite>- Fyodor Ovchinnikov, Co-Founder IEL</cite>
</blockquote>
</div>
</div>
<div layout="row" layout-align="center center">
<a href="https://guide.cobudget.co/case-studies" target="_blank">
<md-button class="md-raised md-primary landing-page__resources-section-btn">more case studies</md-button>
</a>
</div>
</div>
<div class="landing-page__greaterthan-section">
<div class="landing-page__greaterthan-section-content" layout="column" layout-align="center center">
<a href="http://greaterthan.works/" target="_blank"><img class="landing-page__about-section-img-greaterthan" src="/img/LOGO-HORIZONTAL_B.png" /></a>
<div>
<p class="landing-page__about-section-subheader-text landing-page__about-section-subheader-text-greaterthan"><b>Cobudget</b> is the flagship product of <a href="http://greaterthan.works/" target="_blank">Greaterthan</a>. We are a venture with the mission to provide digital tools and practices for next generation organizations to collaboratively manage money and resources.</p>
</div>
</div>
</div>
<landing-page-footer></landing-page-footer>
</div>