fix(ui): pin desktop nav and soften chat jump button

This commit is contained in:
lizerk 2026-04-14 23:55:09 +03:00
parent 59b735d549
commit c8683349c4
2 changed files with 9 additions and 5 deletions

View File

@ -1108,7 +1108,7 @@ function MessageDialogPageContent() {
<button
type="button"
onClick={() => void handleReturnToNewMessages()}
className="app-action-primary relative inline-flex h-10 w-10 items-center justify-center rounded-full p-0 leading-none shadow-[var(--shadow-card)] active:scale-[0.98]"
className="relative inline-flex h-10 w-10 items-center justify-center rounded-full border border-[var(--border-subtle)] bg-[var(--surface-primary)] p-0 leading-none text-[var(--muted-foreground)] shadow-[0_10px_30px_rgba(15,23,42,0.22)] transition hover:bg-[var(--surface-secondary)] hover:text-[var(--foreground)] active:scale-[0.98]"
title="Вернуться к новым сообщениям"
aria-label={displayedUnreadCount > 0 ? `Вернуться к новым сообщениям (${displayedUnreadCount > 99 ? "99+" : displayedUnreadCount})` : "Вернуться к новым сообщениям"}
>

View File

@ -339,10 +339,14 @@ function LeftNavContent({ onNavigate }: LeftNavContentProps) {
);
}
function LeftNav() {
function LeftNav({ fixedDesktop = false }: { fixedDesktop?: boolean }) {
return (
<aside className="hidden w-64 flex-shrink-0 lg:block lg:sticky lg:self-start lg:top-8 lg:max-h-[calc(100vh-7.5rem)] lg:overflow-y-auto">
<div className="space-y-4 lg:pb-2">
<aside className="hidden w-64 flex-shrink-0 lg:block">
<div
className={`space-y-4 lg:max-h-[calc(100vh-7.5rem)] lg:overflow-y-auto lg:pb-2 ${
fixedDesktop ? "lg:fixed lg:top-[5.5rem] lg:w-64" : "lg:sticky lg:top-8"
}`}
>
<LeftNavContent />
</div>
</aside>
@ -455,7 +459,7 @@ export function AppShell({ children }: AppShellProps) {
onOpenCalendar={() => setIsMobileCalendarOpen(true)}
/>
<div className={`mx-auto flex w-full flex-1 min-h-0 max-w-6xl ${isMessageDialogPage ? 'gap-0 px-0 py-0 lg:gap-6 lg:px-8 lg:py-8' : 'gap-6 px-4 py-4 sm:px-8 lg:py-8'}`}>
<LeftNav />
<LeftNav fixedDesktop={!isMessageDialogPage} />
<main className={`flex-1 min-w-0 min-h-0 space-y-6 ${isMessageDialogPage ? 'overflow-visible' : ''}`}>{children}</main>
<CalendarSidebar
onOpenCalendarModal={cal.handleOpenCalendarModal}