add new design of button & new error icon

Author: Awakich

projects/skills/src/app/profile/shared/info-block/info-block.component.html

@@ -41,7 +41,9 @@ <h1 class="info__title">{{ userData.firstName }} {{ userData.lastName }}</h1>
     {{ userData.points }} {{ userData.points | pluralize: ["балл", "балла", "баллов"] }}
   </div>
   <a href="https://app.procollab.ru/office" class="info__return">
-    <app-button>Вернуться на procollab.ru</app-button>
+    <app-button customTypographyClass="text-body-14" size="big"
+      >Вернуться на procollab.ru</app-button
+    >
   </a>
 </div>
 
@@ -54,7 +56,10 @@ <h1 class="info__title">{{ userData.firstName }} {{ userData.lastName }}</h1>
     </div>
     <p class="cancel__title">Подписка оформлена</p>
     <p class="text-body-14 cancel__text">Погрузись в мир знаний прямо сейчас</p>
-    <app-button customTypographyClass="text-body-12" (click)="openSuscriptionBought = false"
+    <app-button
+      customTypographyClass="text-body-12"
+      size="big"
+      (click)="openSuscriptionBought = false"
       >Начать</app-button
     >
     <img alt="wave" src="assets/images/subscription/wave.svg" class="cancel__wave" />

projects/skills/src/app/profile/shared/info-block/info-block.component.scss

@@ -216,14 +216,6 @@
     color: var(--grey-for-text);
   }
 
-  app-button {
-    width: 70%;
-
-    @include responsive.apply-desktop {
-      width: 40%;
-    }
-  }
-
   &__wave {
     position: absolute;
     bottom: -10%;

projects/skills/src/app/profile/shared/skill-chooser/skill-chooser.component.html

@@ -1,7 +1,7 @@
 <!-- @format -->
 
 @if (open && !nonConfirmerModalOpen()) {
-<app-modal [open]="open" (openChange)="onOpenChange($event)">
+<app-modal [open]="true" (openChange)="onOpenChange($event)">
   <div class="plans">
     <i (click)="onCloseModal()" appIcon icon="cross" class="plans__cross"></i>
     <h1 class="plans__title">Выберите 5 навыков</h1>
@@ -80,13 +80,15 @@ <h4 class="confirm__title text-heading-4">У вас нет активной по
 
       <div class="cancel__buttons-group">
         <app-button
+          size="medium"
           customTypographyClass="text-body-12"
           [color]="'grey'"
           (click)="onSubscriptionModalClosed()"
           >Назад</app-button
         >
 
         <app-button
+          size="medium"
           routerLink="/subscription"
           customTypographyClass="text-body-12"
           [color]="'primary'"

projects/skills/src/app/profile/shared/skill-chooser/skill-chooser.component.scss

@@ -179,13 +179,6 @@
   &__buttons-group {
     display: flex;
     gap: 15px;
-    width: 100%;
-    margin-top: 20px;
-
-    app-button {
-      width: 100%;
-      border-radius: 15px;
-    }
   }
 
   &__confirm {

projects/skills/src/app/profile/shared/skills-block/skills-block.component.html

@@ -64,7 +64,11 @@ <h2 class="skills__title">Навыки</h2>
       Тебе предстоит выбрать 5 навыков, развитию которых будет посвящен месяц твоей подписки. Не
       торопись с выбором. Отменить или поменять его будет нельзя!
     </p>
-    <app-button customTypographyClass="text-body-12" style="width: 100%" (click)="nextStepModal()"
+    <app-button
+      size="big"
+      customTypographyClass="text-body-12"
+      style="width: 100%"
+      (click)="nextStepModal()"
       >Выбрать навыки месяца</app-button
     >
     <img alt="wave" src="assets/images/subscription/wave.svg" class="cancel__wave" />
@@ -82,6 +86,7 @@ <h4 class="confirm__title text-heading-4">У вас нет активной по
 
       <div class="cancel__buttons-group">
         <app-button
+          size="medium"
           customTypographyClass="text-body-12"
           [color]="'grey'"
           style="width: 100%"
@@ -90,6 +95,7 @@ <h4 class="confirm__title text-heading-4">У вас нет активной по
         >
 
         <app-button
+          size="medium"
           routerLink="/subscription"
           style="width: 100%"
           customTypographyClass="text-body-12"

projects/skills/src/app/profile/shared/skills-block/skills-block.component.scss

@@ -200,13 +200,6 @@
   &__buttons-group {
     display: flex;
     gap: 15px;
-    width: 100%;
-    margin-top: 20px;
-
-    app-button {
-      width: 100%;
-      border-radius: 15px;
-    }
   }
 
   &__confirm {

projects/skills/src/app/profile/shared/trajectory-block/trajectory-block.component.html

@@ -6,7 +6,7 @@
     src="/assets/images/profile/trajectory.svg"
     class="trajectory__image"
   />
-  <app-button (click)="navigateToTrajectory()">Начать</app-button>
+  <app-button size="big" (click)="navigateToTrajectory()">Начать</app-button>
 </div>
 
 <app-modal [open]="isErrorTrajectoryModalOpen" (openChange)="onOpenErorTrajectoryModalChange()">
@@ -15,7 +15,10 @@
 
     <p class="cancel__title">У вас нет активной траектории!</p>
     <p class="text-body-14 cancel__text">Выберите нужную вам траекторию!</p>
-    <app-button customTypographyClass="text-body-12" (click)="isErrorTrajectoryModalOpen = false"
+    <app-button
+      size="big"
+      customTypographyClass="text-body-12"
+      (click)="isErrorTrajectoryModalOpen = false"
       >Ок</app-button
     >
   </div>

projects/skills/src/app/profile/shared/trajectory-block/trajectory-block.component.scss

@@ -94,12 +94,4 @@
     margin-bottom: 24px;
     color: var(--grey-for-text);
   }
-
-  app-button {
-    width: 70%;
-
-    @include responsive.apply-desktop {
-      width: 40%;
-    }
-  }
 }

projects/skills/src/app/profile/students/students.component.html

@@ -22,7 +22,7 @@
               'https://app.procollab.ru/office/chats/' + student.student.id + '_' + student.mentorId
             "
           >
-            <app-button customTypographyClass="text-body-12" class="students__button"
+            <app-button customTypographyClass="text-body-10" size="big" class="students__button"
               >Чат с участником</app-button
             >
           </a>
@@ -92,7 +92,10 @@
           </div>
 
           <div class="stats__save">
-            <app-button customTypographyClass="text-body-12" (click)="onSave(student.meetingId)"
+            <app-button
+              size="medium"
+              customTypographyClass="text-body-10"
+              (click)="onSave(student.meetingId)"
               >Сохранить</app-button
             >
           </div>
@@ -108,9 +111,9 @@
           {{ expandedStudentId === student.student.id ? "Скрыть" : "Посмотреть" }} статистику
         </p>
         @if (expandedStudentId === student.student.id) {
-        <i appIcon icon="arrow-no-body" appSquare="32" class="icon"></i>
+        <i appIcon icon="arrow-no-body" appSquare="18" class="icon"></i>
         } @else {
-        <i appIcon icon="arrow-no-body" appSquare="32" class="icon__unexpanded"></i>
+        <i appIcon icon="arrow-no-body" appSquare="18" class="icon__unexpanded"></i>
         }
       </div>
     </div>

projects/skills/src/app/profile/students/students.component.scss

@@ -74,12 +74,6 @@
     color: var(--dark-grey);
   }
 
-  app-button {
-    &::ng-deep .button--inline {
-      height: 25px;
-    }
-  }
-
   &__stats {
     position: relative;
     top: auto;
@@ -194,26 +188,6 @@
   &__meeting {
     color: var(--dark-grey);
   }
-
-  &__save {
-    width: 100%;
-
-    app-button {
-      &::ng-deep .button--inline {
-        min-height: 45px;
-      }
-    }
-
-    @include responsive.apply-desktop {
-      width: 13%;
-
-      app-button {
-        &::ng-deep .button--inline {
-          min-height: 38px;
-        }
-      }
-    }
-  }
 }
 
 .icon {