mirror of
https://github.com/Stremio/stremio-web.git
synced 2026-03-11 21:27:05 +00:00
play-button renamed to play icon
This commit is contained in:
parent
16d3144f25
commit
72c250060a
3 changed files with 8 additions and 8 deletions
|
|
@ -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>
|
||||
|
|
|
|||
|
|
@ -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);
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in a new issue