mirror of
https://we.phorge.it/source/phorge.git
synced 2024-11-29 10:12:41 +01:00
Fix mask positioning and use mask classes in lightbox
Summary: See D3795 / D3797. Also made the mask darker. Test Plan: Mask now sizes properly on window resize in all browsers / mask uses. Reviewers: btrahan Reviewed By: btrahan CC: aran Differential Revision: https://secure.phabricator.com/D3798
This commit is contained in:
parent
1a8232f4c9
commit
e0cc277d5f
5 changed files with 59 additions and 68 deletions
2
externals/javelin
vendored
2
externals/javelin
vendored
|
@ -1 +1 @@
|
||||||
Subproject commit 59342b22dc4d336736cdf89af8d51fb49e7bb1a9
|
Subproject commit 888a4aa7ad9ae225c0abdd5358b7e52b77753433
|
|
@ -579,7 +579,7 @@ celerity_register_resource_map(array(
|
||||||
),
|
),
|
||||||
'aphront-dialog-view-css' =>
|
'aphront-dialog-view-css' =>
|
||||||
array(
|
array(
|
||||||
'uri' => '/res/eedc489d/rsrc/css/aphront/dialog-view.css',
|
'uri' => '/res/539f1755/rsrc/css/aphront/dialog-view.css',
|
||||||
'type' => 'css',
|
'type' => 'css',
|
||||||
'requires' =>
|
'requires' =>
|
||||||
array(
|
array(
|
||||||
|
@ -1385,7 +1385,7 @@ celerity_register_resource_map(array(
|
||||||
),
|
),
|
||||||
'javelin-behavior-lightbox-attachments' =>
|
'javelin-behavior-lightbox-attachments' =>
|
||||||
array(
|
array(
|
||||||
'uri' => '/res/bf398927/rsrc/js/application/core/behavior-lightbox-attachments.js',
|
'uri' => '/res/0cfebd8a/rsrc/js/application/core/behavior-lightbox-attachments.js',
|
||||||
'type' => 'js',
|
'type' => 'js',
|
||||||
'requires' =>
|
'requires' =>
|
||||||
array(
|
array(
|
||||||
|
@ -1932,13 +1932,12 @@ celerity_register_resource_map(array(
|
||||||
),
|
),
|
||||||
'javelin-mask' =>
|
'javelin-mask' =>
|
||||||
array(
|
array(
|
||||||
'uri' => '/res/03ef78b8/rsrc/js/javelin/lib/Mask.js',
|
'uri' => '/res/d2a35fff/rsrc/js/javelin/lib/Mask.js',
|
||||||
'type' => 'js',
|
'type' => 'js',
|
||||||
'requires' =>
|
'requires' =>
|
||||||
array(
|
array(
|
||||||
0 => 'javelin-install',
|
0 => 'javelin-install',
|
||||||
1 => 'javelin-vector',
|
1 => 'javelin-dom',
|
||||||
2 => 'javelin-dom',
|
|
||||||
),
|
),
|
||||||
'disk' => '/rsrc/js/javelin/lib/Mask.js',
|
'disk' => '/rsrc/js/javelin/lib/Mask.js',
|
||||||
),
|
),
|
||||||
|
@ -2238,7 +2237,7 @@ celerity_register_resource_map(array(
|
||||||
),
|
),
|
||||||
'lightbox-attachment-css' =>
|
'lightbox-attachment-css' =>
|
||||||
array(
|
array(
|
||||||
'uri' => '/res/398fdb62/rsrc/css/aphront/lightbox-attachment.css',
|
'uri' => '/res/136d479b/rsrc/css/aphront/lightbox-attachment.css',
|
||||||
'type' => 'css',
|
'type' => 'css',
|
||||||
'requires' =>
|
'requires' =>
|
||||||
array(
|
array(
|
||||||
|
@ -3071,7 +3070,7 @@ celerity_register_resource_map(array(
|
||||||
), array(
|
), array(
|
||||||
'packages' =>
|
'packages' =>
|
||||||
array(
|
array(
|
||||||
'8eb36c35' =>
|
'4322f368' =>
|
||||||
array(
|
array(
|
||||||
'name' => 'core.pkg.css',
|
'name' => 'core.pkg.css',
|
||||||
'symbols' =>
|
'symbols' =>
|
||||||
|
@ -3100,10 +3099,10 @@ celerity_register_resource_map(array(
|
||||||
21 => 'phabricator-flag-css',
|
21 => 'phabricator-flag-css',
|
||||||
22 => 'aphront-error-view-css',
|
22 => 'aphront-error-view-css',
|
||||||
),
|
),
|
||||||
'uri' => '/res/pkg/8eb36c35/core.pkg.css',
|
'uri' => '/res/pkg/4322f368/core.pkg.css',
|
||||||
'type' => 'css',
|
'type' => 'css',
|
||||||
),
|
),
|
||||||
'f3d6fc91' =>
|
'f5ccc73b' =>
|
||||||
array(
|
array(
|
||||||
'name' => 'core.pkg.js',
|
'name' => 'core.pkg.js',
|
||||||
'symbols' =>
|
'symbols' =>
|
||||||
|
@ -3126,7 +3125,7 @@ celerity_register_resource_map(array(
|
||||||
15 => 'javelin-behavior-phabricator-tooltips',
|
15 => 'javelin-behavior-phabricator-tooltips',
|
||||||
16 => 'phabricator-prefab',
|
16 => 'phabricator-prefab',
|
||||||
),
|
),
|
||||||
'uri' => '/res/pkg/f3d6fc91/core.pkg.js',
|
'uri' => '/res/pkg/f5ccc73b/core.pkg.js',
|
||||||
'type' => 'js',
|
'type' => 'js',
|
||||||
),
|
),
|
||||||
'2ba14b3d' =>
|
'2ba14b3d' =>
|
||||||
|
@ -3267,20 +3266,20 @@ celerity_register_resource_map(array(
|
||||||
'reverse' =>
|
'reverse' =>
|
||||||
array(
|
array(
|
||||||
'aphront-attached-file-view-css' => '7839ae2d',
|
'aphront-attached-file-view-css' => '7839ae2d',
|
||||||
'aphront-crumbs-view-css' => '8eb36c35',
|
'aphront-crumbs-view-css' => '4322f368',
|
||||||
'aphront-dialog-view-css' => '8eb36c35',
|
'aphront-dialog-view-css' => '4322f368',
|
||||||
'aphront-error-view-css' => '8eb36c35',
|
'aphront-error-view-css' => '4322f368',
|
||||||
'aphront-form-view-css' => '8eb36c35',
|
'aphront-form-view-css' => '4322f368',
|
||||||
'aphront-headsup-action-list-view-css' => '2ba14b3d',
|
'aphront-headsup-action-list-view-css' => '2ba14b3d',
|
||||||
'aphront-headsup-view-css' => '8eb36c35',
|
'aphront-headsup-view-css' => '4322f368',
|
||||||
'aphront-list-filter-view-css' => '8eb36c35',
|
'aphront-list-filter-view-css' => '4322f368',
|
||||||
'aphront-pager-view-css' => '8eb36c35',
|
'aphront-pager-view-css' => '4322f368',
|
||||||
'aphront-panel-view-css' => '8eb36c35',
|
'aphront-panel-view-css' => '4322f368',
|
||||||
'aphront-side-nav-view-css' => '8eb36c35',
|
'aphront-side-nav-view-css' => '4322f368',
|
||||||
'aphront-table-view-css' => '8eb36c35',
|
'aphront-table-view-css' => '4322f368',
|
||||||
'aphront-tokenizer-control-css' => '8eb36c35',
|
'aphront-tokenizer-control-css' => '4322f368',
|
||||||
'aphront-tooltip-css' => '8eb36c35',
|
'aphront-tooltip-css' => '4322f368',
|
||||||
'aphront-typeahead-control-css' => '8eb36c35',
|
'aphront-typeahead-control-css' => '4322f368',
|
||||||
'differential-changeset-view-css' => '2ba14b3d',
|
'differential-changeset-view-css' => '2ba14b3d',
|
||||||
'differential-core-view-css' => '2ba14b3d',
|
'differential-core-view-css' => '2ba14b3d',
|
||||||
'differential-inline-comment-editor' => '8136e4a6',
|
'differential-inline-comment-editor' => '8136e4a6',
|
||||||
|
@ -3299,7 +3298,7 @@ celerity_register_resource_map(array(
|
||||||
'javelin-behavior-aphront-basic-tokenizer' => 'dd024ca1',
|
'javelin-behavior-aphront-basic-tokenizer' => 'dd024ca1',
|
||||||
'javelin-behavior-aphront-drag-and-drop' => '8136e4a6',
|
'javelin-behavior-aphront-drag-and-drop' => '8136e4a6',
|
||||||
'javelin-behavior-aphront-drag-and-drop-textarea' => '8136e4a6',
|
'javelin-behavior-aphront-drag-and-drop-textarea' => '8136e4a6',
|
||||||
'javelin-behavior-aphront-form-disable-on-submit' => 'f3d6fc91',
|
'javelin-behavior-aphront-form-disable-on-submit' => 'f5ccc73b',
|
||||||
'javelin-behavior-audit-preview' => '5e68be89',
|
'javelin-behavior-audit-preview' => '5e68be89',
|
||||||
'javelin-behavior-differential-accept-with-errors' => '8136e4a6',
|
'javelin-behavior-differential-accept-with-errors' => '8136e4a6',
|
||||||
'javelin-behavior-differential-add-reviewers-and-ccs' => '8136e4a6',
|
'javelin-behavior-differential-add-reviewers-and-ccs' => '8136e4a6',
|
||||||
|
@ -3318,20 +3317,20 @@ celerity_register_resource_map(array(
|
||||||
'javelin-behavior-maniphest-transaction-controls' => '7707de41',
|
'javelin-behavior-maniphest-transaction-controls' => '7707de41',
|
||||||
'javelin-behavior-maniphest-transaction-expand' => '7707de41',
|
'javelin-behavior-maniphest-transaction-expand' => '7707de41',
|
||||||
'javelin-behavior-maniphest-transaction-preview' => '7707de41',
|
'javelin-behavior-maniphest-transaction-preview' => '7707de41',
|
||||||
'javelin-behavior-phabricator-autofocus' => 'f3d6fc91',
|
'javelin-behavior-phabricator-autofocus' => 'f5ccc73b',
|
||||||
'javelin-behavior-phabricator-keyboard-shortcuts' => 'f3d6fc91',
|
'javelin-behavior-phabricator-keyboard-shortcuts' => 'f5ccc73b',
|
||||||
'javelin-behavior-phabricator-object-selector' => '8136e4a6',
|
'javelin-behavior-phabricator-object-selector' => '8136e4a6',
|
||||||
'javelin-behavior-phabricator-oncopy' => 'f3d6fc91',
|
'javelin-behavior-phabricator-oncopy' => 'f5ccc73b',
|
||||||
'javelin-behavior-phabricator-tooltips' => 'f3d6fc91',
|
'javelin-behavior-phabricator-tooltips' => 'f5ccc73b',
|
||||||
'javelin-behavior-phabricator-watch-anchor' => 'f3d6fc91',
|
'javelin-behavior-phabricator-watch-anchor' => 'f5ccc73b',
|
||||||
'javelin-behavior-refresh-csrf' => 'f3d6fc91',
|
'javelin-behavior-refresh-csrf' => 'f5ccc73b',
|
||||||
'javelin-behavior-repository-crossreference' => '8136e4a6',
|
'javelin-behavior-repository-crossreference' => '8136e4a6',
|
||||||
'javelin-behavior-workflow' => 'f3d6fc91',
|
'javelin-behavior-workflow' => 'f5ccc73b',
|
||||||
'javelin-dom' => 'c50bbf3a',
|
'javelin-dom' => 'c50bbf3a',
|
||||||
'javelin-event' => 'c50bbf3a',
|
'javelin-event' => 'c50bbf3a',
|
||||||
'javelin-install' => 'c50bbf3a',
|
'javelin-install' => 'c50bbf3a',
|
||||||
'javelin-json' => 'c50bbf3a',
|
'javelin-json' => 'c50bbf3a',
|
||||||
'javelin-mask' => 'f3d6fc91',
|
'javelin-mask' => 'f5ccc73b',
|
||||||
'javelin-request' => 'c50bbf3a',
|
'javelin-request' => 'c50bbf3a',
|
||||||
'javelin-stratcom' => 'c50bbf3a',
|
'javelin-stratcom' => 'c50bbf3a',
|
||||||
'javelin-tokenizer' => 'dd024ca1',
|
'javelin-tokenizer' => 'dd024ca1',
|
||||||
|
@ -3343,30 +3342,30 @@ celerity_register_resource_map(array(
|
||||||
'javelin-uri' => 'c50bbf3a',
|
'javelin-uri' => 'c50bbf3a',
|
||||||
'javelin-util' => 'c50bbf3a',
|
'javelin-util' => 'c50bbf3a',
|
||||||
'javelin-vector' => 'c50bbf3a',
|
'javelin-vector' => 'c50bbf3a',
|
||||||
'javelin-workflow' => 'f3d6fc91',
|
'javelin-workflow' => 'f5ccc73b',
|
||||||
'maniphest-task-summary-css' => '7839ae2d',
|
'maniphest-task-summary-css' => '7839ae2d',
|
||||||
'maniphest-transaction-detail-css' => '7839ae2d',
|
'maniphest-transaction-detail-css' => '7839ae2d',
|
||||||
'phabricator-app-buttons-css' => '8eb36c35',
|
'phabricator-app-buttons-css' => '4322f368',
|
||||||
'phabricator-content-source-view-css' => '2ba14b3d',
|
'phabricator-content-source-view-css' => '2ba14b3d',
|
||||||
'phabricator-core-buttons-css' => '8eb36c35',
|
'phabricator-core-buttons-css' => '4322f368',
|
||||||
'phabricator-core-css' => '8eb36c35',
|
'phabricator-core-css' => '4322f368',
|
||||||
'phabricator-directory-css' => '8eb36c35',
|
'phabricator-directory-css' => '4322f368',
|
||||||
'phabricator-drag-and-drop-file-upload' => '8136e4a6',
|
'phabricator-drag-and-drop-file-upload' => '8136e4a6',
|
||||||
'phabricator-dropdown-menu' => 'f3d6fc91',
|
'phabricator-dropdown-menu' => 'f5ccc73b',
|
||||||
'phabricator-flag-css' => '8eb36c35',
|
'phabricator-flag-css' => '4322f368',
|
||||||
'phabricator-jump-nav' => '8eb36c35',
|
'phabricator-jump-nav' => '4322f368',
|
||||||
'phabricator-keyboard-shortcut' => 'f3d6fc91',
|
'phabricator-keyboard-shortcut' => 'f5ccc73b',
|
||||||
'phabricator-keyboard-shortcut-manager' => 'f3d6fc91',
|
'phabricator-keyboard-shortcut-manager' => 'f5ccc73b',
|
||||||
'phabricator-menu-item' => 'f3d6fc91',
|
'phabricator-menu-item' => 'f5ccc73b',
|
||||||
'phabricator-object-selector-css' => '2ba14b3d',
|
'phabricator-object-selector-css' => '2ba14b3d',
|
||||||
'phabricator-paste-file-upload' => 'f3d6fc91',
|
'phabricator-paste-file-upload' => 'f5ccc73b',
|
||||||
'phabricator-prefab' => 'f3d6fc91',
|
'phabricator-prefab' => 'f5ccc73b',
|
||||||
'phabricator-project-tag-css' => '7839ae2d',
|
'phabricator-project-tag-css' => '7839ae2d',
|
||||||
'phabricator-remarkup-css' => '8eb36c35',
|
'phabricator-remarkup-css' => '4322f368',
|
||||||
'phabricator-shaped-request' => '8136e4a6',
|
'phabricator-shaped-request' => '8136e4a6',
|
||||||
'phabricator-standard-page-view' => '8eb36c35',
|
'phabricator-standard-page-view' => '4322f368',
|
||||||
'phabricator-tooltip' => 'f3d6fc91',
|
'phabricator-tooltip' => 'f5ccc73b',
|
||||||
'phabricator-transaction-view-css' => '8eb36c35',
|
'phabricator-transaction-view-css' => '4322f368',
|
||||||
'syntax-highlighting-css' => '8eb36c35',
|
'syntax-highlighting-css' => '4322f368',
|
||||||
),
|
),
|
||||||
));
|
));
|
||||||
|
|
|
@ -48,18 +48,18 @@
|
||||||
|
|
||||||
.jx-mask {
|
.jx-mask {
|
||||||
opacity: .37;
|
opacity: .37;
|
||||||
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=37)";
|
|
||||||
filter: alpha(opacity=37);
|
|
||||||
background: #222;
|
background: #222;
|
||||||
position: absolute;
|
position: fixed;
|
||||||
z-index: 5;
|
z-index: 10;
|
||||||
top: 0;
|
top: 0;
|
||||||
left: 0;
|
left: 0;
|
||||||
right: 0;
|
right: 0;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
width: 100%;
|
}
|
||||||
height: 100%;
|
|
||||||
min-height: 100%;
|
.jx-dark-mask {
|
||||||
|
background: #000000;
|
||||||
|
opacity: 0.9;
|
||||||
}
|
}
|
||||||
|
|
||||||
.aphront-exception-dialog {
|
.aphront-exception-dialog {
|
||||||
|
|
|
@ -7,19 +7,11 @@
|
||||||
overflow-y: hidden;
|
overflow-y: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
.lightbox-attached .jx-mask {
|
|
||||||
opacity: 0.76;
|
|
||||||
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=76)";
|
|
||||||
filter: alpha(opacity=76);
|
|
||||||
/* jx-mask behavior sets this dynamically so !important to win */
|
|
||||||
width: 100% !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.lightbox-attachment {
|
.lightbox-attachment {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
top: 44px;
|
top: 44px;
|
||||||
left: 0;
|
left: 0;
|
||||||
z-index: 6;
|
z-index: 12;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -171,7 +171,7 @@ JX.behavior('lightbox-attachments', function (config) {
|
||||||
);
|
);
|
||||||
JX.DOM.appendContent(lightbox, statusHTML);
|
JX.DOM.appendContent(lightbox, statusHTML);
|
||||||
JX.DOM.alterClass(document.body, 'lightbox-attached', true);
|
JX.DOM.alterClass(document.body, 'lightbox-attached', true);
|
||||||
JX.Mask.show();
|
JX.Mask.show('jx-dark-mask');
|
||||||
document.body.appendChild(lightbox);
|
document.body.appendChild(lightbox);
|
||||||
img.src = img_uri;
|
img.src = img_uri;
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue