add invites badge for control panel

Author: Awakich

projects/social_platform/src/styles.scss

@@ -25,7 +25,11 @@
 @import "styles/pages/project-detail.scss";
 
 :root {
-  --app-height: 100%;
+  --app-height: 100vh;
+}
+
+html {
+  scrollbar-gutter: stable;
 }
 
 html,

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

@@ -8,6 +8,9 @@
         <div class="attention"></div>
         }
         <i appIcon icon="bell" appWidth="15" appHeight="17" appViewBox="0 0 15 17"></i>
+        @if (invites.length) {
+        <div class="control-panel__bell--hasInvites"></div>
+        }
       </div>
     </div>
     @if (showNotifications) {

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

@@ -31,4 +31,18 @@
     z-index: 20;
     margin-top: 10px;
   }
+
+  &__bell {
+    position: relative;
+
+    &--hasInvites {
+      position: absolute;
+      top: -5%;
+      left: 0%;
+      background-color: var(--red);
+      border-radius: 100%;
+      width: 6px;
+      height: 6px;
+    }
+  }
 }