Notification
The Notification component displays a users notifications.
Example Notification
Using the props on this page and some basic HTML we can create a simple example of Notification:
jsx
<div className={unread ? "notification" : "notification--read"}>
<p>{notification}</p>
<p>{timeSince}</p>
</div>
Props
notification
The notification prop represents the notification text. For example "Caitlin replied to your comment". Below is a simple example of using the notification prop:
<p>{notification}</p>
unread
The unread prop represents wether or not a user has read a certain notification, allowing you to style the notification differently depending on if its been read or not. Below is a simple example of using the unread prop:
jsx
css
<div className={unread ? "notification" : "notification--read"}>
//the notification
</div>
timeSince
The timeSince prop represents the how long ago the notification was made. Below is a simple example of using the timeSince prop:
<p>{timeSince}</p>