From a9f522de37a4b4af69911453e5fe46ae05c5301a Mon Sep 17 00:00:00 2001
From: Dozzy7528 <tashcher2019@bk.ru>
Date: Fri, 6 Mar 2026 23:56:02 +0300
Subject: [PATCH] =?UTF-8?q?fix:=20=D1=84=D0=B8=D0=BA=D1=81=20=D0=BE=D1=82?=
 =?UTF-8?q?=D0=BE=D0=B1=D1=80=D0=B2=D0=B0=D0=B6=D0=B5=D0=BD=D0=B8=D1=8F=20?=
 =?UTF-8?q?=D0=BD=D0=B0=20=D1=81=D0=B6=D0=B0=D1=82=D1=8B=D1=85=20=D1=8D?=
 =?UTF-8?q?=D0=BA=D1=80=D0=B0=D0=BD=D0=B0=D1=85?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/Mainpage.js      | 14 ++++++++------
 src/css/Mainpage.css | 30 ++++++++++++++++++++++++------
 2 files changed, 32 insertions(+), 12 deletions(-)

diff --git a/src/Mainpage.js b/src/Mainpage.js
index f241407..a1f8ca7 100644
--- a/src/Mainpage.js
+++ b/src/Mainpage.js
@@ -1,7 +1,7 @@
-import { useEffect, useState } from 'react';
+import {useEffect, useState} from 'react';
 import axios from 'axios';
 import Header from './Header';
-import { useNavigate } from 'react-router-dom';
+import {useNavigate} from 'react-router-dom';
 import './css/Mainpage.css';
 
 const Mainpage = () => {
@@ -48,14 +48,16 @@ const Mainpage = () => {
 
     return (
         <>
-            <Header />
+            <Header/>
             <div className="mainpage">
                 <div className="mainpage__intro">
                     <div className="left-content">
                         <h1>Kanban-доска Fool-Stack</h1>
                         <p>
-                            Kanban-доска помогает видеть весь процесс целиком: что запланировано, что уже в работе и что готово.
-                            Перетаскивайте карточки между колонками, фиксируйте договорённости и не теряйте контекст — всё в одном месте.
+                            Kanban-доска помогает видеть весь процесс целиком: что запланировано, что уже в работе и что
+                            готово.
+                            Перетаскивайте карточки между колонками, фиксируйте договорённости и не теряйте контекст —
+                            всё в одном месте.
                         </p>
                     </div>
 
@@ -104,4 +106,4 @@ const Mainpage = () => {
 };
 
 export default Mainpage;
-//TODO: проверка правильности отображения даты в отображении
\ No newline at end of file
+//TODO: проверка правильности отображения даты в отображении, приоритет задачи, отображение категории
\ No newline at end of file
diff --git a/src/css/Mainpage.css b/src/css/Mainpage.css
index 0881dc0..7fe3348 100644
--- a/src/css/Mainpage.css
+++ b/src/css/Mainpage.css
@@ -11,10 +11,13 @@
     max-width: 1200px;
     display: flex;
     gap: 20px;
+    align-items: flex-start; /* Выравнивание по верху */
+    min-height: 300px; /* Минимальная высота для стабильности */
 }
 
 .left-content {
-    flex: 0 0 60%; /* Сжата справа, чтобы tasks расширился в центр */
+    flex: 1; /* Берет все доступное пространство */
+    min-width: 0; /* Позволяет сжиматься меньше контента */
     text-align: left;
     background-color: #2b3245;
     border-radius: 6px;
@@ -25,13 +28,14 @@
 .left-content h1,
 .left-content p,
 .left-content li {
-    margin: 6px;
+    margin: 6px 0;
     text-align: left;
     color: #CAD1D8;
 }
 
 .tasks-container {
-    flex: 0 0 400px; /* Расширено влево к центру */
+    flex: 0 0 400px; /* Фиксированная ширина справа */
+    max-width: 400px; /* Дополнительная защита */
     background-color: #2b3245;
     border-radius: 6px;
     padding: 10px;
@@ -59,6 +63,7 @@
     max-height: 250px;
     overflow-y: auto;
     padding-right: 10px;
+    flex: 1; /* Занимает оставшееся пространство */
 }
 
 .tasks-list::-webkit-scrollbar {
@@ -66,15 +71,13 @@
 }
 
 .tasks-list::-webkit-scrollbar-track {
-    background: #fff;
+    background: #2b3245;
     border-radius: 8px;
-    margin-left: 8px;
 }
 
 .tasks-list::-webkit-scrollbar-thumb {
     background: #aaa;
     border-radius: 8px;
-    margin-left: 8px;
 }
 
 .tasks-list::-webkit-scrollbar-thumb:hover {
@@ -87,6 +90,7 @@
     padding: 4px 12px;
     border-radius: 8px;
     color: #CAD1D8;
+    flex: 1;
     text-align: left;
     cursor: pointer;
     transition: all 0.3s ease;
@@ -100,3 +104,17 @@
 .task-item:last-child {
     margin-bottom: 0;
 }
+
+/* Адаптивность для мобильных */
+@media (max-width: 768px) {
+    .mainpage__intro {
+        flex-direction: column;
+        gap: 15px;
+    }
+
+    .tasks-container {
+        flex: none;
+        max-width: none;
+        width: 100%;
+    }
+}