Redesign video player (#4911)
* Redesign video player * Use new video player on static public pages too * Use media gallery component on static public pages too * Pause video when hiding it * Full-screen sizing on WebKit * Add aria labels to video player buttons * Display link card on public status page * Fix fullscreen from modal sizing issue * Remove contain: strict property to fix fullscreen from columns
This commit is contained in:
		@@ -1,4 +1,5 @@
 | 
			
		||||
import React from 'react';
 | 
			
		||||
import PropTypes from 'prop-types';
 | 
			
		||||
import ImmutablePropTypes from 'react-immutable-proptypes';
 | 
			
		||||
import punycode from 'punycode';
 | 
			
		||||
import classnames from 'classnames';
 | 
			
		||||
@@ -22,10 +23,15 @@ export default class Card extends React.PureComponent {
 | 
			
		||||
 | 
			
		||||
  static propTypes = {
 | 
			
		||||
    card: ImmutablePropTypes.map,
 | 
			
		||||
    maxDescription: PropTypes.number,
 | 
			
		||||
  };
 | 
			
		||||
 | 
			
		||||
  static defaultProps = {
 | 
			
		||||
    maxDescription: 50,
 | 
			
		||||
  };
 | 
			
		||||
 | 
			
		||||
  renderLink () {
 | 
			
		||||
    const { card } = this.props;
 | 
			
		||||
    const { card, maxDescription } = this.props;
 | 
			
		||||
 | 
			
		||||
    let image    = '';
 | 
			
		||||
    let provider = card.get('provider_name');
 | 
			
		||||
@@ -52,7 +58,7 @@ export default class Card extends React.PureComponent {
 | 
			
		||||
 | 
			
		||||
        <div className='status-card__content'>
 | 
			
		||||
          <strong className='status-card__title' title={card.get('title')}>{card.get('title')}</strong>
 | 
			
		||||
          <p className='status-card__description'>{(card.get('description') || '').substring(0, 50)}</p>
 | 
			
		||||
          <p className='status-card__description'>{(card.get('description') || '').substring(0, maxDescription)}</p>
 | 
			
		||||
          <span className='status-card__host'>{provider}</span>
 | 
			
		||||
        </div>
 | 
			
		||||
      </a>
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user