Extend UI shims and fix updates again

This commit is contained in:
Drew DeVault 2017-08-23 08:42:00 -04:00
parent e4b76d0d59
commit 6737b4f5b9
4 changed files with 30 additions and 2 deletions

View File

@ -36,3 +36,15 @@
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: bottom; background-position: bottom;
} }
.navbar {
input[type="text"] {
margin-top: 7px;
margin-left: 1rem;
padding: 0 0.5rem;
}
.navbar-brand {
margin-top: -11px;
}
}

View File

@ -9,7 +9,7 @@ export default function torrents(state = {}, action) {
.filter(r => r.type === "torrent") .filter(r => r.type === "torrent")
.reduce((s, r) => ({ .reduce((s, r) => ({
...s, ...s,
[r.id]: { ...s[r.id], ...r } [r.id]: { ...state[r.id], ...r }
}), {}) }), {})
}; };
} }

View File

@ -5,6 +5,11 @@ export default function render(props) {
<span className="navbar-brand">receptor</span> <span className="navbar-brand">receptor</span>
<div className="navbar-collapse collapse"> <div className="navbar-collapse collapse">
<ul className="navbar-nav mr-auto"> <ul className="navbar-nav mr-auto">
<li className="nav-item">
<a className="nav-link" href="#">add torrent</a>
</li>
<li className="nav-item" style={{minWidth: "1rem"}}>
</li>
<li className="nav-item"> <li className="nav-item">
<a className="nav-link" href="#">all</a> <a className="nav-link" href="#">all</a>
</li> </li>
@ -14,6 +19,13 @@ export default function render(props) {
<li className="nav-item"> <li className="nav-item">
<a className="nav-link" href="#">seeding</a> <a className="nav-link" href="#">seeding</a>
</li> </li>
<form className="form-inline">
<input
className="form-control mr-sm-2"
type="text"
placeholder="Search"
aria-label="Search" />
</form>
</ul> </ul>
</div> </div>
</nav>; </nav>;

View File

@ -8,6 +8,7 @@ class TorrentTable extends Component {
<table className="table"> <table className="table">
<thead> <thead>
<tr> <tr>
<th style={{width: "1px"}}></th>
<th>name</th> <th>name</th>
<th>up</th> <th>up</th>
<th>down</th> <th>down</th>
@ -17,11 +18,14 @@ class TorrentTable extends Component {
{Object.values(torrents).map(t => {Object.values(torrents).map(t =>
<tr <tr
key={t.id} key={t.id}
className={`torrent ${"seeding" || t.status}`} className={`torrent ${t.status}`}
style={{ style={{
backgroundSize: `${t.progress * 100}% 3px` backgroundSize: `${t.progress * 100}% 3px`
}} }}
> >
<td>
<input type="checkbox" />
</td>
<td> <td>
<a href="#"> <a href="#">
{t.name} {t.name}