From 72c250060a7117af0673d3a3f4dbaa04c9c10cd5 Mon Sep 17 00:00:00 2001
From: NikolaBorislavovHristov <hristovnikola@protonmail.com>
Date: Tue, 29 Jan 2019 16:15:17 +0200
Subject: [PATCH] play-button renamed to play icon

---
 src/common/MetaItem/MetaItem.js | 6 +++---
 src/common/MetaItem/styles.less | 6 +++---
 src/routes/Board/styles.less    | 4 ++--
 3 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/src/common/MetaItem/MetaItem.js b/src/common/MetaItem/MetaItem.js
index 3a6c477a3..6c31e77ce 100644
--- a/src/common/MetaItem/MetaItem.js
+++ b/src/common/MetaItem/MetaItem.js
@@ -65,8 +65,8 @@ class MetaItem extends Component {
             <div className={styles['poster-image-container']}>
                 <Icon className={styles['placeholder-image']} icon={placeholderIcon} />
                 <div className={styles['poster-image']} style={{ backgroundImage: `url('${this.props.poster}')` }} />
-                <div className={styles['play-button-container']}>
-                    <Icon className={styles['play-button-icon']} icon={'ic_play'} viewBox={'-291.6 0 1190.6 1024'} />
+                <div className={styles['play-icon-container']}>
+                    <Icon className={styles['play-icon']} icon={'ic_play'} viewBox={'-291.6 0 1190.6 1024'} />
                 </div>
                 {this.renderProgress()}
             </div>
@@ -94,7 +94,7 @@ class MetaItem extends Component {
                                 <Popup.Menu>
                                     <div className={styles['menu-items-container']}>
                                         {this.props.menu.map(({ label, onSelect }) => (
-                                            <Button key={label} className={styles['menu-item']} onClick={onSelect}>{label}</Button>
+                                            <Button key={label} data-meta-item-id={this.props.id} className={styles['menu-item']} onClick={onSelect}>{label}</Button>
                                         ))}
                                     </div>
                                 </Popup.Menu>
diff --git a/src/common/MetaItem/styles.less b/src/common/MetaItem/styles.less
index ae3d02553..16fd27920 100644
--- a/src/common/MetaItem/styles.less
+++ b/src/common/MetaItem/styles.less
@@ -32,7 +32,7 @@
             background-origin: border-box;
         }
 
-        .play-button-container {
+        .play-icon-container {
             position: absolute;
             top: calc(50% - (var(--poster-relative-size) * 0.2));
             left: calc(50% - (var(--poster-relative-size) * 0.2));
@@ -42,10 +42,10 @@
             background-color: var(--color-surfacelighter);
             border-radius: 50%;
             box-shadow: 0 0 calc(var(--poster-relative-size) * 0.1) calc(var(--poster-relative-size) * 0.015) var(--color-backgroundlight);
-            visibility: var(--play-button-visibility, collapse);
+            visibility: var(--play-icon-visibility, collapse);
             text-align: center;
 
-            .play-button-icon {
+            .play-icon {
                 height: 40%;
                 margin-top: 30%;
                 fill: var(--color-primary);
diff --git a/src/routes/Board/styles.less b/src/routes/Board/styles.less
index d6eee6aa9..889dd3190 100644
--- a/src/routes/Board/styles.less
+++ b/src/routes/Board/styles.less
@@ -7,7 +7,7 @@
         --poster-relative-size: calc(180px * var(--poster-shape-ratio));
 
         .meta-item {
-            --play-button-visibility: visible;
+            --play-icon-visibility: visible;
         }
     }
 
@@ -16,7 +16,7 @@
 
         .meta-item {
             &:hover, &:focus {
-                --play-button-visibility: visible;
+                --play-icon-visibility: visible;
             }
         }
     }