mirror of
https://we.phorge.it/source/phorge.git
synced 2024-12-04 20:52:43 +01:00
4811e6e7c1
Summary: Fixes T11836. See some prior discussion in T8376#120613. The policy hint in headers in the UI is not exhaustive, and can not reasonably be exhaustive. For example, on a revision, it may say "All Users", but really mean "All users who can see the space this object is in and the repository it belongs to, plus the revision author and reviewers". These rules are explained if you click (and, often, in the documentation), but "All Users" is still at least somewhat misleading. I don't think there's any perfect solution here that balances the needs of both new and experienced users perfectly, but this change tries to do a bit better about avoiding cases where we say something very open (like "All Users") when the real policy is not very open. Specifically, I've made these changes to the header: - Spaces are now listed in the tag, so it will say `(S3 > All Users)` instead of `(All Users)`. They're already listed in the header, this just makes it more explicit that Spaces are a policy container and part of the view policy. - Extended policy objects are now listed in the tag, so it will say `(S3 > rARC > All Users)` for a revision in the Arcanist repository which is also in Space 3. - Objects can now provide a "Policy Codex", which is an object that represents a rulebook of more sophisticated policy descriptions. This codex can replace the tag with something else. - Imported calendar events now say "Uses Import Policy" instead of, e.g., "All Users". I've made these changes to the policy dialog: - Split it into more visually separate sections. - Added an explicit section for extended policies ("You must also have access to these other objects: ..."). - Broken the object policy rules into a "Special Rules" section (for rules like "you can only see a revision if you can see the repository it is part of") and an "Object Policy" section (for the actual object policy). - Tried to make it a little more readable? - The new policy dialogs are great to curl up with in front of a fire with a nice cup of cocoa. I've made these changes to infrastructure: - Implementing `PhabricatorPolicyInterface` no longer requires you to implement `describeAutomaticCapability()`. - Instead, implement `PhabricatorPolicyCodexInterface` and return a `PhabricatorPolicyCodex` object. - This "codex" is a policy rulebook which can set all the policy icons, labels, colors, rules, etc., to properly explain complex policies. - Broadly, the old method was usually either not useful (most objects have no special rules) or not powerful enough (objects with special rules often need to do more in order to explain them). Test Plan: {F1912860} {F1912861} {F1912862} {F1912863} Reviewers: chad Reviewed By: chad Subscribers: avivey Maniphest Tasks: T11836 Differential Revision: https://secure.phabricator.com/D16830
397 lines
7.4 KiB
CSS
397 lines
7.4 KiB
CSS
/**
|
|
* @provides phui-header-view-css
|
|
*/
|
|
|
|
.phui-header-shell {
|
|
border-bottom: 1px solid {$thinblueborder};
|
|
overflow: hidden;
|
|
padding: 0 4px 12px;
|
|
}
|
|
|
|
.phui-header-view {
|
|
display: table;
|
|
width: 100%
|
|
}
|
|
|
|
.phui-header-row {
|
|
display: table-row;
|
|
}
|
|
|
|
.phui-header-col1 {
|
|
display: table-cell;
|
|
vertical-align: middle;
|
|
width: 62px;
|
|
}
|
|
|
|
.phui-header-col2 {
|
|
display: table-cell;
|
|
vertical-align: middle;
|
|
word-break: break-word;
|
|
}
|
|
|
|
.phui-header-col3 {
|
|
display: table-cell;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.device-phone .phui-header-col3 {
|
|
vertical-align: top;
|
|
}
|
|
|
|
body .phui-header-shell.phui-header-no-backgound {
|
|
background-color: transparent;
|
|
border: none;
|
|
}
|
|
|
|
body .phui-header-shell.phui-bleed-header {
|
|
background-color: #fff;
|
|
border-bottom: 1px solid {$thinblueborder};
|
|
width: auto;
|
|
margin: 16px;
|
|
}
|
|
|
|
body .phui-header-shell.phui-bleed-header
|
|
.phui-header-view {
|
|
padding: 8px 24px 8px 0;
|
|
color: {$darkbluetext};
|
|
}
|
|
|
|
.phui-header-shell + .phabricator-form-view {
|
|
border-top-width: 0;
|
|
}
|
|
|
|
.phui-property-list-view + .diviner-document-section {
|
|
margin-top: -1px;
|
|
}
|
|
|
|
.phui-header-view {
|
|
position: relative;
|
|
font-size: {$normalfontsize};
|
|
}
|
|
|
|
.phui-header-header {
|
|
font-size: 16px;
|
|
line-height: 24px;
|
|
color: {$darkbluetext};
|
|
}
|
|
|
|
.phui-header-header .phui-header-icon {
|
|
margin-right: 8px;
|
|
color: {$lightbluetext};
|
|
|
|
/* This allows the header text to be triple-clicked to select it in Firefox,
|
|
see T10905 for discussion. */
|
|
display: inline;
|
|
}
|
|
|
|
.phui-object-box .phui-header-tall .phui-header-header,
|
|
.phui-document-view .phui-header-tall .phui-header-header {
|
|
font-size: 18px;
|
|
}
|
|
|
|
.phui-header-view .phui-header-header a {
|
|
color: {$darkbluetext};
|
|
}
|
|
|
|
.device-desktop .phui-header-view .phui-header-header a:hover {
|
|
text-decoration: none;
|
|
color: {$blue};
|
|
}
|
|
|
|
.phui-header-view .phui-header-action-links {
|
|
float: right;
|
|
}
|
|
|
|
.phui-object-box .phui-header-view .phui-header-action-links {
|
|
margin-right: 4px;
|
|
font-size: {$normalfontsize};
|
|
}
|
|
|
|
.phui-header-action-link {
|
|
margin-bottom: 4px;
|
|
margin-top: 4px;
|
|
float: right;
|
|
}
|
|
|
|
.device-phone .phui-header-action-link .phui-button-text {
|
|
visibility: hidden;
|
|
width: 0;
|
|
margin-left: 8px;
|
|
}
|
|
|
|
.device-phone .phui-header-action-link.button .phui-icon-view {
|
|
width: 12px;
|
|
text-align: center;
|
|
}
|
|
|
|
.phui-header-divider {
|
|
margin: 0 4px;
|
|
font-weight: normal;
|
|
color: {$lightbluetext};
|
|
}
|
|
|
|
.phui-header-tags {
|
|
margin-left: 12px;
|
|
font-size: {$normalfontsize};
|
|
}
|
|
|
|
.phui-header-tags .phui-tag-view {
|
|
margin-left: 4px;
|
|
}
|
|
|
|
.phui-header-image {
|
|
display: inline-block;
|
|
background-repeat: no-repeat;
|
|
background-size: 100%;
|
|
width: 50px;
|
|
height: 50px;
|
|
border-radius: 3px;
|
|
}
|
|
|
|
.phui-header-image-href {
|
|
position: relative;
|
|
display: block;
|
|
}
|
|
|
|
.phui-header-image-edit {
|
|
display: none;
|
|
}
|
|
|
|
.device-desktop .phui-header-image-href:hover .phui-header-image-edit {
|
|
display: block;
|
|
position: absolute;
|
|
left: 0;
|
|
background: rgba({$alphablack},0.4);
|
|
color: #fff;
|
|
font-weight: normal;
|
|
bottom: 4px;
|
|
padding: 4px 8px;
|
|
font-size: 12px;
|
|
}
|
|
|
|
.device-desktop .phui-header-image-edit:hover {
|
|
text-decoration: underline;
|
|
}
|
|
|
|
.phui-header-subheader {
|
|
font-weight: normal;
|
|
font-size: {$biggerfontsize};
|
|
margin-top: 8px;
|
|
}
|
|
|
|
.phui-header-subheader .phui-icon-view {
|
|
margin-right: 4px;
|
|
}
|
|
|
|
.phui-header-subheader .phui-tag-view .phui-icon-view,
|
|
.phui-header-subheader .policy-header-callout .phui-icon-view {
|
|
display: inline-block;
|
|
margin: -2px 4px -2px 0;
|
|
font-size: 15px;
|
|
}
|
|
|
|
.phui-header-subheader,
|
|
.phui-header-subheader .policy-link {
|
|
color: {$darkbluetext};
|
|
}
|
|
|
|
.policy-header-callout,
|
|
.phui-header-subheader .phui-tag-core {
|
|
padding: 3px 9px;
|
|
border-radius: 3px;
|
|
background: rgba({$alphablue}, 0.1);
|
|
margin-right: 8px;
|
|
-webkit-font-smoothing: auto;
|
|
border-color: transparent;
|
|
}
|
|
|
|
|
|
.phui-header-subheader .phui-tag-view,
|
|
.phui-header-subheader .phui-tag-type-shade .phui-tag-core {
|
|
border: none;
|
|
font-weight: normal;
|
|
-webkit-font-smoothing: auto;
|
|
}
|
|
|
|
.policy-header-callout.policy-adjusted-weaker {
|
|
background: {$sh-greenbackground};
|
|
}
|
|
|
|
.policy-header-callout.policy-adjusted-weaker .policy-link,
|
|
.policy-header-callout.policy-adjusted-weaker .phui-icon-view {
|
|
color: {$sh-greentext};
|
|
}
|
|
|
|
.policy-header-callout.policy-adjusted-stronger {
|
|
background: {$sh-redbackground};
|
|
}
|
|
|
|
.policy-header-callout.policy-adjusted-stronger .policy-link,
|
|
.policy-header-callout.policy-adjusted-stronger .phui-icon-view {
|
|
color: {$sh-redtext};
|
|
}
|
|
|
|
.policy-header-callout.policy-adjusted-different {
|
|
background: {$sh-orangebackground};
|
|
}
|
|
|
|
.policy-header-callout.policy-adjusted-different .policy-link,
|
|
.policy-header-callout.policy-adjusted-different .phui-icon-view {
|
|
color: {$sh-orangetext};
|
|
}
|
|
|
|
.policy-header-callout.policy-adjusted-special {
|
|
background: {$sh-indigobackground};
|
|
}
|
|
|
|
.policy-header-callout.policy-adjusted-special .policy-link,
|
|
.policy-header-callout.policy-adjusted-special .phui-icon-view {
|
|
color: {$sh-indigotext};
|
|
}
|
|
|
|
.policy-header-callout .policy-space-container {
|
|
font-weight: bold;
|
|
color: {$sh-redtext};
|
|
}
|
|
|
|
.policy-header-callout .policy-tier-separator {
|
|
padding: 0 0 0 4px;
|
|
color: {$lightgreytext};
|
|
}
|
|
|
|
|
|
.phui-header-action-links .phui-mobile-menu {
|
|
display: none;
|
|
}
|
|
|
|
.device .phui-header-action-links .phui-mobile-menu {
|
|
display: inline-block;
|
|
}
|
|
|
|
.phui-header-action-list {
|
|
float: right;
|
|
}
|
|
|
|
.phui-header-action-list li {
|
|
margin: 0 0 0 8px;
|
|
float: right;
|
|
}
|
|
|
|
.phui-header-action-list .phui-header-action-item .phui-icon-view {
|
|
height: 18px;
|
|
width: 16px;
|
|
font-size: 16px;
|
|
line-height: 20px;
|
|
display: block;
|
|
}
|
|
|
|
.spaces-name {
|
|
color: {$lightbluetext};
|
|
}
|
|
|
|
.phui-object-box .phui-header-tall .spaces-name {
|
|
font-size: 18px;
|
|
}
|
|
|
|
.spaces-name .phui-handle,
|
|
.spaces-name a.phui-handle {
|
|
color: {$sh-redtext};
|
|
}
|
|
|
|
.device-desktop .spaces-name a.phui-handle:hover {
|
|
color: {$sh-redtext};
|
|
text-decoration: underline;
|
|
}
|
|
|
|
.phui-header-subheader .phui-badge-flex-view {
|
|
display: inline;
|
|
margin-right: 4px;
|
|
}
|
|
|
|
.phui-header-subheader .phui-badge-flex-view:after {
|
|
display: inline;
|
|
}
|
|
|
|
/*** Profile Header ***********************************************************/
|
|
|
|
.phui-profile-header {
|
|
padding: 24px 20px 20px 24px;
|
|
}
|
|
|
|
.device-phone .phui-profile-header {
|
|
padding: 12px;
|
|
}
|
|
|
|
.phui-profile-header.phui-header-shell {
|
|
margin: 0;
|
|
border: none;
|
|
}
|
|
|
|
.phui-profile-header .phui-header-image {
|
|
height: 80px;
|
|
width: 80px;
|
|
}
|
|
|
|
.phui-profile-header .phui-header-col1 {
|
|
width: 96px;
|
|
}
|
|
|
|
.phui-profile-header .phui-header-subheader {
|
|
margin-top: 12px;
|
|
}
|
|
|
|
.phui-profile-header.phui-header-shell .phui-header-header {
|
|
font-family: 'Aleo', {$fontfamily};
|
|
font-size: 24px;
|
|
color: #000;
|
|
}
|
|
|
|
.phui-profile-header .phui-header-col3 {
|
|
vertical-align: top;
|
|
}
|
|
|
|
.phui-header-view .phui-tag-shade-indigo a {
|
|
color: {$sh-indigotext};
|
|
}
|
|
|
|
.phui-policy-section-view {
|
|
margin-bottom: 24px;
|
|
}
|
|
|
|
.phui-policy-section-view-header {
|
|
background: {$bluebackground};
|
|
border-bottom: 1px solid {$lightblueborder};
|
|
padding: 4px 8px;
|
|
color: {$darkbluetext};
|
|
margin-bottom: 8px;
|
|
}
|
|
|
|
.phui-policy-section-view-header-text {
|
|
font-weight: bold;
|
|
}
|
|
|
|
.phui-policy-section-view-header .phui-icon-view {
|
|
margin-right: 8px;
|
|
}
|
|
|
|
.phui-policy-section-view-link {
|
|
float: right;
|
|
}
|
|
|
|
.phui-policy-section-view-link .phui-icon-view {
|
|
color: {$bluetext};
|
|
}
|
|
|
|
.phui-policy-section-view-hint {
|
|
color: {$greytext};
|
|
background: {$lightbluebackground};
|
|
padding: 8px;
|
|
}
|
|
|
|
.phui-policy-section-view-body {
|
|
padding: 0 12px;
|
|
}
|
|
|
|
.phui-policy-section-view-inactive-rule {
|
|
color: {$greytext};
|
|
}
|