Geforce File Manager

NAME	SIZE	ACTIONS
📁 collections		[ DEL ]
📁 store		[ DEL ]
📁 upload		[ DEL ]
📁 video		[ DEL ]
📄 BackButton.js	623 B	[ EDIT ] \| [ DEL ]
📄 CollectionHeader.js	2,887 B	[ EDIT ] \| [ DEL ]
📄 Footer.js	1,248 B	[ EDIT ] \| [ DEL ]
📄 Header.js	1,605 B	[ EDIT ] \| [ DEL ]
📄 Loading.js	294 B	[ EDIT ] \| [ DEL ]
📄 Popup.js	3,799 B	[ EDIT ] \| [ DEL ]
📄 ProgressBar.js	353 B	[ EDIT ] \| [ DEL ]
📄 ProgressOverlay.js	787 B	[ EDIT ] \| [ DEL ]
📄 Sidebar.js	4,941 B	[ EDIT ] \| [ DEL ]
📄 ThumbTemplate.js	1,643 B	[ EDIT ] \| [ DEL ]
📄 utils.js	1,634 B	[ EDIT ] \| [ DEL ]

[ CLOSE ]

EDIT: ThumbTemplate.js

/** @jsx jsx */
import { css, jsx } from "@emotion/core";

export default (props) => {
  const { thumbnail, title, footer, badge, before, after } = props;
  return (
    <div
      className="presto-player__video-thumb"
      css={css`
        cursor: pointer;
        user-select: none;
        display: inline-block;
        position: relative;
        margin-right: 20px;
        font-weight: bold;
        margin-bottom: 20px;
        width: 220px;
        flex: 0 0 220px;
        border: 1px solid #e0e0e0;
        border-radius: 4px;
        overflow: hidden;
      `}
      {...props}
    >
      {!!before && before}

{!!thumbnail && thumbnail}

<div
        css={css`
          margin: 14px;
        `}
      >
        {!!badge && (
          <div
            css={css`
              position: absolute;
              top: 8px;
              right: 8px;
            `}
          >
            {badge}
          </div>
        )}

{!!title && (
          <span
            css={css`
              text-overflow: ellipsis;
              white-space: nowrap;
              overflow: hidden;
              width: 100%;
              max-width: 100%;
              display: inline-block;
              margin-bottom: 7px;
              font-size: 13px;
            `}
          >
            {title}
          </span>
        )}

{!!footer && (
          <div
            css={css`
              font-size: 12px;
              opacity: 0.75;
              margin-bottom: 7px;
            `}
          >
            {footer}
          </div>
        )}
      </div>

{!!after && after}
    </div>
  );
};