From f695e48d248da4312b19d78c0be1b0193875617b Mon Sep 17 00:00:00 2001 From: Andre Klapper Date: Wed, 18 Feb 2026 12:10:02 +0100 Subject: [PATCH] CSS: Do not wrap policy-header-callout content in phui-header-subheader Summary: On small screens, the view policy tag in the page subheader (e.g. "Public", "All Users", "Custom Policy", "Administrators") can get wrapped across three lines. Avoid that and keep the tag on one line. Closes T16287 Test Plan: Look at tags in subheaders on object pages in all three different CSS layouts that Phorge offers, ideally with "long" tags * http://phorge.localhost/p/user/ (e.g. with a user who also has MFA enabled) * http://phorge.localhost/diffusion/1/ * http://phorge.localhost/book/flavor/ * http://phorge.localhost/T1 (e.g. with Story Point tags also enabled) * http://phorge.localhost/D1 * http://phorge.localhost/phame/blog/view/1/ * http://phorge.localhost/w/somepage/ * http://phorge.localhost/book/dev/class/PhorgeI18nTestCase/#method/key (Diviner; the "Inherited" tag uses this CSS) * http://phorge.localhost/M1 * http://phorge.localhost/F1 * http://phorge.localhost/B1 * http://phorge.localhost/C1 * http://phorge.localhost/uiexample/view/PHUIBoxExample/ ("Fancy Box" example at the bottom) Reviewers: O1 Blessed Committers, mainframe98 Reviewed By: O1 Blessed Committers, mainframe98 Subscribers: tobiaswiese, valerio.bozzolan, Matthew, Cigaryno Maniphest Tasks: T16287 Differential Revision: https://we.phorge.it/D26736 --- resources/celerity/map.php | 18 +++++++++--------- webroot/rsrc/css/phui/phui-document-pro.css | 3 +-- webroot/rsrc/css/phui/phui-header-view.css | 5 ++++- webroot/rsrc/css/phui/phui-tag-view.css | 4 ++++ webroot/rsrc/css/phui/phui-two-column-view.css | 2 +- 5 files changed, 19 insertions(+), 13 deletions(-) diff --git a/resources/celerity/map.php b/resources/celerity/map.php index 0b90097b76..01da5d88ce 100644 --- a/resources/celerity/map.php +++ b/resources/celerity/map.php @@ -9,7 +9,7 @@ return array( 'names' => array( 'conpherence.pkg.css' => 'b2d6f4b8', 'conpherence.pkg.js' => '020aebcf', - 'core.pkg.css' => 'f5243f80', + 'core.pkg.css' => '8ee41b37', 'core.pkg.js' => '83c66b30', 'dark-console.pkg.js' => '187792c2', 'differential.pkg.css' => '0dac8831', @@ -142,7 +142,7 @@ return array( 'rsrc/css/phui/phui-crumbs-view.css' => '30342804', 'rsrc/css/phui/phui-curtain-object-ref-view.css' => '73b0e59c', 'rsrc/css/phui/phui-curtain-view.css' => '68c5efb6', - 'rsrc/css/phui/phui-document-pro.css' => 'c3211f4e', + 'rsrc/css/phui/phui-document-pro.css' => '6db0e0b6', 'rsrc/css/phui/phui-document-summary.css' => 'b068eed1', 'rsrc/css/phui/phui-document.css' => 'a9154763', 'rsrc/css/phui/phui-feed-story.css' => '1dd2e4c0', @@ -151,7 +151,7 @@ return array( 'rsrc/css/phui/phui-form.css' => '0ce5b5b8', 'rsrc/css/phui/phui-formation-view.css' => 'b172a0b3', 'rsrc/css/phui/phui-head-thing.css' => 'd7f293df', - 'rsrc/css/phui/phui-header-view.css' => 'b71a7a1b', + 'rsrc/css/phui/phui-header-view.css' => '521ef411', 'rsrc/css/phui/phui-hovercard.css' => '7ffb4e0c', 'rsrc/css/phui/phui-icon-set-selector.css' => '19e0253b', 'rsrc/css/phui/phui-icon.css' => 'e790b94e', @@ -170,9 +170,9 @@ return array( 'rsrc/css/phui/phui-segment-bar-view.css' => '5166b370', 'rsrc/css/phui/phui-spacing.css' => 'b05cadc3', 'rsrc/css/phui/phui-status.css' => '293b5dad', - 'rsrc/css/phui/phui-tag-view.css' => 'eb17b97f', + 'rsrc/css/phui/phui-tag-view.css' => 'f5994dd2', 'rsrc/css/phui/phui-timeline-view.css' => '1ccbf191', - 'rsrc/css/phui/phui-two-column-view.css' => '54fb9794', + 'rsrc/css/phui/phui-two-column-view.css' => 'f8db54d6', 'rsrc/css/phui/workboards/phui-workboard-color.css' => '27fbe0ac', 'rsrc/css/phui/workboards/phui-workboard.css' => '269c93f8', 'rsrc/css/phui/workboards/phui-workcard.css' => 'a6c585d5', @@ -770,7 +770,7 @@ return array( 'phui-curtain-view-css' => '68c5efb6', 'phui-document-summary-view-css' => 'b068eed1', 'phui-document-view-css' => 'a9154763', - 'phui-document-view-pro-css' => 'c3211f4e', + 'phui-document-view-pro-css' => '6db0e0b6', 'phui-feed-story-css' => '1dd2e4c0', 'phui-font-icon-base-css' => 'b7608e58', 'phui-fontkit-css' => '1ec937e5', @@ -778,7 +778,7 @@ return array( 'phui-form-view-css' => '029b1ef9', 'phui-formation-view-css' => 'b172a0b3', 'phui-head-thing-view-css' => 'd7f293df', - 'phui-header-view-css' => 'b71a7a1b', + 'phui-header-view-css' => '521ef411', 'phui-hovercard' => '6199f752', 'phui-hovercard-list' => 'de4b4919', 'phui-hovercard-view-css' => '7ffb4e0c', @@ -806,10 +806,10 @@ return array( 'phui-segment-bar-view-css' => '5166b370', 'phui-spacing-css' => 'b05cadc3', 'phui-status-list-view-css' => '293b5dad', - 'phui-tag-view-css' => 'eb17b97f', + 'phui-tag-view-css' => 'f5994dd2', 'phui-theme-css' => '35883b37', 'phui-timeline-view-css' => '1ccbf191', - 'phui-two-column-view-css' => '54fb9794', + 'phui-two-column-view-css' => 'f8db54d6', 'phui-workboard-color-css' => '27fbe0ac', 'phui-workboard-view-css' => '269c93f8', 'phui-workcard-view-css' => 'a6c585d5', diff --git a/webroot/rsrc/css/phui/phui-document-pro.css b/webroot/rsrc/css/phui/phui-document-pro.css index 62bc60286a..b0a6b0fece 100644 --- a/webroot/rsrc/css/phui/phui-document-pro.css +++ b/webroot/rsrc/css/phui/phui-document-pro.css @@ -218,8 +218,7 @@ span.visual-only.phui-icon-view.phui-font-fa.fa-users { } .device-phone .phui-document-view-pro .phui-header-subheader { - display: block; - padding: 8px 0 0 0; + display: flex; } .phui-document-view-pro .phui-info-view { diff --git a/webroot/rsrc/css/phui/phui-header-view.css b/webroot/rsrc/css/phui/phui-header-view.css index e47c3bcc8a..4d5a1a60f3 100644 --- a/webroot/rsrc/css/phui/phui-header-view.css +++ b/webroot/rsrc/css/phui/phui-header-view.css @@ -189,6 +189,9 @@ details > summary.phui-header-shell::-webkit-details-marker { font-weight: normal; font-size: {$biggerfontsize}; margin-top: 8px; + display: flex; + flex-wrap: wrap; + align-items: center; } .phui-header-subheader .phui-icon-view { @@ -213,8 +216,8 @@ details > summary.phui-header-shell::-webkit-details-marker { border-radius: 3px; background: rgba({$alphablue}, 0.1); margin-right: 8px; + margin-bottom: 8px; border-color: transparent; - line-height: 28px; } diff --git a/webroot/rsrc/css/phui/phui-tag-view.css b/webroot/rsrc/css/phui/phui-tag-view.css index 4ed34f54bb..8378f7476c 100644 --- a/webroot/rsrc/css/phui/phui-tag-view.css +++ b/webroot/rsrc/css/phui/phui-tag-view.css @@ -185,6 +185,10 @@ a.phui-tag-view:hover.phui-tag-border-none .phui-tag-core { font-size: 12px; } +.phui-header-subheader > .phui-tag-view.phui-tag-type-shade { + margin-bottom: 8px; +} + /* - Slim Tags ----------------------------------------------------------------- diff --git a/webroot/rsrc/css/phui/phui-two-column-view.css b/webroot/rsrc/css/phui/phui-two-column-view.css index ae43b7975a..ca566e4a80 100644 --- a/webroot/rsrc/css/phui/phui-two-column-view.css +++ b/webroot/rsrc/css/phui/phui-two-column-view.css @@ -51,7 +51,7 @@ } .device .phui-two-column-view .phui-two-column-header .phui-header-shell { - padding: 12px 12px 16px; + padding: 12px 12px 12px; } .phui-two-column-header .phui-header-subheader { -- 2.51.2