diff --git a/src/common/MetaItem/MetaItem.js b/src/common/MetaItem/MetaItem.js
index 1efc0116e..7642edced 100644
--- a/src/common/MetaItem/MetaItem.js
+++ b/src/common/MetaItem/MetaItem.js
@@ -1,4 +1,4 @@
-import React, { Component } from 'react';
+import React, { Component, Fragment } from 'react';
import PropTypes from 'prop-types';
import classnames from 'classnames';
import { Popup } from 'stremio-common';
@@ -48,35 +48,45 @@ class MetaItem extends Component {
);
}
- renderTitleBar() {
- if (this.props.title.length === 0 && this.props.menu.length === 0) {
+ renderInfoBar() {
+ if (this.props.title.length === 0 && this.props.menu.length === 0 && this.props.subtitle.length === 0) {
return null;
}
return (
-
-
{this.props.title}
+
+
+
{this.props.title}
+ {
+ this.props.menu.length > 0 ?
+
+
+
+
+
+
+ {this.props.menu.map(({ label, callback }) => (
+
{label}
+ ))}
+
+
+
+ :
+ null
+ }
+
{
- this.props.menu.length > 0 ?
-
-
-
-
-
-
- {this.props.menu.map(({ label, callback }) => (
-
{label}
- ))}
-
-
-
+ this.props.subtitle.length > 0 ?
+
+
{this.props.subtitle}
+
:
null
}
-
+
);
}
@@ -84,7 +94,7 @@ class MetaItem extends Component {
return (
{this.renderPoster()}
- {this.renderTitleBar()}
+ {this.renderInfoBar()}
);
}
diff --git a/src/common/MetaItem/styles.less b/src/common/MetaItem/styles.less
index 16dbc66cc..067aca9b8 100644
--- a/src/common/MetaItem/styles.less
+++ b/src/common/MetaItem/styles.less
@@ -1,6 +1,7 @@
.meta-item-container {
margin: 10px;
- display: inline-block;
+ display: inline-flex;
+ flex-direction: column;
background-color: var(--color-backgroundlight);
.poster-image-container {