Merge remote-tracking branch 'glen/comment' into web-stream

urbit/tree@7ce6a70, react mountpoint changed in ren/
urbit/talk@48ab9a8

ren/tree/body.hoon

@@ -5,10 +5,5 @@
 /=    dat    /%  /tree-json/ :: default include
 ^-  marl
 ;=  ;script(type "text/javascript"): window.tree = {(pojo (joba %data dat))}
-    ;div.container
+    ;div#tree;
-      ;div.row#main
-        ;div#head;
-        ;div#body;
-      ==
-    ==
 ==

web/talk/main.js

@@ -292,7 +292,7 @@ module.exports = recl({
 
 
 },{}],5:[function(require,module,exports){
-var Member, a, clas, div, h2, h3, label, pre, recl, ref,
+var Member, a, clas, div, h2, h3, label, pre, recl, ref, yaml,
   indexOf = [].indexOf || function(item) { for (var i = 0, l = this.length; i < l; i++) { if (i in this && this[i] === item) return i; } return -1; };
 
 clas = require('classnames');
@@ -303,6 +303,26 @@ ref = React.DOM, div = ref.div, pre = ref.pre, a = ref.a, label = ref.label, h2
 
 Member = require('./MemberComponent.coffee');
 
+yaml = function(x, pad) {
+  var k, v;
+  if (pad == null) {
+    pad = "";
+  }
+  if ("object" !== typeof x) {
+    return "" + x;
+  } else {
+    return ((function() {
+      var results;
+      results = [];
+      for (k in x) {
+        v = x[k];
+        results.push("\n" + pad + k + ": " + (yaml(v, pad + "  ")));
+      }
+      return results;
+    })()).join('');
+  }
+};
+
 module.exports = recl({
   displayName: "Message",
   lz: function(n) {
@@ -339,8 +359,8 @@ module.exports = recl({
     return this.props._handlePm(user);
   },
   renderSpeech: function(arg) {
-    var app, com, exp, fat, lin, mor, tax, url, x;
+    var api, app, com, exp, fat, lin, mor, tax, url, x;
-    lin = arg.lin, app = arg.app, exp = arg.exp, tax = arg.tax, url = arg.url, mor = arg.mor, fat = arg.fat, com = arg.com;
+    lin = arg.lin, app = arg.app, exp = arg.exp, tax = arg.tax, url = arg.url, mor = arg.mor, fat = arg.fat, api = arg.api, com = arg.com;
     switch (false) {
       case !(lin || app || exp || tax):
         return (lin || app || exp || tax).txt;
@@ -361,6 +381,10 @@ module.exports = recl({
         return div({}, this.renderSpeech(fat.taf), div({
           className: "fat"
         }, this.renderTorso(fat.tor)));
+      case !api:
+        return div({}, a({
+          href: api.url
+        }, "[Piped data]"), pre({}, yaml(api)));
       default:
         return "Unknown speech type:" + ((function() {
           var results;
@@ -394,11 +418,13 @@ module.exports = recl({
     }
   },
   classesInSpeech: function(arg) {
-    var app, exp, fat, lin, mor, url;
+    var api, app, exp, fat, lin, mor, url;
-    url = arg.url, exp = arg.exp, app = arg.app, lin = arg.lin, mor = arg.mor, fat = arg.fat;
+    url = arg.url, api = arg.api, exp = arg.exp, app = arg.app, lin = arg.lin, mor = arg.mor, fat = arg.fat;
     switch (false) {
       case !url:
         return "url";
+      case !api:
+        return "api";
       case !exp:
         return "exp";
       case !app:
@@ -590,11 +616,13 @@ module.exports = recl({
     if (this.state.station && this.state.listening.indexOf(this.state.station) === -1) {
       MessageActions.listenStation(this.state.station);
     }
-    $(window).on('scroll', this.checkMore);
+    if (this.props.readOnly == null) {
+      $(window).on('scroll', this.checkMore);
+      window.util.scrollToBottom();
+    }
     this.focused = true;
     $(window).on('blur', this._blur);
-    $(window).on('focus', this._focus);
+    return $(window).on('focus', this._focus);
-    return window.util.scrollToBottom();
   },
   componentWillUpdate: function(props, state) {
     var $window, i, j, key, lastSaid, len, len1, message, nowSaid, old, ref, ref1, results, sameAs, scrollTop;
@@ -623,7 +651,7 @@ module.exports = recl({
   },
   componentDidUpdate: function(_props, _state) {
     var _messages, d, t;
-    if (this.setOffset) {
+    if (this.setOffset && (this.props.readOnly == null)) {
       $(window).scrollTop(this.setOffset);
       this.setOffset = null;
     }
@@ -657,7 +685,7 @@ module.exports = recl({
     return StationActions.setAudience(audi);
   },
   render: function() {
-    var _messages, lastIndex, lastSaid, messageHeights, messages, ref, station;
+    var _messages, body, lastIndex, lastSaid, messageHeights, messages, ref, station;
     station = this.state.station;
     messages = this.sortedMessages(this.state.messages);
     this.last = messages[messages.length - 1];
@@ -696,15 +724,20 @@ module.exports = recl({
         }));
       };
     })(this));
+    if (this.props.readOnly == null) {
+      body = React.createElement(Infinite, {
+        useWindowAsScrollContainer: true,
+        containerHeight: window.innerHeight,
+        elementHeight: messageHeights,
+        key: "messages-infinite"
+      }, _messages);
+    } else {
+      body = _messages;
+    }
     return div({
       className: "grams",
       key: "messages"
-    }, React.createElement(Infinite, {
+    }, body);
-      useWindowAsScrollContainer: true,
-      containerHeight: window.innerHeight,
-      elementHeight: messageHeights,
-      key: "messages-infinite"
-    }, _messages));
   }
 });
 
@@ -1280,6 +1313,9 @@ TreeActions.registerComponent("talk", React.createClass({
     var station;
     require('./utils/util.coffee');
     require('./utils/move.coffee');
+    if (!this.props.readonly) {
+      $(window).on('scroll', window.util.checkScroll);
+    }
     station = this.getStation();
     StationActions.listen();
     StationActions.listenStation(station);
@@ -1959,8 +1995,6 @@ $(window).on('scroll', function(e) {
   return so.ls = so.cs;
 });
 
-$(window).on('scroll', window.util.checkScroll);
-
 
 },{}],16:[function(require,module,exports){
 if (!window.util) {

web/tree/main.css

@@ -14,6 +14,34 @@ img.logo {
 img.logo.first {
   margin-bottom: 2rem; }
 
+div.logo {
+  width: 3rem;
+  height: 3rem;
+  background-color: #fff;
+  display: inline-block;
+  margin-right: 1rem;
+  border-radius: 50%;
+  vertical-align: middle;
+  margin-top: -.8rem;
+  background-color: #0500F0; }
+
+div.logo:before {
+  content: "~";
+  color: #B1B7BD;
+  font-size: 2.6rem;
+  vertical-align: middle;
+  line-height: 3rem;
+  margin-top: .2rem;
+  text-align: center;
+  width: 2rem;
+  display: inline-block; }
+
+div.logo.inverse:before {
+  color: #fff; }
+
+.lead .logo.inverse {
+  margin-top: -1.4rem; }
+
 .short {
   width: 75%; }
 
@@ -30,6 +58,18 @@ img.logo.first {
     font-size: 1rem;
     line-height: 2rem; }
 
+.link-next {
+  margin-top: 4rem; }
+  .link-next a {
+    padding: .6rem;
+    border: 2px solid;
+    text-decoration: none;
+    font-weight: 500;
+    margin-top: 4rem; }
+  .link-next a:hover {
+    background-color: #000;
+    color: #fff; }
+
 .loading:before {
   font-family: 'scp';
   background-color: #000;
@@ -40,6 +80,7 @@ img.logo.first {
   height: 1.6rem;
   text-align: center;
   font-size: .8rem;
+  line-height: 1.7rem;
   display: block;
   font-weight: 600;
   z-index: 3; }
@@ -79,7 +120,8 @@ img.logo.first {
   #head {
     top: 0;
     z-index: 10;
-    width: 100%; }
+    width: 100%;
+    position: absolute; }
   #head.m-down,
   #head.m-up {
     position: absolute; }
@@ -99,29 +141,64 @@ img.logo.first {
   background-color: #fff;
   transition: max-width .2s ease-in-out;
   position: fixed;
+  height: 100%;
   z-index: 100; }
   .ctrl ul.nav {
     margin-top: 2rem;
-    overflow: hidden; }
+    overflow-x: hidden;
+    overflow-y: scroll;
+    height: 100%; }
     .ctrl ul.nav li {
       width: 100%;
       overflow: hidden;
-      white-space: nowrap; }
+      white-space: nowrap;
+      margin-bottom: .6rem; }
   .ctrl ul.nav:hover {
-    overflow: visible; }
+    overflow-x: visible; }
-  .ctrl a.nav-link:hover {
-    text-decoration: underline; }
   .ctrl a.nav-link {
-    letter-spacing: 1px; }
+    letter-spacing: 1px;
+    text-decoration: none;
+    border-bottom: 2px solid;
+    line-height: 1rem; }
   .ctrl .selected a.nav-link {
     font-weight: 500; }
 
+.ctrl.navbar {
+  position: relative;
+  margin-bottom: 3rem;
+  padding: 0;
+  background-color: transparent; }
+  .ctrl.navbar .icon,
+  .ctrl.navbar ul.nav,
+  .ctrl.navbar li {
+    display: inline-block;
+    padding: 0; }
+  .ctrl.navbar ul.nav {
+    margin-top: 0;
+    overflow: visible; }
+    .ctrl.navbar ul.nav li {
+      width: auto;
+      display: inline-block;
+      min-width: 16.66667%; }
+    .ctrl.navbar ul.nav .right {
+      float: right; }
+    .ctrl.navbar ul.nav .btn {
+      margin: 0;
+      padding: 0;
+      border: 0;
+      text-transform: none; }
+
 .ctrl.open,
 .ctrl:hover {
   max-width: 33.33333%;
   min-width: 16.66667%;
   width: auto; }
 
+.ctrl.navbar.open,
+.ctrl.navbar:hover {
+  max-width: none;
+  min-width: none; }
+
 @media (max-width: 991px) {
   ul.nav {
     line-height: 1.3rem; }
@@ -150,7 +227,10 @@ img.logo.first {
   .ctrl.open {
     max-height: 12rem; }
   a.nav-link {
-    font-size: 1rem; }
+    font-size: 1rem;
+    line-height: 1rem;
+    text-decoration: none;
+    border-bottom: 2px solid; }
   .ctrl.open ul.nav {
     max-height: 9rem;
     overflow-y: scroll; } }
@@ -165,6 +245,9 @@ img.logo.first {
   opacity: .2;
   margin-left: -.2rem; }
 
+.items {
+  height: 80%; }
+
 @media (min-width: 768px) {
   .ctrl .navbar-toggler {
     display: none; }
@@ -264,7 +347,7 @@ img.logo.first {
 
 [data-path^='/docs'] .selected .nav-link,
 [data-path^='/work'] .selected .nav-link {
-  color: #02D124; }
+  color: #55595c; }
 
 [data-path^='/docs'] .nav-link,
 [data-path^='/work'] .nav-link {
@@ -272,13 +355,13 @@ img.logo.first {
 
 [data-path^='/docs'] .home,
 [data-path^='/work'] .home {
-  background-color: #0500F0;
+  background-color: #55595c;
-  border-color: #0500F0; }
+  border-color: #55595c; }
 
 [data-path^='/docs'] .home:hover,
 [data-path^='/work'] .home:hover {
-  background-color: #0500F0;
+  background-color: #B1B7BD;
-  border-color: #0500F0;
+  border-color: #B1B7BD;
   opacity: .6; }
 
 [data-path^='/docs'] .home:before,
@@ -343,20 +426,147 @@ img.logo.first {
     line-height: 1rem;
     margin-bottom: 1rem; } }
 
+.urbit.navbar.ctrl .icon .home {
+  border-color: #B1B7BD;
+  background-color: #B1B7BD;
+  width: 3rem;
+  height: 3rem;
+  margin: 0 4rem 0 0; }
+
+.urbit.navbar.ctrl .icon .home:before {
+  content: "~";
+  color: #fff;
+  font-size: 2.6rem;
+  line-height: 2.6rem;
+  text-align: center;
+  width: 2.4rem;
+  display: inline-block; }
+
+.urbit.navbar.ctrl ul.nav li {
+  height: 3rem;
+  vertical-align: middle; }
+
+.urbit.navbar.ctrl ul.nav li a {
+  text-decoration: none;
+  color: #B1B7BD;
+  font-weight: 500;
+  font-size: 1rem;
+  line-height: 3rem; }
+
+.urbit.navbar.ctrl ul.nav .btn {
+  border: 3px solid #0500F0;
+  margin-top: -3px;
+  height: 3rem;
+  padding: 0rem; }
+  .urbit.navbar.ctrl ul.nav .btn a {
+    font-size: 1rem;
+    color: #0500F0;
+    letter-spacing: 0; }
+
+.urbit.navbar.ctrl ul.nav .btn.selected,
+.urbit.navbar.ctrl ul.nav .btn:hover {
+  background-color: #0500F0; }
+  .urbit.navbar.ctrl ul.nav .btn.selected a,
+  .urbit.navbar.ctrl ul.nav .btn:hover a {
+    color: #fff; }
+
+.urbit.navbar.ctrl ul.nav li a:hover,
+.urbit.navbar.ctrl ul.nav li.selected a {
+  color: #0500F0; }
+
+.urbit.navbar.ctrl .subnav ul.nav {
+  height: 1.5rem; }
+  .urbit.navbar.ctrl .subnav ul.nav li {
+    height: 1.5rem; }
+  .urbit.navbar.ctrl .subnav ul.nav li a {
+    line-height: 1.5rem; }
+  .urbit.navbar.ctrl .subnav ul.nav .btn {
+    position: relative;
+    height: 3rem; }
+    .urbit.navbar.ctrl .subnav ul.nav .btn a {
+      line-height: 3rem; }
+
+.urbit.home.navbar.ctrl .icon .home {
+  opacity: 0;
+  border-color: #fff;
+  background-color: #fff; }
+
+.urbit.home.navbar.ctrl .icon .home:before {
+  color: #B1B7BD; }
+
+.urbit.home.navbar.ctrl ul.nav li a {
+  color: #f7f7f9; }
+
+@media (max-width: 767px) {
+  .urbit.navbar.ctrl .icon {
+    margin-top: .5rem;
+    margin-bottom: .5rem; }
+    .urbit.navbar.ctrl .icon .home {
+      width: 2rem;
+      height: 2rem;
+      margin: 0; }
+    .urbit.navbar.ctrl .icon .home:before {
+      font-size: 1.6rem;
+      line-height: 1.8rem;
+      width: 1.6rem; }
+  .urbit.navbar.ctrl .navbar-toggler {
+    margin-top: .5rem;
+    margin-left: 1rem; }
+  .urbit.navbar.ctrl ul.nav,
+  .urbit.navbar.ctrl .subnav ul.nav {
+    overflow: visible;
+    height: auto;
+    margin-left: 3rem;
+    float: left; }
+    .urbit.navbar.ctrl ul.nav li,
+    .urbit.navbar.ctrl .subnav ul.nav li {
+      display: block;
+      height: 1.5rem; }
+      .urbit.navbar.ctrl ul.nav li a,
+      .urbit.navbar.ctrl .subnav ul.nav li a {
+        line-height: 1.5rem; }
+    .urbit.navbar.ctrl ul.nav li.btn,
+    .urbit.navbar.ctrl .subnav ul.nav li.btn {
+      height: 1.5rem;
+      border: 0; }
+      .urbit.navbar.ctrl ul.nav li.btn a,
+      .urbit.navbar.ctrl .subnav ul.nav li.btn a {
+        color: #64DE79;
+        line-height: 1.5rem; } }
+
 .lead h1:first-of-type {
   padding-bottom: 0; }
 
+.flush {
+  padding-top: 0; }
+
 .h-arrow {
-  float: left;
+  width: 100%;
+  height: 9rem;
   margin-bottom: 3rem; }
+  .h-arrow h1,
+  .h-arrow img {
+    float: left; }
+  .h-arrow img {
+    height: 6rem;
+    margin: 1rem 0 0 1rem; }
   .h-arrow h1 {
     color: #0500F0;
-    display: inline; }
+    display: inline-block;
+    line-height: 4rem; }
   .h-arrow h1 code {
     background-color: transparent;
     color: #0500F0; }
-  .h-arrow img {
+
-    float: right; }
+.footer {
+  margin-top: 6rem;
+  font-weight: 500;
+  color: #B1B7BD; }
+  .footer a {
+    color: #55595c;
+    text-decoration: none;
+    border-bottom: 2px solid #55595c;
+    margin-left: .6rem; }
 
 .body[data-path^='/docs'] h1,
 .body[data-path^='/work'] h1 {
@@ -404,6 +614,176 @@ img.logo.first {
   padding-top: 0;
   margin-bottom: 0; }
 
+.body .urbit h1 {
+  color: #0500F0;
+  line-height: 4rem; }
+
+.body .urbit a.green:hover {
+  color: #64DE79; }
+
+.body .urbit .container.stack {
+  margin-bottom: 3rem; }
+
+.body .urbit .container.stack.six {
+  margin-top: 12rem;
+  margin-bottom: 6rem; }
+
+.body .urbit .btn.black {
+  text-transform: none;
+  text-decoration: none;
+  border: 3px solid #000;
+  letter-spacing: 0;
+  margin-right: 1rem; }
+
+.body .urbit button.submit:hover,
+.body .urbit .btn.black:hover {
+  background-color: #0500F0;
+  color: #fff; }
+
+.body .urbit .front {
+  padding-bottom: 4rem; }
+  .body .urbit .front h1 {
+    padding-top: 0; }
+  .body .urbit .front h1,
+  .body .urbit .front h1 a {
+    font-size: 4rem;
+    line-height: 6rem; }
+
+.body .urbit .image-fs {
+  height: 44rem;
+  margin-bottom: 3rem; }
+  .body .urbit .image-fs .text-container,
+  .body .urbit .image-fs .image-container {
+    position: absolute; }
+  .body .urbit .image-fs .text-container {
+    display: table;
+    height: 44rem;
+    width: 100%;
+    z-index: 1; }
+    .body .urbit .image-fs .text-container .text {
+      display: table-cell;
+      vertical-align: middle; }
+    .body .urbit .image-fs .text-container .rect {
+      width: 60%;
+      margin-left: auto;
+      margin-right: auto; }
+      .body .urbit .image-fs .text-container .rect h1 {
+        padding-bottom: 1rem;
+        text-align: left; }
+    .body .urbit .image-fs .text-container .rect.no-header {
+      font-weight: 500;
+      color: #fff;
+      font-size: 1.4rem; }
+      .body .urbit .image-fs .text-container .rect.no-header p.email {
+        font-size: 1rem; }
+      .body .urbit .image-fs .text-container .rect.no-header button.submit {
+        background-color: transparent;
+        border-color: #fff; }
+  .body .urbit .image-fs .image-container {
+    z-index: 0;
+    height: 44rem;
+    width: 100%;
+    overflow: hidden; }
+    .body .urbit .image-fs .image-container img {
+      position: relative;
+      left: 50%;
+      margin-left: -50%;
+      top: 50%;
+      margin-top: -50%;
+      min-height: 44rem;
+      min-width: 100%; }
+  .body .urbit .image-fs h1 {
+    text-align: center;
+    color: #fff; }
+
+.body .urbit .image-fs.first {
+  margin-top: -9rem; }
+
+.body .urbit .slide {
+  margin-bottom: 12rem;
+  position: relative; }
+  .body .urbit .slide h1 {
+    padding-bottom: 1rem; }
+  .body .urbit .slide .pair {
+    display: table; }
+    .body .urbit .slide .pair .text,
+    .body .urbit .slide .pair .image {
+      display: table-cell;
+      vertical-align: middle; }
+    .body .urbit .slide .pair .image.right {
+      padding-left: 5%; }
+    .body .urbit .slide .pair .image.left {
+      padding-right: 5%; }
+    .body .urbit .slide .pair .text {
+      width: 75%; }
+    .body .urbit .slide .pair .image {
+      width: 20%; }
+    .body .urbit .slide .pair p:last-child {
+      margin-bottom: 0; }
+
+.body .urbit .end {
+  padding: 1rem;
+  background-color: #64DE79;
+  color: white;
+  text-decoration: none;
+  font-size: 2rem;
+  font-weight: 500; }
+
+.body .urbit input.email,
+.body .urbit button.submit {
+  line-height: 1rem;
+  padding: .6rem;
+  border: 0; }
+
+.body .urbit input.email {
+  font-weight: 500;
+  background-color: #B1B7BD;
+  color: #fff;
+  margin-right: 1rem;
+  border: 3px solid #B1B7BD; }
+
+.body .urbit input.email::-moz-placeholder {
+  color: #D2D2D2; }
+
+.body .urbit input.email::-webkit-input-placeholder {
+  color: #D2D2D2; }
+
+.body .urbit button.submit {
+  text-transform: none;
+  text-decoration: none;
+  border: 3px solid #000;
+  background-color: #fff;
+  font-weight: 500;
+  letter-spacing: 0; }
+
+.body .urbit .last a {
+  display: block;
+  font-weight: 500;
+  color: #B1B7BD; }
+
+.body .urbit .last h2 {
+  padding-top: 0;
+  padding-bottom: 1rem;
+  margin-bottom: 0; }
+
+.body .urbit.home p.email {
+  margin-top: 3rem; }
+
+@media (max-width: 767px) {
+  .body .urbit {
+    margin-top: 4rem; }
+    .body .urbit .slide .pair,
+    .body .urbit .slide .pair .text,
+    .body .urbit .slide .pair .image {
+      display: block;
+      width: 100%; }
+    .body .urbit .slide .pair .image {
+      text-align: center; }
+    .body .urbit .slide .pair .image.left {
+      margin-bottom: 2rem; }
+    .body .urbit .slide .pair .image.right {
+      margin-top: 2rem; } }
+
 @keyframes menu-open {
   0% {
     visibility: hidden; }
@@ -518,14 +898,14 @@ img.logo.first {
   .body[data-path^='/docs'] .list h1,
   .body[data-path^='/work'] .list a,
   .body[data-path^='/work'] .list h1 {
-    color: #02D124;
+    color: #55595c;
     font-weight: 500;
     height: 2rem;
     display: inline;
     text-decoration: none; }
   .body[data-path^='/docs'] .list h1,
   .body[data-path^='/work'] .list h1 {
-    border-bottom: 2px solid #02D124; }
+    border-bottom: 2px solid #55595c; }
 
 .body[data-path^='/work'] .list.main a,
 .body[data-path^='/work'] .list.main h1 {
@@ -552,7 +932,7 @@ img.logo.first {
   .body[data-path^='/docs'] .list.runes a h1 code {
     margin-right: 1rem;
     background-color: transparent;
-    color: #0500F0; }
+    color: #55595c; }
   .body[data-path^='/docs'] .list.runes a code {
     background-color: #eceeef; }
   .body[data-path^='/docs'] .list.runes a code {
@@ -571,6 +951,21 @@ img.logo.first {
   .body[data-path^='/docs'] .list.runes a:hover:after {
     background-color: #0500F0; }
 
+.urbit ul.blog {
+  list-style-type: none;
+  padding-left: 0; }
+  .urbit ul.blog li {
+    margin-bottom: 12rem; }
+  .urbit ul.blog .btn {
+    padding: .3rem;
+    border: 3px solid #64DE79;
+    color: #64DE79;
+    text-decoration: none;
+    text-transform: none; }
+  .urbit ul.blog .btn:hover {
+    background-color: #64DE79;
+    color: #fff; }
+
 .kids.runes h1 {
   padding-top: 3rem; }
 
@@ -587,6 +982,53 @@ img.logo.first {
 .kids.runes > div p:first-of-type {
   font-weight: 500; }
 
+.urbit .post .date,
+.urbit.post .date {
+  font-family: 'scp';
+  color: #B1B7BD;
+  font-size: .7rem;
+  font-weight: 200; }
+
+.urbit .post h1.title,
+.urbit .post p.preview,
+.urbit.post h1.title,
+.urbit.post p.preview {
+  font-weight: 500; }
+
+.urbit .post h1.title,
+.urbit.post h1.title {
+  font-size: 2rem;
+  padding-bottom: 0; }
+
+.urbit .post h1.title,
+.urbit .post img,
+.urbit.post h1.title,
+.urbit.post img {
+  width: 100%;
+  margin-bottom: 2rem; }
+
+.urbit .post .date,
+.urbit .post p.preview,
+.urbit .post h3.author,
+.urbit.post .date,
+.urbit.post p.preview,
+.urbit.post h3.author {
+  margin-bottom: .6rem; }
+
+.urbit .post h3.author,
+.urbit.post h3.author {
+  padding-top: 0;
+  font-size: 1rem;
+  font-weight: 200; }
+
+.urbit .post h3:before,
+.urbit.post h3:before {
+  content: "—";
+  margin-right: .6rem; }
+
+.urbit.post .preview {
+  max-width: 75%; }
+
 .sections h1 {
   font-size: 2rem;
   color: #0500F0; }
@@ -605,7 +1047,7 @@ img.logo.first {
 .sections ul li,
 .sections ul li a,
 .sections ul li h1 span {
-  color: #02D124;
+  color: #55595c;
   height: 2rem; }
 
 .sections .kids > div {
@@ -614,7 +1056,9 @@ img.logo.first {
   margin-right: 3rem;
   margin-top: 2rem;
   min-width: 14rem;
-  margin-bottom: 3rem; }
+  margin-bottom: 3rem;
+  padding: 0;
+  float: none; }
 
 .sections .kids > div p {
   font-weight: 500; }
@@ -623,7 +1067,7 @@ img.logo.first {
   display: none; }
 
 .lead-offset {
-  margin-left: 8rem; }
+  margin-left: 4rem; }
 
 @media (max-width: 991px) {
   .lead-offset {
@@ -655,16 +1099,17 @@ img.logo.first {
   padding-top: 3rem; }
   .comments .comment {
     margin-top: 2rem; }
-    .comments .comment h3,
-    .comments .comment > span {
-      font-family: 'scp'; }
     .comments .comment > span {
+      font-family: 'scp';
       font-size: .8rem;
       color: #B1B7BD; }
-    .comments .comment h3 {
+    .comments .comment h2 {
       padding-top: 0;
       font-size: 1rem;
       font-weight: 500; }
+      .comments .comment h2 code {
+        background-color: transparent;
+        padding: 0; }
     .comments .comment p {
       width: 66%; }