feat(ui): add desktop footer, legal custom link and about dialog
This commit is contained in:
1 parent
bc7bdc481e
commit
c181ffea54
12 files changed
+179
-13
No files matched your search
+30
-2
@@ -65,6 +65,8 @@ import { useMobileActions } from './context/MobileActionContext';
|
||||
import { MobileHeaderMenu } from './components/MobileHeaderMenu';
|
||||
import { UserAvatar } from './components/UserAvatar';
|
||||
import { CommandPalette } from './components/CommandPalette';
|
||||
import { AppFooter } from './components/AppFooter';
|
||||
import { AboutModal } from './components/AboutModal';
|
||||
import { APP_VERSION } from './version';
|
||||
|
||||
type ActiveTab =
|
||||
@@ -170,6 +172,7 @@ export const App: React.FC = () => {
|
||||
|
||||
// Profile Dropdown State
|
||||
const [showProfileMenu, setShowProfileMenu] = useState(false);
|
||||
const [showAbout, setShowAbout] = useState(false);
|
||||
const dropdownRef = useRef<HTMLDivElement | null>(null);
|
||||
|
||||
// Mobile Navigation & Quick-Action State
|
||||
@@ -1119,8 +1122,8 @@ export const App: React.FC = () => {
|
||||
{/* Main Container */}
|
||||
{/* The workspace fills the window exactly and scrolls only inside the note, never the page */}
|
||||
<main
|
||||
className={`flex-1 max-w-6xl w-full mx-auto px-3 sm:px-4 pt-3 pb-24 sm:pb-6 ${
|
||||
activeTab === 'workspace' ? 'min-h-0 flex flex-col' : ''
|
||||
className={`flex-1 max-w-6xl w-full mx-auto px-3 sm:px-4 pt-3 pb-24 ${
|
||||
activeTab === 'workspace' ? 'min-h-0 flex flex-col sm:pb-0' : 'sm:pb-6'
|
||||
}`}
|
||||
>
|
||||
<ViewErrorBoundary onReset={() => setActiveTab('triage')}>
|
||||
@@ -1202,6 +1205,11 @@ export const App: React.FC = () => {
|
||||
</ViewErrorBoundary>
|
||||
</main>
|
||||
|
||||
<AppFooter
|
||||
legal={authStatus.legal}
|
||||
onOpenAbout={() => setShowAbout(true)}
|
||||
/>
|
||||
|
||||
{/* MOBILE BOTTOM NAVIGATION BAR (5 equal columns -> + FAB is dead-center) */}
|
||||
<nav className="sm:hidden fixed bottom-0 left-0 right-0 z-40 bg-panel/95 backdrop-blur-md border-t border-border px-2 pt-1.5 pb-[calc(0.5rem+env(safe-area-inset-bottom))] grid grid-cols-5 items-center shadow-panel">
|
||||
{/* Col 1: Triage */}
|
||||
@@ -1594,6 +1602,19 @@ export const App: React.FC = () => {
|
||||
<span>Hilfe & Anleitung</span>
|
||||
</button>
|
||||
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => {
|
||||
triggerHaptic(10);
|
||||
setShowMobileProfile(false);
|
||||
setShowAbout(true);
|
||||
}}
|
||||
className="w-full px-3 py-2.5 rounded-btn text-left flex items-center gap-3 hover:bg-panel-elevated transition-colors text-xs cursor-pointer text-main"
|
||||
>
|
||||
<Brain className="w-4 h-4 text-accent" />
|
||||
<span>Über MindSift</span>
|
||||
</button>
|
||||
|
||||
{isServerAdmin && (
|
||||
<button
|
||||
type="button"
|
||||
@@ -1626,6 +1647,11 @@ export const App: React.FC = () => {
|
||||
<span>Abmelden</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{/* Version & About Hint on Mobile */}
|
||||
<div className="pt-2 text-center text-[10px] text-faint font-mono">
|
||||
MindSift {APP_VERSION}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
@@ -1725,6 +1751,8 @@ export const App: React.FC = () => {
|
||||
onOpenTask={handleOpenTask}
|
||||
onOpenList={handleOpenList}
|
||||
/>
|
||||
|
||||
{showAbout && <AboutModal onClose={() => setShowAbout(false)} />}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
Reference in new issue
Block a user