add empty-manage-card for notification

Author: Awakich

projects/social_platform/src/assets/icons/svg/empty-mail.svg

@@ -0,0 +1,16 @@
+<!-- @format -->
+
+<div class="card">
+  <div class="card__inner">
+    <i appIcon icon="cross" appSquare="16" class="card__cross"></i>
+
+    <div class="card__info">
+      <i appIcon icon="empty-mail" appSquare="46"></i>
+      <p class="text-body-12 card__text">новых уведомлений пока нет</p>
+    </div>
+
+    <app-button routerLink="/office/program/all" customTypographyClass="text-body-12" size="big"
+      >начать действовать</app-button
+    >
+  </div>
+</div>

projects/social_platform/src/assets/icons/symbol/svg/sprite.css.svg

@@ -0,0 +1,38 @@
+.card {
+  padding: 24px;
+  background-color: var(--light-white);
+  background-color: var(--light-white);
+  border: 0.5px solid var(--medium-grey-for-outline);
+  border-radius: var(--rounded-xl);
+  width: 100%;
+  position: relative;
+  max-width: 286px;
+
+  &__inner {
+    display: flex;
+    flex-direction: column;
+    gap: 10px;
+  }
+
+  &__info {
+    display: flex;
+    align-items: center;
+    gap: 15px;
+  }
+
+  &__text {
+    color: var(--dark-grey);
+    width: 60%;
+  }
+
+  &__cross {
+    position: absolute;
+    top: 10px;
+    right: 10px;
+  }
+
+  i {
+    cursor: pointer;
+    color: var(--dark-grey);
+  }
+}

projects/ui/src/lib/components/layout/empty-manage-card/empty-manage-card.component.html

@@ -0,0 +1,15 @@
+/** @format */
+
+import { CommonModule } from "@angular/common";
+import { Component } from "@angular/core";
+import { ButtonComponent, IconComponent } from "@ui/components";
+import { RouterLink } from "@angular/router";
+
+@Component({
+  selector: "app-empty-manage-card",
+  templateUrl: "./empty-manage-card.component.html",
+  styleUrl: "./empty-manage-card.component.scss",
+  imports: [CommonModule, ButtonComponent, IconComponent, RouterLink],
+  standalone: true,
+})
+export class EmptyManageCardComponent {}

projects/ui/src/lib/components/layout/empty-manage-card/empty-manage-card.component.scss

@@ -17,16 +17,17 @@
         >
 
         <!-- для программ -->
-        <p>В программе</p>
+        <!-- <p>В программе</p>
         <br />
         <a [routerLink]="['/office/program', invite.project.id]"
           >"{{ invite.project.name | truncate: 20 }}"</a
-        >
+        > -->
+
         <!-- для поста текст -->
-        <p>выложили новый пост</p>
+        <!-- <p>выложили новый пост</p> -->
 
         <!-- для материалов текст -->
-        <p>опубликован новый материал</p>
+        <!-- <p>опубликован новый материал</p> -->
       </div>
 
       <!-- <div class="text-body-12 invite__time">
@@ -49,12 +50,12 @@
     >
 
     <!-- для программ -->
-    <app-button
+    <!-- <app-button
       customTypographyClass="text-body-12"
       size="big"
       [routerLink]="['/office/program', invite.project.id]"
       >перейти в программу</app-button
-    >
+    > -->
   </div>
 </div>
 }

projects/ui/src/lib/components/layout/empty-manage-card/empty-manage-card.component.ts

@@ -24,6 +24,8 @@
             (reject)="rejectInvite.emit($event)"
           ></app-invite-manage-card>
         </li>
+        } @empty {
+        <app-empty-manage-card></app-empty-manage-card>
         }
       </ul>
     </div>

projects/ui/src/lib/components/layout/invite-manage-card/invite-manage-card.component.html

@@ -27,7 +27,7 @@
   &__notifications {
     position: absolute;
     top: 100%;
-    right: -10%;
+    right: 0%;
     z-index: 20;
     margin-top: 10px;
   }

projects/ui/src/lib/components/layout/profile-control-panel/profile-control-panel.component.html

@@ -7,6 +7,7 @@ import { ClickOutsideModule } from "ng-click-outside";
 import type { Invite } from "@office/models/invite.model";
 import { RouterLink } from "@angular/router";
 import type { User } from "../../../models/user.model";
+import { EmptyManageCardComponent } from "../empty-manage-card/empty-manage-card.component";
 
 /**
  * Компонент панели управления профилем
@@ -38,6 +39,7 @@ import type { User } from "../../../models/user.model";
     ClickOutsideModule,
     IconComponent,
     RouterLink,
+    EmptyManageCardComponent,
   ],
   templateUrl: "./profile-control-panel.component.html",
   styleUrl: "./profile-control-panel.component.scss",