Add three reusable size tier classes (app-dialog-sm, app-dialog-md, app-dialog-lg) to base dialog CSS, replacing per-variant max-width rules. Each tier uses width: min(Xrem, calc(100vw - 2rem)) for consistent fixed widths with responsive mobile fallback. - Confirm dialog + session warning: app-dialog-sm (24rem) - Bookmark + bookmark group dialog: app-dialog-md (32rem) - Remove max-width from app-confirm-dialog.css and app-bookmark-form.css Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
23 lines
852 B
PHTML
23 lines
852 B
PHTML
<dialog
|
|
data-app-session-warning-dialog
|
|
data-app-component="session-warning"
|
|
aria-labelledby="app-session-warning-title"
|
|
aria-describedby="app-session-warning-message"
|
|
aria-live="assertive"
|
|
>
|
|
<article class="app-session-warning-dialog app-dialog-sm">
|
|
<header>
|
|
<h2 id="app-session-warning-title"><?php e(t('Session expiring')); ?></h2>
|
|
</header>
|
|
<p
|
|
id="app-session-warning-message"
|
|
data-session-warning-message
|
|
data-template="<?php e(t('Your session will expire in {countdown}. Would you like to continue?')); ?>"
|
|
></p>
|
|
<footer>
|
|
<button type="button" class="secondary outline" data-session-warning-logout><?php e(t('Log out')); ?></button>
|
|
<button type="button" class="primary" data-session-warning-extend><?php e(t('Extend session')); ?></button>
|
|
</footer>
|
|
</article>
|
|
</dialog>
|