| @@ -1,8 +1,12 @@ | ||
| 1 | 1 | <?php |
| 2 | 2 | /** |
| 3 | 3 | * Reusable "Upgrade to Pro" modal — shown on load over a Pro feature preview page. |
| 4 | 4 | * |
| 5 | + * Contained (`--contained`): the dim covers this plugin's screen only, not the | |
| 6 | + * admin bar or the admin menu. A paywall that greys out Plugins and Users reads | |
| 7 | + * like the site broke rather than like a feature is locked. | |
| 8 | + * | |
| 5 | 9 | * Including file must set, before the include: |
| 6 | 10 | * string $modal_title — heading, e.g. "Unlock Subscription Health". |
| 7 | 11 | * string $modal_desc — supporting copy. |
| 8 | 12 | * string $upgrade_url — Pro upgrade URL. |
| @@ -16,9 +20,9 @@ | ||
| 16 | 20 | $modal_desc = isset( $modal_desc ) ? $modal_desc : __( 'This feature requires WPSubscription Pro. Unlock advanced features, priority support, and more with WPSubscription Pro.', 'subscription' ); |
| 17 | 21 | $upgrade_url = isset( $upgrade_url ) ? $upgrade_url : 'https://wpsubscription.co/?utm_source=plugin&utm_medium=admin&utm_campaign=upgrade_pro'; |
| 18 | 22 | ?> |
| 19 | 23 | |
| 20 | -<div class="wpsubs-modal" id="subscrpt-pro-modal" role="dialog" aria-modal="true" aria-labelledby="subscrpt-pro-modal-title" data-wpsubs-modal-autoopen hidden> | |
| 24 | +<div class="wpsubs-modal wpsubs-modal--contained" id="subscrpt-pro-modal" role="dialog" aria-modal="true" aria-labelledby="subscrpt-pro-modal-title" data-wpsubs-modal-autoopen hidden> | |
| 21 | 25 | <div class="wpsubs-modal__backdrop" data-wpsubs-modal-close style="backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);"></div> |
| 22 | 26 | <div class="wpsubs-modal__dialog" role="document" style="width:min(440px,calc(100vw - 40px));"> |
| 23 | 27 | <button type="button" class="wpsubs-modal__close" data-wpsubs-modal-close aria-label="<?php esc_attr_e( 'Close', 'subscription' ); ?>" style="position:absolute;top:12px;right:14px;">×</button> |
| 24 | 28 | <div class="wpsubs-modal__body" style="display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px;padding:28px 28px 24px;"> |