feat: menu styles

src/components/menu.module.scss

@@ -1,9 +1,9 @@
 @reference "../index.scss";
 
 .menu_container {
-  @apply flex min-h-8 min-w-screen flex-col items-center gap-4 border-l border-l-gray-500 px-5 pt-5 md:min-h-screen md:min-w-[300px];
+  @apply fixed bottom-0 flex min-h-8 min-w-screen flex-row items-center gap-1 border-t border-t-gray-500 bg-white px-1 py-5 md:relative md:min-h-screen md:min-w-[300px] md:flex-col md:gap-4 md:border-t-0 md:border-l md:border-l-gray-500 md:px-5;
 }
 
 .menu_item {
-  @apply w-full cursor-pointer rounded-md px-6 py-2 text-center hover:bg-gray-200;
+  @apply w-full cursor-pointer rounded-md px-3 py-2 text-center hover:bg-gray-200 md:px-6;
 }

src/components/menu.tsx

@@ -39,15 +39,15 @@ const Menu: FunctionComponent = () => {
   const menu_items: MenuItems[] = [
     {
       title: "Профиль",
-      link: "/profile",
+      link: "/profile/settings",
     },
     {
       title: "Задачи",
-      link: "/tasks",
+      link: "/profile/tasks",
     },
     {
       title: "Календарь",
-      link: "/calendar",
+      link: "/profile/calendar",
     },
   ];
   return (

src/pages/profile.tsx

@@ -6,14 +6,87 @@ const ProfilePage: FunctionComponent = () => {
   const { route } = useLocation();
   return (
     <div class="flex min-w-screen flex-row justify-between">
-      <div class="w-full overflow-x-auto">
+      <div class="w-full overflow-x-hidden overflow-y-auto px-3 pb-20 break-all md:pb-0">
         <Router>
-          <Route path="/settings" component={() => <h1>Test</h1>} />
+          <Route
-          <Route path="/tasks" component={() => <h1>Test2</h1>} />
+            path="/settings"
+            component={() => (
+              <p class="text-2xl">
+                information sets circus station three entirely outer fun event free thirty breathing race snow planned
+                surface fully he cast town group plant egg journeyearly city thread fight outline wear key flame special
+                voice carefully exactly entire notice practical biggest television find particular middle noise cloud
+                tobacco cameraowner rule factor lift within order somewhere rocky powerful steam expect forty tonight
+                son front motor knowledge law easily equipment worse adult straw declaredhave famous choose ants us
+                broke warn prevent follow depth been buffalo bag classroom before term repeat want here plant division
+                camera hang preparechurch call member it build rose who potatoes easy sides exclaimed foot independent
+                point alone gone forty completely habit slept heard stand forest paperjoy repeat shot wrote label giving
+                whale quick tomorrow feathers additional active unless reader angle copy blanket white pitch my seeing
+                instant result asideexcited front word guess each wolf leader steady rhyme sound thy chapter during
+                electricity available managed comfortable eight left scientist article which stove term information sets
+                circus station three entirely outer fun event free thirty breathing race snow planned surface fully he
+                cast town group plant egg journeyearly city thread fight outline wear key flame special voice carefully
+                exactly entire notice practical biggest television find particular middle noise cloud tobacco
+                cameraowner rule factor lift within order somewhere rocky powerful steam expect forty tonight son front
+                motor knowledge law easily equipment worse adult straw declaredhave famous choose ants us broke warn
+                prevent follow depth been buffalo bag classroom before term repeat want here plant division camera hang
+                preparechurch call member it build rose who potatoes easy sides exclaimed foot independent point alone
+                gone forty completely habit slept heard stand forest paperjoy repeat shot wrote label giving whale quick
+                tomorrow feathers additional active unless reader angle copy blanket white pitch my seeing instant
+                result asideexcited front word guess each wolf leader steady rhyme sound thy chapter during electricity
+                available managed comfortable eight left scientist article which stove terminformation sets circus
+                station three entirely outer fun event free thirty breathing race snow planned surface fully he cast
+                town group plant egg journeyearly city thread fight outline wear key flame special voice carefully
+                exactly entire notice practical biggest television find particular middle noise cloud tobacco
+                cameraowner rule factor lift within order somewhere rocky powerful steam expect forty tonight son front
+                motor knowledge law easily equipment worse adult straw declaredhave famous choose ants us broke warn
+                prevent follow depth been buffalo bag classroom before term repeat want here plant division camera hang
+                preparechurch call member it build rose who potatoes easy sides exclaimed foot independent point alone
+                gone forty completely habit slept heard stand forest paperjoy repeat shot wrote label giving whale quick
+                tomorrow feathers additional active unless reader angle copy blanket white pitch my seeing instant
+                result asideexcited front word guess each wolf leader steady rhyme sound thy chapter during electricity
+                available managed comfortable eight left scientist article which stove terminformation sets circus
+                station three entirely outer fun event free thirty breathing race snow planned surface fully he cast
+                town group plant egg journeyearly city thread fight outline wear key flame special voice carefully
+                exactly entire notice practical biggest television find particular middle noise cloud tobacco
+                cameraowner rule factor lift within order somewhere rocky powerful steam expect forty tonight son front
+                motor knowledge law easily equipment worse adult straw declaredhave famous choose ants us broke warn
+                prevent follow depth been buffalo bag classroom before term repeat want here plant division camera hang
+                preparechurch call member it build rose who potatoes easy sides exclaimed foot independent point alone
+                gone forty completely habit slept heard stand forest paperjoy repeat shot wrote label giving whale quick
+                tomorrow feathers additional active unless reader angle copy blanket white pitch my seeing instant
+                result asideexcited front word guess each wolf leader steady rhyme sound thy chapter during electricity
+                available managed comfortable eight left scientist article which stove terminformation sets circus
+                station three entirely outer fun event free thirty breathing race snow planned surface fully he cast
+                town group plant egg journeyearly city thread fight outline wear key flame special voice carefully
+                exactly entire notice practical biggest television find particular middle noise cloud tobacco
+                cameraowner rule factor lift within order somewhere rocky powerful steam expect forty tonight son front
+                motor knowledge law easily equipment worse adult straw declaredhave famous choose ants us broke warn
+                prevent follow depth been buffalo bag classroom before term repeat want here plant division camera hang
+                preparechurch call member it build rose who potatoes easy sides exclaimed foot independent point alone
+                gone forty completely habit slept heard stand forest paperjoy repeat shot wrote label giving whale quick
+                tomorrow feathers additional active unless reader angle copy blanket white pitch my seeing instant
+                result asideexcited front word guess each wolf leader steady rhyme sound thy chapter during electricity
+                available managed comfortable eight left scientist article which stove terminformation sets circus
+                station three entirely outer fun event free thirty breathing race snow planned surface fully he cast
+                town group plant egg journeyearly city thread fight outline wear key flame special voice carefully
+                exactly entire notice practical biggest television find particular middle noise cloud tobacco
+                cameraowner rule factor lift within order somewhere rocky powerful steam expect forty tonight son front
+                motor knowledge law easily equipment worse adult straw declaredhave famous choose ants us broke warn
+                prevent follow depth been buffalo bag classroom before term repeat want here plant division camera hang
+                preparechurch call member it build rose who potatoes easy sides exclaimed foot independent point alone
+                gone forty completely habit slept heard stand forest paperjoy repeat shot wrote label giving whale quick
+                tomorrow feathers additional active unless reader angle copy blanket white pitch my seeing instant
+                result asideexcited front word guess each wolf leader steady rhyme sound thy chapter during electricity
+                available managed comfortable eight left scientist article which stove term
+              </p>
+            )}
+          />
+          <Route path="/tasks" component={() => <p class="text-2xl">Tasks</p>} />
+          <Route path="/calendar" component={() => <p class="text-2xl">Calendar</p>} />
           <Route
             default
             component={() => {
-              route("/profile/settings", true);
+              route("/profile/tasks", true);
               return null;
             }}
           />