Add "wide" remarkup image support for Documents

Summary: Seems to work ok, if you give `size=wide` to an image file, we blow it out a bit in DocumentPro mode.

Test Plan:
Test in Phame and Maniphest.

{F1256717}

{F1256718}

Reviewers: epriestley

Reviewed By: epriestley

Subscribers: Korvin

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

resources/celerity/map.php

@@ -7,7 +7,7 @@
  */
 return array(
   'names' => array(
-    'core.pkg.css' => '2bd78e9d',
+    'core.pkg.css' => '5242a859',
     'core.pkg.js' => '6972d365',
     'darkconsole.pkg.js' => 'e7393ebb',
     'differential.pkg.css' => '7ba78475',
@@ -104,7 +104,7 @@ return array(
     'rsrc/css/application/tokens/tokens.css' => '3d0f239e',
     'rsrc/css/application/uiexample/example.css' => '528b19de',
     'rsrc/css/core/core.css' => 'd0801452',
-    'rsrc/css/core/remarkup.css' => '6aae5360',
+    'rsrc/css/core/remarkup.css' => '787105d6',
     'rsrc/css/core/syntax.css' => '9fd11da8',
     'rsrc/css/core/z-index.css' => '5b6fcf3f',
     'rsrc/css/diviner/diviner-shared.css' => 'aa3656aa',
@@ -128,9 +128,9 @@ return array(
     'rsrc/css/phui/phui-chart.css' => '6bf6f78e',
     'rsrc/css/phui/phui-crumbs-view.css' => '1a1265d4',
     'rsrc/css/phui/phui-curtain-view.css' => '7148ae25',
-    'rsrc/css/phui/phui-document-pro.css' => '73e45fd2',
+    'rsrc/css/phui/phui-document-pro.css' => '8419560b',
     'rsrc/css/phui/phui-document-summary.css' => '9ca48bdf',
-    'rsrc/css/phui/phui-document.css' => '9c71d2bf',
+    'rsrc/css/phui/phui-document.css' => '715aedfb',
     'rsrc/css/phui/phui-feed-story.css' => 'aa49845d',
     'rsrc/css/phui/phui-fontkit.css' => '9cda225e',
     'rsrc/css/phui/phui-form-view.css' => '6a51768e',
@@ -777,7 +777,7 @@ return array(
     'phabricator-object-selector-css' => '85ee8ce6',
     'phabricator-phtize' => 'd254d646',
     'phabricator-prefab' => 'e67df814',
-    'phabricator-remarkup-css' => '6aae5360',
+    'phabricator-remarkup-css' => '787105d6',
     'phabricator-search-results-css' => '7dea472c',
     'phabricator-shaped-request' => '7cbe244b',
     'phabricator-side-menu-view-css' => 'dd849797',
@@ -821,8 +821,8 @@ return array(
     'phui-crumbs-view-css' => '1a1265d4',
     'phui-curtain-view-css' => '7148ae25',
     'phui-document-summary-view-css' => '9ca48bdf',
-    'phui-document-view-css' => '9c71d2bf',
+    'phui-document-view-css' => '715aedfb',
-    'phui-document-view-pro-css' => '73e45fd2',
+    'phui-document-view-pro-css' => '8419560b',
     'phui-feed-story-css' => 'aa49845d',
     'phui-font-icon-base-css' => '6449bce8',
     'phui-fontkit-css' => '9cda225e',

src/applications/files/markup/PhabricatorEmbedFileRemarkupRule.php

@@ -109,6 +109,14 @@ final class PhabricatorEmbedFileRemarkupRule
           );
           $image_class = 'phabricator-remarkup-embed-image-full';
           break;
+        // Displays "full" in normal Remarkup, "wide" in Documents
+        case 'wide':
+          $attrs += array(
+            'src' => $file->getBestURI(),
+            'width' => $file->getImageWidth(),
+          );
+          $image_class = 'phabricator-remarkup-embed-image-wide';
+          break;
         case 'thumb':
         default:
           $preview_key = PhabricatorFileThumbnailTransform::TRANSFORM_PREVIEW;

webroot/rsrc/css/core/remarkup.css

@@ -353,12 +353,14 @@
   box-shadow: 1px 1px 2px rgba({$alphablack}, 0.20);
 }
 
-.phabricator-remarkup-embed-image-full {
+.phabricator-remarkup-embed-image-full,
+.phabricator-remarkup-embed-image-wide {
   display: inline-block;
   max-width: 100%;
 }
 
-.phabricator-remarkup-embed-image-full img {
+.phabricator-remarkup-embed-image-full img,
+.phabricator-remarkup-embed-image-wide img {
   height: auto;
   max-width: 100%;
 }

webroot/rsrc/css/phui/phui-document-pro.css

@@ -141,8 +141,27 @@ a.button.phui-document-toc {
   margin: 16px 0 0 0;
 }
 
+.phui-document-view-pro .phabricator-remarkup-embed-image-wide {
+  margin-left: -200px;
+  margin-right: -200px;
+  width: auto;
+}
 
+.phui-document-view-pro .phabricator-remarkup-embed-image-wide img {
+  max-width: 1200px;
+}
 
+@media (max-width: 1200px) {
+  .phui-document-view-pro .phabricator-remarkup-embed-image-wide {
+    margin-left: 0;
+    margin-right: 0;
+    width: auto;
+  }
+
+  .phui-document-view-pro .phabricator-remarkup-embed-image-wide img {
+    max-width: inherit;
+  }
+}
 
 .phui-document-view-pro-box .phui-timeline-view {
   padding: 16px 0 0 0;

webroot/rsrc/css/phui/phui-document.css

@@ -103,7 +103,6 @@
 
 .phui-document-content {
   background: #fff;
-  overflow: hidden;
 }
 
 .phui-document-content .phabricator-remarkup {