mirror of
https://github.com/ivabus/www
synced 2024-11-22 01:45:05 +03:00
.some(HTML)
This commit is contained in:
mxcl
parent
1c131b3729
commit
e322461698
17 changed files with 924 additions and 0 deletions
56
.github/workflows/cd.yml
vendored
Normal file
56
.github/workflows/cd.yml
vendored
Normal file
|
|
@ -0,0 +1,56 @@
|
|||
on: push
|
||||
|
||||
concurrency:
|
||||
group: deploy
|
||||
cancel-in-progress: true
|
||||
|
||||
jobs:
|
||||
deploy:
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- name: Create Deployment
|
||||
uses: bobheadxi/deployments@v0.6.2
|
||||
id: deployment
|
||||
with:
|
||||
step: start
|
||||
token: ${{ github.token }}
|
||||
env: aws
|
||||
|
||||
- uses: actions/checkout@v2
|
||||
|
||||
## means s3 sync will only sync things we need sync’d
|
||||
- uses: chetan/git-restore-mtime-action@v1
|
||||
|
||||
- uses: aws-actions/configure-aws-credentials@v1
|
||||
with:
|
||||
aws-access-key-id: ${{ secrets.AWS_ACCESS_KEY_ID }}
|
||||
aws-secret-access-key: ${{ secrets.AWS_SECRET_ACCESS_KEY }}
|
||||
aws-region: us-east-1
|
||||
|
||||
# cache-control of 10 mins because we *need* to be able to update
|
||||
# this and have people see the results can be fixed well with a static site builder
|
||||
- run: |
|
||||
aws s3 sync . s3://www.tea.xyz \
|
||||
--metadata-directive REPLACE \
|
||||
--cache-control max-age=600 \
|
||||
--exclude '.git/*' --exclude '.github/*' \
|
||||
--exclude pour.sh \
|
||||
--delete
|
||||
|
||||
#TODO create a github-action that can be used to parse the
|
||||
# output from `s3 sync` into invalidation commands. NOTE
|
||||
# I have already looked for something to do this and failed.
|
||||
- run: |
|
||||
aws cloudfront create-invalidation \
|
||||
--distribution-id ${{ secrets.AWS_CF_DISTRIBUTION_ID }} \
|
||||
--paths '/*'
|
||||
|
||||
|
||||
- name: Seal Deployment
|
||||
uses: bobheadxi/deployments@v0.6.2
|
||||
if: always()
|
||||
with:
|
||||
step: finish
|
||||
token: ${{ github.token }}
|
||||
status: ${{ job.status }}
|
||||
deployment_id: ${{ steps.deployment.outputs.deployment_id }}
|
||||
29
404.html
Normal file
29
404.html
Normal file
|
|
@ -0,0 +1,29 @@
|
|||
<!DOCTYPE html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>tea</title>
|
||||
<link href="/index.css" rel="stylesheet" />
|
||||
<style>
|
||||
body, html {
|
||||
background-color: var(--light-grey);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="masthead">
|
||||
<a href="/"><img src="/logo%2Bwordmark.png" class="logo"></a>
|
||||
</div>
|
||||
<div class="content content1">
|
||||
<div class="twocol">
|
||||
<div style="position: relative">
|
||||
<img src="/404.png" alt="broken teacup" style="position: absolute; top: -2.5rem; right: 0; height: 115%; max-height: 45rem">
|
||||
</div>
|
||||
<div>
|
||||
<h1><span class="alt">Oops<br />Something</span><br />Broke.</h1>
|
||||
<p>
|
||||
We couldn’t find the page you’re looking for.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
BIN
404.png
Normal file
BIN
404.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 98 KiB |
BIN
banner.png
Normal file
BIN
banner.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 29 KiB |
BIN
blockchain.png
Normal file
BIN
blockchain.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 58 KiB |
BIN
circles.png
Normal file
BIN
circles.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 40 KiB |
BIN
favicon-1024.png
Normal file
BIN
favicon-1024.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 58 KiB |
BIN
favicon-180.png
Normal file
BIN
favicon-180.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 7.4 KiB |
BIN
favicon.ico
Normal file
BIN
favicon.ico
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.7 KiB |
334
index.css
Normal file
334
index.css
Normal file
|
|
@ -0,0 +1,334 @@
|
|||
:root {
|
||||
--trip-teal: 13,115,130;
|
||||
--trip-mint: 125, 201, 191;
|
||||
--trip-pale-mint: 178, 222, 219;
|
||||
--trip-neon-green: 212,255,92;
|
||||
--trip-charcoal: 43, 48, 51;
|
||||
--trip-light-charcoal: 102, 102, 102;
|
||||
--trip-light-grey: 230, 231, 232;
|
||||
--trip-pale-teal: 179, 200, 200;
|
||||
|
||||
--teal: rgb(var(--trip-teal));
|
||||
--light-grey: rgb(var(--trip-light-grey));
|
||||
--charcoal: rgb(var(--trip-charcoal));
|
||||
--light-charcoal: rgb(var(--trip-light-charcoal));
|
||||
--neon-green: rgb(var(--trip-neon-green));
|
||||
--mint: rgb(var(--trip-mint));
|
||||
--pale-mint: rgb(var(--trip-pale-mint));
|
||||
--pale-teal: rgb(var(--trip-pale-teal));
|
||||
--main-padding: max(calc((100vw - 60rem) / 2 - 5.5rem), 3rem);
|
||||
--teal-highlight: #4c8995;
|
||||
}
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
html, body {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
body, html {
|
||||
background-color: var(--teal);
|
||||
font-family: Montserrat, sans-serif;
|
||||
color: white;
|
||||
font-size: 16px;
|
||||
}
|
||||
b {
|
||||
font-weight: 900;
|
||||
}
|
||||
h1, h2, h3, h4, h5 {
|
||||
font-family: 'Playfair Display', serif;
|
||||
text-transform: lowercase;
|
||||
color: var(--teal);
|
||||
}
|
||||
h1 {
|
||||
font-size: 3rem;
|
||||
}
|
||||
h2 {
|
||||
font-size: 2rem;
|
||||
}
|
||||
h3 {
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
h1 .alt, h2 .alt, h3 .alt {
|
||||
color: var(--pale-teal);
|
||||
}
|
||||
.tea {
|
||||
font-family: 'Playfair Display', serif;
|
||||
font-weight: bold;
|
||||
}
|
||||
.logo {
|
||||
width: auto;
|
||||
height: 2.2rem;
|
||||
}
|
||||
#masthead {
|
||||
background: white;
|
||||
color: var(--light-charcoal);
|
||||
padding: 1.8rem 3rem;
|
||||
padding-left: var(--main-padding);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
#masthead nav {
|
||||
margin-left: auto;
|
||||
}
|
||||
#masthead nav ol {
|
||||
list-style-type: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-weight: bold;
|
||||
}
|
||||
#masthead nav ol li {
|
||||
display: inline-block;
|
||||
padding: 0 1rem;
|
||||
}
|
||||
|
||||
#masthead img {
|
||||
transform: translateY(-13%)
|
||||
}
|
||||
|
||||
.content {
|
||||
padding: 2rem;
|
||||
}
|
||||
.content1 {
|
||||
background: var(--light-grey);
|
||||
color: var(--charcoal);
|
||||
}
|
||||
.content2 {
|
||||
background: white;
|
||||
color: var(--light-charcoal);
|
||||
}
|
||||
.content3 {
|
||||
background: inherit;
|
||||
color: inherit;
|
||||
}
|
||||
.content3 h1, .content3 h2, .content3 h3, .content3 h4, .content3 h5 {
|
||||
color: white;
|
||||
}
|
||||
.content {
|
||||
padding: 1rem max(calc((100vw - 60rem) / 2), 1rem);
|
||||
}
|
||||
p {
|
||||
max-width: 34em;
|
||||
line-height: 1.65;
|
||||
}
|
||||
|
||||
.content > *:first-child {
|
||||
margin-top: 3rem;
|
||||
}
|
||||
.content > *:last-child {
|
||||
margin-bottom: 3rem;
|
||||
}
|
||||
|
||||
b, strong {
|
||||
color: var(--charcoal);
|
||||
}
|
||||
|
||||
strong {
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.content3 b, .content3 strong {
|
||||
color: white;
|
||||
}
|
||||
|
||||
b {
|
||||
position: relative;
|
||||
z-index: 0;
|
||||
}
|
||||
b::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
top: 55%;
|
||||
left: -0.2rem;
|
||||
height: 60%;
|
||||
width: calc(100% + 0.4rem);
|
||||
background: var(--neon-green);
|
||||
z-index: -1;
|
||||
}
|
||||
.content3 b::before {
|
||||
background: var(--teal-highlight);
|
||||
}
|
||||
|
||||
.content3 {
|
||||
position: relative;
|
||||
}
|
||||
.content3 h2 {
|
||||
position: relative;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
.content3 p {
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
.content3 .flair {
|
||||
content: "";
|
||||
background: var(--teal-highlight);
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
left: var(--main-padding);
|
||||
height: 14rem;
|
||||
width: 8rem;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
code.example {
|
||||
background: var(--teal);
|
||||
border: 1px dashed var(--light-grey);
|
||||
color: white;
|
||||
padding: 1rem;
|
||||
font-size: 1.5rem;
|
||||
display: inline-block;
|
||||
}
|
||||
code.example.small {
|
||||
font-size: 1.3rem;
|
||||
}
|
||||
pre, code {
|
||||
font-family: 'Courier New', monospace;
|
||||
}
|
||||
a {
|
||||
color: var(--mint);
|
||||
text-decoration: none;
|
||||
}
|
||||
a:hover, a:visited:hover {
|
||||
color: var(--pale-mint);
|
||||
}
|
||||
a:active, a:hover:active {
|
||||
color: var(--neon-green);
|
||||
}
|
||||
.content1 a {
|
||||
color: var(--teal);
|
||||
}
|
||||
.content3 a {
|
||||
color: #54baab;
|
||||
}
|
||||
.content3 a:hover, .content3 a:visited:hover {
|
||||
color: #7dc9bf;
|
||||
}
|
||||
.content3 a:active, .content3 a:hover:active {
|
||||
color: #45edd6;
|
||||
}
|
||||
a.button, input[type=submit] {
|
||||
line-height: 3rem;
|
||||
border-radius: 1.5rem;
|
||||
padding: 0 5rem;
|
||||
background: white;
|
||||
color: var(--charcoal);
|
||||
display: inline-block;
|
||||
font-weight: bold;
|
||||
letter-spacing: 0.125rem;
|
||||
text-transform: uppercase;
|
||||
border: 0;
|
||||
}
|
||||
a.button:hover, input[type=submit]:hover, a.button:visited:hover, input[type=submit]:visited:hover {
|
||||
background: #7df2de;
|
||||
color: var(--charcoal);
|
||||
}
|
||||
a.button:active, input[type=submit]:active, a.button:visited:active, input[type=submit]:visited:active {
|
||||
background: #45edd6;
|
||||
}
|
||||
.content2 a.button, input[type=submit] {
|
||||
background: #54baab;
|
||||
color: white;
|
||||
}
|
||||
a.button:hover, a.button:visited:hover {
|
||||
background: #7dc9bf;
|
||||
color: white;
|
||||
}
|
||||
a.button:active, a.button:visited:active {
|
||||
background: #addbd6;
|
||||
color: white;
|
||||
}
|
||||
ul.linktree {
|
||||
list-style-type: none;
|
||||
margin: 0;
|
||||
margin-left: -1.2rem;
|
||||
margin-top: 2rem;
|
||||
margin-bottom: 4rem;
|
||||
padding: 0;
|
||||
display: table;
|
||||
border-collapse: separate;
|
||||
border-spacing: 1rem;
|
||||
}
|
||||
ul.linktree li {
|
||||
display: table-row;
|
||||
}
|
||||
ul.linktree li a {
|
||||
display: table-cell;
|
||||
}
|
||||
.linktree .button {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.twocol {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fill, calc(50% - 3rem));
|
||||
gap: 6rem;
|
||||
}
|
||||
img.constrained {
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
}
|
||||
|
||||
.genuine-innovation .twocol > div:first-child {
|
||||
padding: 2rem 0 3rem 0;
|
||||
}
|
||||
.genuine-innovation .twocol:first-child {
|
||||
margin-bottom: 10rem;
|
||||
}
|
||||
.genuine-innovation .twocol:nth-child(2) {
|
||||
margin-bottom: 10rem;
|
||||
}
|
||||
|
||||
.hero p {
|
||||
font-size: larger;
|
||||
}
|
||||
|
||||
input[type=email] {
|
||||
border: 0;
|
||||
font-family: inherit;
|
||||
font-size: 100%;
|
||||
padding: 0 1.5em;
|
||||
margin: 0;
|
||||
line-height: 3rem;
|
||||
border-radius: 1.5rem;
|
||||
width: 20em;
|
||||
margin-right: 1rem;
|
||||
transform: translateY(-1px) translateX(-3px); /* or not aligned with submit button */
|
||||
}
|
||||
|
||||
input[type=submit] {
|
||||
font-size: 100%;
|
||||
padding: 0 1.5rem;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.content2 input[type=email] {
|
||||
background-color: var(--pale-mint);
|
||||
color: var(--teal);
|
||||
width: 14em;
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.content2 input[type=email]::placeholder {
|
||||
color: rgba(var(--trip-teal), 0.5);
|
||||
}
|
||||
|
||||
.aside {
|
||||
font-variant: small-caps;
|
||||
opacity: 0.5;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.left-a-bit {
|
||||
transform: translateX(-3rem);
|
||||
}
|
||||
.right-a-bit {
|
||||
transform: translateX(3rem);
|
||||
}
|
||||
|
||||
.twocol.left-a-bit, .twocol.right-a-bit {
|
||||
gap: 3rem;
|
||||
}
|
||||
275
index.html
Normal file
275
index.html
Normal file
|
|
@ -0,0 +1,275 @@
|
|||
<!DOCTYPE html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width">
|
||||
<title>tea > the toolkit that builds the Internet</title>
|
||||
<link rel="apple-touch-icon-precomposed" href="/favicon-180.png">
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,400;0,700;1,400&family=Playfair+Display:wght@900&display=swap" rel="stylesheet">
|
||||
<link href="/index.css" rel="stylesheet">
|
||||
<link href="/mobile.css" rel="stylesheet">
|
||||
<meta name="twitter:card" content="summary">
|
||||
<meta name="twitter:image:alt" content="sh <(curl tea.xyz)">
|
||||
<meta name="twitter:title" content="tea.">
|
||||
<meta name="twitter:description" content="something new is brewing.">
|
||||
<meta name="twitter:image" content=" https://tea.xyz/favicon-1024.png">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="masthead">
|
||||
<img src="/logo%2Bwordmark.png" alt="tea." class="logo">
|
||||
<nav>
|
||||
<ol>
|
||||
<li><a href="https://medium.com/teaxyz">Blog</a></li>
|
||||
<li><a href="press-release.pdf">Press Release</a></li>
|
||||
</ol>
|
||||
</nav>
|
||||
</div>
|
||||
<div class="content content1 hero">
|
||||
<div class="something-new-is-brewing">
|
||||
<h1><span class="alt">Something<br />New is</span><br />Brewing.</h1>
|
||||
<p>
|
||||
The tools that build the Internet have steeped too long.<br/>
|
||||
It’s time for a fresh brew.
|
||||
</p>
|
||||
<span style="border: 4px solid var(--teal); display: inline-block; margin-top: 1rem">
|
||||
<code class="example">
|
||||
<span style="color: var(--mint)">$</span> sh <(curl tea.xyz)
|
||||
</code>
|
||||
</span>
|
||||
|
||||
<img src="terminal-window.png" alt="Abstract Terminal Window">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="content content2">
|
||||
<div class="twocol right-a-bit image-container-mobile lightbulb">
|
||||
<div>
|
||||
<h2><span class="alt">Transforming<br />What’s</span> Possible.</h2>
|
||||
<p>
|
||||
Like its predecessor, <code>brew</code>,
|
||||
<span class="tea">tea</span> is the base of the
|
||||
developer stack—seated beneath the tools that build the Internet.
|
||||
We’re uniquely placed to have tangible impact on all aspects of software development
|
||||
<i>and we intend to</i>.
|
||||
We will make sure devs have the tools they need to build the Internet and
|
||||
the compensation they need to keep on building.
|
||||
</p>
|
||||
</div>
|
||||
<div class="image-container">
|
||||
<img src="lightbulb.png" alt="lightbulb">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="twocol image-container-mobile blockchain">
|
||||
<div class="image-container">
|
||||
<img src="blockchain.png" alt="blockchain">
|
||||
</div>
|
||||
<div>
|
||||
<h2>
|
||||
<span class="alt">It’s time for an<br/>
|
||||
open source</span> revolution.
|
||||
</h2>
|
||||
<p>
|
||||
For more than twenty years the Internet has been built upon the fruits of freely available open source.
|
||||
Whenever a project enabled new functionality it was
|
||||
(whether desired or not)
|
||||
added as a new brick in the tower of infrastructure;
|
||||
giving the Internet new powers and capabilities;
|
||||
becoming a new foundation for all the innovations that followed.
|
||||
The maintainers of these new bricks became thanklessly unpaid volunteers.
|
||||
</p>
|
||||
<h3><span class="alt">The</span> Homebrew <span class="alt">Story</span>.</h3>
|
||||
<p>
|
||||
Homebrew has been used by tens of millions of creators to build things we all use every day,
|
||||
and yet Max Howell—the creator of <code>brew</code> and co‐founder of <span class="tea">tea</span>—was
|
||||
unable to make a living from Homebrew alone.
|
||||
Maintaining such a large project was more than a full‐time job but every few years Max
|
||||
would have to go back to working on somebody else’s idea for money.
|
||||
Of the countless enterprises that have utilized Homebrew,
|
||||
only two have ever said thanks:
|
||||
Google sent him a blanket and Square sent him an iPad.
|
||||
As generous as (the iPad) was, small gifts don’t pay bills.
|
||||
We’re making sure such a thing never happens again and that open source developers
|
||||
can focus on building things they love without compromise.
|
||||
</p>
|
||||
<h3><span class="alt">Tech giants accrued fortunes on the backs of people they’ve</span> never thanked, paid or even met.</h3>
|
||||
<p>
|
||||
The problem has always existed, but the technology to solve it hasn’t.
|
||||
<span class="tea">tea</span> facilitates the graph of open source that underpins all modern digital infrastructure.
|
||||
We’re putting it <i>on‐chain</i> creating a <i>map</i>
|
||||
we’ll use to guide value redistribution to the open source that makes the Internet possible.
|
||||
</p>
|
||||
<p>
|
||||
We’re not changing how open source works—<i>it’s still free.</i>
|
||||
web3 has introduced powerful new paradigms that allow value to be compensated without direct payment.
|
||||
Creator economy, meet open source.
|
||||
</p>
|
||||
<p style="margin-top: 3em">
|
||||
Want an email when the white paper is released?
|
||||
</p>
|
||||
<form action="https://xyz.us14.list-manage.com/subscribe/post?u=5ecf36ba3d22ddd88d09708e6&id=4af8bd918a" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate autocomplete="off">
|
||||
<input type="hidden" name="tags" value="7137169">
|
||||
<input placeholder="Email" name="EMAIL" type="email" />
|
||||
<input type="submit" value="subscribe" />
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="content content3">
|
||||
<h2>
|
||||
Cross Platform.
|
||||
</h2>
|
||||
<div class="twocol">
|
||||
<div>
|
||||
<p>
|
||||
Wherever you develop,
|
||||
wherever your CI/CD runs,
|
||||
however you deploy your app,
|
||||
<span class="tea">tea</span> is there.
|
||||
We abstract this detail away so you can get on with the work that matters to <strong>you</strong>.
|
||||
</p>
|
||||
<code class="example small">
|
||||
<span style="color: var(--mint)">$</span> sh <(curl tea.xyz) ci
|
||||
</code>
|
||||
</div>
|
||||
<div>
|
||||
<p>
|
||||
Your <code>README</code>, blog post or internal install instructions can
|
||||
all use the same, simple one‐liner.
|
||||
</p>
|
||||
<code class="example small">
|
||||
<span style="color: var(--mint)">$</span> sh <(curl tea.xyz) install deno.land
|
||||
</code>
|
||||
<p style="color: var(--pale-teal)">
|
||||
Here, our one‐liner installs <a href="https://deno.land"><code>deno</code></a>
|
||||
to <code>./bin/deno</code>. If <span class="tea">tea</span> is installed it
|
||||
integrates with that installation, if not the script just exits;
|
||||
<span class="tea">tea</span> itself is not installed either way.
|
||||
We’re happy to be just the transmission layer.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<h2>
|
||||
Designed for Tea’ms.
|
||||
</h2>
|
||||
<p>
|
||||
<b>Good developers create. Great developers collaborate.</b>
|
||||
</p>
|
||||
<p>
|
||||
You don’t work alone and neither should the tool that sits at the root of your stack.
|
||||
We’re designing tea to be super great for teams.
|
||||
</p>
|
||||
<p>
|
||||
<span class="tea">tea</span>
|
||||
sets your stack up <i>right</i>
|
||||
and makes working with it a <i>delight</i>
|
||||
so you and your team can focus on building what matters.
|
||||
</p>
|
||||
</div>
|
||||
<div class="content content1">
|
||||
<div class="twocol">
|
||||
<div>
|
||||
<h2>
|
||||
<span class="alt">Decentralized<br/>
|
||||
&</span> Secure.
|
||||
</h2>
|
||||
<p>
|
||||
<span class="tea">tea</span>’s decentralization offers tangible benefits to ecosystem <b>security<span style="font-weight: normal">.</span></b>
|
||||
Every layer of your apps and dapps is signed and verified on‐chain.
|
||||
Users can rest assured that the software they are using is what <i>all</i> its creators intended.
|
||||
</p>
|
||||
<p>
|
||||
In day to day development our decentralization increases <b>reliability</b>
|
||||
(<a href="https://www.theregister.com/2016/03/23/npm_left_pad_chaos/">leftpad</a> is a sore memory)
|
||||
and gives developers the flexibility they need to turn inspiration into empires;
|
||||
when a single proprietry vendor controls how your stack is composed and deployed your stack is centralized and <strong>under their control</strong>.
|
||||
</p>
|
||||
<p>
|
||||
We’re also saying goodbye to centralization at the <i>installation layer</i>.
|
||||
Say hello to native, built‐in “version management”† for every tool in your stack
|
||||
and goodbye to dependency hell.
|
||||
</p>
|
||||
<p style="font-size: smaller">
|
||||
† similar to tools like <code>rbenv</code>, <code>nvm</code> or Python’s virtualenv.
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<h2>
|
||||
Delightful <span class="alt">developer<br/>
|
||||
experience.</span>
|
||||
</h2>
|
||||
<p>
|
||||
<span class="tea">tea</span> is built with a “it just works” philosophy.
|
||||
It’s our job to set you up for success and then get out of your way so you can work as effectively as possible.
|
||||
Development is hard enough without the toolset being a source of pain as well.
|
||||
</p>
|
||||
<p>
|
||||
Much like its predecessor, <code>brew</code>, <span class="tea">tea</span> is full of delightful touches.
|
||||
You’ll have to try it and see.
|
||||
</p>
|
||||
<p>
|
||||
<i>ofc delightful also means <b>fast<span style="font-weight: normal">.</span></b></i> You’ve got plenty to do and need tools that <i>respect your time</i>.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="content content2 genuine-innovation image-container-mobile">
|
||||
<div class="twocol right-a-bit image-container-mobile open-governance">
|
||||
<div>
|
||||
<h2>
|
||||
<span class="alt">Open</span> Governance.
|
||||
</h2>
|
||||
<p>
|
||||
We believe the open source community needs to direct and control the ecosystem we will help launch.
|
||||
The DAO will be an open, transparent and evolving governance structure where the
|
||||
depth of your contributions will matter more than the depth of your pocket.
|
||||
</p>
|
||||
</div>
|
||||
<div class="image-container">
|
||||
<img src="circles.png" alt="circles">
|
||||
</div>
|
||||
</div>
|
||||
<div class="twocol left-a-bit image-container-mobile we-are-hiring">
|
||||
<div class="image-container">
|
||||
<img src="magnifying-glass.png" alt="magnifying-glass">
|
||||
</div>
|
||||
<div>
|
||||
<h2><span class="alt">We’re</span> Hiring.</h2>
|
||||
<p>
|
||||
Join the team that is both fixing how open source is funded and
|
||||
creating the tools that will accelerate its creation for the benefit of all humanity.
|
||||
</p>
|
||||
<p>
|
||||
Max Howell, our CEO, created <code>brew</code>.
|
||||
He’s a self‐taught developer,
|
||||
yet has written software used by tens of millions of people.
|
||||
<strong>He doesn’t care if you know how to invert a binary tree.</strong>
|
||||
If you have a passion for changing the world and have
|
||||
built some cool stuff then why not <a href="mailto:jobs@tea.xyz">email us</a>
|
||||
and speak for what job you have in mind?
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="content content3">
|
||||
<h2>Coming Soon.</h2>
|
||||
<p>
|
||||
Join the community that’s taking back the Internet.
|
||||
</p>
|
||||
<ul class="linktree">
|
||||
<li><a class="button" href="https://discord.tea.xyz">Discord</a> <span class="aside">developers & users</span></li>
|
||||
<li><a class="button" href="https://twitter.com/teaxyz_">Twitter</a> <span class="aside">follow us=now. rewards=later.</span></li>
|
||||
<li><a class="button" href="https://github.com/teaxyz">GitHub</a> <span> </span></li>
|
||||
<li><a class="button" href="https://t.me/tea_xyz">Telegram</a> <span class="aside">web3 discussion</span></li>
|
||||
<li><a class="button" href="https://reddit.com/r/teaxyz">Reddit</a> <span> </span></li>
|
||||
</ul>
|
||||
<p>Get updates to your inbox.</p>
|
||||
<form action="https://xyz.us14.list-manage.com/subscribe/post?u=5ecf36ba3d22ddd88d09708e6&id=4af8bd918a" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate autocomplete="off">
|
||||
<input type="hidden" name="tags" value="7137169">
|
||||
<input placeholder="Email" name="EMAIL" type="email" />
|
||||
<input type="submit" value="subscribe" />
|
||||
</form>
|
||||
</div>
|
||||
</body>
|
||||
BIN
lightbulb.png
Normal file
BIN
lightbulb.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 75 KiB |
BIN
logo+wordmark.png
Normal file
BIN
logo+wordmark.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
BIN
magnifying-glass.png
Normal file
BIN
magnifying-glass.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 34 KiB |
230
mobile.css
Normal file
230
mobile.css
Normal file
|
|
@ -0,0 +1,230 @@
|
|||
@media (min-width: 62rem) {
|
||||
.something-new-is-brewing {
|
||||
display: inline-block; /* not sure why, but removing this screws with the image on the right */
|
||||
position: relative; /* [1] */
|
||||
}
|
||||
.something-new-is-brewing h1, .genuine-innovation h2 {
|
||||
margin-top: 0; /* margin collapse doesn’t work due to above [1] */
|
||||
}
|
||||
|
||||
.content > *:first-child.something-new-is-brewing {
|
||||
margin-top: 3rem;
|
||||
}
|
||||
.content > *:last-child.something-new-is-brewing {
|
||||
margin-top: 3rem;
|
||||
}
|
||||
|
||||
.genuine-innovation .twocol > div:first-child {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.genuine-innovation .twocol:nth-child(2) {
|
||||
margin-bottom: 3rem;
|
||||
}
|
||||
}
|
||||
|
||||
.hero {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
@media (max-width: 62rem) {
|
||||
.content {
|
||||
padding: 0 1.5rem;
|
||||
display: flow-root;
|
||||
}
|
||||
.content > *:first-child {
|
||||
margin-top: 2rem;
|
||||
}
|
||||
.content > *:last-child {
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
h1 {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
.twocol {
|
||||
display: inline; /* to make margin-collapse happen */
|
||||
}
|
||||
.right-a-bit, .left-a-bit {
|
||||
transform: unset;
|
||||
}
|
||||
ul.linktree {
|
||||
display: initial;
|
||||
}
|
||||
ul.linktree li {
|
||||
display: block;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
ul.linktree li>*, ul.linktree li a {
|
||||
display: block;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
margin-top: 0.3rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 43rem) {
|
||||
.logo {
|
||||
height: 2rem;
|
||||
}
|
||||
#masthead {
|
||||
padding: 1.5rem;
|
||||
}
|
||||
}
|
||||
@media (max-width: 24.375rem) {
|
||||
body, html {
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
@media (max-width: 20rem) {
|
||||
body, html {
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.image-container {
|
||||
position: relative;
|
||||
}
|
||||
.image-container-mobile {
|
||||
position: unset;
|
||||
}
|
||||
|
||||
.image-container-mobile.blockchain {
|
||||
padding-top: 3rem;
|
||||
}
|
||||
|
||||
@media (max-width: 62rem) {
|
||||
.image-container {
|
||||
position: unset;
|
||||
}
|
||||
.image-container-mobile {
|
||||
position: relative;
|
||||
padding-top: 8rem;
|
||||
}
|
||||
|
||||
.image-container-mobile.blockchain {
|
||||
padding-top: 13rem;
|
||||
}
|
||||
.image-container-mobile.genuine-innovation {
|
||||
padding-top: 3rem;
|
||||
}
|
||||
}
|
||||
|
||||
.something-new-is-brewing img {
|
||||
position: absolute;
|
||||
right: -30rem;
|
||||
bottom: 0;
|
||||
width: 26rem;
|
||||
}
|
||||
|
||||
.lightbulb .image-container img {
|
||||
height: 16rem;
|
||||
position: absolute;
|
||||
top: 3rem;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.blockchain .image-container img {
|
||||
position: absolute;
|
||||
top: 3rem;
|
||||
right: -1rem;
|
||||
height: 25rem;
|
||||
max-height: 45rem;
|
||||
}
|
||||
|
||||
.open-governance .image-container img {
|
||||
position: absolute;
|
||||
height: 15rem;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.we-are-hiring .image-container img {
|
||||
height: 14rem;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0
|
||||
}
|
||||
|
||||
@media (max-width: 62rem) {
|
||||
.lightbulb .image-container img {
|
||||
height: 12rem;
|
||||
top: 0;
|
||||
right: -2rem;
|
||||
left: unset;
|
||||
}
|
||||
.image-container-mobile.lightbulb {
|
||||
padding-top: 3.8rem;
|
||||
}
|
||||
.blockchain .image-container img {
|
||||
height: 22rem;
|
||||
top: -1rem;
|
||||
left: -5.8rem;
|
||||
right: 0;
|
||||
clip-path: inset(10px 0 10px 0);
|
||||
}
|
||||
.we-are-hiring .image-container img {
|
||||
height: 10rem;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0
|
||||
}
|
||||
.open-governance .image-container img {
|
||||
height: 8rem;
|
||||
right: 0;
|
||||
left: unset;
|
||||
top: -1rem;
|
||||
}
|
||||
.blockchain h2 {
|
||||
padding-left: 1.5rem;
|
||||
}
|
||||
.blockchain form {
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
form input[type="submit"] {
|
||||
font-size: 72%;
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
input[type=email] {
|
||||
width: 50%;
|
||||
}
|
||||
h2 {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
backdrop-filter: blur(0.5rem);
|
||||
-webkit-backdrop-filter: blur(0.5rem);
|
||||
}
|
||||
.lightbulb h2, .blockchain h2, .genuine-innovation h2 {
|
||||
display: inline-block;
|
||||
margin-bottom: 0.83rem;
|
||||
}
|
||||
.blockchain, .lightbulb {
|
||||
display: block;
|
||||
}
|
||||
.something-new-is-brewing img {
|
||||
right: -12em;
|
||||
height: 14em;
|
||||
width: auto;
|
||||
top: 2.5em;
|
||||
bottom: unset;
|
||||
}
|
||||
code.example.small {
|
||||
max-width: 100%;
|
||||
min-width: 100%;
|
||||
overflow: scroll;
|
||||
}
|
||||
|
||||
.content {
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 90rem) {
|
||||
.logo {
|
||||
height: 2.8rem;
|
||||
}
|
||||
#masthead {
|
||||
padding-top: 2.45rem;
|
||||
padding-bottom: 2.45rem;
|
||||
}
|
||||
}
|
||||
BIN
press-release.pdf
Normal file
BIN
press-release.pdf
Normal file
Binary file not shown.
BIN
terminal-window.png
Normal file
BIN
terminal-window.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 35 KiB |
Loading…
Reference in a new issue