on master help sign in
Merge pull request #481 from urbit/mp/homepage-restoration

index.html: the oceanic restoration project

commit55b47fb7767ff1618887dde91be3ccfe012b3633 authormatildepark <matilde@tlon.io> dateTue 29 Sep 2020, 18:08 (6 years ago) parente6100dc2ecac06
5 files changed+130−71
sass/_main.scss−3 static/scripts.js+10−1 templates/essays/post.html+34 templates/index.html+85−66 templates/understanding-urbit/post.html+1−1
sass/_main.scss−3
@@ -633,9 +633,6 @@ hr {
633633}
634634
635635.vid-insert {
636− position: absolute;
637− right: 0;
638− bottom: 0;
639636 // Use .vid-insert-wrap to control height + width
640637 width: 100%;
641638 height: 100%;
static/scripts.js+10−1
@@ -412,4 +412,13 @@ if (document.body.classList.contains("page-indiced")) {
412412 }
413413 });
414414 })
415−};
415+};
416+
417+let oceanvid = document.getElementById("ocean");
418+
419+if ((oceanvid !== null) && (window.innerWidth > window.innerHeight)) {
420+ oceanvid.innerHTML = `<source
421+ src="https://media.urbit.org/site/sea30-1440.mp4"
422+ type="video/mp4"/>
423+ Your browser does not support the video tag.`
424+}
templates/essays/post.html+34
@@ -64,4 +64,38 @@
6464
6565 {% include "partials/pagination.html" %}
6666</article>
67+<section class="full c4-12-lg lh-copy mt6 mb4 measure-wide">
68+ <iframe name="nothing" style="display:none;"></iframe>
69+ <p class="mt5">If you’d like to follow our progress, we send monthly updates via email:</p>
70+ <form
71+ action="https://urbit.us11.list-manage.com/subscribe/post?u=972a03db9e0c6c25bb58de8c8&amp;amp;id=be143888d2"
72+ method="post"
73+ id="mc-embedded-subscribe-form"
74+ name="mc-embedded-subscribe-form"
75+ class="validate form"
76+ target="_blank"
77+ novalidate>
78+ <div class="input-group" id="mc_embed_signup_scroll">
79+ <div class="mc-field-group w-100 relative">
80+ <input
81+ class="bg-white black b--black ba pa3 w-100 mb2 br0 wk-appearance-none"
82+ type="email"
83+ name="EMAIL"
84+ id="mce-EMAIL"
85+ placeholder="your@email.com"/>
86+ <button
87+ id="mc-embedded-subscribe"
88+ class="dib bn absolute bg-transparent"
89+ style="font-family: 'Inter UI', san-serif; right: 3px; top: 15px; -webkit-appearance: none;"
90+ type="submit"
91+ name="subscribe"
92+ onclick="_paq.push(['trackEvent', 'Mailing List', 'Subscribe'])">
93+ <span class="fr pr1">-></span>
94+ </button>
95+ </div>
96+ </div>
97+ </form>
98+ <p class="mt3 mb3 mb3-xl lh-copy">You can also follow us on <a class="bb" href="https://twitter.com/urbit">Twitter</a> or <a class="bb" href="https://github.com/urbit">Github</a>.</p>
99+ <p class="mt0 mb3 mb4-xl lh-copy">Or talk to us on Urbit: <code>~bitbet-bolbel/urbit-community</code></p>
100+</section>
67101{% endblock content %}
templates/index.html+85−66
@@ -19,74 +19,49 @@
1919 <meta name="description" content="Urbit is a simple, durable system for running a personal server that you own 100% and forever.">
2020{% endblock description %}
2121{% block content %}
22−<header class="mt7 mb7 c1-12 c2-11-md c3-11-lg">
23− Urbit is a clean-slate OS and network for the 21st century.
24−</header>
25−<section class="full lh-copy c2-7-md c3-7-lg mt4">
26− <p><strong>Urbit OS</strong> is a clean slate reimagining of the operating system as an 'overlay OS.' It runs on any Unix machine with an internet connection.</p>
27− <p>It's a compact system for an individual to run their own permanent personal server.</p>
28− <p><strong>Urbit ID</strong> is a decentralized digital identity system. Your
29− Urbit ID is a username, network address, and crypto wallet.</p>
30− <p>Both are designed to work together as a single system, completely <a class="b--black bb" href="https://github.com/urbit/urbit">open source</a>.</p>
31− <ul class="list mt4">
32− <li class="mt3">
33− <a class="b--blue2 blue2 bb" href="/using/install/">Install + Setup</a>
34− </li>
35− <li class="mt3">
36− <a class="b--green2 green2 bb" href="/docs/">Documentation</a>
37− </li>
38− </ul>
22+
23+<section class="full lh-copy c2-11-md c3-11-lg mt4 f6">
24+ <strong>Urbit</strong>
25+ <a class="ml4" href="/understanding-urbit">Introduction</a>
26+ <a class="ml3" href="/blog">Blog</a>
27+ <a class="ml3" href="/docs">Documentation</a>
3928</section>
4029
30+<section class="full lh-copy c2-7-md c3-7-lg mt4 mb6">
31+ <p class="mt0 mb4"><strong>Urbit</strong> is a clean-slate OS and network for the 21st century.</p>
32+ <p><strong>Urbit OS</strong> is a clean slate reimagining of the operating system as an 'overlay OS.'</p>
33+ <p class="mb4">It's a compact system for an individual to run their own permanent personal server on any Unix machine with an internet connection.</p>
34+ <p class="mb4"><strong>Urbit ID</strong> is a decentralized digital identity system. Your
35+ Urbit ID is a username, network address, and crypto wallet.</p>
36+ <p><strong>Urbit OS + Urbit ID</strong> are designed to work together as a single system, are completely open source and 100% owned by the people who use them.</p>
37+</section>
4138
42−<section class="full lh-copy c7-12-md c7-11-lg mt4">
43− <p class="fw6">Latest Posts</p>
44− {% set s = get_section(path="updates/_index.md") %}
45− {% set e = get_section(path="blog/_index.md") %}
46− {% set allposts = s.pages
47− | concat (with=e.pages)
48− | sort(attribute="date")
49− | reverse
50− %}
51− {% for page in allposts | slice (end=2) %}
52− <a class="bb-0" href="{{ page.permalink }}">
53− <li class="mb4 list">
54− <h2 class="f5 fw6 mt0 mb1">{{ page.title }}</h2>
55− {% if page.extra.image %}
56− <img class="db pv2 obj-cover h4 w-50" src="{{ page.extra.image }}" />
57− {% endif %}
58− <time class="mono f6">{{ page.date | date(format="~%Y.%-m.%-d") }}</time>
59− <span class="mono f6">
60− {% if page.extra.ship %}
61− <address class="mono f6 mh2">{{ page.extra.ship }}</address>
62− {% endif %}
63− </span>
64− </li>
65− </a>
66− {% endfor %}
39+<section class="full lh-copy c7-12-md c7-11-lg mt4 mb6">
40+ <video class="vid-insert bg-black" id="ocean" autoplay="" muted="" loop="" poster="https://media.urbit.org/site/sea30-poster.jpg">
41+ </video>
6742</section>
6843
69−<section class="full c2-7-md c3-7-lg mt5">
70− <h1 class="mb3">Understanding Urbit</h1>
71− <p class="lh-copy mt1">This sequence of posts will give you a high-level overview of Urbit. They take about 20 minutes to read.</p>
72− <ul class="list">
44+
45+
46+<section class="full lh-copy c2-7-md c3-7-lg mb6">
47+ <ul class="list mt0">
48+ <li class="mt0">
49+ <a class="bb" href="/understanding-urbit">Introduction</a><br />
50+ Never heard of Urbit before? Start here to read a bit about the project.
51+ </li>
7352 <li class="mt3">
74− <a class="b--black bb" href="/understanding-urbit/">Introduction</a>
53+ <a class="b--blue2 blue2 bb" href="/using/install/">Install + Setup</a><br />
54+ If you're comfortable in the command-line, feel free to boot a node and try Urbit.
7555 </li>
76− {% set posts = get_section(path="understanding-urbit/_index.md") %} {%
77− for page in posts.pages %}
7856 <li class="mt3">
79− <a
80− class="b--black bb"
81− href="{{ page.permalink }}">
82− {{ page.title }}
83− </a>
57+ <a class="b--green2 green2 bb" href="/docs/">Documentation</a><br />
58+ To learn more about the technology, head to the docs.
8459 </li>
85− {% endfor %}
8660 </ul>
8761</section>
8862
89−<section class="full c7-12-md c7-11-lg mv5">
63+
64+<section class="full lh-copy c7-12-md c7-11-lg" id="follow">
9065 <h1 class="mb3">Stay Up to Date</h1>
9166 <p class="lh-copy mt1 mb3">
9267 We send regular updates about our project. Enter your email to get them.
@@ -120,22 +95,66 @@
12095 </div>
12196 </div>
12297 </form>
123− <p>You can also:</p>
124− <ul class="list">
125− <li class="mt3">
98+ <p class="lh-copy">
12699 Follow us on <a class="b--black bb" href="https://twitter.com/urbit">Twitter</a>
127− </li>
100+ </p>
101+ <p class="lh-copy">
102+ Explore the code on <a class="b--black bb" href="https://github.com/urbit/urbit">GitHub</a>
103+ </p>
104+ <p class="lh-copy">
105+ Ask questions in our <a class="b--black bb" href="https://discord.gg/Mae2bk7">Discord</a>
106+ </p>
107+ <p class="lh-copy">
108+ Boot Urbit and join:<br /> <code>~bitbet-bolbel/urbit-community</code><br /><br/> (That's where we hang out.)
109+ </p>
110+</section>
111+
112+<section class="full c2-7-md c3-7-lg mt5">
113+ <h1 class="mb3">Understanding Urbit</h1>
114+ <p class="lh-copy mt1">This sequence of posts will give you a high-level overview of Urbit. They take about 20 minutes to read.</p>
115+ <ul class="list">
128116 <li class="mt3">
129− Explore the code on
130− <a class="b--black bb" href="https://github.com/urbit/urbit">GitHub</a>
117+ <a class="b--black bb" href="/understanding-urbit/">Introduction</a>
131118 </li>
119+ {% set posts = get_section(path="understanding-urbit/_index.md") %} {%
120+ for page in posts.pages %}
132121 <li class="mt3">
133− Ask questions in our <a class="b--black bb" href="https://discord.gg/Mae2bk7">Discord</a>
122+ <a
123+ class="b--black bb"
124+ href="{{ page.permalink }}">
125+ {{ page.title }}
126+ </a>
134127 </li>
128+ {% endfor %}
135129 </ul>
136− <p class="lh-copy">
137− Or, boot Urbit and join the <code>~bitbet-bolbel/urbit-community</code>
138− </p>
130+</section>
131+
132+<section class="full c7-12-md c7-11-lg mv5">
133+ <h1 class="mb3">Latest Posts</h1>
134+ <p class="lh-copy mt1">We regularly write posts on our <a class="bb" href="/blog">blog</a> about what we're working on.</p>
135+ {% set s = get_section(path="updates/_index.md") %}
136+ {% set e = get_section(path="blog/_index.md") %}
137+ {% set allposts = s.pages
138+ | concat (with=e.pages)
139+ | sort(attribute="date")
140+ | reverse
141+ %}
142+ {% for page in allposts | slice (end=2) %}
143+ <a class="bb-0" href="{{ page.permalink }}">
144+ <li class="mb4 list">
145+ <h2 class="f5 fw6 mt0 mb1">{{ page.title }}</h2>
146+ {% if page.extra.image %}
147+ <img class="db pv2 obj-cover h4 w-50 ba" src="{{ page.extra.image }}" />
148+ {% endif %}
149+ <time class="mono f6">{{ page.date | date(format="~%Y.%-m.%-d") }}</time>
150+ <span class="mono f6">
151+ {% if page.extra.ship %}
152+ <address class="mono f6 mh2">{{ page.extra.ship }}</address>
153+ {% endif %}
154+ </span>
155+ </li>
156+ </a>
157+ {% endfor %}
139158</section>
140159
141160{% include "partials/footer.html" %}
templates/understanding-urbit/post.html+1−1
@@ -105,6 +105,6 @@
105105 </div>
106106 </form>
107107 <p class="mt3 mb3 mb3-xl lh-copy">You can also follow us on <a class="bb" href="https://twitter.com/urbit">Twitter</a> or <a class="bb" href="https://github.com/urbit">Github</a>.</p>
108− <p class="mt0 mb3 mb4-xl lh-copy">Or, preferably, on Urbit itself in the <code>~bitbet-bolbel/urbit-community</code></p>
108+ <p class="mt0 mb3 mb4-xl lh-copy">Or talk to us on Urbit: <code>~bitbet-bolbel/urbit-community</code></p>
109109 </section>
110110{% endblock content %}