Merge pull request #92 from lbryio/homepage

Homepage
2025-09-02 18:25:11 +00:00 · 2017-03-14 10:02:42 -04:00 · 2017-03-14 10:02:42 -04:00 · c62e7849b7
commit c62e7849b7
parent 2adcebb227 991383d732
19 changed files with 239 additions and 124 deletions
--- a/controller/Controller.class.php
+++ b/controller/Controller.class.php
@ -141,7 +141,8 @@ class Controller
      }
    }

-    $router->any('/get/lbry.{ext:c}', 'DownloadActions::executeGetRedirect');
+    $router->any('/get/lbry.{ext:c}', 'DownloadActions::executeGetAppRedirect');
+    $router->any('/get/lbrynet.{os:c}.zip', 'DownloadActions::executeGetDaemonRedirect');

    $router->get([ContentActions::URL_NEWS . '/{slug:c}?', 'news'], 'ContentActions::executeNews');
    $router->get([ContentActions::URL_FAQ . '/{slug:c}?', 'faq'], 'ContentActions::executeFaq');
--- a/controller/action/DeveloperActions.class.php
+++ b/controller/action/DeveloperActions.class.php
@ -47,6 +47,16 @@ class DeveloperActions extends Actions
    ];
  }

+
+  public static function prepareQuickstartInstallPartial(array $vars)
+  {
+    return $vars + ['versions' => [
+      Os::OS_LINUX => Github::getDaemonReleaseProperty(OS::OS_LINUX, 'tag_name'),
+      Os::OS_OSX => Github::getDaemonReleaseProperty(OS::OS_OSX, 'tag_name'),
+      Os::OS_WINDOWS => Github::getDaemonReleaseProperty(OS::OS_WINDOWS, 'tag_name'),
+    ]];
+  }
+
  public static function prepareFormNewDeveloperRewardPartial(array $vars)
  {
    return $vars + [
--- a/controller/action/DownloadActions.class.php
+++ b/controller/action/DownloadActions.class.php
@ -2,27 +2,40 @@

 class DownloadActions extends Actions
 {
-  public static function executeGetRedirect(string $ext)
+  public static function executeGetAppRedirect(string $ext)
  {
    $uri = null;
    switch ($ext)
    {
      case 'deb':
-        $uri = GitHub::getDownloadUrl(OS::OS_LINUX);
+        $uri = GitHub::getAppDownloadUrl(OS::OS_LINUX);
        break;

      case 'dmg':
-        $uri = GitHub::getDownloadUrl(OS::OS_OSX);
+        $uri = GitHub::getAppDownloadUrl(OS::OS_OSX);
        break;

      case 'msi':
-        $uri = GitHub::getDownloadUrl(OS::OS_WINDOWS);
+        $uri = GitHub::getAppDownloadUrl(OS::OS_WINDOWS);
        break;
    }

    return Controller::redirect($uri ?: '/get', 302);
  }

+  public static function executeGetDaemonRedirect(string $os)
+  {
+    $uri = null;
+    $oses = Os::getAll();
+
+    if (isset($oses[$os]))
+    {
+      $uri = GitHub::getDaemonDownloadUrl($os);
+    }
+
+    return Controller::redirect($uri ?: '/quickstart', 302);
+  }
+
  public static function executeGet()
  {
    $email = Request::getParam('e');
@ -68,7 +81,7 @@ class DownloadActions extends Actions
        'osIcon'        => $osIcon,
        'prefineryUser' => $user ?: [],
        'downloadHtml'  => View::exists('download/' . $partial) ?
-          View::render('download/' . $partial, ['downloadUrl' => Github::getDownloadUrl($os)]) :
+          View::render('download/' . $partial, ['downloadUrl' => Github::getAppDownloadUrl($os)]) :
          false
      ]];
    }
--- a/lib/thirdparty/Github.class.php
+++ b/lib/thirdparty/Github.class.php
@ -2,7 +2,7 @@

 class Github
 {
-  public static function getDownloadUrl($os, $cache = true)
+  public static function getAppDownloadUrl($os, $cache = true)
  {
    if (!in_array($os, array_keys(OS::getAll())))
    {
@ -32,6 +32,40 @@ class Github
    return null;
  }

+  public static function getDaemonReleaseProperty($os, $property, $isAssetProperty = false, $cache = true)
+  {
+    if (!in_array($os, array_keys(OS::getAll())))
+    {
+      throw new DomainException('Unknown OS');
+    }
+
+    try
+    {
+      $releaseData = static::get('/repos/lbryio/lbry/releases/latest', $cache);
+      foreach ($releaseData['assets'] as $asset)
+      {
+        if (
+          ($os == OS::OS_LINUX && stripos($asset['browser_download_url'], 'linux') !== false) ||
+          ($os == OS::OS_OSX && stripos($asset['browser_download_url'], 'macos') !== false) ||
+          ($os == OS::OS_WINDOWS && strpos($asset['browser_download_url'], 'windows') !== false)
+        )
+        {
+          return $isAssetProperty ? $asset[$property] : $releaseData[$property];
+        }
+      }
+    }
+    catch (Exception $e)
+    {
+    }
+
+    return null;
+  }
+
+  public static function getDaemonDownloadUrl($os, $cache = true)
+  {
+    return static::getDaemonReleaseProperty($os, 'browser_download_url', true);
+  }
+
  public static function get($endpoint, $cache = true)
  {
    $twoHoursInSeconds = 7200;
--- a/view/template/developer/_quickstartApi.php
+++ b/view/template/developer/_quickstartApi.php
@ -1,4 +1,4 @@
-<h3 id="api">The API</h3>
+<h3 id="api">API Basics</h3>
 <p>
  When running, the LBRY daemon provides a JSON-RPC server running at <code class="code-inline">http://localhost:5279/lbryapi</code>.
 </p>
@ -25,7 +25,7 @@
    "ver": "0.0.3"
  }
 ]</span></code>
-
+<h3>First Download</h3>
 <p>
  Above, we called the method
  <code class="code-inline"><a href="<?php echo DeveloperActions::API_DOC_URL ?>#resolve_name" class="link-primary">resolve_name</a></code>
@ -38,42 +38,18 @@
 <code class="code-bash"><span class="code-bash__prompt">$</span>curl 'http://localhost:5279/lbryapi' --data '{"method":"get","params":{"name":"what"} }'
 <span class="code-bash__response">[
  {
-    "claim_id": "790cd199f4177a1b2045c0f2e5ed922ee4dbce29",
-    "completed": false,
-    "download_directory": "/home/lbry/Downloads",
-    "download_path": "/home/lbry/Downloads/LBRY100.mp4",
+    <span class="code-bash__comment">//some response fields omitted for brevity</span>
+    "claim_id": "7b670f0034d0eb119c32acfe8b19ae6622dd218f", <span class="code-bash__comment">//a claim ID is persistent for a piece of content. It stays the same if the original publisher updates the entry.</span>
+    "download_directory": "/home/kauffj/Downloads",
+    "download_path": "/home/kauffj/Downloads/LBRY100.mp4",
    "file_name": "LBRY100.mp4",
-    "key": "0edc1705489d7a2b2bcad3fea7e5ce92",
-    "message": "Started LBRY100.mp4, got 3/76 blobs, stream status: running",
-    "metadata": {
-      "author": "Samuel Bryan",
-      "content_type": "video/mp4",
-      "description": "What is LBRY? An introduction with Alex Tabarrok",
-      "language": "en",
-      "license": "LBRY inc",
-      "nsfw": false,
-      "sources": {
-        "lbry_sd_hash": "d5169241150022f996fa7cd6a9a1c421937276a3275eb912790bd07ba7aec1fac5fd45431d226b8fb402691e79aeb24b"
-      },
-      "thumbnail": "https://s3.amazonaws.com/files.lbry.io/logo.png",
-      "title": "What is LBRY?",
-      "ver": "0.0.3"
-    },
-    "mime_type": "video/mp4",
-    "name": "what",
-    "outpoint": "cbfc821bf6a73f62affd69207119e0da1e438ecfcbc1c69777bf01b16f142d47:0",
-    "points_paid": 0.0,
-    "sd_hash": "d5169241150022f996fa7cd6a9a1c421937276a3275eb912790bd07ba7aec1fac5fd45431d226b8fb402691e79aeb24b",
-    "stopped": false,
-    "stream_hash": "9f41e37b1ea706d1b431a65f634b89c5aadefb106280da3661e4d565d47bc938a345755cafb2af807bcfc9fbde3306e3",
-    "stream_name": "LBRY100.mp4",
-    "suggested_file_name": "LBRY100.mp4",
+    "metadata": { ... }, <span class="code-bash__comment">//same dictionary as above</span>
+    "outpoint": "6e224057a9dfa3417bb3890da2c4b4e9d2471641185c6c8b33cb57d61365a4f0:1", <span class="code-bash__comment">//an outpoint is a frozen-in-time pointer to a specific piece of content. It changes if the content changes.</span>
    "total_bytes": 158433904,
-    "written_bytes": 0
+    "written_bytes": 0 <span class="code-bash__comment">//will increase as the file downloads</span>
  }
-]</span>
-</code>
-
+]</span></code>
+<p>This file will download in the background to the <code class="code-inline">download_directory</code> specified in the returned data. Subsequent calls to <code class="code-inline">get</code> or <code class="code-inline">file_list</code> will return the status.</p>
 <p>The LBRY API consists of about 50 calls, all related to discovering, distributing, and purchasing content. <a class="link-primary" href="/api">View the full API documentation</a>.</p>
 <p>You can also list all of the commands available by calling the <span class="code-plan">help</span> command.</p>
 <code class="code-bash"><span class="code-bash__prompt">$</span>curl 'http://localhost:5279/lbryapi' --data '{"method":"help"}'
--- a/view/template/developer/_quickstartCredits.php
+++ b/view/template/developer/_quickstartCredits.php
@ -38,9 +38,21 @@
 <h3>Enjoy a Hollywood Film</h3>
 <p><a href="http://www.imdb.com/title/tt1995341/" class="link-primary">It's a Disaster</a> starring David Cross is just one of tens of thousands of great pieces of content available. Check it out!</p>
 <code class="code-bash"><span class="code-bash__prompt">$</span>curl 'http://localhost:5279/lbryapi' --data '{"method":"get","params":{"name":"itsadisaster"} }'
-<span class="code-bash__response">["d5169241150022f996fa7cd6a9a1c421937276a3275eb912790bd07ba7aec1fac5fd45431d226b8fb402691e79aeb24b"]</span></code>
+<span class="code-bash__response">[
+  {
+    <span class="code-bash__comment">//some response fields omitted for brevity</span>
+    "claim_id": "bd970a51249cba542a9acfb130147294a6326ee2",
+    "download_directory": "/home/kauffj/Downloads",
+    "download_path": "/home/kauffj/Downloads/It's A Disaster_Feature.mp4",
+    "metadata": {
+      "author": "Written and directed by Todd Berger",
+      "content_type": "video/mp4",
+      "description": "Four couples meet for Sunday brunch only to discover they are stuck in a house together as the world may be about to end."
+    }
+  }
+]</span></code>
 <h3>Try the UI</h3>
-<p>LBRY comes with a UI so that normal people can use it too. You can download it <a href="https://github.com/lbryio/lbry-app/releases" class="link-primary">here</a>.</p>
+<p>LBRY comes with a fully-featured UI so that normal people can use it too. You can download it <a href="https://github.com/lbryio/lbry-app/releases" class="link-primary">here</a>.</p>
 <h3 id="community">You Did It! What's Next?</h3>
 <p>
  Start building something awesome! LBRY works as a discovery and distribution backend for everything from films to CAD files.
--- a/view/template/developer/_quickstartInstall.php
+++ b/view/template/developer/_quickstartInstall.php
@ -9,9 +9,9 @@
  </thead>
  <tbody>
    <tr>
-      <td><a href="https://github.com/lbryio/lbry/releases/download/v0.9.0/lbrynet-daemon-v0.9.0-macos.zip" class="link-primary">Download</a></td>
-      <td><a href="https://github.com/lbryio/lbry/releases/download/v0.9.0/lbrynet-daemon-v0.9.0-linux.zip"  class="link-primary">Download</a></td>
-      <td><a href="https://github.com/lbryio/lbry/releases/download/v0.9.0/lbrynet-daemon-v0.9.0-windows.zip"  class="link-primary">Download</a></td>
+      <td><a href="/get/lbrynet.<?php echo Os::OS_OSX ?>.zip" class="link-primary">Download <?php echo $versions[OS::OS_OSX] ?></a></td>
+      <td><a href="/get/lbrynet.<?php echo Os::OS_LINUX ?>.zip"  class="link-primary">Download <?php echo $versions[OS::OS_LINUX] ?></a></td>
+      <td><a href="/get/lbrynet.<?php echo Os::OS_WINDOWS ?>.zip"  class="link-primary">Download <?php echo $versions[OS::OS_WINDOWS] ?></a></td>
    </tr>
  </tbody>
 </table>
--- a/view/template/nav/_footer.php
+++ b/view/template/nav/_footer.php
@ -4,20 +4,18 @@
    <?php if ($showLearnFooter): ?>
      <?php echo View::render('nav/_learnFooter') ?>
    <?php endif ?>
-    <div class="footer-standard">
-      <div class="content">
-        <nav class="control-group">
-          <div class="control-item">
-            <a href="/"><?php echo __('nav.home') ?></a>
-          </div>
-          <?php echo View::render('nav/_globalItems') ?>
-          <div class="control-item">
-            <a href="https://en.wikipedia.org/wiki/AACS_encryption_key_controversy" class="footer-img-link">
-              <img src="/img/Free-speech-flag.svg" alt="Free Speech Flag" height="30"/>
-            </a>
-          </div>
-        </nav>
-      </div>
+    <div class="footer-standard <?php echo $isDark ? 'footer-standard--dark' : 'footer-standard--light' ?>">
+      <nav class="control-group">
+        <div class="control-item">
+          <a href="/"><?php echo __('nav.home') ?></a>
+        </div>
+        <?php echo View::render('nav/_globalItems') ?>
+        <div class="control-item">
+          <a href="https://en.wikipedia.org/wiki/Free_Speech_Flag" class="footer-img-link">
+            <img src="/img/Free-speech-flag.svg" alt="Free Speech Flag" height="30"/>
+          </a>
+        </div>
+      </nav>
    </div>
  </div>
 <?php endif ?>
--- a/view/template/nav/_globalItems.php
+++ b/view/template/nav/_globalItems.php
@ -1,6 +1,5 @@
 <?php foreach([
    '/get' => __('nav.get'),
-    '/news' => __('nav.news'),
    '/learn' => __('nav.learn')
 ] as $url => $label): ?>
  <div class="control-item">
--- a/view/template/nav/_header.php
+++ b/view/template/nav/_header.php
@ -2,28 +2,27 @@
  <?php define('HEADER_RENDERED', 1) ?>
  <?php extract([
      'isDark' => false,
-      'isAbsolute' => false
+      'isAbsolute' => false,
+      'isLogoOnly' => false
  ], EXTR_SKIP) ?>
  <div class="header <?php echo $isAbsolute ? 'header-absolute' : '' ?> <?php echo $isDark ? 'header-dark' : 'header-light' ?>">
    <div class="header-content">
      <a href="/" class="primary-logo">
        <img src="<?php echo $isDark ? View::imagePath('header-logo-light.png') : View::imagePath('header-logo-dark2.png') ?>" alt="LBRY" />
-        <?php /*
-        <img src="<?php echo View::imagePath('header-logo-light.png') ?>" alt="LBRY" class="logo-light" />
-        <img src="<?php echo View::imagePath('header-logo-dark.png') ?>" alt="LBRY" class="logo-dark" />
-         */ ?>
      </a>
-      <div class="mobile header-navigation-mobile">
-        <a href="javascript:;" data-action="toggle-class" data-for=".header" data-class="header-open">
-          <span class="icon icon-bars"></span>
-          <span class="icon icon-close"></span>
-        </a>
-      </div>
-      <div class="fullscreen header-navigation-fullscreen">
-        <nav class="control-group">
-          <?php echo View::render('nav/_globalItems') ?>
-        </nav>
-      </div>
+      <?php if (!$isLogoOnly): ?>
+        <div class="mobile header-navigation-mobile">
+          <a href="javascript:;" data-action="toggle-class" data-for=".header" data-class="header-open">
+            <span class="icon icon-bars"></span>
+            <span class="icon icon-close"></span>
+          </a>
+        </div>
+        <div class="fullscreen header-navigation-fullscreen">
+          <nav class="control-group">
+            <?php echo View::render('nav/_globalItems') ?>
+          </nav>
+        </div>
+      <?php endif ?>
    </div>
  </div>
 <?php endif ?>
--- a/view/template/page/home.php
+++ b/view/template/page/home.php
@ -41,4 +41,4 @@
      </div>
    </div>
  </div>
-</main>
+</main>
--- a/view/template/page/home2.php
+++ b/view/template/page/home2.php
@ -0,0 +1,49 @@
+
+<div class="bg-image-full" style="background-color: white" <?php //style="background-image: url(https://s3.amazonaws.com/files.lbry.io/cover-home2.jpg)" ?>></div>
+<?php Response::setMetaTitle(__('title.home')) ?>
+<?php Response::setMetaDescription(__('description.home')) ?>
+<?php echo View::render('nav/_header', ['isDark' => false, 'isLogoOnly' => false]) ?>
+<main class="column-fluid">
+  <div class="span12">
+    <div class="cover cover-light cover-center">
+      <div class="content content-wide content-light" style="max-width: 800px">
+        <div class="spacer2">
+          <h1 class="cover-title cover-title-flat">Content Freedom</h1>
+          <h2 class="cover-subtitle cover-title-flat">Watch, read or play what you choose. Earn 100% of the price you decide.</h2>
+          <h3 class="cover-subtitle cover-title-flat">You control your data. You own the network. Indeed, you <em>are</em> the network.</h3>
+          <h3 class="cover-subtitle cover-title-flat">Find Hollywood films, college lessons, amazing streamers and more on the first open, global, and community-controlled digital bazaar.</h3>
+        </div>
+        <div class="control-group spacer2 text-center">
+          <div class="control-item">
+            <a href="/get" class="btn-primary btn-large">Join LBRY</a>
+          </div>
+          <div class="control-item">
+            <a href="/learn" class="btn-link btn-large">{{global.learn}}</a>
+          </div>
+        </div>
+      </div>
+      <div class="video" style="margin: 48px 0">
+        <iframe width="560" height="315" src="https://www.youtube.com/embed/DjouYBEkQPY" frameborder="0" allowfullscreen></iframe>
+      </div>
+      <?php /*
+      <div class="content content-dark">
+        <div class="row-fluid">
+          <div class="span4">
+            <h3><?php echo __('email.updates') ?></h3>
+            <?php echo View::render('mail/_subscribeForm', ['submitLabel' => __('email.go'), 'btnClass' => 'btn-alt']) ?>
+          </div>
+          <div class="span4 text-center">
+            <div class="fb-page" data-href="https://www.facebook.com/lbryio" data-height="300" data-small-header="false" data-width="300"
+                 data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="true" data-show-posts="true">
+              <div class="fb-xfbml-parse-ignore"><blockquote cite="https://www.facebook.com/lbryio"><a href="https://www.facebook.com/lbryio">LBRY</a></blockquote></div>
+            </div>
+          </div>
+          <div class="span4 text-center">
+            <a width="300" class="twitter-timeline" href="https://twitter.com/LBRYio" data-widget-id="671104143034073088">{{social.tweets}}</a>
+          </div>
+        </div> */ ?>
+    </div>
+  </div>
+  </div>
+</main>
+<?php echo View::render('nav/_footer', ['isDark' => false]) ?>
--- a/view/template/page/learn.php
+++ b/view/template/page/learn.php
@ -17,45 +17,39 @@
        <a href="/what" class="btn-alt"><?php echo __('learn.essay') ?></a>
      </div>
    </div>
-    <div class="span6">
+    <div class="span4">
      <div class="cover cover-light-alt cover-light-alt-grad">
-        <div class=" content content-light content-tile">
-          <div class="row-fluid">
-            <div class="span6">
-              <h3>{{learn.explore}}</h3>
-              <div class="spacer1">
-                <a href="/faq" class="link-primary">{{page.faq.header}}</a>
-              </div>
-              <div class="spacer1">
-                <a href="http://explorer.lbry.io" class="link-primary">{{learn.explorer}}</a>
-              </div>
-              <div class="spacer1">
-                <a href="/faq/exchanges" class="link-primary">{{learn.exchange_faq}}</a>
-              </div>
-            </div>
-            <div class="span6">
-              <h3>{{learn.nerd}}</h3>
-              <p>LBRY is 100% open source in the <a class="link-primary" href="https://en.wikipedia.org/wiki/The_Cathedral_and_the_Bazaar">Bazaar tradition</a>.</p>
-              <?php echo View::render('social/_listDev') ?>
-            </div>
+        <div class="content content-light content-tile">
+          <h3>{{learn.explore}}</h3>
+          <div class="spacer1">
+            <a href="/news" class="link-primary">Latest News</a>
+          </div>
+          <div class="spacer1">
+            <a href="/faq" class="link-primary">{{page.faq.header}}</a>
+          </div>
+          <div class="spacer1">
+            <a href="http://explorer.lbry.io" class="link-primary">{{learn.explorer}}</a>
+          </div>
+          <div class="spacer1">
+            <a href="/team" class="link-primary">About the Team</a>
          </div>
        </div>
      </div>
    </div>
-    <div class="span6">
+    <div class="span4">
      <div class="cover cover-light">
        <div class="content content-light content-tile">
-          <div class="row-fluid">
-            <div class="span6">
-              <h3><?php echo __('page.team.header') ?></h3>
-              <p><?php echo __('learn.rebels') ?></p>
-              <a href="/team" class="btn-alt"><?php echo __('learn.team') ?></a>
-            </div>
-            <div class="span6">
-              <h3>{{learn.join}}</h3>
-              <?php echo View::render('social/_list') ?>
-            </div>
-          </div>
+          <h3>{{learn.nerd}}</h3>
+          <p>LBRY is 100% open source in the <a class="link-primary" href="https://en.wikipedia.org/wiki/The_Cathedral_and_the_Bazaar">Bazaar tradition</a>.</p>
+          <?php echo View::render('social/_listDev') ?>
+        </div>
+      </div>
+    </div>
+    <div class="span4">
+      <div class="cover cover-dark cover-dark-grad">
+        <div class="content content-dark content-tile">
+          <h3>{{learn.join}}</h3>
+          <?php echo View::render('social/_list') ?>
        </div>
      </div>
    </div>
--- a/view/template/social/_list.php
+++ b/view/template/social/_list.php
@ -1,3 +1,6 @@
+<div class="spacer1">
+  <a href="https://slack.lbry.io" class="link-primary"><span class="icon-slack icon-fw"></span><span class="btn-label">Slack</span></a>
+</div>
 <div class="spacer1">
  <a href="https://twitter.com/lbryio" class="link-primary"><span class="icon-twitter icon-fw"></span><span class="btn-label">Twitter</span></a>
 </div>
--- a/view/template/social/_listDev.php
+++ b/view/template/social/_listDev.php
@ -4,11 +4,11 @@
 </div>
 */ ?>
 <div class="spacer1">
-  <a href="/quickstart" class="link-primary"><span class="icon-code icon-fw"></span><span class="btn-label">Quickstart</span></a>
+  <a href="/quickstart" class="link-primary"><span class="icon-fast-forward icon-fw"></span><span class="btn-label">Quickstart</span></a>
 </div>
 <div class="spacer1">
-  <a href="https://github.com/lbryio" class="link-primary"><span class="icon-github icon-fw"></span><span class="btn-label">{{social.github}}</span></a>
+  <a href="/api" class="link-primary"><span class="icon-code icon-fw"></span><span class="btn-label">The API</span></a>
 </div>
 <div class="spacer1">
-  <a href="http://slack.lbry.io" class="link-primary"><span class="icon-slack icon-fw"></span><span class="btn-label">{{social.slack}}</span></a>
+  <a href="https://github.com/lbryio" class="link-primary"><span class="icon-code-fork icon-fw"></span><span class="btn-label">Source Code</span></a>
 </div>
--- a/web/scss/_basic.scss
+++ b/web/scss/_basic.scss
@ -114,7 +114,7 @@ a:hover img
  }
 }

-.btn-primary, .btn-alt
+.btn-primary, .btn-alt, .btn-link
 {
  cursor: pointer;
  display: inline-block;
@ -129,6 +129,17 @@ a:hover img
    margin-left: 8px;
  }
 }
+.btn-link
+{
+  @include anchor($color-primary);
+}
+.btn-large
+{
+  height: $spacing-vertical * 2;
+  line-height: $spacing-vertical * 2;
+  font-size: 1.5em;
+  padding: 0 30px;
+}
 .btn-primary
 {
  color: white;
--- a/web/scss/_content.scss
+++ b/web/scss/_content.scss
@ -45,15 +45,15 @@

  &.content-dark
  {
-    color: #e8e8e8;
+    color: $color-content-dark;
    h1, h2, h3, h4, h5, h6 { color: #fff; }
    .link-primary { color: $color-light-alt; }
-    .meta { color: #dddddd; }
+    .meta { color: $color-meta-dark; }
  }

  &:not(.content-dark), &.content-light
  {
-    color: #333;
+    color: $color-content-light;
    h1, h2, h3, h4, h5, h6
    {
      color: $color-text-dark;
@ -174,7 +174,6 @@
    margin-left: auto;
    margin-right: auto;
  }
-
 }
 .content-inset
 {
--- a/web/scss/_global.scss
+++ b/web/scss/_global.scss
@ -8,6 +8,9 @@ $color-text-dark: #000;
 $color-money: #216C2A;
 $color-meta-light: #505050;
 $color-meta-lighter: #999999;
+$color-meta-dark: #dddddd;
+$color-content-light: #333333;
+$color-content-dark: #e8e8e8;
 $color-info-bg: #3a779d;

 $font-size: 16px;
--- a/web/scss/_header.scss
+++ b/web/scss/_header.scss
@ -1,6 +1,7 @@
@import "global";

-$color-nav-border: #ddd;
+$color-nav-border-light: #ddd;
+$color-nav-border-dark: #ddd;

 .header
 {
@ -41,7 +42,7 @@ $color-nav-border: #ddd;
 .header-light
 {
  color: $color-text-dark;
-  border-bottom: 1px $color-nav-border solid;
+  border-bottom: 1px $color-nav-border-light solid;
  background-color: white;
  .logo-light { display: none; }
 }
@ -119,11 +120,24 @@ $color-nav-border: #ddd;
  text-align: center;
  font-size: 0.8em;
  line-height: $spacing-vertical * 2;
-  color: #666;
-  border-top: 1px $color-nav-border solid;
-  border-bottom: 1px $color-nav-border solid;
  padding: $spacing-vertical / 2 0;
  @include jumpingScrollbarFix();
+  img
+  {
+    display: block;
+    margin-left: auto;
+    margin-right: auto;
+  }
+}
+.footer-standard--light
+{
+  color: $color-content-light;
+  border-top: 1px $color-nav-border-light solid;
+  border-bottom: 1px $color-nav-border-light solid;
+}
+.footer-standard--dark
+{
+  color: $color-content-dark;
 }
 .footer-img-link
 {