mirror of
https://we.phorge.it/source/phorge.git
synced 2024-11-10 17:02:41 +01:00
c3913f5995
Summary: When JX.Scrollbar activates, the page needs to be clicked before scrolling keys work. Instead, set focus into the content after we set the page frame (if something else isn't already focused). Also fixes T7042. Test Plan: In Safari, Chrome and Firefox, scrolling with key commands is now immediately active. Reviewers: btrahan, chad Reviewed By: chad Subscribers: epriestley Maniphest Tasks: T7042 Differential Revision: https://secure.phabricator.com/D11508
201 lines
3.8 KiB
CSS
201 lines
3.8 KiB
CSS
/**
|
|
* @provides phabricator-standard-page-view
|
|
*/
|
|
|
|
.phabricator-anchor-view,
|
|
.phabricator-anchor-navigation-marker {
|
|
position: absolute;
|
|
margin-top: -15px;
|
|
}
|
|
|
|
.phabricator-chromeless-page .phabricator-standard-page {
|
|
background: transparent;
|
|
border-width: 0px;
|
|
}
|
|
|
|
.phabricator-standard-page-footer {
|
|
text-align: right;
|
|
margin: 4px 16px;
|
|
padding: 12px 0;
|
|
border-top: 1px solid {$lightgreyborder};
|
|
color: {$greytext};
|
|
}
|
|
|
|
.device-desktop .has-local-nav + .phabricator-standard-page-footer {
|
|
margin-left: 221px;
|
|
}
|
|
|
|
.keyboard-shortcut-help td,
|
|
.keyboard-shortcut-help th {
|
|
padding: 8px;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.keyboard-shortcut-help th {
|
|
white-space: nowrap;
|
|
color: {$greytext};
|
|
}
|
|
|
|
.keyboard-shortcut-help kbd {
|
|
background: #222222;
|
|
padding: 6px;
|
|
color: #ffffff;
|
|
font-weight: bold;
|
|
border: 1px solid #555555;
|
|
}
|
|
|
|
.keyboard-focus-focus-reticle {
|
|
background: #ffffd3;
|
|
position: absolute;
|
|
border: 1px solid #999900;
|
|
}
|
|
|
|
.workflow-header {
|
|
background: #efefef;
|
|
padding: 6px 2em;
|
|
text-align: right;
|
|
margin-bottom: 6px;
|
|
border-bottom: 1px solid #dfdfdf;
|
|
}
|
|
|
|
.workflow-header button {
|
|
float: right;
|
|
}
|
|
|
|
a.handle-status-closed {
|
|
text-decoration: line-through;
|
|
color: #676767;
|
|
}
|
|
|
|
a.handle-status-closed:hover {
|
|
text-decoration: line-through;
|
|
color: #19558D;
|
|
}
|
|
|
|
a.handle-disabled,
|
|
a.handle-status-away,
|
|
a.handle-status-sporadic {
|
|
padding-left: 11px;
|
|
background-repeat: no-repeat;
|
|
background-position: -4px center;
|
|
}
|
|
|
|
a.handle-status-away {
|
|
background-image: url(/rsrc/image/icon/fatcow/bullet_red.png);
|
|
}
|
|
|
|
a.handle-status-sporadic {
|
|
background-image: url(/rsrc/image/icon/fatcow/bullet_orange.png);
|
|
}
|
|
|
|
a.handle-disabled {
|
|
background-image: url(/rsrc/image/icon/fatcow/bullet_black.png);
|
|
}
|
|
|
|
.aphront-developer-error-callout {
|
|
position: relative;
|
|
padding: 2em;
|
|
background: #aa0000;
|
|
color: white;
|
|
text-align: center;
|
|
font-size: 11px;
|
|
font-family: "Verdana";
|
|
}
|
|
|
|
.setup-warning-callout {
|
|
position: relative;
|
|
padding: 8px 16px;
|
|
background: {$lightyellow};
|
|
}
|
|
|
|
.phui-handle .phui-icon-view {
|
|
display: inline-block;
|
|
margin: 2px 2px -2px 0;
|
|
}
|
|
|
|
.main-page-frame {
|
|
position: absolute;
|
|
top: 0;
|
|
bottom: 0;
|
|
right: 0;
|
|
left: 0;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.phabricator-standard-page {
|
|
/* If we don't activate JX.Scrollbar because the default scrollbars are
|
|
satisfactory, make sure the page still has sensible behavior. These
|
|
settings will be overwritten by .jx-scrollbar-frame if JX.Scrollbar
|
|
activates. */
|
|
position: relative;
|
|
height: 100%;
|
|
overflow-y: scroll;
|
|
|
|
-webkit-overflow-scrolling: touch;
|
|
}
|
|
|
|
.jx-scrollbar-frame {
|
|
position: relative;
|
|
height: 100%;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.jx-scrollbar-viewport {
|
|
position: absolute;
|
|
overflow-x: hidden;
|
|
overflow-y: scroll;
|
|
top: 0;
|
|
bottom: 0;
|
|
left: 0;
|
|
right: 0;
|
|
}
|
|
|
|
.jx-scrollbar-test {
|
|
position: absolute;
|
|
left: -300px;
|
|
}
|
|
|
|
.jx-scrollbar-bar {
|
|
position: absolute;
|
|
top: 0;
|
|
right: 0;
|
|
bottom: 7px;
|
|
width: 11px;
|
|
}
|
|
|
|
.jx-scrollbar-bar .jx-scrollbar-handle {
|
|
position: absolute;
|
|
right: 2px;
|
|
-webkit-border-radius: 7px;
|
|
-moz-border-radius: 7px;
|
|
border-radius: 7px;
|
|
min-height: 10px;
|
|
width: 7px;
|
|
opacity: 0;
|
|
-webkit-transition: opacity 0.2s linear;
|
|
-moz-transition: opacity 0.2s linear;
|
|
-o-transition: opacity 0.2s linear;
|
|
-ms-transition: opacity 0.2s linear;
|
|
transition: opacity 0.2s linear;
|
|
background: #6c6e71;
|
|
-webkit-background-clip: padding-box;
|
|
-moz-background-clip: padding;
|
|
}
|
|
|
|
.jx-scrollbar-bar:hover .jx-scrollbar-handle {
|
|
opacity: 0.7;
|
|
-webkit-transition: opacity 0 linear;
|
|
-moz-transition: opacity 0 linear;
|
|
-o-transition: opacity 0 linear;
|
|
-ms-transition: opacity 0 linear;
|
|
transition: opacity 0 linear;
|
|
}
|
|
|
|
.jx-scrollbar-bar .jx-scrollbar-visible {
|
|
opacity: 0.7;
|
|
}
|
|
|
|
.jx-scrollbar-link {
|
|
position: absolute;
|
|
left: -50px;
|
|
}
|