[UI] Fix navbar bell Razor leak, add Settings link, tidy desktop bar
Wrap the bell label in a span so the conditional parses as Razor code instead of leaking as literal text (Persian word char before the at-sign triggered email detection). Bell is icon-only on desktop, label shows in the mobile dropdown. Add a Settings link to admin actions so the demo-mode page is reachable from the navbar. Tighten desktop nav/action spacing. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
@@ -64,12 +64,13 @@
|
|||||||
@if (User.IsInRole("Admin"))
|
@if (User.IsInRole("Admin"))
|
||||||
{
|
{
|
||||||
<a class="nav-action" asp-page="/Admin/Overview">پنل مدیریت</a>
|
<a class="nav-action" asp-page="/Admin/Overview">پنل مدیریت</a>
|
||||||
|
<a class="nav-action" asp-page="/Admin/Settings">تنظیمات</a>
|
||||||
}
|
}
|
||||||
@if (User.IsInRole("FacilityAdmin"))
|
@if (User.IsInRole("FacilityAdmin"))
|
||||||
{
|
{
|
||||||
<a class="nav-action" asp-page="/Employer/Index">پنل کارفرما</a>
|
<a class="nav-action" asp-page="/Employer/Index">پنل کارفرما</a>
|
||||||
}
|
}
|
||||||
<a class="nav-action bell-inline" asp-page="/Me/Notifications" title="اعلانها">🔔 اعلانها@if (unreadCount > 0) {<span class="bell-badge">@JalaliDate.ToPersianDigits(unreadCount > 99 ? "99+" : unreadCount.ToString())</span>}</a>
|
<a class="nav-action bell-inline" asp-page="/Me/Notifications" title="اعلانها"><span class="bell-ico">🔔</span><span class="bell-label">اعلانها</span>@if (unreadCount > 0) {<span class="bell-badge">@JalaliDate.ToPersianDigits(unreadCount > 99 ? "99+" : unreadCount.ToString())</span>}</a>
|
||||||
<a class="nav-action" asp-page="/Me/Index">پنل کارجو</a>
|
<a class="nav-action" asp-page="/Me/Index">پنل کارجو</a>
|
||||||
<form method="post" asp-page="/Account/Logout" style="display:contents;">
|
<form method="post" asp-page="/Account/Logout" style="display:contents;">
|
||||||
<button type="submit" class="btn btn-outline btn-sm">خروج</button>
|
<button type="submit" class="btn btn-outline btn-sm">خروج</button>
|
||||||
|
|||||||
@@ -62,15 +62,19 @@ a { color: inherit; text-decoration: none; }
|
|||||||
|
|
||||||
/* nav + actions share a flex wrapper so the desktop layout is unchanged
|
/* nav + actions share a flex wrapper so the desktop layout is unchanged
|
||||||
and the whole thing can collapse into a dropdown on mobile. */
|
and the whole thing can collapse into a dropdown on mobile. */
|
||||||
.nav-collapse { display: flex; align-items: center; gap: 28px; flex: 1; }
|
.nav-collapse { display: flex; align-items: center; gap: 18px; flex: 1; }
|
||||||
.main-nav { display: flex; gap: 22px; margin-inline-start: 8px; flex: 1; }
|
.main-nav { display: flex; gap: 18px; margin-inline-start: 6px; flex: 1; }
|
||||||
.main-nav a { color: var(--muted); font-weight: 600; transition: color .15s; }
|
.main-nav a { color: var(--muted); font-weight: 600; font-size: 15px; white-space: nowrap; transition: color .15s; }
|
||||||
.main-nav a:hover { color: var(--primary); }
|
.main-nav a:hover { color: var(--primary); }
|
||||||
.header-actions { display: flex; align-items: center; gap: 14px; margin-inline-start: auto; }
|
.header-actions { display: flex; align-items: center; gap: 12px; margin-inline-start: auto; }
|
||||||
.nav-action { font-weight: 600; color: var(--muted); transition: color .15s; }
|
.nav-action { font-weight: 600; font-size: 15px; color: var(--muted); white-space: nowrap; transition: color .15s; }
|
||||||
.nav-action:hover { color: var(--primary); }
|
.nav-action:hover { color: var(--primary); }
|
||||||
.btn-sm { padding: 7px 14px; font-size: 13px; }
|
.btn-sm { padding: 7px 14px; font-size: 13px; }
|
||||||
|
|
||||||
|
/* Bell: icon-only on desktop (label shows inside the mobile dropdown). */
|
||||||
|
.bell-inline { display: inline-flex; align-items: center; gap: 6px; position: relative; font-size: 18px; }
|
||||||
|
.bell-inline .bell-label { display: none; }
|
||||||
|
|
||||||
/* Hamburger + mobile-only bell — hidden on desktop */
|
/* Hamburger + mobile-only bell — hidden on desktop */
|
||||||
.nav-burger, .bell-mobile { display: none; }
|
.nav-burger, .bell-mobile { display: none; }
|
||||||
.nav-burger {
|
.nav-burger {
|
||||||
@@ -279,7 +283,8 @@ label { font-size: 13px; }
|
|||||||
margin: 0; padding: 8px 14px 16px; border-top: 1px solid var(--line);
|
margin: 0; padding: 8px 14px 16px; border-top: 1px solid var(--line);
|
||||||
}
|
}
|
||||||
.nav-action { padding: 12px 6px; font-size: 15px; }
|
.nav-action { padding: 12px 6px; font-size: 15px; }
|
||||||
.bell-inline { display: flex; align-items: center; gap: 6px; }
|
.bell-inline { font-size: 15px; }
|
||||||
|
.bell-inline .bell-label { display: inline; }
|
||||||
.header-actions .btn { width: 100%; justify-content: center; padding: 12px; font-size: 15px; margin-top: 6px; }
|
.header-actions .btn { width: 100%; justify-content: center; padding: 12px; font-size: 15px; margin-top: 6px; }
|
||||||
|
|
||||||
.cal { border-spacing: 4px; }
|
.cal { border-spacing: 4px; }
|
||||||
|
|||||||
Reference in New Issue
Block a user