From f87d551e5895f5d13d9afb36a94439a5f0b125bb Mon Sep 17 00:00:00 2001
From: Vladyslav-H <97888612+Vladyslav-H@users.noreply.github.com>
Date: Fri, 30 Jun 2023 00:17:43 +0300
Subject: [PATCH 1/3] add ellipsis to the end of strings

---
 src/components/BoardItem/BoardItem.module.scss         |  3 +++
 src/components/Modal/Modal.module.scss                 | 10 ++++++++++
 src/components/TaskCard/TaskCard.module.scss           |  3 +++
 .../TasksColumnHeader/TasksColumnHeader.module.scss    |  7 +++++++
 4 files changed, 23 insertions(+)

diff --git a/src/components/BoardItem/BoardItem.module.scss b/src/components/BoardItem/BoardItem.module.scss
index 1637414..6f3b0d0 100644
--- a/src/components/BoardItem/BoardItem.module.scss
+++ b/src/components/BoardItem/BoardItem.module.scss
@@ -53,6 +53,9 @@
   color: #ffffff80;
 
   width: 135px;
+  display: -webkit-box;
+  -webkit-line-clamp: 1;
+  -webkit-box-orient: vertical;
   overflow: hidden;
   text-overflow: ellipsis;
 
diff --git a/src/components/Modal/Modal.module.scss b/src/components/Modal/Modal.module.scss
index 5459d97..6db1664 100644
--- a/src/components/Modal/Modal.module.scss
+++ b/src/components/Modal/Modal.module.scss
@@ -1,6 +1,10 @@
 @import '../../assets/styles/vars';
 @import '../../assets/styles/mixins';
 
+.cl{
+  overflow: hidden;
+}
+
 .title {
   text-align: center;
   font-family: 'Poppins-Medium';
@@ -12,6 +16,12 @@
   margin-bottom: 24px;
   // margin-top: 24px;
 
+  display: -webkit-box;
+  -webkit-line-clamp: 2;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+  text-overflow: ellipsis;
+
   &.dark {
     color: $white-text-color;
   }
diff --git a/src/components/TaskCard/TaskCard.module.scss b/src/components/TaskCard/TaskCard.module.scss
index d38a0b2..8966e5a 100644
--- a/src/components/TaskCard/TaskCard.module.scss
+++ b/src/components/TaskCard/TaskCard.module.scss
@@ -43,6 +43,9 @@
   line-height: 1.5;
   color: $black-text-color;
 
+  display: -webkit-box;
+  -webkit-line-clamp: 1;
+  -webkit-box-orient: vertical;
   overflow: hidden;
   text-overflow: ellipsis;
 
diff --git a/src/components/TasksColumnHeader/TasksColumnHeader.module.scss b/src/components/TasksColumnHeader/TasksColumnHeader.module.scss
index 39d461f..cb9f7a1 100644
--- a/src/components/TasksColumnHeader/TasksColumnHeader.module.scss
+++ b/src/components/TasksColumnHeader/TasksColumnHeader.module.scss
@@ -17,11 +17,18 @@
 }
 
 .title {
+  margin-right: 10px;
   font-weight: 500;
   font-size: 14px;
   line-height: 1.5;
   color: $black-text-color;
 
+  display: -webkit-box;
+  -webkit-line-clamp: 1;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+  text-overflow: ellipsis;
+
   &.dark {
     color: $white-color;
   }

From e868d9cab349410350c92796aa87856bb2c821bc Mon Sep 17 00:00:00 2001
From: Vladyslav-H <97888612+Vladyslav-H@users.noreply.github.com>
Date: Fri, 30 Jun 2023 01:07:29 +0300
Subject: [PATCH 2/3] add ellipsis to board title and mod change column

---
 .../HeaderDashBoard/HeaderDashBoard.module.scss     |  6 ++++++
 src/components/Modal/Modal.module.scss              |  2 +-
 .../ModalChangeColumn/ModalChangeColumn.jsx         |  2 +-
 .../ModalChangeColumn/ModalChangeColumn.module.scss | 13 ++++++++++++-
 4 files changed, 20 insertions(+), 3 deletions(-)

diff --git a/src/components/HeaderDashBoard/HeaderDashBoard.module.scss b/src/components/HeaderDashBoard/HeaderDashBoard.module.scss
index 03c8023..7a72f2c 100644
--- a/src/components/HeaderDashBoard/HeaderDashBoard.module.scss
+++ b/src/components/HeaderDashBoard/HeaderDashBoard.module.scss
@@ -20,6 +20,12 @@
   line-height: 27px;
   letter-spacing: -0.02em;
 
+  display: -webkit-box;
+  -webkit-line-clamp: 1;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+  text-overflow: ellipsis;
+
   &.dark {
     color: $white-color;
   }
diff --git a/src/components/Modal/Modal.module.scss b/src/components/Modal/Modal.module.scss
index 6db1664..02070dd 100644
--- a/src/components/Modal/Modal.module.scss
+++ b/src/components/Modal/Modal.module.scss
@@ -1,7 +1,7 @@
 @import '../../assets/styles/vars';
 @import '../../assets/styles/mixins';
 
-.cl{
+.cl {
   overflow: hidden;
 }
 
diff --git a/src/components/ModalChangeColumn/ModalChangeColumn.jsx b/src/components/ModalChangeColumn/ModalChangeColumn.jsx
index 0bdbd64..76769ea 100644
--- a/src/components/ModalChangeColumn/ModalChangeColumn.jsx
+++ b/src/components/ModalChangeColumn/ModalChangeColumn.jsx
@@ -28,7 +28,7 @@ export const ModalChangeColumn = ({ closeModal, columnId, cardId }) => {
               }}
               type="button"
             >
-              {title}
+             <span className={s.title}> {title}</span>
               <svg
                 className={clsx(s.icon, s[theme], id === columnId && s.current)}
               >
diff --git a/src/components/ModalChangeColumn/ModalChangeColumn.module.scss b/src/components/ModalChangeColumn/ModalChangeColumn.module.scss
index a2ac0a7..3d515a9 100644
--- a/src/components/ModalChangeColumn/ModalChangeColumn.module.scss
+++ b/src/components/ModalChangeColumn/ModalChangeColumn.module.scss
@@ -1,7 +1,7 @@
 @import '../../assets/styles/vars';
 
 .modalWrapper {
-  max-width: max-content;
+  max-width: 350px;
   min-height: 86px;
   padding: 18px;
   border-radius: 8px;
@@ -57,10 +57,21 @@
   }
 }
 
+.title {
+  text-align: left;
+
+  display: -webkit-box;
+  -webkit-line-clamp: 1;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
 .icon {
   width: 16px;
   height: 16px;
   margin-left: 8px;
+  flex-shrink: 0;
   stroke: $black-text-color;
 
   &.current {

From 26a5cf56ffd4e1024b891a4ff5a469f596291baf Mon Sep 17 00:00:00 2001
From: Vladyslav-H <97888612+Vladyslav-H@users.noreply.github.com>
Date: Fri, 30 Jun 2023 01:33:34 +0300
Subject: [PATCH 3/3] fix filter without label color

---
 src/components/Modal/Modal.module.scss       | 4 ----
 src/components/ModalFilter/Modal.module.scss | 5 ++++-
 2 files changed, 4 insertions(+), 5 deletions(-)

diff --git a/src/components/Modal/Modal.module.scss b/src/components/Modal/Modal.module.scss
index 02070dd..f39dd85 100644
--- a/src/components/Modal/Modal.module.scss
+++ b/src/components/Modal/Modal.module.scss
@@ -1,10 +1,6 @@
 @import '../../assets/styles/vars';
 @import '../../assets/styles/mixins';
 
-.cl {
-  overflow: hidden;
-}
-
 .title {
   text-align: center;
   font-family: 'Poppins-Medium';
diff --git a/src/components/ModalFilter/Modal.module.scss b/src/components/ModalFilter/Modal.module.scss
index ee6981e..0906710 100644
--- a/src/components/ModalFilter/Modal.module.scss
+++ b/src/components/ModalFilter/Modal.module.scss
@@ -172,7 +172,10 @@
 }
 .InputField {
   &[id='without']::before {
-    background-color: #ffffff4d;
+    background-color: $priority-without-color;
+  }
+  &[id='without'].dark::before {
+    background-color: $priority-without-dark-theme-color;
   }
   &[id='low']::before {
     background-color: $priority-low-color;