feat: Add Todo page mockup and layout Wrapper components

Key Changes:
- Created Wrapper components (Fullscreen, Column, Container, ListedComponent) to standardize the application's overall layout.
- Refactored the structure of major components like App.tsx and PageContainer.tsx to use the new Wrapper components.
- Added a simple TodoBoard mockup page at the /todos route.
- Adjusted flexbox classes for the TodoBoard component to allow its width to resize flexibly based on screen size.

package.json

@@ -11,6 +11,7 @@
   },
   "dependencies": {
     "@base-ui-components/react": "^1.0.0-beta.3",
+    "@radix-ui/react-checkbox": "^1.3.3",
     "@radix-ui/react-slot": "^1.2.3",
     "@tabler/icons-react": "^3.35.0",
     "@tailwindcss/vite": "^4.1.13",
@@ -35,6 +36,7 @@
     "eslint-plugin-react-hooks": "^5.2.0",
     "eslint-plugin-react-refresh": "^0.4.20",
     "globals": "^16.3.0",
+    "tailwind-scrollbar": "^4.0.2",
     "tw-animate-css": "^1.3.8",
     "typescript": "~5.8.3",
     "typescript-eslint": "^8.39.1",