diff --git a/src/App.css b/src/App.css
index 74b5e053..ce8e6d52 100644
--- a/src/App.css
+++ b/src/App.css
@@ -1,3 +1,13 @@
+@font-face {
+ font-family: 'SF UI Text';
+ src: local('SF UI Text'), url(./fonts/SFUIText-Bold.ttf) format('truetype');
+}
+
+@font-face {
+ font-family: 'Inter';
+ src: local('Inter'), url(./fonts/Inter-Regular.otf) format('opentype');
+}
+
.App {
text-align: center;
}
diff --git a/src/fonts/Inter-Regular.otf b/src/fonts/Inter-Regular.otf
new file mode 100644
index 00000000..fdb121dd
Binary files /dev/null and b/src/fonts/Inter-Regular.otf differ
diff --git a/src/fonts/SFUIText-Bold.ttf b/src/fonts/SFUIText-Bold.ttf
new file mode 100644
index 00000000..391724c7
Binary files /dev/null and b/src/fonts/SFUIText-Bold.ttf differ
diff --git a/src/svgs/donut-icon.svg b/src/svgs/donut-icon.svg
new file mode 100644
index 00000000..bb4666aa
--- /dev/null
+++ b/src/svgs/donut-icon.svg
@@ -0,0 +1,3 @@
+
diff --git a/src/svgs/not-icon-2.svg b/src/svgs/not-icon-2.svg
new file mode 100644
index 00000000..59fd721d
--- /dev/null
+++ b/src/svgs/not-icon-2.svg
@@ -0,0 +1,3 @@
+
diff --git a/src/svgs/not-icon-3.svg b/src/svgs/not-icon-3.svg
new file mode 100644
index 00000000..017d0987
--- /dev/null
+++ b/src/svgs/not-icon-3.svg
@@ -0,0 +1,3 @@
+
diff --git a/src/svgs/profile-icon.svg b/src/svgs/profile-icon.svg
new file mode 100644
index 00000000..1d54b7be
--- /dev/null
+++ b/src/svgs/profile-icon.svg
@@ -0,0 +1,9 @@
+
diff --git a/src/user/dashboard/notifications/notifications.js b/src/user/dashboard/notifications/notifications.js
index 09978668..27700d81 100644
--- a/src/user/dashboard/notifications/notifications.js
+++ b/src/user/dashboard/notifications/notifications.js
@@ -1,32 +1,71 @@
import React, { Component } from "react";
-import { Table } from "react-bootstrap";
+import donutIcon from '../../../svgs/donut-icon.svg'
+import icon2 from '../../../svgs/not-icon-2.svg'
+import icon3 from '../../../svgs/not-icon-3.svg'
import "./notifications.scss";
+const customNotifications = [
+ {
+ _id: 1,
+ imgSrc: donutIcon,
+ heading: 'Cody Nguyen',
+ content: 'Lorem ipsum dolor sit amet, duo esse augue torgatos te, ius an nisi deterruisset.',
+ tag: '+1 RSVP'
+ },
+ {
+ _id: 2,
+ imgSrc: icon2,
+ heading: 'Arlene Mccoy',
+ content: 'Lorem ipsum dolor sit amet, duo esse augue torgatos te, ius an nisi deterruisset.',
+ tag: ''
+ },
+ {
+ _id: 3,
+ imgSrc: icon3,
+ heading: 'Julian Richards',
+ content: 'Lorem ipsum dolor sit amet, duo esse augue torgatos te, ius an nisi deterruisset.',
+ tag: 'View'
+ },
+ {
+ _id: 4,
+ imgSrc: donutIcon,
+ heading: 'Julian Richards',
+ content: 'Lorem ipsum dolor sit amet, duo esse augue torgatos te, ius an nisi deterruisset.',
+ tag: ''
+ },
+]
+
class Notifications extends Component {
render() {
+ let notifications = customNotifications.map((notification,i) => {
+ return (
+
+
+
+
+
+
+
{notification.heading}
+ {notification.tag ?
:
}
+
{notification.content}
+
+
+
-
-
-
- | Notifications |
-
-
-
-
- | 1 |
-
-
- | 2 |
-
-
- | 3 |
-
-
-
+
+
Notifications
+
+
+ {notifications}
+
+
+
+
+
+
+
{event.createdBy}
+ {event.tag ?
:
}
+
{event.description}
+
+
+
-
-
-
- | Upcoming Events |
-
-
-
-
- | 1 |
-
-
- | 2 |
-
-
- | 3 |
-
-
-
+
+
Upcoming Events
+
+
+ {upcomingEvents}
+