diff --git a/DeepDrftPublic.Client/Controls/SharePopover.razor b/DeepDrftPublic.Client/Controls/SharePopover.razor index b1843af..b8eeed8 100644 --- a/DeepDrftPublic.Client/Controls/SharePopover.razor +++ b/DeepDrftPublic.Client/Controls/SharePopover.razor @@ -1,66 +1,74 @@ @namespace DeepDrftPublic.Client.Controls - - - - +@* Overlay is viewport-level/fixed regardless of DOM nesting; placing it outside + the wrapper is harmless/cleaner but doesn't change its behavior. *@ - - +@* display:inline-block is the load-bearing property: it shrink-wraps this div + to the button, so MudPopover's portal reads the button's tight bounding rect + (via parentNode.getBoundingClientRect()) rather than a page-wide flow box. + position:relative is incidental. *@ +
+ + + - - - Copy link - - @if (_linkCopied) + + + + + + Copy link + + @if (_linkCopied) + { + Copied! + } + + + @* Embed is a single-track affordance only; a release page is not a single-track embed (§3b.3). *@ + @if (!IsReleaseMode) { - Copied! - } - + - @* Embed is a single-track affordance only; a release page is not a single-track embed (§3b.3). *@ - @if (!IsReleaseMode) - { - + - - - @if (_embed) - { - - - - - @if (_embedCopied) - { - Copied! - } + @if (_embed) + { + + + + + @if (_embedCopied) + { + Copied! + } + - + } } - } - - + + +
diff --git a/DeepDrftPublic/wwwroot/styles/deepdrft-styles.css b/DeepDrftPublic/wwwroot/styles/deepdrft-styles.css index 5767715..d23889a 100644 --- a/DeepDrftPublic/wwwroot/styles/deepdrft-styles.css +++ b/DeepDrftPublic/wwwroot/styles/deepdrft-styles.css @@ -358,6 +358,15 @@ h2, h3, h4, h5, h6, font-family: var(--deepdrft-font-mono) !important; } +/* display:inline-block is load-bearing: it shrink-wraps the wrapper to the + button so MudPopover's portal reads the button's tight bounding rect + (parentNode.getBoundingClientRect()) instead of a page-wide flow box. + position:relative is incidental — do not drop inline-block. */ +.deepdrft-share-popover-anchor { + position: relative; + display: inline-block; +} + .deepdrft-share-popover-body { padding: 0.75rem 1rem; min-width: 280px;