feat(ui): floating back-to-top button on long scrollable pages
A reusable BackToTop fades in once the active page's <main> is scrolled past ~600px and smooth-scrolls it back to the top. Rendered once at the App root, portaled to <body> for viewport-fixed placement (bottom-right, below the chat dock), and re-binds to the live <main> on navigation (page or channel change) so it works on every scrollable page incl. the channel page. EN/HU/DE.
This commit is contained in:
@@ -29,6 +29,7 @@ import NavSidebar from "./components/NavSidebar";
|
||||
import Sidebar from "./components/Sidebar";
|
||||
import Feed from "./components/Feed";
|
||||
import ChannelPage from "./components/ChannelPage";
|
||||
import BackToTop from "./components/BackToTop";
|
||||
import Channels, { type ChannelStatusFilter, type ChannelsView } from "./components/Channels";
|
||||
import Playlists from "./components/Playlists";
|
||||
import Stats from "./components/Stats";
|
||||
@@ -667,6 +668,8 @@ export default function App() {
|
||||
<ReleaseNotes onClose={() => setNotesOpen(false)} highlight={notesHighlight} />
|
||||
)}
|
||||
<ErrorDialog />
|
||||
{/* Re-binds to the active page's scroll container on navigation (page or channel change). */}
|
||||
<BackToTop dep={channelView ? `chan:${channelView.id}` : page} />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user