Merge pull request #57 from 001elijah/bugfix

bugfix
001elijah · Jun 29, 2023 · d7fe085 · d7fe085
2 parents e754efc + a9309dd
commit d7fe085
Show file tree

Hide file tree

Showing 8 changed files with 69 additions and 87 deletions.
diff --git a/src/components/BoardList/BoardList.module.scss b/src/components/BoardList/BoardList.module.scss
@@ -8,29 +8,15 @@
   width: 100%;
   margin-top: 40px;
   margin-bottom: 40px;
-  overflow-y: auto;
+  overflow-x: auto;
   scrollbar-width: thin;
-
   display: flex;
   flex-direction: column;
-  gap: 4px;
-
-  &::-webkit-scrollbar {
-    width: 0.5em;
-  }
-
-  &::-webkit-scrollbar-thumb {
-    background-color: rgba(0, 0, 0, 0);
-  }
-
-  &::-webkit-scrollbar-track {
-    background-color: rgba(0, 0, 0, 0);
-  }
 
   @include tablet {
-    height: calc(100vh - 655px);
+    max-height: calc(100vh - 655px);
   }
   @include desktop {
-    height: calc(100vh - 646px);
+    max-height: calc(100vh - 654px);
   }
 }
diff --git a/src/components/DefaultBoard/Default.module.scss b/src/components/DefaultBoard/Default.module.scss
@@ -1,7 +1,7 @@
 @import '../../assets/styles/vars';
 @import '../../assets/styles/mixins';
 
-.BackGround {
+.backGround {
   height: calc(100vh - 60px);
   position: relative;
 
@@ -14,48 +14,43 @@
   &.colorful {
     background-color: #ecedfd;
   }
-}
-// .Wrapper {
-//   display: flex;
-//   align-items: center;
-//   justify-content: center;
-//   // height: 100%
-// }
-.DefaultTitle {
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  transform: translate(-50%, -50%);
-  font-weight: 400;
-  font-size: 14px;
-  line-height: 1.29;
-  text-align: center;
-  letter-spacing: -0.02em;
-  max-height: min-content;
-  // margin-left: auto;
-  // margin-right: auto;
 
-  @include mobileSmall {
-    max-width: 335px;
-  }
-  @include mobile {
-    width: 335px;
-  }
   @include tablet {
-    width: 486px;
-    .BackGround {
-      height: calc(100vh - 68px);
-    }
+    height: calc(100vh - 68px);
   }
-  &.dark {
-    color: #ffffff80;
-  }
-  &.light,
-  &.colorful {
-    color: #161616;
+
+  .defaultTitle {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    font-weight: 400;
+    font-size: 14px;
+    line-height: 1.29;
+    text-align: center;
+    letter-spacing: -0.02em;
+    max-height: min-content;
+
+    @include mobileSmall {
+      max-width: 335px;
+    }
+    @include mobile {
+      width: 335px;
+    }
+    @include tablet {
+      width: 486px;
+    }
+    &.dark {
+      color: #ffffff80;
+    }
+    &.light,
+    &.colorful {
+      color: #161616;
+    }
   }
 }
-.DefaultLink {
+
+.defaultLink {
   &.dark,
   &.light {
     color: #bedbb0;

diff --git a/src/components/DefaultBoard/DefaultBoard.jsx b/src/components/DefaultBoard/DefaultBoard.jsx
@@ -2,19 +2,19 @@ import { selectorTheme } from 'redux/Auth/authSelectors';
 import { useSelector } from 'react-redux';
 import clsx from 'clsx';
 import React from 'react';
-import s from './Default.module.scss';
 import { HeaderDashBoard } from 'components/HeaderDashBoard/HeaderDashBoard';
+import s from './Default.module.scss';
 
 export const DefaultDashBoard = () => {
   const theme = useSelector(selectorTheme);
   return (
     <>
-      <div className={clsx(s.BackGround, s[theme])}>
+      <div className={clsx(s.backGround, s[theme])}>
         <HeaderDashBoard />
-        {/* <div className={s.Wrapper}> */}
-        <p className={clsx(s.DefaultTitle, s[theme])}>
+
+        <p className={clsx(s.defaultTitle, s[theme])}>
           Before starting your project, it is essential
-          <span className={clsx(s.DefaultLink, s[theme])}>
+          <span className={clsx(s.defaultLink, s[theme])}>
             {' '}
             to create a board{' '}
           </span>
@@ -23,7 +23,6 @@ export const DefaultDashBoard = () => {
           effective collaboration among team members.
         </p>
       </div>
-      {/* </div> */}
     </>
   );
 };
diff --git a/src/components/MainBoard/MainBoard.styled.jsx b/src/components/MainBoard/MainBoard.styled.jsx
@@ -10,7 +10,6 @@ export const Wrapper = styled.div`
   height: calc(100vh - 61px);
 
   @media screen and (min-width: 375px) {
-    padding-left: 0px;
     background-image: url(${props => props.imgurl.mobileUrl_1x});
   }
 
@@ -33,10 +32,11 @@ export const Wrapper = styled.div`
 
   @media screen and (min-width: 1280px) {
     width: calc(100vw - 260px);
-    height: calc(100% - 76px);
+    height: calc(100vh - 76px);
     padding-left: 24px;
     padding-right: 24px;
     background-image: url(${props => props.imgurl.desktopUrl_1x});
+    height: calc(100vh - 68px);
   }
 
   @media screen and (min-width: 1280px) and (-webkit-min-device-pixel-ratio: 2),

diff --git a/src/components/Sidebar/Sidebar.module.scss b/src/components/Sidebar/Sidebar.module.scss
@@ -1,5 +1,6 @@
 @import '../../assets/styles/vars';
 @import '../../assets/styles/mixins';
+
 .container {
   width: 225px;
   max-height: 100%;
@@ -44,30 +45,30 @@
   // &>div>div{
   //   height: 100%;
   // }
-}
 
-.text {
-  margin-top: 70px;
-  width: 197px;
-  font-weight: 400;
-  font-size: 12px;
-  line-height: 1.5;
-  letter-spacing: -0.02em;
-  color: #16161680;
+  .text {
+    margin-top: 70px;
+    width: 197px;
+    font-weight: 400;
+    font-size: 12px;
+    line-height: 1.5;
+    letter-spacing: -0.02em;
+    color: hsla(0, 0%, 9%, 0.502);
 
-  @include tablet {
-    width: 212px;
-  }
+    @include tablet {
+      width: 212px;
+    }
 
-  &.light {
-    color: #16161680;
-  }
+    &.light {
+      color: #16161680;
+    }
 
-  &.dark {
-    color: rgba(255, 255, 255, 0.5);
-  }
+    &.dark {
+      color: rgba(255, 255, 255, 0.5);
+    }
 
-  &.colorful {
-    color: rgba(255, 255, 255, 0.5);
+    &.colorful {
+      color: rgba(255, 255, 255, 0.5);
+    }
   }
 }
diff --git a/src/components/TaskColumn/TaskColumn.module.scss b/src/components/TaskColumn/TaskColumn.module.scss
@@ -4,7 +4,6 @@
 .taskCardListLight {
   margin-bottom: 14px;
   overflow-y: auto;
-
   max-height: calc(100vh - 280px);
 
   &::-webkit-scrollbar {

diff --git a/src/components/UserInfo/UserInfo.module.scss b/src/components/UserInfo/UserInfo.module.scss
@@ -28,5 +28,6 @@
     object-fit: cover;
     width: 32px;
     height: 32px;
+    cursor: pointer;
   }
 }
diff --git a/src/index.scss b/src/index.scss
@@ -27,7 +27,8 @@
 body {
   margin: 0;
   height: 100vh;
-  overflow: hidden;
+  //width: 100vw;
+  // overflow: hidden;
   font-family: 'Poppins-Regular', sans-serif;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
@@ -56,11 +57,11 @@ code {
 // }
 
 // ::-webkit-scrollbar-thumb {
-//   background-color: $dark-color;
+//   // background-color: $dark-color;
 //   border-radius: 100vw;
 // }
 
 // ::-webkit-scrollbar-track {
-//   background-color: $background-color;
+//   // background-color: $background-color;
 //   border-radius: 100vw;
 // }