NotificationPlaceholder implemented

src/common/NavBar/NotificationsMenu/NotificationsList/NotificationPlaceholder/NotificationPlaceholder.js

@@ -0,0 +1,25 @@
+const React = require('react');
+const PropTypes = require('prop-types');
+const classnames = require('classnames');
+const Icon = require('stremio-icons/dom');
+const styles = require('./styles');
+
+const NotificationPlaceholder = ({ className }) => {
+    return (
+        <div className={classnames(className, styles['notification-placeholder-container'])}>
+            <div className={styles['logo-image-container']}>
+                <div className={styles['logo-image']} />
+            </div>
+            <div className={styles['info-container']}>
+                <div className={styles['name-container']} />
+                <div className={styles['released-container']} />
+            </div>
+        </div>
+    );
+};
+
+NotificationPlaceholder.propTypes = {
+    className: PropTypes.string
+}
+
+module.exports = NotificationPlaceholder;

src/common/NavBar/NotificationsMenu/NotificationsList/NotificationPlaceholder/index.js

@@ -0,0 +1,3 @@
+const NotificationPlaceholder = require('./NotificationPlaceholder');
+
+module.exports = NotificationPlaceholder;

src/common/NavBar/NotificationsMenu/NotificationsList/NotificationPlaceholder/styles.less

@@ -0,0 +1,39 @@
+.notification-placeholder-container {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    padding: 1rem;
+
+    .logo-image-container {
+        flex: none;
+        border-radius: 50%;
+
+        .logo-image {
+            width: 3.5rem;
+            height: 3.5rem;
+            background-color: var(--color-placeholder);
+        }
+    }
+
+    .info-container {
+        flex: 1;
+        padding: 0 1rem;
+        
+        .name-container {
+            width: 100%;
+            height: 1.2rem;
+            background: var(--color-placeholder);
+        }
+
+        .released-container {
+            width: 50%;
+            height: 1.2rem;
+            margin-top: 0.5rem;
+            background: var(--color-placeholder);
+        }
+    }
+
+    &:not(:last-child) {
+        border-bottom: thin solid var(--color-surfacelight);
+    }
+}