Page Menu
Home
Phabricator
Search
Configure Global Search
Log In
Files
F14082438
D17563.diff
No One
Temporary
Actions
View File
Edit File
Delete File
View Transforms
Subscribe
Mute Notifications
Award Token
Flag For Later
Size
12 KB
Referenced Files
None
Subscribers
None
D17563.diff
View Options
diff --git a/resources/celerity/map.php b/resources/celerity/map.php
--- a/resources/celerity/map.php
+++ b/resources/celerity/map.php
@@ -9,8 +9,8 @@
'names' => array(
'conpherence.pkg.css' => '82aca405',
'conpherence.pkg.js' => '6249a1cf',
- 'core.pkg.css' => 'dc689e29',
- 'core.pkg.js' => '1fa7c0c5',
+ 'core.pkg.css' => 'acd257dc',
+ 'core.pkg.js' => '021685f1',
'darkconsole.pkg.js' => 'e7393ebb',
'differential.pkg.css' => '90b30783',
'differential.pkg.js' => 'ddfeb49b',
@@ -108,7 +108,7 @@
'rsrc/css/application/tokens/tokens.css' => '3d0f239e',
'rsrc/css/application/uiexample/example.css' => '528b19de',
'rsrc/css/core/core.css' => '9f4cb463',
- 'rsrc/css/core/remarkup.css' => '2d793c5b',
+ 'rsrc/css/core/remarkup.css' => '17c0fb37',
'rsrc/css/core/syntax.css' => '769d3498',
'rsrc/css/core/z-index.css' => '5e72c4e0',
'rsrc/css/diviner/diviner-shared.css' => '896f1d43',
@@ -136,7 +136,7 @@
'rsrc/css/phui/phui-button.css' => '14bfba79',
'rsrc/css/phui/phui-chart.css' => '6bf6f78e',
'rsrc/css/phui/phui-cms.css' => '504b4b23',
- 'rsrc/css/phui/phui-comment-form.css' => '48fbd65d',
+ 'rsrc/css/phui/phui-comment-form.css' => '7d903c2d',
'rsrc/css/phui/phui-comment-panel.css' => 'f50152ad',
'rsrc/css/phui/phui-crumbs-view.css' => '6ece3bbb',
'rsrc/css/phui/phui-curtain-view.css' => '947bf1a4',
@@ -503,7 +503,7 @@
'rsrc/js/core/behavior-object-selector.js' => 'e0ec7f2f',
'rsrc/js/core/behavior-oncopy.js' => '2926fff2',
'rsrc/js/core/behavior-phabricator-nav.js' => '08675c6d',
- 'rsrc/js/core/behavior-phabricator-remarkup-assist.js' => '0c61d4e3',
+ 'rsrc/js/core/behavior-phabricator-remarkup-assist.js' => 'a0777ea3',
'rsrc/js/core/behavior-read-only-warning.js' => 'ba158207',
'rsrc/js/core/behavior-refresh-csrf.js' => 'ab2f381b',
'rsrc/js/core/behavior-remarkup-preview.js' => '4b700e9e',
@@ -664,7 +664,7 @@
'javelin-behavior-phabricator-notification-example' => '8ce821c5',
'javelin-behavior-phabricator-object-selector' => 'e0ec7f2f',
'javelin-behavior-phabricator-oncopy' => '2926fff2',
- 'javelin-behavior-phabricator-remarkup-assist' => '0c61d4e3',
+ 'javelin-behavior-phabricator-remarkup-assist' => 'a0777ea3',
'javelin-behavior-phabricator-reveal-content' => '60821bc7',
'javelin-behavior-phabricator-search-typeahead' => '06c32383',
'javelin-behavior-phabricator-show-older-transactions' => '94c65b72',
@@ -793,7 +793,7 @@
'phabricator-object-selector-css' => '85ee8ce6',
'phabricator-phtize' => 'd254d646',
'phabricator-prefab' => '8d40ae75',
- 'phabricator-remarkup-css' => '2d793c5b',
+ 'phabricator-remarkup-css' => '17c0fb37',
'phabricator-search-results-css' => '64ad079a',
'phabricator-shaped-request' => '7cbe244b',
'phabricator-slowvote-css' => 'a94b7230',
@@ -836,7 +836,7 @@
'phui-calendar-month-css' => '8e10e92c',
'phui-chart-css' => '6bf6f78e',
'phui-cms-css' => '504b4b23',
- 'phui-comment-form-css' => '48fbd65d',
+ 'phui-comment-form-css' => '7d903c2d',
'phui-comment-panel-css' => 'f50152ad',
'phui-crumbs-view-css' => '6ece3bbb',
'phui-curtain-view-css' => '947bf1a4',
@@ -988,16 +988,6 @@
'javelin-dom',
'javelin-router',
),
- '0c61d4e3' => array(
- 'javelin-behavior',
- 'javelin-stratcom',
- 'javelin-dom',
- 'phabricator-phtize',
- 'phabricator-textareautils',
- 'javelin-workflow',
- 'javelin-vector',
- 'phuix-autocomplete',
- ),
'0f764c35' => array(
'javelin-install',
'javelin-util',
@@ -1705,6 +1695,17 @@
'javelin-dom',
'javelin-vector',
),
+ 'a0777ea3' => array(
+ 'javelin-behavior',
+ 'javelin-stratcom',
+ 'javelin-dom',
+ 'phabricator-phtize',
+ 'phabricator-textareautils',
+ 'javelin-workflow',
+ 'javelin-vector',
+ 'phuix-autocomplete',
+ 'javelin-mask',
+ ),
'a0b57eb8' => array(
'javelin-behavior',
'javelin-dom',
diff --git a/src/view/form/control/PhabricatorRemarkupControl.php b/src/view/form/control/PhabricatorRemarkupControl.php
--- a/src/view/form/control/PhabricatorRemarkupControl.php
+++ b/src/view/form/control/PhabricatorRemarkupControl.php
@@ -172,11 +172,6 @@
'align' => 'right',
);
- $actions[] = array(
- 'spacer' => true,
- 'align' => 'right',
- );
-
$actions['fa-book'] = array(
'tip' => pht('Help'),
'align' => 'right',
@@ -200,10 +195,6 @@
}
if ($mode_actions) {
- $actions[] = array(
- 'spacer' => true,
- 'align' => 'right',
- );
$actions += $mode_actions;
}
diff --git a/webroot/rsrc/css/core/remarkup.css b/webroot/rsrc/css/core/remarkup.css
--- a/webroot/rsrc/css/core/remarkup.css
+++ b/webroot/rsrc/css/core/remarkup.css
@@ -558,9 +558,13 @@
.remarkup-assist-button {
display: block;
- margin-top: 2px;
- padding: 4px 5px;
+ margin-top: 4px;
+ height: 20px;
+ padding: 2px 5px 3px;
+ line-height: 18px;
+ width: 16px;
float: left;
+ border-radius: 3px;
}
.remarkup-assist-button:hover .phui-icon-view.phui-font-fa {
@@ -617,37 +621,6 @@
opacity: 1.0;
}
-.remarkup-control-fullscreen-mode {
- position: fixed;
- top: -1px;
- bottom: -1px;
- left: -1px;
- right: -1px;
-}
-
-.remarkup-control-fullscreen-mode textarea.remarkup-assist-textarea {
- position: absolute;
- top: 32px;
- left: 0;
- right: 0;
- bottom: 0;
- /* NOTE: This doesn't work in Firefox, there's a JS behavior to correct it. */
- height: auto;
- border-width: 1px 0 0 0;
- outline: none;
- resize: none;
- background: #fff !important;
-}
-
-.remarkup-control-fullscreen-mode textarea.remarkup-assist-textarea:focus {
- border-color: none;
- box-shadow: none;
-}
-
-.remarkup-control-fullscreen-mode .remarkup-assist-button .fa-arrows-alt {
- color: {$sky};
-}
-
.phabricator-image-macro-hero {
margin: auto;
max-width: 95%;
@@ -673,42 +646,12 @@
padding: 0 4px;
}
-.remarkup-inline-preview {
- display: block;
- position: relative;
- background: #fff;
- overflow-y: auto;
- box-sizing: border-box;
- width: 100%;
- border: 1px solid {$sky};
- resize: vertical;
- padding: 4px 6px;
-}
-
-.remarkup-control-fullscreen-mode .remarkup-inline-preview {
- resize: none;
-}
-
-.remarkup-inline-preview * {
- resize: none;
-}
-
-.remarkup-assist-button.preview-active {
- background: {$sky};
-}
-
-.remarkup-assist-button.preview-active .phui-icon-view {
- color: #ffffff;
-}
-
-.remarkup-assist-button.preview-active:hover .phui-icon-view {
- color: {$lightsky};
-}
-
.device .remarkup-assist-nodevice {
display: none;
}
+/* - Autocomplete ----------------------------------------------------------- */
+
.phuix-autocomplete {
position: absolute;
width: 300px;
@@ -764,6 +707,9 @@
color: #000;
}
+
+/* - Pinned ----------------------------------------------------------------- */
+
.phui-box.phui-object-box.phui-comment-form-view.remarkup-assist-pinned {
position: fixed;
background-color: #ffffff;
@@ -783,3 +729,144 @@
.remarkup-assist-pinned-spacer {
position: relative;
}
+
+
+/* - Preview ---------------------------------------------------------------- */
+
+.remarkup-inline-preview {
+ display: block;
+ position: relative;
+ background: #fff;
+ overflow-y: auto;
+ box-sizing: border-box;
+ width: 100%;
+ resize: vertical;
+ padding: 8px;
+ border: 1px solid {$lightblueborder};
+ border-top: none;
+ -webkit-font-smoothing: antialiased;
+}
+
+.remarkup-control-fullscreen-mode .remarkup-inline-preview {
+ resize: none;
+}
+
+.remarkup-inline-preview * {
+ resize: none;
+}
+
+.remarkup-assist-button.preview-active {
+ background: {$sky};
+}
+
+.remarkup-assist-button.preview-active .phui-icon-view {
+ color: #fff;
+}
+
+.remarkup-assist-button.preview-active:hover {
+ text-decoration: none;
+}
+
+.remarkup-assist-button.preview-active:hover .phui-icon-view {
+ color: #fff;
+}
+
+.remarkup-preview-active .remarkup-assist,
+.remarkup-preview-active .remarkup-assist-separator {
+ opacity: .2;
+ transition: all 100ms cubic-bezier(0.250, 0.250, 0.750, 0.750);
+ transition-timing-function: cubic-bezier(0.250, 0.250, 0.750, 0.750);
+}
+
+.remarkup-preview-active .remarkup-assist-button {
+ pointer-events: none;
+ cursor: default;
+}
+
+.remarkup-preview-active .remarkup-assist-button.preview-active {
+ pointer-events: inherit;
+ cursor: pointer;
+}
+
+.remarkup-preview-active .remarkup-assist.fa-eye {
+ opacity: 1;
+ transition: all 100ms cubic-bezier(0.250, 0.250, 0.750, 0.750);
+ transition-timing-function: cubic-bezier(0.250, 0.250, 0.750, 0.750);
+}
+
+
+/* - Fullscreen ------------------------------------------------------------- */
+
+.remarkup-fullscreen-mode {
+ overflow: hidden;
+}
+
+.remarkup-control-fullscreen-mode {
+ position: fixed;
+ border: none;
+ top: 32px;
+ bottom: 32px;
+ left: 64px;
+ right: 64px;
+ border-radius: 3px;
+ box-shadow: 0px 4px 32px #555;
+}
+
+.remarkup-control-fullscreen-mode .remarkup-assist-button {
+ padding: 1px 6px 4px;
+ font-size: 15px;
+}
+
+.remarkup-control-fullscreen-mode .remarkup-assist-button .remarkup-assist {
+ height: 16px;
+ width: 16px;
+}
+
+.aphront-form-input .remarkup-control-fullscreen-mode .remarkup-assist-bar {
+ border: none;
+ border-top-left-radius: 3px;
+ border-top-right-radius: 3px;
+ height: 32px;
+ padding: 4px 8px;
+ background: {$bluebackground};
+}
+
+.aphront-form-control .remarkup-control-fullscreen-mode
+ textarea.remarkup-assist-textarea {
+ position: absolute;
+ top: 39px;
+ left: 0;
+ right: 0;
+ height: calc(100% - 36px) !important;
+ padding: 16px;
+ font-size: {$biggerfontsize};
+ line-height: 1.51em;
+ border-width: 1px 0 0 0;
+ outline: none;
+ resize: none;
+ background: #fff !important;
+}
+
+.remarkup-control-fullscreen-mode textarea.remarkup-assist-textarea:focus {
+ border-color: {$thinblueborder};
+ box-shadow: none;
+}
+
+.remarkup-control-fullscreen-mode .remarkup-inline-preview {
+ font-size: {$biggerfontsize};
+ border: none;
+ padding: 16px;
+ border-bottom-left-radius: 3px;
+ border-bottom-right-radius: 3px;
+}
+
+.remarkup-control-fullscreen-mode .remarkup-assist-button .fa-arrows-alt {
+ color: {$sky};
+}
+
+.device-phone .remarkup-control-fullscreen-mode {
+ top: 0;
+ bottom: 0;
+ left: 0;
+ right: 0;
+}
diff --git a/webroot/rsrc/css/phui/phui-comment-form.css b/webroot/rsrc/css/phui/phui-comment-form.css
--- a/webroot/rsrc/css/phui/phui-comment-form.css
+++ b/webroot/rsrc/css/phui/phui-comment-form.css
@@ -62,7 +62,7 @@
border-color: {$lightblueborder};
border-top: 1px solid {$thinblueborder};
padding: 8px;
- height: 10em;
+ height: 12em;
background-color: rgba({$alphablue},.02);
}
diff --git a/webroot/rsrc/js/core/behavior-phabricator-remarkup-assist.js b/webroot/rsrc/js/core/behavior-phabricator-remarkup-assist.js
--- a/webroot/rsrc/js/core/behavior-phabricator-remarkup-assist.js
+++ b/webroot/rsrc/js/core/behavior-phabricator-remarkup-assist.js
@@ -8,6 +8,7 @@
* javelin-workflow
* javelin-vector
* phuix-autocomplete
+ * javelin-mask
*/
JX.behavior('phabricator-remarkup-assist', function(config) {
@@ -39,6 +40,7 @@
if (edit_mode == 'fa-arrows-alt') {
JX.DOM.alterClass(edit_root, 'remarkup-control-fullscreen-mode', false);
JX.DOM.alterClass(document.body, 'remarkup-fullscreen-mode', false);
+ JX.Mask.hide('jx-light-mask');
}
area.style.height = '';
@@ -59,6 +61,7 @@
if (mode == 'fa-arrows-alt') {
JX.DOM.alterClass(edit_root, 'remarkup-control-fullscreen-mode', true);
JX.DOM.alterClass(document.body, 'remarkup-fullscreen-mode', true);
+ JX.Mask.show('jx-light-mask');
// If we're in preview mode, expand the preview to full-size.
if (preview) {
@@ -275,6 +278,7 @@
area.parentNode.insertBefore(preview, area);
JX.DOM.alterClass(button, 'preview-active', true);
+ JX.DOM.alterClass(root, 'remarkup-preview-active', true);
resize_preview();
JX.DOM.hide(area);
@@ -286,6 +290,7 @@
preview = null;
JX.DOM.alterClass(button, 'preview-active', false);
+ JX.DOM.alterClass(root, 'remarkup-preview-active', false);
}
break;
case 'fa-thumb-tack':
File Metadata
Details
Attached
Mime Type
text/plain
Expires
Sat, Nov 23, 11:54 PM (19 h, 18 m)
Storage Engine
blob
Storage Format
Encrypted (AES-256-CBC)
Storage Handle
6779500
Default Alt Text
D17563.diff (12 KB)
Attached To
Mode
D17563: Cleaner fullscreen / preview states for Remarkup bar
Attached
Detach File
Event Timeline
Log In to Comment