client/build/components/PageLayout/index.js

@@ -50,7 +50,7 @@ function (_React$Component) {
         pageUri: this.props.pageUri
       }), _react.default.createElement(_NavBar.default, null), _react.default.createElement("div", {
         className: 'content'
-      }, this.props.content));
+      }, this.props.children));
     }
   }]);
 

client/build/components/PageLayoutShowLite/index.js

@@ -53,9 +53,7 @@ function (_React$Component) {
         asset: this.props.asset
       }), _react.default.createElement("div", {
         className: 'content'
-      }, this.props.content), _react.default.createElement("div", {
+      }, this.props.children));
-        className: 'footer'
-      }, this.props.footer));
     }
   }]);
 

client/build/pages/AboutPage/index.js

@@ -49,12 +49,11 @@ function (_React$Component) {
     value: function render() {
       return _react.default.createElement(_PageLayout.default, {
         pageTitle: 'About',
-        pageUri: 'about',
+        pageUri: 'about'
-        content: _react.default.createElement(_HorizontalSplit.default, {
+      }, _react.default.createElement(_HorizontalSplit.default, {
-          leftSide: _react.default.createElement(_AboutSpeechOverview.default, null),
+        leftSide: _react.default.createElement(_AboutSpeechOverview.default, null),
-          rightSide: _react.default.createElement(_AboutSpeechDetails.default, null)
+        rightSide: _react.default.createElement(_AboutSpeechDetails.default, null)
-        })
+      }));
-      });
     }
   }]);
 

client/build/pages/ErrorPage/index.js

@@ -46,9 +46,8 @@ function (_React$Component) {
       var error = this.props.error;
       return _react.default.createElement(_PageLayout.default, {
         pageTitle: 'Error',
-        pageUri: 'error',
+        pageUri: 'error'
-        content: _react.default.createElement("p", null, error)
+      }, _react.default.createElement("p", null, error));
-      });
     }
   }]);
 

client/build/pages/FourOhFourPage/index.js

@@ -43,9 +43,8 @@ function (_React$Component) {
     value: function render() {
       return _react.default.createElement(_PageLayout.default, {
         pageTitle: '404',
-        pageUri: '/404',
+        pageUri: '/404'
-        content: _react.default.createElement("div", null, _react.default.createElement("h2", null, "404"), _react.default.createElement("p", null, "That page does not exist"))
+      }, _react.default.createElement("h2", null, "404"), _react.default.createElement("p", null, "That page does not exist"));
-      });
     }
   }]);
 

client/build/pages/HomePage/index.js

@@ -45,9 +45,8 @@ function (_React$Component) {
     value: function render() {
       return _react.default.createElement(_PageLayout.default, {
         pageTitle: 'Speech',
-        pageUri: '',
+        pageUri: ''
-        content: _react.default.createElement(_PublishTool.default, null)
+      }, _react.default.createElement(_PublishTool.default, null));
-      });
     }
   }]);
 

client/build/pages/LoginPage/view.js

@@ -59,12 +59,11 @@ function (_React$Component) {
     value: function render() {
       return _react.default.createElement(_PageLayout.default, {
         pageTitle: 'Login',
-        pageUri: 'login',
+        pageUri: 'login'
-        content: _react.default.createElement(_HorizontalSplit.default, {
+      }, _react.default.createElement(_HorizontalSplit.default, {
-          leftSide: _react.default.createElement(_ChannelAbout.default, null),
+        leftSide: _react.default.createElement(_ChannelAbout.default, null),
-          rightSide: _react.default.createElement(_ChannelTools.default, null)
+        rightSide: _react.default.createElement(_ChannelTools.default, null)
-        })
+      }));
-      });
     }
   }]);
 

client/build/pages/MultisitePage/index.js

@@ -82,9 +82,8 @@ function (_React$Component) {
     value: function render() {
       return _react.default.createElement(_PageLayout.default, {
         pageTitle: 'Multisite',
-        pageUri: '/multisite',
+        pageUri: '/multisite'
-        content: _react.default.createElement(MultisiteContent, null)
+      }, _react.default.createElement(MultisiteContent, null));
-      });
     }
   }]);
 

client/build/pages/ShowAssetDetails/view.js

@@ -57,12 +57,11 @@ function (_React$Component) {
         var name = asset.claimData.name;
         return _react.default.createElement(_PageLayout.default, {
           pageTitle: "".concat(name, " - details"),
-          asset: asset,
+          asset: asset
-          content: _react.default.createElement("div", null, _react.default.createElement(_AssetTitle.default, null), _react.default.createElement(_HorizontalSplit.default, {
+        }, _react.default.createElement(_AssetTitle.default, null), _react.default.createElement(_HorizontalSplit.default, {
-            leftSide: _react.default.createElement(_AssetDisplay.default, null),
+          leftSide: _react.default.createElement(_AssetDisplay.default, null),
-            rightSide: _react.default.createElement(_AssetInfo.default, null)
+          rightSide: _react.default.createElement(_AssetInfo.default, null)
-          }))
+        }));
-        });
       }
 
       return _react.default.createElement(_ErrorPage.default, {

client/build/pages/ShowAssetLite/view.js

@@ -15,6 +15,8 @@ var _AssetDisplay = _interopRequireDefault(require("@containers/AssetDisplay"));
 
 var _SpaceAround = _interopRequireDefault(require("@components/SpaceAround"));
 
+var _VerticalSplit = _interopRequireDefault(require("@components/VerticalSplit"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
@@ -35,6 +37,21 @@ function _assertThisInitialized(self) { if (self === void 0) { throw new Referen
 
 function _getPrototypeOf(o) { _getPrototypeOf = Object.getPrototypeOf || function _getPrototypeOf(o) { return o.__proto__; }; return _getPrototypeOf(o); }
 
+var AssetLiteFooter = function AssetLiteFooter(_ref) {
+  var name = _ref.name,
+      claimId = _ref.claimId;
+  return _react.default.createElement(_SpaceAround.default, null, _react.default.createElement("p", {
+    className: 'text--extra-small'
+  }, _react.default.createElement(_reactRouterDom.Link, {
+    className: "link--primary",
+    to: "/".concat(claimId, "/").concat(name)
+  }, " hosted on spee.ch"), " via the ", _react.default.createElement("a", {
+    className: "link--primary",
+    href: 'https://lbry.io/get',
+    target: '_blank'
+  }, "LBRY"), " blockchain"));
+};
+
 var ShowLite =
 /*#__PURE__*/
 function (_React$Component) {
@@ -55,19 +72,14 @@ function (_React$Component) {
             claimId = _asset$claimData.claimId;
         return _react.default.createElement(_PageLayoutShowLite.default, {
           pageTitle: name,
-          asset: asset,
+          asset: asset
-          content: _react.default.createElement(_AssetDisplay.default, null),
+        }, _react.default.createElement(_VerticalSplit.default, {
-          footer: _react.default.createElement(_SpaceAround.default, null, _react.default.createElement("p", {
+          top: _react.default.createElement(_AssetDisplay.default, null),
-            className: 'text--extra-small'
+          bottom: _react.default.createElement(AssetLiteFooter, {
-          }, _react.default.createElement(_reactRouterDom.Link, {
+            name: name,
-            className: "link--primary",
+            claimId: claimId
-            to: "/".concat(claimId, "/").concat(name)
+          })
-          }, " hosted on spee.ch"), " via the ", _react.default.createElement("a", {
+        }));
-            className: "link--primary",
-            href: 'https://lbry.io/get',
-            target: '_blank'
-          }, "LBRY"), " blockchain"))
-        });
       }
 
       return _react.default.createElement("div", null, _react.default.createElement("p", {

client/build/pages/ShowChannel/view.js

@@ -55,13 +55,12 @@ function (_React$Component) {
             shortId = channel.shortId;
         return _react.default.createElement(_PageLayout.default, {
           pageTitle: name,
-          channel: channel,
+          channel: channel
-          content: _react.default.createElement("div", null, _react.default.createElement(_ChannelInfoDisplay.default, {
+        }, _react.default.createElement(_ChannelInfoDisplay.default, {
-            name: name,
+          name: name,
-            longId: longId,
+          longId: longId,
-            shortId: shortId
+          shortId: shortId
-          }), _react.default.createElement(_ChannelClaimsDisplay.default, null))
+        }), _react.default.createElement(_ChannelClaimsDisplay.default, null));
-        });
       }
 
       return _react.default.createElement(_ErrorPage.default, {

client/src/components/PageLayout/index.jsx

@@ -10,7 +10,7 @@ class PageLayout extends React.Component {
         <SEO pageTitle={this.props.pageTitle} pageUri={this.props.pageUri} />
         <NavBar />
         <div className={'content'}>
-          {this.props.content}
+          {this.props.children}
         </div>
       </div>
     );

client/src/components/PageLayoutShowLite/index.jsx

@@ -11,10 +11,7 @@ class PageLayoutShowLite extends React.Component {
       <div className={'page-layout-show-lite'}>
         <SEO pageTitle={this.props.pageTitle} asset={this.props.asset} />
         <div className={'content'}>
-          {this.props.content}
+          {this.props.children}
-        </div>
-        <div className={'footer'}>
-          {this.props.footer}
         </div>
       </div>
     );

client/src/pages/AboutPage/index.jsx

@@ -10,13 +10,12 @@ class AboutPage extends React.Component {
       <PageLayout
         pageTitle={'About'}
         pageUri={'about'}
-        content={
+      >
-          <HorizontalSplit
+        <HorizontalSplit
-            leftSide={<AboutSpeechOverview />}
+          leftSide={<AboutSpeechOverview />}
-            rightSide={<AboutSpeechDetails />}
+          rightSide={<AboutSpeechDetails />}
-          />
+        />
-        }
+      </PageLayout>
-      />
     );
   }
 }

client/src/pages/ErrorPage/index.jsx

@@ -9,10 +9,9 @@ class ErrorPage extends React.Component {
       <PageLayout
         pageTitle={'Error'}
         pageUri={'error'}
-        content={
+      >
-          <p>{error}</p>
+        <p>{error}</p>
-        }
+      </PageLayout>
-      />
     );
   }
 };

client/src/pages/FourOhFourPage/index.jsx

@@ -7,13 +7,10 @@ class FourOhForPage extends React.Component {
       <PageLayout
         pageTitle={'404'}
         pageUri={'/404'}
-        content={
+      >
-          <div>
+        <h2>404</h2>
-            <h2>404</h2>
+        <p>That page does not exist</p>
-            <p>That page does not exist</p>
+      </PageLayout>
-          </div>
-        }
-      />
     );
   }
 };

client/src/pages/HomePage/index.jsx

@@ -9,8 +9,9 @@ class HomePage extends React.Component {
       <PageLayout
         pageTitle={'Speech'}
         pageUri={''}
-        content={<PublishTool />}
+      >
-      />
+        <PublishTool />
+      </PageLayout>
     );
   }
 };

client/src/pages/LoginPage/view.jsx

@@ -18,13 +18,12 @@ class LoginPage extends React.Component {
       <PageLayout
         pageTitle={'Login'}
         pageUri={'login'}
-        content={
+      >
-          <HorizontalSplit
+        <HorizontalSplit
-            leftSide={<ChannelAbout />}
+          leftSide={<ChannelAbout />}
-            rightSide={<ChannelTools />}
+          rightSide={<ChannelTools />}
-          />
+        />
-        }
+      </PageLayout>
-      />
     );
   }
 };

client/src/pages/MultisitePage/index.jsx

@@ -53,8 +53,9 @@ class MultisitePage extends React.Component {
       <PageLayout
         pageTitle={'Multisite'}
         pageUri={'/multisite'}
-        content={<MultisiteContent />}
+      >
-      />
+        <MultisiteContent />
+      </PageLayout>
     );
   }
 }

client/src/pages/ShowAssetDetails/view.jsx

@@ -16,16 +16,13 @@ class ShowAssetDetails extends React.Component {
         <PageLayout
           pageTitle={`${name} - details`}
           asset={asset}
-          content={
+        >
-            <div>
+          <AssetTitle />
-              <AssetTitle />
+          <HorizontalSplit
-              <HorizontalSplit
+            leftSide={<AssetDisplay />}
-                leftSide={<AssetDisplay />}
+            rightSide={<AssetInfo />}
-                rightSide={<AssetInfo />}
+          />
-              />
+        </PageLayout>
-            </div>
-          }
-        />
       );
     }
     return (

client/src/pages/ShowAssetLite/view.jsx

@@ -3,6 +3,17 @@ import { Link } from 'react-router-dom';
 import PageLayoutShowLite from '@components/PageLayoutShowLite';
 import AssetDisplay from '@containers/AssetDisplay';
 import SpaceAround from '@components/SpaceAround';
+import VerticalSplit from '@components/VerticalSplit';
+
+const AssetLiteFooter = ({ name, claimId }) => {
+  return (
+    <SpaceAround>
+      <p className={'text--extra-small'}>
+        <Link className='link--primary' to={`/${claimId}/${name}`}> hosted on spee.ch</Link> via the <a  className='link--primary' href={'https://lbry.io/get'} target={'_blank'}>LBRY</a> blockchain
+      </p>
+    </SpaceAround>
+  )
+}
 
 class ShowLite extends React.Component {
   render () {
@@ -13,15 +24,17 @@ class ShowLite extends React.Component {
         <PageLayoutShowLite
           pageTitle={name}
           asset={asset}
-          content={<AssetDisplay />}
+        >
-          footer={
+          <VerticalSplit
-            <SpaceAround>
+            top={<AssetDisplay />}
-              <p className={'text--extra-small'}>
+            bottom={
-                <Link className='link--primary' to={`/${claimId}/${name}`}> hosted on spee.ch</Link> via the <a  className='link--primary' href={'https://lbry.io/get'} target={'_blank'}>LBRY</a> blockchain
+              <AssetLiteFooter
-              </p>
+                name={name}
-            </SpaceAround>
+                claimId={claimId}
-          }
+              />
-        />
+            }
+          />
+        </PageLayoutShowLite>
       );
     }
     return (

client/src/pages/ShowChannel/view.jsx

@@ -13,17 +13,14 @@ class ShowChannel extends React.Component {
         <PageLayout
           pageTitle={name}
           channel={channel}
-          content={
+        >
-            <div>
+          <ChannelInfoDisplay
-              <ChannelInfoDisplay
+            name={name}
-                name={name}
+            longId={longId}
-                longId={longId}
+            shortId={shortId}
-                shortId={shortId}
+          />
-              />
+          <ChannelClaimsDisplay />
-              <ChannelClaimsDisplay />
+        </PageLayout>
-            </div>
-          }
-        />
       );
     }
     return (