Clean up Oblivious skin

Summary: Adds Remarkup rules and CSS, cleans up some spacing a color. Ref T9546

Test Plan: Review a blog post list, and a blog

Reviewers: epriestley

Reviewed By: epriestley

Subscribers: Korvin

Maniphest Tasks: T9546

Differential Revision: https://secure.phabricator.com/D14421

externals/skins/oblivious/css/oblivious.css

@@ -29,19 +29,18 @@ html {
 .oblivious-content {
   padding-top: 3%;
   margin-left: 22%;
-  max-width: 600px;
+  max-width: 800px;
 }
 
 a {
-  color: #222222;
+  color: #2980b9;
   text-decoration: none;
 }
 
 a:hover {
-  color: #a00000;
+  text-decoration: underline;
 }
 
-
 h1 {
   font-size: 24px;
   font-weight: normal;
@@ -50,37 +49,24 @@ h1 {
 h2 {
   font-size: 22px;
   font-weight: bold;
+  margin-bottom: 8px;
 }
 
 .phame-post {
   margin: 0 0 2em;
 }
 
+.phame-post-title {
+  font-size: 28px;
+}
+
 .phame-post-date {
   font-size: 12px;
-  margin: .25em 0 1em;
+  margin: .25em 0 2em;
 }
 
-.phame-post {
-  line-height: 1.6em;
-}
-
-.phame-post p {
-  margin: 0 0 1em;
-}
-
-.phame-post tt {
-  color: #333333;
-  background: #ebebeb;
-  padding: 0 .25em;
-  white-space: pre-wrap;
-}
-
-.phame-post .remarkup-code-block pre {
-  overflow: auto;
-  padding: 10px 10px;
-  border: 1px solid #dfdfdf;
-  background-color: #f8f8f8;
+.oblivious-content .phabricator-remarkup ul.remarkup-list {
+  margin-left: 0;
 }
 
 .fb-comments,

src/applications/phame/skins/PhameBasicBlogSkin.php

@@ -16,6 +16,7 @@ abstract class PhameBasicBlogSkin extends PhameBlogSkin {
     $this->uriPath = $uri_path;
     return $this;
   }
+
   public function getURIPath() {
     return $this->uriPath;
   }
@@ -24,6 +25,7 @@ abstract class PhameBasicBlogSkin extends PhameBlogSkin {
     $this->oGType = $og_type;
     return $this;
   }
+
   protected function getOGType() {
     return $this->oGType;
   }
@@ -32,6 +34,7 @@ abstract class PhameBasicBlogSkin extends PhameBlogSkin {
     $this->description = $description;
     return $this;
   }
+
   protected function getDescription() {
     return $this->description;
   }
@@ -40,13 +43,12 @@ abstract class PhameBasicBlogSkin extends PhameBlogSkin {
     $this->title = $title;
     return $this;
   }
+
   protected function getTitle() {
     return $this->title;
   }
 
-  public function processRequest() {
-    $request = $this->getRequest();
-
+  public function handleRequest(AphrontRequest $request) {
     $content = $this->renderContent($request);
 
     if (!$content) {
@@ -69,7 +71,6 @@ abstract class PhameBasicBlogSkin extends PhameBlogSkin {
       $view->setFrameable(true);
     }
 
-
     $view->appendChild($content);
 
     $response = new AphrontWebpageResponse();
@@ -222,7 +223,7 @@ abstract class PhameBasicBlogSkin extends PhameBlogSkin {
    * @task internal
    */
   protected function renderContent(AphrontRequest $request) {
-    $user = $request->getUser();
+    $viewer = $request->getViewer();
 
     $matches = null;
     $path = $request->getPath();
@@ -233,7 +234,7 @@ abstract class PhameBasicBlogSkin extends PhameBlogSkin {
     $this->setURIPath('');
     if (preg_match('@^/post/(?P<name>.*)$@', $path, $matches)) {
       $post = id(new PhamePostQuery())
-        ->setViewer($user)
+        ->setViewer($viewer)
         ->withBlogPHIDs(array($this->getBlog()->getPHID()))
         ->withPhameTitles(array($matches['name']))
         ->executeOne();
@@ -263,7 +264,7 @@ abstract class PhameBasicBlogSkin extends PhameBlogSkin {
       $pager->setPageSize($this->getPageSize());
 
       $posts = id(new PhamePostQuery())
-        ->setViewer($user)
+        ->setViewer($viewer)
         ->withBlogPHIDs(array($this->getBlog()->getPHID()))
         ->executeWithCursorPager($pager);
 
@@ -280,10 +281,10 @@ abstract class PhameBasicBlogSkin extends PhameBlogSkin {
 
   private function buildPostViews(array $posts) {
     assert_instances_of($posts, 'PhamePost');
-    $user = $this->getRequest()->getUser();
+    $viewer = $this->getViewer();
 
     $engine = id(new PhabricatorMarkupEngine())
-      ->setViewer($user);
+      ->setViewer($viewer);
 
     $phids = array();
     foreach ($posts as $post) {
@@ -294,7 +295,7 @@ abstract class PhameBasicBlogSkin extends PhameBlogSkin {
     }
 
     $handles = id(new PhabricatorHandleQuery())
-      ->setViewer($user)
+      ->setViewer($viewer)
       ->withPHIDs($phids)
       ->execute();
 
@@ -303,7 +304,7 @@ abstract class PhameBasicBlogSkin extends PhameBlogSkin {
     $views = array();
     foreach ($posts as $post) {
       $view = id(new PhamePostView())
-        ->setUser($user)
+        ->setUser($viewer)
         ->setSkin($this)
         ->setPost($post)
         ->setBody($engine->getOutput($post, PhamePost::MARKUP_FIELD_BODY))

src/applications/phame/skins/PhameBasicTemplateBlogSkin.php

@@ -27,15 +27,26 @@ final class PhameBasicTemplateBlogSkin extends PhameBasicBlogSkin {
     }
 
     $map = CelerityResourceMap::getNamedInstance('phabricator');
-    $resource_symbol = 'syntax-highlighting-css';
-    $resource_uri = $map->getURIForSymbol($resource_symbol);
+    $highlight_symbol = 'syntax-highlighting-css';
+    $highlight_uri = $map->getURIForSymbol($highlight_symbol);
 
     $this->cssResources[] = phutil_tag(
       'link',
       array(
         'rel'   => 'stylesheet',
         'type'  => 'text/css',
-        'href'  => PhabricatorEnv::getCDNURI($resource_uri),
+        'href'  => PhabricatorEnv::getCDNURI($highlight_uri),
+      ));
+
+    $remarkup_symbol = 'phabricator-remarkup-css';
+    $remarkup_uri = $map->getURIForSymbol($remarkup_symbol);
+
+    $this->cssResources[] = phutil_tag(
+      'link',
+      array(
+        'rel'   => 'stylesheet',
+        'type'  => 'text/css',
+        'href'  => PhabricatorEnv::getCDNURI($remarkup_uri),
       ));
 
     $this->cssResources = phutil_implode_html("\n", $this->cssResources);

src/applications/phame/view/PhamePostView.php

@@ -87,7 +87,7 @@ final class PhamePostView extends AphrontView {
     return phutil_tag(
       'div',
       array(
-        'class' => 'phame-post-body',
+        'class' => 'phame-post-body phabricator-remarkup',
       ),
       $this->getBody());
   }
@@ -96,7 +96,7 @@ final class PhamePostView extends AphrontView {
     return phutil_tag(
       'div',
       array(
-        'class' => 'phame-post-body',
+        'class' => 'phame-post-body phabricator-remarkup',
       ),
       $this->getSummary());
   }