Add mobile card views to 12 high-priority list pages
Pages were blank on phones because mobile-cards.css hides .table-responsive below 992px. Added .mobile-card-view sections to: GiftCertificates, PurchaseOrders, CreditMemos, VendorCredits, JournalEntries, Appointments, InAppNotifications, BankReconciliations, FixedAssets, RecurringTemplates, SmsAgreements, SmsConsentAudit. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -29,6 +29,61 @@
|
||||
else
|
||||
{
|
||||
<div class="card border-0 shadow-sm">
|
||||
<div class="mobile-card-view">
|
||||
<div class="mobile-card-list">
|
||||
@foreach (var n in items)
|
||||
{
|
||||
bool mIsRead = (bool)n.IsRead;
|
||||
string mTitle = (string)n.Title;
|
||||
string mMessage = (string)n.Message;
|
||||
string? mLink = (string?)n.Link;
|
||||
string mType = (string)n.NotificationType;
|
||||
DateTime mCreatedAt = ((DateTime)n.CreatedAt).Tz(ViewBag.CompanyTimeZone as string);
|
||||
<div class="mobile-data-card notif-history-row @(!mIsRead ? "notif-unread" : "")"
|
||||
data-id="@n.Id"
|
||||
data-title="@mTitle"
|
||||
data-message="@mMessage"
|
||||
data-link="@(mLink ?? "")"
|
||||
data-type="@mType"
|
||||
data-is-read="@(mIsRead ? "1" : "0")"
|
||||
data-created-at="@mCreatedAt.ToString("MMM d, yyyy h:mm tt")">
|
||||
<div class="mobile-card-header" style="@(!mIsRead ? "background:rgba(99,102,241,0.08);" : "")">
|
||||
<div class="mobile-card-icon" style="background: linear-gradient(135deg, #6366f1 0%, #4f46e5 100%);">
|
||||
<i class="bi bi-bell"></i>
|
||||
</div>
|
||||
<div class="mobile-card-title">
|
||||
<h6 class="@(!mIsRead ? "fw-semibold" : "text-muted")">
|
||||
@if (!mIsRead)
|
||||
{
|
||||
<span style="display:inline-block;width:8px;height:8px;background:#6366f1;border-radius:50%;margin-right:6px;"></span>
|
||||
}
|
||||
@mTitle
|
||||
</h6>
|
||||
<small>@mCreatedAt.ToString("MMM d, yyyy h:mm tt")</small>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mobile-card-body">
|
||||
<div class="mobile-card-row">
|
||||
<span class="mobile-card-label">Type</span>
|
||||
<span class="mobile-card-value"><span class="badge bg-secondary bg-opacity-25 text-body small">@mType</span></span>
|
||||
</div>
|
||||
<div class="mobile-card-row" style="align-items:flex-start;">
|
||||
<span class="mobile-card-label">Message</span>
|
||||
<span class="mobile-card-value" style="white-space:normal;text-align:right;">@mMessage</span>
|
||||
</div>
|
||||
</div>
|
||||
@if (!string.IsNullOrEmpty(mLink))
|
||||
{
|
||||
<div class="mobile-card-footer">
|
||||
<a href="@mLink" class="btn btn-sm btn-outline-primary" onclick="event.stopPropagation()">
|
||||
<i class="bi bi-arrow-right me-1"></i>Open
|
||||
</a>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
<div class="table-responsive">
|
||||
<table class="table table-hover align-middle mb-0">
|
||||
<thead class="table-light">
|
||||
|
||||
Reference in New Issue
Block a user