summaryrefslogtreecommitdiffstats
path: root/openecomp-ui/resources/scss/components/_userNotifications.scss
diff options
context:
space:
mode:
authortalig <talig@amdocs.com>2017-12-20 14:30:43 +0200
committerVitaly Emporopulo <Vitaliy.Emporopulo@amdocs.com>2017-12-21 11:12:33 +0000
commit8e9c0653dd6c6862123c9609ae34e1206d86456e (patch)
tree5eeef00ec0677133baa439ca8d7ffd7aca4804b6 /openecomp-ui/resources/scss/components/_userNotifications.scss
parent785ebcc95de3e064e843bec04ba7a209d854fc7c (diff)
Add collaboration feature
Issue-ID: SDC-767 Change-Id: I14fb4c1f54086ed03a56a7ff7fab9ecd40381795 Signed-off-by: talig <talig@amdocs.com>
Diffstat (limited to 'openecomp-ui/resources/scss/components/_userNotifications.scss')
-rw-r--r--openecomp-ui/resources/scss/components/_userNotifications.scss123
1 files changed, 123 insertions, 0 deletions
diff --git a/openecomp-ui/resources/scss/components/_userNotifications.scss b/openecomp-ui/resources/scss/components/_userNotifications.scss
new file mode 100644
index 0000000000..74cafae438
--- /dev/null
+++ b/openecomp-ui/resources/scss/components/_userNotifications.scss
@@ -0,0 +1,123 @@
+
+.onboarding-notifications {
+ margin-left: 10px;
+ .notifications-icon {
+ display: flex;
+ @extend .clickable;
+ .notifications-count {
+ color: $white;
+ font-size: 11px;
+ text-align: center;
+ width: 16px;
+ height: 16px;
+ background-color: $orange;
+ border-radius: 50%;
+ position: relative;
+ right: 7px;
+ top: -2px;
+ &.hidden-count {
+ background-color: transparent;
+ color: transparent;
+ }
+ }
+ }
+ .onboarding-overlay {
+ width: 520px;
+ right: 39px;
+ margin-top: 18px;
+ .arrow-up {
+ margin-left: 487px;
+ }
+
+ .user-notifications {
+ .notifications-title {
+ color: $blue;
+ @extend .heading-5-semibold;
+ @extend .text-uppercase !optional;
+ padding: 13px 20px 10px 20px;
+ border-bottom: 1px solid $tlv-light-gray;
+ }
+ .notifications-list {
+ max-height: 600px;
+ overflow-y: auto;
+ .notification {
+ border-bottom: 1px solid $tlv-light-gray;
+ padding: 16px 20px 18px 20px;
+ display: flex;
+ &.unread {
+ background-color: lighten($gray, 38%);
+ .item-name {
+ display: flex;
+ @include base-font-bold;
+ }
+ .unread-circle-icon {
+ width: 8px;
+ height: 8px;
+ border-radius: 50%;
+ background-color: $blue;
+ align-self: center;
+ margin-bottom: 3px;
+ margin-left: 9px;
+ }
+ }
+ .notification-data {
+ width: 366px;
+ margin-right: 30px;
+ color: $dark-gray;
+ .item-name {
+ @extend .body-2-semibold;
+ @extend .text-uppercase !optional;
+ margin-bottom: 6px;
+ }
+ .flex-items {
+ display: flex;
+ margin: 6px 0 11px 0;
+ @extend .body-3;
+ line-height: 20px;
+ @extend .text-uppercase !optional;
+ color: $gray;
+ .separator {
+ border-left: 1px solid $dark-gray;
+ margin: 5px 8px;
+ }
+ }
+ .description {
+ @extend .body-3;
+ margin: 11px 0 8px 0;
+ .more-less {
+ font-size: $icon-font-size;
+ color: $blue;
+ }
+ }
+ .date {
+ font-size: $icon-font-size;
+ @include base-font-regular;
+ color: $gray;
+ margin-top: 8px;
+ }
+ }
+
+ .notification-action .action-button {
+ @extend .clickable;
+ width: 74px;
+ height: 28px;
+ color: $white;
+ background-color: $blue;
+ border-radius: 2px;
+ text-align: center;
+ line-height: 2;
+ margin-top: 4px;
+ &.active {
+ background-color: #0091c7;
+ border: solid 1px #006186;
+ }
+ &:hover {
+ background-color: #1ec2ff;
+ border: solid 1px #0091c8;
+ }
+ }
+ }
+ }
+ }
+ }
+}