rob
/
torrents.csv
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

More responsive

This commit is contained in:
Dessalines 2018-11-26 22:25:52 -07:00
parent 24571df531
commit ada3df08dc
1 changed files with 31 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

64
server/ui/src/index.tsx
View File

@ -77,41 +77,39 @@ class TorrentSearchComponent extends Component<any, State> {
table() {
return (
<div>
<div class="table-responsive-md">
<table class="table table-hover table-sm table-striped">
<thead>
<table style="table-layout: fixed;" class="table table-fixed table-hover table-sm table-striped">
<thead>
<tr>
<th style="width: 50%">Name</th>
<th class="text-right">Size</th>
<th class="text-right">Seeds</th>
<th class="text-right d-none d-md-table-cell">Leeches</th>
<th class="text-right d-none d-md-table-cell">Created</th>
<th></th>
</tr>
</thead>
<tbody>
{this.state.results.torrents.map(torrent => (
<tr>
<th style="width: 50%">Name</th>
<th class="text-right">Size</th>
<th class="text-right">Seeds</th>
<th class="text-right d-none d-md-table-cell">Leeches</th>
<th class="text-right d-none d-md-table-cell">Created</th>
<th></th>
<td style="word-wrap: break-word;">{torrent.name}</td>
<td class="text-right text-muted">{humanFileSize(torrent.size_bytes, true)}</td>
<td class="text-right text-success"><div><i class="fas fa-fw fa-arrow-up"></i>{torrent.seeders}</div></td>
<td class="text-right text-danger d-none d-md-table-cell"><i class="fas fa-fw fa-arrow-down"></i>{torrent.leechers}</td>
<td class="text-right text-muted d-none d-md-table-cell" title={`Scraped ${moment(torrent.scraped_date * 1000).fromNow()}`}>
{moment(torrent.created_unix * 1000).fromNow()}
</td>
<td class="text-right">
<a class="btn btn-sm" href={magnetLink(torrent.infohash)}>
<i title="magnet link" class="fas fa-fw fa-magnet"></i>
</a>
<a class="btn btn-sm d-none d-md-inline" href={`https://gitlab.com/dessalines/torrents.csv/issues/new?issue[assignee_id]=&issue[milestone_id]=&issue[title]=Report%20Torrent%20infohash%20${torrent.infohash}`}>
<i title="Report torrent" class="fas fa-fw fa-flag"></i>
</a>
</td>
</tr>
</thead>
<tbody>
{this.state.results.torrents.map(torrent => (
<tr>
<td>{torrent.name}</td>
<td class="text-right text-muted">{humanFileSize(torrent.size_bytes, true)}</td>
<td class="text-right text-success"><div><i class="fas fa-fw fa-arrow-up"></i>{torrent.seeders}</div></td>
<td class="text-right text-danger d-none d-md-table-cell"><i class="fas fa-fw fa-arrow-down"></i>{torrent.leechers}</td>
<td class="text-right text-muted d-none d-md-table-cell" title={`Scraped ${moment(torrent.scraped_date * 1000).fromNow()}`}>
{moment(torrent.created_unix * 1000).fromNow()}
</td>
<td class="text-right">
<a class="btn btn-sm" href={magnetLink(torrent.infohash)}>
<i title="magnet link" class="fas fa-fw fa-magnet"></i>
</a>
<a class="btn btn-sm d-none d-md-inline" href={`https://gitlab.com/dessalines/torrents.csv/issues/new?issue[assignee_id]=&issue[milestone_id]=&issue[title]=Report%20Torrent%20infohash%20${torrent.infohash}`}>
<i title="Report torrent" class="fas fa-fw fa-flag"></i>
</a>
</td>
</tr>
))}
</tbody>
</table>
</div>
))}
</tbody>
</table>
{this.paginator()}
</div>
);