fix: adaptive

src/app/auth/components/login/login.component.scss

@@ -24,7 +24,6 @@
     max-width: 480px;
     width: 100%;
     margin: 10% auto auto auto;
-    padding-top: 10%;
 
   }
 .login-form-button {

src/app/core/components/footer/footer.component.scss

@@ -63,6 +63,7 @@ li {
 
 @media (max-width: 768px) {
   :host {
+    height: 60px;
     min-height: 60px;
 
     .footer {
@@ -92,7 +93,8 @@ li {
 
       .our-team:focus+.footer__nav, &:hover .footer__nav{
         display: inline;
-        height: fit-content;
+        // height: fit-content;
+        height: 60px;
       }
     }
   }

src/app/core/components/header/header.component.html

@@ -12,6 +12,7 @@
       <app-logo-tree-d></app-logo-tree-d>
     </div>
   </div>
+  <span nz-icon nzType="file-add" nzTheme="outline" *ngIf="showSearch" (click)="createForm()" class="header__create-board" title="{{'HEADER.CREATE_BOARD' | translate}}"></span>
   <div class="header__search" *ngIf="showSearch">
     <app-global-search></app-global-search>
   </div>

src/app/core/components/navigation/navigation.component.scss

@@ -4,7 +4,8 @@
 }
 
   @media (max-width: 768px) {
-    .ant-menu {
+
+    .ant-menu, .wrapper {
       width: 80px;
     }
     .nav-text {

src/app/welcome/welcome.component.scss

@@ -77,7 +77,7 @@
   border-radius: 13px;
   position: absolute;
   top: 10%;
-  left: 5%;
+  left: 55%;
 
   animation-duration: 6s;
   animation-name: square-mini-animation;
@@ -195,8 +195,9 @@ h1 {
   max-height: 150px;
   padding: 72px 44px;
   position: absolute;
-  left: 480px;
-  top: 12%;
+  left: 85%;
+  top: 30%;
+  width: 180px;
   z-index: 1;
   animation-duration: 6s;
   animation-name: square-custom-animation;
@@ -217,8 +218,8 @@ h1 {
   padding: 26px 132px;
   max-height: 76px;
   position: absolute;
-  top: 19%;
-  left: 0;
+  top: 45%;
+  left: 10%;
   z-index: 1;
   animation-duration: 5s;
   animation-name: square-big-animation;
@@ -238,8 +239,8 @@ h1 {
   max-height: 156px;
   padding: 66px 89px;
   position: absolute;
-  top: 41%;
-  left: 26%;
+  bottom: 0%;
+  left: 50%;
   z-index: 0;
   animation-duration: 4s;
   animation-name: square-drag-animation;
@@ -297,8 +298,8 @@ h1 {
   backdrop-filter: blur(5px);
   border-radius: 13px;
   position: absolute;
-  top: 27%;
-  left: 10%;
+  top: 30%;
+  right: -28px;
   animation-duration: 6s;
   animation-name: square-big-animation;
   animation-iteration-count: infinite;
@@ -427,3 +428,11 @@ h1 {
     left: 26%;
   }
 }
+
+.square-big {
+  position: absolute;
+  top: -50%;
+  right: -60px;
+
+}
+

src/app/workspace/components/create-column-modal/create-column-modal.component.scss

@@ -77,3 +77,9 @@
     }
   }
 }
+
+@media (max-width: 400px) {
+  .create-column {
+    max-width: 320px;
+  }
+}

src/app/workspace/components/create-task-modal/create-task-modal.component.scss

@@ -72,3 +72,9 @@
     }
   }
 }
+
+@media (max-width: 400px) {
+  .modal {
+    max-width: 320px;
+  }
+}

src/app/workspace/pages/board/board.component.html

@@ -19,6 +19,7 @@
   </div>
 </nz-result>
 <section *ngIf="board" class="board">
+  <a routerLink="/workspace" class="link-back" >{{'AUTH.BACK' | translate}}</a>
   <button class="board__filter" (click)="onFilterPush()" title="{{'FILTER.FILTER' | translate}}"><span class="board__filter-icon" nz-icon nzType="filter" nzTheme="outline"></span></button>
   <button class="board__filter-clear" (click)="onFilterClear()" title="{{'FILTER.CLEAR' | translate}}"><span nz-icon nzType="clear" class="board__filter-icon" nzTheme="outline"></span></button>
   <app-filter-window class="board__filter-options" *ngIf="isFilterVisible"></app-filter-window>

src/app/workspace/pages/board/board.component.scss

@@ -101,7 +101,7 @@
       padding-left: 10px !important;
       height: calc(100vh - 158px);
     }
-    
+  }
   &__create-button {
     padding: 15px;
     min-width: 350px;
@@ -360,3 +360,10 @@
     background-color: transparent;
   }
 }
+
+.link-back {
+  position: absolute;
+  right: 115px;
+  top: 100px;
+  height: 40px
+}

src/app/workspace/workspace.component.scss

@@ -45,7 +45,7 @@
                 padding-left: 3%;
             }
             @media(max-width: 600px) {
-                padding-left: 20%;  
+                padding-left: 20%;
             }
             @media(max-width: 420px) {
               padding-left: 20%;
@@ -218,3 +218,5 @@
 
   }
 }
+
+