- Add design-token stylesheet (wwwroot/css/user-panel.css): CSS variables derived from the existing p8.css palette (brand maroon, success/danger colors, radius, shadow), plus reusable component classes (card, button variants, alert, badge, empty state, pagination, list item, toast, confirm modal). Includes a prefers-color-scheme dark block compatible with the existing toggleColorScheme() mechanism in bk.js. - Add wwwroot/js/user-panel.js: upConfirm() and upToast() helpers as styled, promise-based replacements for window.confirm()/alert(), falling back to the native dialogs if the modal/toast markup isn't present on a page. - Add Areas/User/Pages/Shared/ partials: _Pagination (wraps the List<NameIdUrlImage> pattern already used by every list page), _EmptyState, _Toasts and _ConfirmModal (hosts, included once by the layout). - Wire the new stylesheet/script and the toast/modal hosts into _UserPanelLayout.cshtml. - Refactor Notifications.cshtml as a first demonstration: replaces the hand-rolled pagination loop, manual gray/lightsteelblue row alternation, and confirm()/alert() calls with the new components. No backend/API changes. Rest of the User area is untouched pending Phase 1+ (nav/dashboard, forms, remaining list pages, moderation queues, editors).
12 lines
645 B
Plaintext
12 lines
645 B
Plaintext
@* Styled replacement for window.confirm(). Included once by
|
|
_UserPanelLayout.cshtml. Trigger with JS: await upConfirm('پیام شما') *@
|
|
<div class="up-modal-backdrop" id="upConfirmBackdrop" hidden>
|
|
<div class="up-modal" role="alertdialog" aria-modal="true" aria-labelledby="upConfirmTitle">
|
|
<p id="upConfirmTitle" class="up-modal__message"></p>
|
|
<div class="up-modal__actions">
|
|
<button type="button" class="up-btn up-btn--ghost" id="upConfirmCancel">انصراف</button>
|
|
<button type="button" class="up-btn up-btn--danger" id="upConfirmOk">تأیید</button>
|
|
</div>
|
|
</div>
|
|
</div>
|