Commit f680ccf7 authored by Matthieu Fesselier's avatar Matthieu Fesselier

udpate: add author user informations - issue #6

parent b232eb51
......@@ -66,14 +66,8 @@
background: rgba(0,0,0,0.03);
}
.sib-notifications__items sib-display div[name=content]{
padding: 0.8rem;
border-bottom: 1px solid #DDD;
position: relative;
}
/* Read / unread */
.sib-notifications__items sib-display div[name=content]:before{
.sib-notifications__items [name=content]:before{
content: '';
display: block;
width: 4px;
......@@ -85,10 +79,10 @@
border-radius: 50%;
border: 2px solid #DDD;
}
.sib-notifications__items sib-display [data-read=read] + div[name=content]{
.sib-notifications__items [data-read=read] + [name=content]{
opacity: .4;
}
.sib-notifications__items sib-display [data-read=unread] + div[name=content]:before{
.sib-notifications__items [data-read=unread] + [name=content]:before{
border-color: var(--sib-notifications-theme, gray);
background-color: var(--sib-notifications-theme, gray);
}
......@@ -106,8 +100,37 @@
/* Fields */
.sib-notifications__items sib-display-div[name="date"]{
.sib-notifications__items [name=content]{
padding: 0.8rem 0;
border-bottom: 1px solid #DDD;
position: relative;
display: flex;
}
.sib-notifications__items [name="wrapper"]{
flex-grow: 1;
padding-right: 0.8rem;
}
.sib-notifications__items [name="author_user.username"]{
font-weight: bold;
font-size: 1rem;
}
.sib-notifications__items [name="type"]{
font-size: 0.9rem;
margin-top: 0.15rem;
margin-bottom: 0.5rem;
}
.sib-notifications__items [name="date"]{
color: #AAA;
font-size: 70%;
margin-top: 0.3rem;
font-size: 75%;
}
.sib-notifications__items [name="author_user.avatar"]{
display: block;
width: 30px;
height: 30px;
background: #CCC;
border-radius: 50%;
margin: 0 0.8rem;
}
.sib-notifications__items img[src=""]{
display: none;
}
\ No newline at end of file
......@@ -75,11 +75,14 @@ class SIBNotifications extends SIBTemplateElement {
<div class="sib-notifications__list">
<sib-display
id="notifications-list"
data-src="${sourceUrl}"
class="sib-notifications__items"
data-src="${sourceUrl}"
template-read="read_badge"
set-content="type, date"
set-wrapper="author_user.username, type, date"
set-content="author_user.avatar, wrapper"
data-fields="read, content"
widget-author_user.avatar="sib-display-img"
paginate-by="10"></sib-display>
</div>
<template id="read_badge">
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment