5 .popover-notifications.popover {
12 font-family: $main-fonts;
14 box-shadow: 0 6px 14px rgba(0, 0, 0, 0.30);
19 justify-content: center;
26 transition: max-height 0.15s ease-out;
29 flex-direction: column;
35 & > my-user-notifications:nth-child(2) {
41 .notifications-header {
43 justify-content: space-between;
45 background-color: rgba(0, 0, 0, 0.10);
52 @include disable-default-a-behaviour;
56 @include peertube-button;
59 background: transparent;
63 color: rgba(20, 20, 20, 0.5);
65 &:hover:not(:disabled) {
66 color: rgba(20, 20, 20, 0.8);
74 justify-content: center;
75 font-weight: $font-semibold;
79 text-decoration: none;
85 .notification-avatar {
90 .unread-notifications {
95 @include avatar(34px);
100 .unread-notifications {
107 justify-content: center;
109 background-color: var(--mainColor);
112 font-weight: $font-semibold;
120 @media screen and (max-width: $mobile-view) {
122 .popover-notifications.popover {
123 left: unset !important;
126 left: calc(2em + 7px);