decentral1se
870d09a746
All checks were successful
continuous-integration/drone/push Build is passing
649 lines
24 KiB
HTML
649 lines
24 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta
|
|
name="viewport"
|
|
content="width=device-width, initial-scale=1.0, maximum-scale=1.0"
|
|
/>
|
|
<link rel="shortcut icon" type="image/png" href="img/favicon.ico" />
|
|
<meta name="og:type" content="website" />
|
|
<meta name="twitter:card" content="photo" />
|
|
<link rel="stylesheet" type="text/css" href="css/mobile.css" />
|
|
<style></style>
|
|
<link rel="stylesheet" type="text/css" href="css/styleguide.css" />
|
|
<link rel="stylesheet" type="text/css" href="css/globals.css" />
|
|
<meta name="author" content="Servers.coop" />
|
|
<title>Servers.coop</title>
|
|
</head>
|
|
<body style="margin: 0; background: #ffffff;">
|
|
<input type="hidden" id="anPageName" name="page" value="mobile" />
|
|
<div class="container-center-horizontal">
|
|
<div class="desktop screen">
|
|
<div class="header">
|
|
<div class="overlap-group-1">
|
|
<img class="hero-tilt" src="img/hero-tilt@1x.svg" />
|
|
<div class="group-24">
|
|
<div class="flex-row">
|
|
<img class="brand bp3-animate-enter" src="img/logonew.svg" />
|
|
<div class="menu bp3-animate-enter1">
|
|
<div class="about liberationmono-bold-black-18px">
|
|
<a
|
|
href="#reclaim-hosting"
|
|
class="liberationmono-bold-black-18px"
|
|
>ABOUT</a
|
|
>
|
|
</div>
|
|
<div class="support liberationmono-bold-black-18px">
|
|
<a
|
|
href="#joint-mission"
|
|
class="liberationmono-bold-black-18px"
|
|
>PARTNERS</a
|
|
>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="overlap-group2">
|
|
<div class="overlap-group1">
|
|
<h1 class="hero-text liberationsans-bold-jade-48px">
|
|
The recipe for self-managed co-operative computing
|
|
</h1>
|
|
<div class="hero-text-1 liberationsans-bold-black-18px">
|
|
Servers.coop is an algorithm for co-operation: a technical,
|
|
governance, and cost-sharing stack which radically reduces
|
|
the cost and complexity of setting up a server hosting
|
|
provider.
|
|
</div>
|
|
<img class="stack4" src="img/stack4.svg" /><img
|
|
class="human1"
|
|
src="img/human1@2x.svg"
|
|
/>
|
|
</div>
|
|
<div class="buttons">
|
|
<div class="button smart-layers-pointers">
|
|
<div
|
|
class="text-i13631421432 valign-text-middle liberationmono-bold-white-14px"
|
|
>
|
|
<a
|
|
class="liberationmono-bold-white-14px"
|
|
href="https://yolo.servers.coop"
|
|
>TRY IT OUT</a
|
|
>
|
|
</div>
|
|
</div>
|
|
<div class="button-1">
|
|
<div
|
|
class="text-i13631422432 valign-text-middle liberationmono-bold-jade-14px"
|
|
>
|
|
<a id="get-in-touch" href="mailto:hello@servers.coop"
|
|
>GET IN TOUCH</a
|
|
>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="aim" id="reclaim-hosting">
|
|
<div
|
|
class="reclaim-hosting liberationsans-bold-jade-48px bp3-animate-enter2"
|
|
show-on-scroll
|
|
>
|
|
Reclaiming digital infrastructure
|
|
</div>
|
|
<div
|
|
class="hero-text-2 liberationsans-bold-black-18px bp3-animate-enter3"
|
|
>
|
|
Our goal is to support an emerging ecosystem of grassroots,
|
|
decentralised server hosting providers by stewarding a technical and
|
|
social toolkit designed for free software communities worldwide.
|
|
</div>
|
|
<div class="flex-row-1">
|
|
<div class="box bp3-animate-enter4">
|
|
<div class="frame-4">
|
|
<div class="overlap-group">
|
|
<div class="text liberationsans-bold-jade-32px">
|
|
Libre software platform
|
|
</div>
|
|
<img class="icon-dove" src="img/icon-dove-2@2x.svg" />
|
|
</div>
|
|
</div>
|
|
<div class="text-1 liberationsans-bold-black-18px">
|
|
Simple, fast, private compute based on
|
|
<a
|
|
id="capsul-flask"
|
|
href="https://giit.cyberia.club/~forest/capsul-flask"
|
|
>capsul-flask</a
|
|
>.
|
|
</div>
|
|
</div>
|
|
<div class="box-1 bp3-animate-enter5">
|
|
<div class="frame-4">
|
|
<div class="overlap-group">
|
|
<div class="text liberationsans-bold-jade-32px">
|
|
Co-operative algorithm
|
|
</div>
|
|
<img class="icon-dove-1" src="img/icon-dove-1@2x.svg" />
|
|
</div>
|
|
</div>
|
|
<div class="text-1 liberationsans-bold-black-18px">
|
|
Co-operative ownership models, toolkits and protocols
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<p
|
|
class="text-5 liberationsans-regular-normal-black-16px bp3-animate-enter6"
|
|
>
|
|
Fig. 2: The two ingredients of Servers.coop.
|
|
</p>
|
|
</div>
|
|
<div class="frame-25">
|
|
<div class="overlap-group2-1">
|
|
<img class="hero-tilt-1" src="img/hero-tilt-3@2x.png" />
|
|
<div class="frame-26"></div>
|
|
<div class="group-26">
|
|
<img class="human2" src="img/human2@2x.svg" />
|
|
<div class="overlap-group-2">
|
|
<div
|
|
id="joint-mission"
|
|
class="a-joint-mission liberationsans-bold-jade-48px bp3-animate-enter7"
|
|
show-on-scroll
|
|
>
|
|
A joint mission
|
|
</div>
|
|
<div
|
|
class="hero-text-3 liberationsans-bold-black-18px bp3-animate-enter8"
|
|
>
|
|
Servers.coop is a collective effort and a coalition of tech
|
|
co-ops.
|
|
</div>
|
|
</div>
|
|
<div class="frame-20">
|
|
<img
|
|
class="logo-autonomic bp3-animate-enter9"
|
|
src="img/logo-autonomic@2x.svg"
|
|
/><img
|
|
class="logo-platform6 bp3-animate-enter10"
|
|
src="img/logo-mc3.png"
|
|
/><img
|
|
class="logo-wa bp3-animate-enter11"
|
|
src="img/logo-wa@2x.svg"
|
|
/>
|
|
</div>
|
|
<div class="frame-21">
|
|
<img
|
|
class="logo-cni bp3-animate-enter12"
|
|
src="img/logo-cni@2x.svg"
|
|
/><img
|
|
class="logo-mediablaze bp3-animate-enter13"
|
|
src="img/logo-mediablaze@2x.svg"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="frame-28">
|
|
<div class="hero-text-4 liberationsans-bold-white-18px-2">
|
|
<span class="liberationsans-bold-black-18px"
|
|
><a
|
|
href="https://creativecommons.org/licenses/by-sa/4.0/"
|
|
class="liberationsans-bold-black-18px"
|
|
>CC BY-SA</a
|
|
></span
|
|
><span class="liberationsans-bold-white-18px"> | </span
|
|
><span class="liberationsans-bold-black-18px"
|
|
><a
|
|
href="git.coopcloud.tech/servers.coop/servers.coop"
|
|
class="liberationsans-bold-black-18px"
|
|
>(source code)</a
|
|
></span
|
|
>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="container-center-horizontal">
|
|
<div class="mobile screen">
|
|
<div class="header">
|
|
<img class="brand bp1-animate-enter" src="img/brand-5@2x.png" />
|
|
<div class="menu bp1-animate-enter1">
|
|
<div class="about liberationmono-bold-black-18px">
|
|
<a href="#reclaim-hosting" class="liberationmono-bold-black-18px"
|
|
>ABOUT</a
|
|
>
|
|
</div>
|
|
<div class="support liberationmono-bold-black-18px">
|
|
<a href="#joint-mission" class="liberationmono-bold-black-18px"
|
|
>PARTNERS</a
|
|
>
|
|
</div>
|
|
</div>
|
|
<div class="hero-text liberationsans-bold-jade-32px">
|
|
The recipe for self-managed co-operative computing
|
|
</div>
|
|
<div class="hero-text-1 liberationsans-bold-black-18px">
|
|
Servers.coop is an algorithm for co-operation: a technical,
|
|
governance, and cost-sharing stack which radically reduces the cost
|
|
and complexity of setting up a server hosting provider.
|
|
</div>
|
|
<div class="overlap-group">
|
|
<img class="stack4" src="img/stack4.svg" /><img
|
|
class="human1"
|
|
src="img/human1-1@2x.svg"
|
|
/>
|
|
</div>
|
|
<div class="buttons">
|
|
<div class="button smart-layers-pointers">
|
|
<div
|
|
class="text-i13629856432 valign-text-middle liberationmono-bold-white-14px"
|
|
>
|
|
<a
|
|
class="liberationmono-bold-white-14px"
|
|
href="https://yolo.servers.coop"
|
|
>TRY IT OUT</a
|
|
>
|
|
</div>
|
|
</div>
|
|
<div class="button-1">
|
|
<div
|
|
class="text-i13629857432 valign-text-middle liberationmono-bold-jade-14px"
|
|
>
|
|
<a id="get-in-touch" href="mailto:hello@servers.coop"
|
|
>GET IN TOUCH</a
|
|
>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<img class="hero-tilt" src="img/hero-tilt-1@1x.svg" />
|
|
</div>
|
|
<div class="aim" id="reclaim-hosting">
|
|
<div class="group-23">
|
|
<div
|
|
class="reclaim-hosting liberationsans-bold-jade-32px bp1-animate-enter2"
|
|
show-on-scroll
|
|
>
|
|
Reclaiming digital <br />
|
|
infrastructure
|
|
</div>
|
|
<div
|
|
class="hero-text-2 liberationsans-bold-black-18px bp1-animate-enter3 reclaiming-text"
|
|
>
|
|
Our goal is to support an emerging ecosystem of grassroots,
|
|
decentralised server hosting providers by stewarding a technical
|
|
and social toolkit designed for free software communities
|
|
worldwide.
|
|
</div>
|
|
</div>
|
|
<div class="box bp1-animate-enter4">
|
|
<div class="frame-4">
|
|
<div class="text">Libre software platform</div>
|
|
<img class="icon-dove" src="img/icon-dove-1@2x.svg" />
|
|
</div>
|
|
<div class="text-1 liberationsans-bold-black-18px">
|
|
Simple, fast, private compute based on
|
|
<a
|
|
id="capsul-flask"
|
|
href="https://giit.cyberia.club/~forest/capsul-flask"
|
|
>capsul-flask</a
|
|
>.
|
|
</div>
|
|
</div>
|
|
<div class="box-1 bp1-animate-enter5">
|
|
<div class="frame-4">
|
|
<div class="text">Co-operative algorithm</div>
|
|
<img class="icon-dove" src="img/icon-handshake@2x.svg" />
|
|
</div>
|
|
<div class="text-1 liberationsans-bold-black-18px">
|
|
Co-operative ownership models, toolkits and protocols
|
|
</div>
|
|
</div>
|
|
<p
|
|
class="text-10 liberationsans-regular-normal-black-16px bp1-animate-enter6"
|
|
>
|
|
Fig. 2: The two ingredients of Servers.coop.
|
|
</p>
|
|
</div>
|
|
<div class="frame-25">
|
|
<div class="overlap-group1">
|
|
<img class="hero-tilt-1" src="img/hero-tilt-3@2x.png" />
|
|
<div class="frame-26"></div>
|
|
<img class="human2" src="img/human2-1@2x.svg" />
|
|
</div>
|
|
<div
|
|
id="joint-mission"
|
|
class="a-joint-mission liberationsans-bold-jade-32px bp1-animate-enter7"
|
|
show-on-scroll
|
|
>
|
|
A joint mission
|
|
</div>
|
|
<div
|
|
class="hero-text-3 liberationsans-bold-black-18px bp1-animate-enter8"
|
|
>
|
|
Servers.coop is a collective effort and a coalition of tech co-ops.
|
|
</div>
|
|
<div class="frame-20">
|
|
<img
|
|
class="logo-autonomic bp1-animate-enter9"
|
|
src="img/logo-autonomic@2x.svg"
|
|
/><img
|
|
class="logo-platform6 bp1-animate-enter10"
|
|
src="img/logo-mc3.png"
|
|
/><img
|
|
class="logo-wa bp1-animate-enter11"
|
|
src="img/logo-wa-5@2x.svg"
|
|
/>
|
|
</div>
|
|
<div class="frame-21">
|
|
<img
|
|
class="logo-cni bp1-animate-enter12"
|
|
src="img/logo-cni-5@2x.svg"
|
|
/><img
|
|
class="logo-mediablaze bp1-animate-enter13"
|
|
src="img/logo-mediablaze@2x.svg"
|
|
/>
|
|
</div>
|
|
</div>
|
|
<div class="frame-28">
|
|
<div class="hero-text-4 liberationsans-bold-white-18px-2">
|
|
<span class="liberationsans-bold-black-18px"
|
|
><a
|
|
href="https://creativecommons.org/licenses/by-sa/4.0/"
|
|
class="liberationsans-bold-black-18px"
|
|
>CC BY-SA</a
|
|
></span
|
|
><span class="liberationsans-bold-white-18px"> | </span
|
|
><span class="liberationsans-bold-black-18px"
|
|
><a
|
|
href="git.coopcloud.tech/servers.coop/servers.coop"
|
|
class="liberationsans-bold-black-18px"
|
|
>(source code)</a
|
|
></span
|
|
>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="container-center-horizontal">
|
|
<div class="tablet screen">
|
|
<div class="overlap-group">
|
|
<div class="header">
|
|
<img class="brand bp2-animate-enter" src="img/brand@2x.svg" />
|
|
<div class="menu bp2-animate-enter1">
|
|
<div class="about liberationmono-bold-black-18px">
|
|
<a
|
|
href="#reclaim-hosting"
|
|
class="liberationmono-bold-black-18px"
|
|
>ABOUT</a
|
|
>
|
|
</div>
|
|
<div class="support liberationmono-bold-black-18px">
|
|
<a href="#joint-mission" class="liberationmono-bold-black-18px"
|
|
>PARTNERS</a
|
|
>
|
|
</div>
|
|
</div>
|
|
<div class="hero-text liberationsans-bold-jade-32px">
|
|
A DIY framework for community-owned computing
|
|
</div>
|
|
<div class="hero-text-1 liberationsans-bold-black-18px">
|
|
We believe in a world where our technology services are run by
|
|
people we know, instead of remote, profit-hungry advertising
|
|
companies.
|
|
</div>
|
|
<div class="overlap-group1-1">
|
|
<img class="stack4" src="img/stack4-2@2x.svg" /><img
|
|
class="human1"
|
|
src="img/human1-2@2x.svg"
|
|
/>
|
|
<div class="buttons">
|
|
<div class="button smart-layers-pointers">
|
|
<div
|
|
class="text-i13630520432 valign-text-middle liberationmono-bold-white-14px"
|
|
>
|
|
<a
|
|
class="liberationmono-bold-white-14px"
|
|
href="https://yolo.servers.coop"
|
|
>TRY IT OUT</a
|
|
>
|
|
</div>
|
|
</div>
|
|
<div class="button-1">
|
|
<div
|
|
class="text-i13630521432 valign-text-middle liberationmono-bold-jade-14px"
|
|
>
|
|
<a id="get-in-touch" href="mailto:hello@servers.coop"
|
|
>GET IN TOUCH</a
|
|
>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<img class="hero-tilt" src="img/hero-tilt-4@1x.png" />
|
|
</div>
|
|
<div class="aim" id="reclaim-hosting">
|
|
<div class="group-23">
|
|
<div
|
|
class="reclaim-hosting liberationsans-bold-jade-32px bp2-animate-enter2"
|
|
show-on-scroll
|
|
>
|
|
Reclaiming digital infrastructure
|
|
</div>
|
|
<div
|
|
class="hero-text-2 liberationsans-bold-black-18px bp2-animate-enter3"
|
|
>
|
|
Our goal is to support an emerging ecosystem of grassroots,
|
|
decentralised server hosting providers by stewarding a technical
|
|
and social toolkit designed for free software communities
|
|
worldwide.
|
|
</div>
|
|
</div>
|
|
<div class="flex-row">
|
|
<div class="box bp2-animate-enter4">
|
|
<div class="frame-4">
|
|
<div class="overlap-group1">
|
|
<div class="text-1 liberationsans-bold-jade-32px">
|
|
Libre software platform
|
|
</div>
|
|
<img class="icon-dove" src="img/icon-dove@2x.svg" />
|
|
</div>
|
|
</div>
|
|
<div class="text-1-1 liberationsans-bold-black-18px">
|
|
Simple, fast, private compute based on
|
|
<a
|
|
id="capsul-flask"
|
|
href="https://giit.cyberia.club/~forest/capsul-flask"
|
|
>capsul-flask</a
|
|
>.
|
|
</div>
|
|
</div>
|
|
<div class="box-1 bp2-animate-enter5">
|
|
<div class="frame-4">
|
|
<div class="overlap-group1">
|
|
<div class="text-1 liberationsans-bold-jade-32px">
|
|
Co-operative algorithm
|
|
</div>
|
|
<img class="icon-dove" src="img/icon-handshake@2x.svg" />
|
|
</div>
|
|
</div>
|
|
<div class="text-1 liberationsans-bold-black-18px">
|
|
Co-operative ownership models, toolkits and protocols
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<p
|
|
class="text-15 liberationsans-regular-normal-black-16px bp2-animate-enter6"
|
|
>
|
|
Fig. 2: The two parts of Servers.coop. Part platform, part
|
|
community.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="frame-25">
|
|
<div class="overlap-group2">
|
|
<img class="hero-tilt-1" src="img/hero-tilt-5@1x.png" />
|
|
<div class="frame-26"></div>
|
|
<img class="human2" src="img/human2-2@2x.svg" />
|
|
</div>
|
|
<div
|
|
id="joint-mission"
|
|
class="a-joint-mission liberationsans-bold-jade-32px bp2-animate-enter7"
|
|
show-on-scroll
|
|
>
|
|
A joint mission
|
|
</div>
|
|
<div
|
|
class="hero-text-3 liberationsans-bold-black-18px bp2-animate-enter8"
|
|
>
|
|
Servers.coop is a collective effort and a coalition of tech co-ops.
|
|
</div>
|
|
<div class="frame-20">
|
|
<img
|
|
class="logo-autonomic bp2-animate-enter9"
|
|
src="img/logo-autonomic@2x.svg"
|
|
/><img
|
|
class="logo-platform6 bp2-animate-enter10"
|
|
src="img/logo-mc3.png"
|
|
/><img
|
|
class="logo-wa bp2-animate-enter11"
|
|
src="img/logo-wa-2@2x.svg"
|
|
/>
|
|
</div>
|
|
<div class="frame-21">
|
|
<img
|
|
class="logo-cni bp2-animate-enter12"
|
|
src="img/logo-cni-7@2x.svg"
|
|
/><img
|
|
class="logo-mediablaze bp2-animate-enter13"
|
|
src="img/logo-mediablaze@2x.svg"
|
|
/>
|
|
</div>
|
|
</div>
|
|
<div class="frame-28">
|
|
<div class="hero-text-4 liberationsans-bold-white-18px-2">
|
|
<span class="liberationsans-bold-black-18px"
|
|
><a
|
|
href="https://creativecommons.org/licenses/by-sa/4.0/"
|
|
class="liberationsans-bold-black-18px"
|
|
>CC BY-SA</a
|
|
> </span
|
|
><span class="liberationsans-bold-white-18px"> | </span
|
|
><span class="liberationsans-bold-black-18px"
|
|
><a
|
|
href="git.coopcloud.tech/servers.coop/servers.coop"
|
|
class="liberationsans-bold-black-18px"
|
|
>(source code)</a
|
|
></span
|
|
>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<script>
|
|
function ShowOnScroll() {
|
|
this.toShow = [];
|
|
this.nextEventY = undefined;
|
|
}
|
|
|
|
ShowOnScroll.prototype.show = function (e) {
|
|
e.style.display = "";
|
|
};
|
|
|
|
ShowOnScroll.prototype.hide = function (e) {
|
|
e.style.display = "none";
|
|
};
|
|
|
|
ShowOnScroll.prototype.getTop = function (e) {
|
|
if (e.Top != undefined && e.Top != 0) {
|
|
return e.Top;
|
|
}
|
|
var top = 0;
|
|
var iter = e;
|
|
do {
|
|
top += iter.offsetTop || 0;
|
|
iter = iter.offsetParent;
|
|
} while (iter);
|
|
e.Top = top;
|
|
return top;
|
|
};
|
|
|
|
ShowOnScroll.prototype.onScroll = function () {
|
|
var screenBottom = window.pageYOffset + window.innerHeight;
|
|
if (this.nextEventY == undefined || this.nextEventY > screenBottom) {
|
|
return;
|
|
}
|
|
this.nextEventY = undefined;
|
|
for (var i = 0; i < this.toShow.length; i++) {
|
|
var e = this.toShow[i];
|
|
var top = this.getTop(e);
|
|
if (top < screenBottom) {
|
|
this.show(e);
|
|
this.toShow.shift();
|
|
i--;
|
|
} else {
|
|
this.nextEventY = top;
|
|
break;
|
|
}
|
|
}
|
|
};
|
|
|
|
ShowOnScroll.prototype.resetScrolling = function () {
|
|
// Clear state
|
|
var screenBottom = window.pageYOffset + window.innerHeight;
|
|
for (var i = 0; i < this.toShow.length; i++) {
|
|
var e = this.toShow[i];
|
|
this.show(e);
|
|
}
|
|
this.toShow = [];
|
|
this.nextEventY == undefined;
|
|
|
|
// Collect items
|
|
var itemsToShowOnScroll = Array.prototype.slice.call(
|
|
document.getElementsByTagName("*")
|
|
);
|
|
itemsToShowOnScroll = itemsToShowOnScroll.filter(function (e) {
|
|
return e.getAttribute("show-on-scroll") != undefined;
|
|
});
|
|
var getTop = this.getTop;
|
|
itemsToShowOnScroll.sort(function (a, b) {
|
|
return getTop(a) - getTop(b);
|
|
});
|
|
for (var i = 0; i < itemsToShowOnScroll.length; i++) {
|
|
var e = itemsToShowOnScroll[i];
|
|
var top = this.getTop(e);
|
|
if (top < screenBottom) {
|
|
continue;
|
|
}
|
|
this.toShow.push(e);
|
|
this.hide(e);
|
|
this.nextEventY =
|
|
this.nextEventY != undefined ? this.nextEventY : top;
|
|
}
|
|
};
|
|
|
|
ShowOnScroll.prototype.handleEvent = function (e) {
|
|
switch (e.type) {
|
|
case "scroll":
|
|
this.onScroll();
|
|
break;
|
|
case "resize":
|
|
this.resetScrolling();
|
|
break;
|
|
}
|
|
};
|
|
|
|
ShowOnScroll.prototype.init = function () {
|
|
this.resetScrolling();
|
|
window.addEventListener("scroll", this);
|
|
window.addEventListener("resize", this);
|
|
};
|
|
|
|
// After anima-src
|
|
setTimeout(function () {
|
|
var instShowOnScroll = new ShowOnScroll();
|
|
instShowOnScroll.init();
|
|
}, 250);
|
|
</script>
|
|
</body>
|
|
</html>
|