Add floating-action button to open torrent details panel

client/source/scripts/components/icons/Icon.js

@@ -15,6 +15,11 @@ const _icons = {
     <path d="M55.9,39.1l-8.8-6.4h-5.4l9.4,7.8h-9.8c-0.3,0-0.5,0.2-0.7,0.4l-2.3,6.7H21.7l-2.3-6.7
       c-0.1-0.2-0.4-0.4-0.7-0.4H8.9l9.4-7.8h-5.4l-8.8,6.4C2.8,40,2,41.9,2.4,43.5l1.6,9.2c0.4,1.5,1.9,2.8,3.5,2.8h45.2
       c1.6,0,3.1-1.3,3.5-2.8l1.6-9.2C58,41.9,57.2,40,55.9,39.1z M44.4,20.1h-8.9V4.5h-11v15.6h-8.9L30,34.5L44.4,20.1z"/>,
+  dotsMini: <g>
+      <circle cx="0.9" cy="4" r="0.9"/>
+      <circle cx="4" cy="4" r="0.9"/>
+      <circle cx="7.1" cy="4" r="0.9"/>
+    </g>,
   error: <path d="M34.3,51.3h-8.5v-9h8.5V51.3z M34.3,36.4h-8.5L23.6,8.7h12.7L34.3,36.4z"/>,
   inactive: <path d="M56,52H42l-9.7-12.5l-11,4.8L13,20.7l-7,4l-2-9.9L17.2,8l9.5,24.4l9.6-4.3l10.9,15.4H56V52z"/>,
   limits:

client/source/scripts/components/torrent-list/Torrent.js

@@ -2,6 +2,7 @@ import classNames from 'classnames';
 import React from 'react';
 
 import format from '../../helpers/formatData';
+import Icon from '../icons/Icon';
 import ProgressBar from './ProgressBar';
 
 const methodsToBind = [
@@ -141,7 +142,7 @@ export default class Torrent extends React.Component {
         onMouseDown={this.handleClick}
         onContextMenu={this.handleRightClick}>
         <ul className="torrent__details">
-          <li className="torrent__details--primary">
+          <li className="torrent__details--primary text-overflow">
             {torrent.name}
           </li>
           <li className="torrent__details--secondary">
@@ -188,6 +189,9 @@ export default class Torrent extends React.Component {
           </li>
         </ul>
         <ProgressBar percent={torrent.percentComplete} />
+        <button className="torrent__more-info floating-action__button">
+          <Icon icon="dotsMini" size="mini" />
+        </button>
       </li>
     );
   }