feature: notification - templates for circle and private notification added

src/header.pug

@@ -7,6 +7,10 @@ solid-notifications.notLoggedIn(
   bind-user
 )
 
+//- Templates for notifications from circles and from other users
+include views/circle/page-circle-notifications.pug
+include views/user/page-user-notifications.pug
+
 include templates/hubl-user-avatar.pug
 
 details#user-controls.notLoggedIn

src/styles/base/header.scss

@@ -203,6 +203,10 @@ solid-notifications {
             .solid-notification__title {
               font-size: 1.3rem;
               font-weight: 600;
+
+              .solid-notification__title__side {
+                font-weight: normal;
+              }
             }
 
             .solid-notification__summary {
@@ -219,10 +223,6 @@ solid-notifications {
                 max-width: 256px;
               }
             }
-
-            .solid-notification__date {
-              display: none;
-            }
           }
 
           .solid-notification__read {

src/styles/base/main.scss

@@ -279,121 +279,6 @@ h5 {
   width: 15vw;
 }
 
-.project-edit-logo {
-  display: flex;
-  height: 8.5vh;
-  margin-top: 20px;
-  margin-bottom: 30px;
-
-  form {
-    display: flex;
-  }
-
-  hubl-user-avatar {
-    width: 104px;
-  }
-
-  input[type='submit'] {
-    @extend .button,
-    .text-bold,
-    .text-uppercase,
-    .button-primary,
-    .bordered;
-    align-self: center;
-  }
-}
-
-.form-picture {
-
-  form {
-    display: block;
-    text-align: center;
-    margin-bottom: 2.6rem;
-    padding-top: 1.8rem;
-
-    @include breakpoint(lg) {
-      display: flex;
-      width: 100%;
-    }
-
-    hubl-user-avatar {
-      display: inline-block;
-      max-width: 100%;
-      max-height: 16.5vh;
-
-      @include breakpoint(lg) {
-        margin-left: 20px;
-        max-height: 8.5vh;
-        max-width: none;
-        width: calc(35vw - 20px);
-      }
-
-      >object,
-      >img {
-        display: block;
-        max-height: 16.5vh !important;
-
-        @include breakpoint(lg) {
-          max-height: 8.5vh !important;
-        }
-      }
-    }
-
-    input {
-      @extend .button,
-      .text-bold,
-      .text-uppercase,
-      .button-primary,
-      .bordered;
-      margin: 10px 0;
-      width: 100%;
-
-      @include breakpoint(lg) {
-        margin: auto 0 auto 2.2rem;
-        width: auto;
-      }
-    }
-  }
-}
-
-
-.p_relative {
-  position: relative;
-}
-
-.is-inline-1200 {
-
-  @include breakpoint(lg) {
-    flex-direction: row;
-  }
-}
-
-.flex_vertical-center {
-  align-items: center;
-}
-
-.flex_column {
-  flex-direction: column;
-}
-
-.pull-left-1200 {
-
-  @include breakpoint(lg) {
-    float: left;
-  }
-}
-
-.profile-avatar {
-  height: 243px;
-  width: 243px;
-  margin-left: 2rem;
-}
-
-solid-picture {
-  
-}
-
-
 .content-box {
   @include window-style-modal();
   flex-direction: column;

src/views/circle/page-circle-notifications.pug

@@ -0,0 +1,8 @@
+solid-notifications-template(data-rdf-type='hd:circle')
+  template
+    .solid-notification__avatar
+      img(src="${await author['account.foaf:depiction']}")
+    .solid-notification__content
+      .solid-notification__title ${await author.name} 
+        span.solid-notification__title__side dans #${await object.name}
+      p.solid-notification__summary ${summary}

src/views/user/page-user-notifications.pug

@@ -0,0 +1,8 @@
+solid-notifications-template(data-rdf-type='foaf:user')
+  template
+    .solid-notification__avatar
+      img(src="${await author['account.foaf:depiction']}")
+    .solid-notification__content
+      .solid-notification__title ${await author.name} 
+        span.solid-notification__title__side en privé
+      p.solid-notification__summary ${summary}