Skip to content

Commit 4665b01

Browse files
fezcodefezcode
committed
DND: From Serfs and Frauds
1 parent dda840e commit 4665b01

14 files changed

+282
-2
lines changed

‎public/images/wallies/artem-sapegin-XGDBdSQ70O0-unsplash.jpg‎

569 KB
Loading

‎public/images/wallies/ember-navarro-3q2TzsUUVIo-unsplash.jpg‎

605 KB
Loading

‎public/images/wallies/jr-korpa-RADGP_E2pBk-unsplash.jpg‎

228 KB
Loading

‎public/images/wallies/muhammad-haikal-sjukri--RMBf_xSf2U-unsplash.jpg‎

685 KB
Loading

‎public/images/wallies/vida-huang-XHiLiBfp7UM-unsplash.jpg‎

822 KB
Loading

‎src/components/AnimatedRoutes.js‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@ import LogsPage from '../pages/LogsPage';
1111
import LogDetailPage from '../pages/LogDetailPage';
1212
import NotFoundPage from '../pages/NotFoundPage';
1313
import SeriesPage from '../pages/SeriesPage';
14+
import DndPage from '../pages/DndPage';
1415

1516
const pageVariants = {
1617
initial: {
@@ -190,6 +191,20 @@ function AnimatedRoutes() {
190191
</motion.div>
191192
}
192193
/>
194+
<Route
195+
path="/dnd"
196+
element={
197+
<motion.div
198+
initial="initial"
199+
animate="in"
200+
exit="out"
201+
variants={pageVariants}
202+
transition={pageTransition}
203+
>
204+
<DndPage />
205+
</motion.div>
206+
}
207+
/>
193208
</Routes>
194209
</AnimatePresence>
195210
);

‎src/components/DndFooter.js‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
import React, { useContext } from 'react';
2+
import { DndContext } from '../context/DndContext';
3+
4+
const DndFooter = () => {
5+
const { bgImageName } = useContext(DndContext);
6+
7+
return (
8+
<footer className="dnd-footer">
9+
<div className="dnd-footer-left">
10+
<p>&copy; 2025 From Serfs and Frauds. All rights reserved.</p>
11+
</div>
12+
<div className="dnd-footer-right">
13+
<p> Unsplash: {bgImageName}</p>
14+
</div>
15+
</footer>
16+
);
17+
};
18+
19+
export default DndFooter;

‎src/components/DndLogo.js‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
import React from 'react';
2+
3+
const DndLogo = () => {
4+
return (
5+
<div className="dnd-logo">
6+
<span className="dnd-logo-s">S</span>
7+
<span className="dnd-logo-amp">&</span>
8+
<span className="dnd-logo-f">F</span>
9+
</div>
10+
);
11+
};
12+
13+
export default DndLogo;

‎src/components/DndNavbar.js‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
import React from 'react';
2+
import { Link } from 'react-router-dom';
3+
import DndLogo from './DndLogo';
4+
5+
const DndNavbar = () => {
6+
return (
7+
<nav className="dnd-navbar">
8+
<div className="dnd-navbar-left">
9+
<Link to="/" className="dnd-navbar-link">Back to Home</Link>
10+
</div>
11+
<div className="dnd-navbar-center">
12+
<span className="dnd-navbar-title">From Serfs and Frauds</span>
13+
</div>
14+
<div className="dnd-navbar-right">
15+
<DndLogo />
16+
</div>
17+
</nav>
18+
);
19+
};
20+
21+
export default DndNavbar;

‎src/components/Layout.js‎

Lines changed: 19 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,9 +2,15 @@ import React, { useState, useEffect } from 'react';
22
import Navbar from './Navbar';
33
import Sidebar from './Sidebar';
44
import Footer from './Footer';
5+
import DndNavbar from './DndNavbar';
6+
import DndFooter from './DndFooter';
7+
import { useLocation } from 'react-router-dom';
8+
9+
import { DndProvider } from '../context/DndContext';
510

611
const Layout = ({ children }) => {
712
const [isSidebarOpen, setIsSidebarOpen] = useState(window.innerWidth > 768);
13+
const location = useLocation();
814

915
useEffect(() => {
1016
const handleResize = () => {
@@ -24,12 +30,23 @@ const Layout = ({ children }) => {
2430
setIsSidebarOpen(!isSidebarOpen);
2531
};
2632

33+
if (location.pathname.startsWith('/dnd')) {
34+
return (
35+
<DndProvider>
36+
<div className="bg-gray-950 min-h-screen font-sans flex flex-col">
37+
<DndNavbar />
38+
<main className="flex-grow">{children}</main>
39+
<DndFooter />
40+
</div>
41+
</DndProvider>
42+
);
43+
}
44+
2745
return (
2846
<div className="bg-gray-950 min-h-screen font-sans flex">
2947
<Sidebar isOpen={isSidebarOpen} toggleSidebar={toggleSidebar} />
3048
<div
31-
className={`flex-1 flex flex-col transition-all duration-300 ${isSidebarOpen ? 'md:ml-64' : 'md:ml-0'}`}
32-
>
49+
className={`flex-1 flex flex-col transition-all duration-300 ${isSidebarOpen ? 'md:ml-64' : 'md:ml-0'}`}>
3350
<Navbar toggleSidebar={toggleSidebar} isSidebarOpen={isSidebarOpen} />
3451
<main className="flex-grow">{children}</main>
3552
<Footer />

0 commit comments

Comments
 (0)