git.iko.soy/urbit.org
on master help sign in
Merge pull request #100 from urbit/zola-port

Indigo typography with size hacks, internal links, form validation

commit96ccd9d7d61e88cd7cce80fbeec4366ae94cccdc authorMorgan Sutherland <msutherl@users.noreply.github.com> dateThu 23 May 2019, 17:11 (7 years ago) parent7fb5108f5fcbac
15 files changed+171−51
compare with master
unifiedsplit
.gitmodules+1−1 content/docs+1−1 content/posts/azimuth-as-multipass.md+4−4 content/posts/the-100-year-computer.md+1−1 content/posts/the-state-of-landscape.md+1−1 content/privacy.md+1 sass/_main.scss+88−19 static/scripts.js+44−4 templates/doc.html+1−1 templates/page.html+2−2 templates/partials/footer.html+6−2 templates/partials/navigation.html+18−12 templates/posts/single.html+1−1 templates/sections/docs.html+1−1 templates/sections/docs/chapters.html+1−1
.gitmodules+1−1
@@ -1,3 +1,3 @@
11[submodule "content/docs"]
22 path = content/docs
3− url = https://github.com/urbit/docs.git
3+ url = git@github.com:urbit/docs.git
content/docs+1−1

Submodule changed.

content/posts/azimuth-as-multipass.md+4−4
@@ -18,14 +18,14 @@ Why not just use one? Forget about how we get there for a moment: just imagine h
1818
1919An Azimuth point is an identity and a wallet. Both a driver’s license and a credit card. Identity and money. Think about it as a ‘civilizational key’ for a new society. Concretely, it’s nice to imagine it as a physical object. A slick, card sized object with an e-ink screen. You can tap it to pay, tap it to enter, and plug it into a computer to boot your Arvo OS.
2020
21−Worried about losing it? Just remember your ticket. If you use our wallet system, all you need to remember is something like `~ravmel-ropdyl` and `~habpem-sondem-pidbyt-solbyn`. A point and a ticket. That’s it.
21+Worried about losing it? Just remember your ticket. If you use our wallet system, all you need to remember is something like `~ravmel-ropdyl` and `~habpem-sondem-pidbyt-solbyn`. A point and a ticket. That’s it.
2222
23−Woke up in the desert, no idea how you got there, but can still remember your point and ticket? Great! Just get to an internet connection and re-ticket – you’ll be fine. Although probably dehydrated.
23+Woke up in the desert, no idea how you got there, but can still remember your point and ticket? Great! Just get to an internet connection and re-ticket – you’ll be fine. Although probably dehydrated.
2424
2525If you’re someone who’s worried about getting kidnapped, just use a child identity. Your Azimuth planet has ~4B of them, so you can always invalidate one if you lose it.
2626
27−Perhaps part of how we ended up in the world we’re in is that we didn’t have something like Azimuth to begin with. Today, it’s backwards: everyone has an address on the network, but no one has an identity.
27+Perhaps part of how we ended up in the world we’re in is that we didn’t have something like Azimuth to begin with. Today, it’s backwards: everyone has an address on the network, but no one has an identity.
2828
2929We think everyone needs an identity that can hold money and have packets routed to it. Start there, and it’s quite fun to imagine where you end up. A civilized digital society might even be possible after all.
3030
31−**Galen Wolfe-Pauly** ~ravmel-ropdyl
31+**Galen Wolfe-Pauly** `~ravmel-ropdyl`
content/posts/the-100-year-computer.md+1−1
@@ -24,4 +24,4 @@ Imagine that a computer was something you kept forever. It would comfortably sto
2424
2525Imagine a computer that was extremely valuable to you, that you’d pay thousands of dollars to recover, but you used *less* than the one you do today.
2626
27−**Galen Wolfe-Pauly** ~ravmel-ropdyl
27+**Galen Wolfe-Pauly** `~ravmel-ropdyl`
content/posts/the-state-of-landscape.md+1−1
@@ -72,4 +72,4 @@ Many of us spend all day on Landscape, use it from our phones, and find it reall
7272
7373We operate one public channel, `~dopzod/urbit-help` for answering any of your questions about the system. And, from time to time, we have been creating topic-centric channels and announcing them publicly. This has been a lot of fun. Come join us if you’re feeling brave.
7474
75−**Galen Wolfe-Pauly** ~ravmel-ropdyl
75+**Galen Wolfe-Pauly** `~ravmel-ropdyl`
content/privacy.md+1
@@ -1,6 +1,7 @@
11+++
22title = "Privacy Policy"
33+++
4+
45## Scope of this Privacy Policy
56
67Tlon Corporation ('Tlon,' 'we,' 'our,' and/or 'us') values the privacy of individuals who use Urbit software, our websites, and related services (collectively, our 'Services'). This privacy policy (the 'Privacy Policy') explains how we collect, use, and share information from users of our Services ('Users'). By using our Services, you agree to the collection, use, disclosure, and procedures this Privacy Policy describes. Beyond the Privacy Policy, your use of our Services is also subject to our Terms of Service.
sass/_main.scss+88−19
@@ -55,6 +55,10 @@ iframe {
5555 line-height: 8rem;
5656 margin-bottom: 1rem;
5757 }
58+ li {
59+ font-size: inherit;
60+ line-height: inherit;
61+ }
5862}
5963
6064.content-nav-icon {
@@ -259,20 +263,6 @@ iframe {
259263 width: 100%;
260264}
261265
262−.article {
263− h2 {
264− margin-top: 16rem;
265− margin-bottom: 4rem;
266− }
267− h3 {
268− margin-top: 8rem;
269− margin-bottom: 4rem;
270− }
271− h4 {
272− margin-bottom: 4rem;
273− }
274−}
275−
276266.form {
277267 width: 100%;
278268 max-width: 320px;
@@ -353,19 +343,62 @@ h1, h2, h3, h4, h5, h6, .text-heading {
353343 font-family: 'Inter UI', -apple-system, BlinkMacSystemFont, Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
354344}
355345
356−p, article li {
357− font-size: 4rem;
346+h1, h2, h3, h4 {
347+ font-weight: 700;
348+}
349+h1 {
350+ font-size: 8rem;
358351 line-height: 8rem;
359− font-weight: 400;
352+}
353+h2 {
354+ font-size: 6rem;
355+ line-height: 6rem;
356+}
357+h3 {
358+ font-size: 5rem;
359+ line-height: 5rem;
360+}
361+h4 {
362+ font-size: 4.5rem;
363+ line-height: 4.5rem;
364+}
365+h5 {
366+ font-size: 4rem;
367+ line-height: 4rem;
360368}
361369
362−article {
370+.article {
363371 h1 {
364− margin-bottom: 6rem;
372+ margin-bottom: 7rem;
373+ }
374+ h2 {
375+ margin-top: 8rem;
376+ margin-bottom: 4rem;
377+ }
378+ h3 {
379+ margin-top: 7rem;
380+ margin-bottom: 3rem;
381+ }
382+ h4 {
383+ margin-top: 6.5rem;
384+ margin-bottom: 2.5rem;
385+ }
386+ h5 {
387+ margin-top: 6rem;
388+ margin-bottom: 2rem;
365389 }
366390}
367391
392+li {
393+ font-size: 4rem;
394+ line-height: 8rem;
395+ font-weight: 400;
396+}
397+
368398p, .p {
399+ font-size: 4rem;
400+ font-weight: 400;
401+ line-height: 8rem;
369402 margin: 0 0 4rem;
370403}
371404
@@ -374,9 +407,45 @@ pre, code {
374407 background-color: #eee !important;
375408 color: #000 !important;
376409 overflow-y: scroll;
410+ font-weight: 400;
377411 span {
378412 color: #000 !important;
379413 }
380414 padding: 1rem;
381415 font-size: 4rem;
382416}
417+
418+textarea, input[type="text"], input[type="email"], input[type="number"] {
419+ border: 1px solid #B1B2B3;
420+ font-size: 4rem;
421+ line-height: 6rem;
422+ transition: all 0.1s linear;
423+ padding-right: 40px;
424+ position: relative;
425+ &:active, &:focus {
426+ border: 1px solid #000000;
427+ }
428+ &:required, &:invalid {
429+ box-shadow: none !important;
430+ border: 1px solid #EE892B;
431+ color: #EE892B;
432+ }
433+}
434+
435+.has-valid-input {
436+ position: relative;
437+ &:after {
438+ content: '✓';
439+ color: #2AA779;
440+ position: absolute;
441+ right: 10px;
442+ top: 50%;
443+ transform: translate(0,-50%);
444+ width: 15px;
445+ height: 24px;
446+ margin-top: -4px;
447+ }
448+ input[type="text"], input[type="email"], input[type="number"] {
449+ border: 1px solid #2AA779;
450+ }
451+}
static/scripts.js+44−4
@@ -1,9 +1,49 @@
1+//
2+ // toggling of navigation menus
3+//
4+
15var toggleMainNav = document.getElementById('js-main-nav-toggle');
2−toggleMainNav.onclick = function() {
3− document.body.classList.toggle('has-active-main-nav');
6+if (toggleMainNav !== null) {
7+ toggleMainNav.onclick = function() {
8+ document.body.classList.toggle('has-active-main-nav');
9+ }
410}
511
612var toggleContentNav = document.getElementById('js-content-nav-toggle');
7−toggleContentNav.onclick = function() {
8− document.body.classList.toggle('has-active-content-nav');
13+if (toggleContentNav !== null) {
14+ toggleContentNav.onclick = function() {
15+ document.body.classList.toggle('has-active-content-nav');
16+ }
17+}
18+
19+//
20+ // styling of input fields
21+//
22+
23+var inputElements = document.querySelectorAll('input.tlon-input');
24+for (var i = 0; i < inputElements.length; i++) {
25+ //listen for changes in input
26+ inputElements[i].addEventListener('input', function() {
27+ // if input has a value do this
28+ if (this.value) {
29+ var inputContainer = this.parentNode;
30+ var validInputs = inputContainer.querySelectorAll('input.tlon-input:valid');
31+ var inputs = inputContainer.querySelectorAll('input.tlon-input');
32+ if (validInputs.length !== 0) {
33+ // has valid input
34+ for (var i = 0; i < validInputs.length; i++) {
35+ if (this.classList.contains('is-valid') == false ) {
36+ validInputs[i].parentNode.classList.add('has-valid-input');
37+ }
38+ }
39+ } else {
40+ // doesn't have valid input
41+ for (var i = 0; i < inputs.length; i++) {
42+ inputs[i].parentNode.classList.remove('has-valid-input');
43+ }
44+ }
45+ } else {
46+ this.parentNode.classList.remove('has-valid-input');
47+ }
48+ });
949}
templates/doc.html+1−1
@@ -12,7 +12,7 @@
1212 </div>
1313 <div class="container ml8">
1414 <div class="content-nav-spacer"></div>
15− <article class="content">
15+ <article class="article content">
1616 <!-- header -->
1717 <h1>{{ page.title }}</h1>
1818 <!-- body -->
templates/page.html+2−2
@@ -39,8 +39,8 @@
3939 <div class="content posts__content pb40">
4040 <article class="article">
4141 <!-- header -->
42− <h4 class="mb16"><code>&#126;{% if page.date %}{{ page.date | date(format="%Y.%m.%d") }}{% endif %}</code></h4>
43− <h1 class="mt8 mb8">{{ page.title }}</h1>
42+ <!-- <h4 class="mb8"><code>&#126;{% if page.date %}{{ page.date | date(format="%Y.%m.%d") }}{% endif %}</code></h4> -->
43+ <h1 class="mb8">{{ page.title }}</h1>
4444 <!-- body -->
4545 {{ page.content | safe }}
4646 </article>
templates/partials/footer.html+6−2
@@ -8,7 +8,7 @@
88 <form id="mc-embedded-subscribe-form" class="validate" action="https://urbit.us11.list-manage.com/subscribe/post?u=972a03db9e0c6c25bb58de8c8&amp;amp;id=be143888d2" method="post" name="mc-embedded-subscribe-form" target="nothing">
99 <div class="input-group text-mono" id="mc_embed_signup_scroll">
1010 <div class="mc-field-group">
11− <input class="required mb2" type="email" name="EMAIL" id="mce-EMAIL" placeholder="your@email.com">
11+ <input class="required tlon-input mb2" type="email" name="EMAIL" id="mce-EMAIL" placeholder="your@email.com">
1212 </div>
1313 <div id="mce-responses" class="clear">
1414 <div id="mce-error-response" class="response" style="display:none"></div>
@@ -39,7 +39,11 @@
3939 </section>
4040 <section class="mb6">
4141 <h4 class="mb1">Contact</h4>
42− <a class="mono" href="mailto:support@urbit.org">support@urbit.org</a>
42+ <ul class="list">
43+ <li class="list__item">
44+ <a class="mono" href="mailto:support@urbit.org">support@urbit.org</a>
45+ </li>
46+ </ul>
4347 </section>
4448 <section class="mb6">
4549 <h4 class="mb1">Company</h4>
templates/partials/navigation.html+18−12
@@ -7,17 +7,19 @@
77 <div class="wrapper">
88 <div class="container">
99 <div class="nav-column">
10− <ul class="list">
11− {% for item in config.extra.urbit_menu %}
12− <li class="list__item">
13− <h2 class="mb6">
14− <a href="{{ item.url | replace(from="$BASE_URL", to=config.base_url) }}">
15− {{ item.name }}
16− </a>
17− </h2>
18− </li>
19− {% endfor %}
20− </ul>
10+ <div class="nav-links mb24">
11+ <ul class="list">
12+ {% for item in config.extra.urbit_menu %}
13+ <li class="list__item">
14+ <h2 class="mt0 mb6">
15+ <a href="{{ item.url | replace(from="$BASE_URL", to=config.base_url) }}">
16+ {{ item.name }}
17+ </a>
18+ </h2>
19+ </li>
20+ {% endfor %}
21+ </ul>
22+ </div>
2123 <section class="mt9 mb6">
2224 <h4 class="mb1">Follow</h4>
2325 <ul class="list">
@@ -31,7 +33,11 @@
3133 </section>
3234 <section class="mb6">
3335 <h4 class="mb1">Contact</h4>
34− <a class="mono" href="mailto:support@urbit.org">support@urbit.org</a>
36+ <ul class="list">
37+ <li class="list__item">
38+ <a class="mono" href="mailto:support@urbit.org">support@urbit.org</a>
39+ </li>
40+ </ul>
3541 </section>
3642 <section class="mb6">
3743 <h4 class="mb1">Company</h4>
templates/posts/single.html+1−1
@@ -36,7 +36,7 @@
3636 </div>
3737 <div class="container">
3838 <div class="content-nav-spacer"></div>
39− <article class="content posts__content">
39+ <article class="article content posts__content">
4040 <h1 class="mb8">{{ term.name }}</h1>
4141 <ul class="list">
4242 {% for page in term.pages %}
templates/sections/docs.html+1−1
@@ -12,7 +12,7 @@
1212 </div>
1313 <div class="container ml8">
1414 <div class="content-nav-spacer"></div>
15− <article class="content">
15+ <article class="article content">
1616 <!-- header -->
1717 <h1>{{ section.title }}</h1>
1818 <!-- body -->
templates/sections/docs/chapters.html+1−1
@@ -12,7 +12,7 @@
1212 </div>
1313 <div class="container ml8">
1414 <div class="content-nav-spacer"></div>
15− <article class="content mb16">
15+ <article class="article content mb16">
1616 <!-- header -->
1717 <h1 class="8mb">{{ section.title }}</h1>
1818 <!-- body -->