clean up help, report, and settings
This commit is contained in:
Jeremy Kauffman
Alex Liebowitz
parent
7b18774e81
commit
0d2775138a
6 changed files with 72 additions and 55 deletions
|
|
@ -7,36 +7,40 @@ var HelpPage = React.createClass({
|
|||
render: function() {
|
||||
return (
|
||||
<main className="page">
|
||||
<h3>Read the FAQ</h3>
|
||||
<p>Our FAQ answers many common questions.</p>
|
||||
<p><Link href="https://lbry.io/faq" label="Read the FAQ" icon="icon-help" button="alt"/></p>
|
||||
<h3>Get Live Help</h3>
|
||||
<p>
|
||||
Live help is available most hours in the #help channel of our Slack chat room.
|
||||
</p>
|
||||
<p>
|
||||
<Link button="alt" label="Join Our Slack" icon="icon-slack" href="https://slack.lbry.io" />
|
||||
</p>
|
||||
<h3>Common Issues</h3>
|
||||
<h4>Nothing seems to start downloading.</h4>
|
||||
<p>If you can't download anything, including 'wonderfullife', try forwarding ports 4444 and 3333 on your firewall or router. If you can access 'wonderfullife' but not other content, it's possible the content is not longer hosted on the network.</p>
|
||||
<section className="card">
|
||||
<h3>Read the FAQ</h3>
|
||||
<p>Our FAQ answers many common questions.</p>
|
||||
<p><Link href="https://lbry.io/faq" label="Read the FAQ" icon="icon-question" button="alt"/></p>
|
||||
</section>
|
||||
<section className="card">
|
||||
<h3>Get Live Help</h3>
|
||||
<p>
|
||||
Live help is available most hours in the #help channel of our Slack chat room.
|
||||
</p>
|
||||
<p>
|
||||
<Link button="alt" label="Join Our Slack" icon="icon-slack" href="https://slack.lbry.io" />
|
||||
</p>
|
||||
</section>
|
||||
<section className="card">
|
||||
<h3>Common Issues</h3>
|
||||
<h4>Nothing seems to start downloading.</h4>
|
||||
<p>If you can't download anything, including 'wonderfullife', try forwarding ports 4444 and 3333 on your firewall or router. If you can access 'wonderfullife' but not other content, it's possible the content is not longer hosted on the network.</p>
|
||||
|
||||
<h4>Videos have trouble playing.</h4>
|
||||
<p>Sometimes your video player will start the file while it's still empty. Try reloading the page after a few seconds and it may work. You should also see the file appear in your downloads folder (configured in <a href="/?settings">settings</a>).</p>
|
||||
<h4>Videos have trouble playing.</h4>
|
||||
<p>Sometimes your video player will start the file while it's still empty. Try reloading the page after a few seconds and it may work. You should also see the file appear in your downloads folder (configured in <a href="/?settings">settings</a>).</p>
|
||||
|
||||
<p>A real fix for this is underway!</p>
|
||||
<p>A real fix for this is underway!</p>
|
||||
|
||||
<h4>How do I turn LBRY off?</h4>
|
||||
<p>If you're on OS X you can find the app running in the notification area at the top right of your screen. Click the LBRY icon and choose <code>Quit</code>.</p>
|
||||
<h4>How do I turn LBRY off?</h4>
|
||||
<p>If you're on OS X you can find the app running in the notification area at the top right of your screen. Click the LBRY icon and choose <code>Quit</code>.</p>
|
||||
|
||||
<p>On Linux, you'll find a close button in the menu at the top right of LBRY.</p>
|
||||
<p>On Linux, you'll find a close button in the menu at the top right of LBRY.</p>
|
||||
|
||||
<p>If you're running LBRY from the command line, you may also close the app with the command <code>stop-lbrynet-daemon</code></p>
|
||||
|
||||
<h3>None of this applies to me, or it didn't work.</h3>
|
||||
<p>Please <Link href="/?report" label="send us a bug report" />. Thanks!</p>
|
||||
<section>
|
||||
<ReturnLink />
|
||||
<p>If you're running LBRY from the command line, you may also close the app with the command <code>stop-lbrynet-daemon</code></p>
|
||||
</section>
|
||||
<section className="card">
|
||||
<h3>None of this applies to me, or it didn't work.</h3>
|
||||
<p>Please <Link href="/?report" label="send us a bug report" />. Thanks!</p>
|
||||
</section>
|
||||
</main>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -13,6 +13,9 @@ var ReportPage = React.createClass({
|
|||
this._messageArea.value = '';
|
||||
}
|
||||
},
|
||||
componentDidMount: function() {
|
||||
document.title = "Report an Issue";
|
||||
},
|
||||
getInitialState: function() {
|
||||
return {
|
||||
submitting: false,
|
||||
|
|
@ -21,17 +24,15 @@ var ReportPage = React.createClass({
|
|||
render: function() {
|
||||
return (
|
||||
<main className="page">
|
||||
<h1>Report an Issue</h1>
|
||||
<section>
|
||||
<p>Please describe the problem you experienced and any information you think might be useful to us. Links to screenshots are great!</p>
|
||||
<textarea ref={(t) => this._messageArea = t} cols="50" rows="10" name="message" type="text"/>
|
||||
<div><button onClick={this.submitMessage} className={'button-block button-primary ' + (this.state.submitting ? 'disabled' : '')}>{this.state.submitting ? 'Submitting...' : 'Submit Report'}</button></div>
|
||||
<section className="card">
|
||||
<h3>Report an Issue</h3>
|
||||
<p>Please describe the problem you experienced and any information you think might be useful to us. Links to screenshots are great!</p>
|
||||
<textarea ref={(t) => this._messageArea = t} cols="50" rows="10" name="message" type="text"/>
|
||||
<div><button onClick={this.submitMessage} className={'button-block button-primary ' + (this.state.submitting ? 'disabled' : '')}>{this.state.submitting ? 'Submitting...' : 'Submit Report'}</button></div>
|
||||
</section>
|
||||
<section>
|
||||
Developers, feel free to instead <Link href="https://github.com/lbryio/lbry/issues" label="submit an issue on GitHub"/>.
|
||||
</section>
|
||||
<section>
|
||||
<ReturnLink href="/?help" label="Return to Help"/>
|
||||
<section className="card">
|
||||
<h3>Developer?</h3>
|
||||
You can also <Link href="https://github.com/lbryio/lbry/issues" label="submit an issue on GitHub"/>.
|
||||
</section>
|
||||
</main>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -76,19 +76,20 @@ var SettingsPage = React.createClass({
|
|||
}
|
||||
|
||||
return (
|
||||
<main className="page">
|
||||
<section>
|
||||
<h4>Run on startup</h4>
|
||||
<main>
|
||||
<section className="card">
|
||||
<h3>Run on startup</h3>
|
||||
<label style={settingsCheckBoxOptionStyles}>
|
||||
<input type="checkbox" onChange={this.onRunOnStartChange} defaultChecked={this.state.settings.run_on_startup} /> Run LBRY automatically when I start my computer
|
||||
</label>
|
||||
</section>
|
||||
<section>
|
||||
<h4>Download directory</h4>
|
||||
<section className="card">
|
||||
<h3>Download directory</h3>
|
||||
<div className="help">Where would you like the files you download from LBRY to be saved?</div>
|
||||
<input style={downloadDirectoryFieldStyles} type="text" name="download_directory" defaultValue={this.state.settings.download_directory} onChange={this.onDownloadDirChange}/>
|
||||
</section>
|
||||
<section>
|
||||
<section className="card">
|
||||
<h3>Bandwidth Limits</h3>
|
||||
<h4>Max Upload</h4>
|
||||
<label style={settingsRadioOptionStyles}>
|
||||
<input type="radio" name="max_upload_pref" onChange={this.onMaxUploadPrefChange.bind(this, false)} defaultChecked={!this.state.isMaxUpload}/> Unlimited
|
||||
|
|
@ -97,8 +98,6 @@ var SettingsPage = React.createClass({
|
|||
<input type="radio" name="max_upload_pref" onChange={this.onMaxUploadPrefChange.bind(this, true)} defaultChecked={this.state.isMaxUpload}/> { this.state.isMaxUpload ? 'Up to' : 'Choose limit...' }
|
||||
<span className={ this.state.isMaxUpload ? '' : 'hidden'}> <input type="number" min="0" step=".5" defaultValue={this.state.settings.max_upload} style={settingsNumberFieldStyles} onChange={this.onMaxUploadFieldChange}/> MB/s</span>
|
||||
</label>
|
||||
</section>
|
||||
<section>
|
||||
<h4>Max Download</h4>
|
||||
<label style={settingsRadioOptionStyles}>
|
||||
<input type="radio" name="max_download_pref" onChange={this.onMaxDownloadPrefChange.bind(this, false)} defaultChecked={!this.state.isMaxDownload}/> Unlimited
|
||||
|
|
@ -108,20 +107,12 @@ var SettingsPage = React.createClass({
|
|||
<span className={ this.state.isMaxDownload ? '' : 'hidden'}> <input type="number" min="0" step=".5" defaultValue={this.state.settings.max_download} style={settingsNumberFieldStyles} onChange={this.onMaxDownloadFieldChange}/> MB/s</span>
|
||||
</label>
|
||||
</section>
|
||||
<section>
|
||||
<h4>Share diagnostic data</h4>
|
||||
<section className="card">
|
||||
<h3>Share diagnostic data</h3>
|
||||
<label style={settingsCheckBoxOptionStyles}>
|
||||
<input type="checkbox" onChange={this.onShareDataChange} defaultChecked={this.state.settings.upload_log} /> Help make LBRY better by contributing diagnostic data about my usage
|
||||
</label>
|
||||
</section>
|
||||
<section>
|
||||
<h4>Claim invite code</h4>
|
||||
<Link href="?claim" label="Claim a LBRY beta invite code"/>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<ReturnLink />
|
||||
</section>
|
||||
</main>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -103,6 +103,10 @@ var WalletPage = React.createClass({
|
|||
<main className="page">
|
||||
<NewAddressSection />
|
||||
<SendToAddressSection />
|
||||
<section>
|
||||
<h4>Claim invite code</h4>
|
||||
<Link href="?claim" label="Claim a LBRY beta invite code"/>
|
||||
</section>
|
||||
<section>
|
||||
<ReturnLink />
|
||||
</section>
|
||||
|
|
|
|||
|
|
@ -64,13 +64,16 @@ body
|
|||
height: $header-height;
|
||||
padding: $spacing-vertical / 2;
|
||||
h1 { font-size: 1.8em; line-height: $header-height; }
|
||||
margin-bottom: $spacing-vertical;
|
||||
}
|
||||
|
||||
#main-content
|
||||
{
|
||||
background: $color-canvas;
|
||||
min-height: 100vh;
|
||||
main
|
||||
{
|
||||
padding: $spacing-vertical;
|
||||
}
|
||||
}
|
||||
|
||||
$header-icon-size: 1.5em;
|
||||
|
|
@ -89,13 +92,23 @@ $header-icon-size: 1.5em;
|
|||
padding: 0 6px 0 18px;
|
||||
}
|
||||
|
||||
.page {
|
||||
.card {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
max-width: 800px;
|
||||
padding: $spacing-vertical;
|
||||
background: $color-bg;
|
||||
h3, h4
|
||||
{
|
||||
margin-bottom: $spacing-vertical / 2;
|
||||
margin-top: $spacing-vertical;
|
||||
&:first-child
|
||||
{
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.full-screen
|
||||
{
|
||||
width: 100%;
|
||||
|
|
|
|||
|
|
@ -59,6 +59,10 @@ label {
|
|||
p
|
||||
{
|
||||
margin-bottom: 0.8em;
|
||||
&:last-child
|
||||
{
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
textarea {
|
||||
|
|
|
|||
Loading…
Reference in a new issue