Component that represents one notification. The component consists out of some text describing the notification, a way to indicate if it was read and the time when the notification was send. This is mainly used in a list of other notifications.
<article class="m-notification ">
<p class="m-notification__description">
Vergeet de evaluatie voor “Excel basis” niet in te vullen alvorens je volgende les start
</p>
<time class="m-notification__time" datetime="1:20 pm">1:20 pm</time>
<button class="m-notification__state">
Markeren als gelezen
</button>
</article>
<article class="m-notification is-read">
<p class="m-notification__description">
Vergeet de evaluatie voor “Excel basis” niet in te vullen alvorens je volgende les start
</p>
<time class="m-notification__time" datetime="1:20 pm">1:20 pm</time>
<button class="m-notification__state">
Gelezen
</button>
</article>
is-read
Indicate if the notification is alreay read or not, this will change the color of the title/description and change the copy of an already read item to "read".