add relevant links to item meta

Author: chrisdwheatley

components/comment-thread.js

@@ -11,9 +11,9 @@ function commentThread(comments) {
         className="bb b--black-10 mb3"
       >
         <li>
-          <span className="mt3 f6 fw4 mb0 black-60">
+          <span className="mt3 f6 fw3 mb0 black-60">
             <Link route="user" params={{ name: user || "pg" }}>
-              <a className="link dim pv1 pr1 black-60">{user}</a>
+              <a className="link grow black-60">{user}</a>
             </Link>
             {" "}
             {time_ago}

components/item-meta.js

@@ -3,30 +3,53 @@ import { CSSTransitionGroup } from "react-transition-group";
 
 export default (
   { domain, url, title, user, points, time_ago, id, comments_count }
-) => (
-  <CSSTransitionGroup
-    transitionName="page-transition"
-    transitionAppear={true}
-    transitionAppearTimeout={500}
-    transitionEnter={false}
-    transitionLeave={false}
-  >
+) => {
+  let internalUrl;
+  if (url.substring(0, 8) === "item?id=") {
+    internalUrl = url.split("=").pop();
+  }
+
+  return (
     <article>
       <div className="dt w-100 bb b--black-10">
-        <a
-          className="link dtc dim pt2 pl2 pl3-ns w-50 w-65-m w-90-l"
-          href={url}
-        >
-          <h2 className="f4 f3-ns f2-l fw4 lh-title mv0 black baskerville">
-            {title}
-          </h2>
-          <div className="mt2 mb3 f7 f6-ns fw4 mb0 black-60">
-            {time_ago} {user && <span>by {user} ({points} points)</span>}
+        <div className="dtc pt2 pl2 pl3-ns w-50 w-65-m w-90-l">
+          {internalUrl &&
+            <Link prefetch route="comments" params={{ id: internalUrl }}>
+              <a
+                className="link dim f4 f3-ns f2-l fw3 lh-solid mv0 black baskerville"
+              >
+                {title}
+                {" "}
+                {domain &&
+                  <span className="f7 f6-ns f5-l fw3 black-60 sans-serif">
+                    ({domain})
+                  </span>}
+              </a>
+            </Link>}
+          {!internalUrl &&
+            <a
+              className="link dim f4 f3-ns f2-l fw3 lh-solid mv0 black baskerville"
+              href={url}
+            >
+              {title}
+              {" "}
+              {domain &&
+                <span className="fw2 f7 f6-ns f3-l black-60 sans-serif">
+                  ({domain})
+                </span>}
+            </a>}
+          <div className="mt2 mb3 f7 f6-ns fw3 mb0 black-60">
+            {time_ago} {user &&
+              <span>
+                by <Link route="user" params={{ name: user || "pg" }}>
+                  <a className="link grow black-60">{user}</a>
+                </Link> ({points} points)
+              </span>}
           </div>
-        </a>
+        </div>
         {user &&
           <Link prefetch route="comments" params={{ id }}>
-            <a className="dtc center link grow v-mid pr1 pr3-ns w-10">
+            <a className="dtc center link v-mid pr1 pr3-ns w-10 grow">
               <svg
                 className="fr pr2"
                 xmlns="http://www.w3.org/2000/svg"
@@ -51,5 +74,5 @@ export default (
           </Link>}
       </div>
     </article>
-  </CSSTransitionGroup>
-);
+  );
+};

components/navigation.js

@@ -30,7 +30,7 @@ export default ({ current }) => {
             >
               <a
                 className={
-                  `${current === item ? "pink" : "near-white dim"} link f7 f5-ns dib ph1 ph2-ns pv4 fw3`
+                  `${current === item ? "pink" : "near-white grow"} link f7 f5-ns dib ph1 ph2-ns pv4 fw3`
                 }
               >
                 {item.charAt(0).toUpperCase() + item.slice(1)}

components/user-details.js

@@ -1,7 +1,7 @@
 import Link from "next/link";
 
 export default ({ about, created, id, karma }) => (
-  <section className="center mw7 mh4 pa2 pa3-ns lh-title">
+  <section className="center mw7 mh4 pa2 pa3-ns lh-solid">
     <div className="dt w-100 pv1">
       <span className="dtc w-30 w-20-ns black-60">Username: </span>
       <span className="dtc w-70 w-80-ns">{id}</span>