diff options
author | 2018-06-28 20:03:55 +0300 | |
---|---|---|
committer | 2023-01-13 10:37:53 +0300 | |
commit | 782c7cf77b5ba3da5360cc11c85d1399efbee438 (patch) | |
tree | e7b7c01fd218869f763317c7021ad333e5e0252d | |
parent | e58b1a6c4b714ed602d2545c89accaa5349520f0 (diff) |
fix settings layout
-rw-r--r-- | vnext/src/components/Settings.js | 342 |
1 files changed, 171 insertions, 171 deletions
diff --git a/vnext/src/components/Settings.js b/vnext/src/components/Settings.js index fc28c3b5..95f7e60d 100644 --- a/vnext/src/components/Settings.js +++ b/vnext/src/components/Settings.js @@ -12,204 +12,204 @@ export default class Settings extends React.Component { render() { const { settings, userinfo, facebook } = this.state; return ( - <div id="content"> - <article> - <h1>Settings</h1> - <form> - <p>Avatar: <input type="file" name="avatar" /><br /> - <small>Recommendations: PNG, 96x96, <50Kb. Also, JPG and GIF supported.</small></p> - <p><input type="hidden" name="page" value="about" /><input type="submit" value=" OK " /></p> - <p>Full name: <input type="text" name="fullname" value={userinfo.fullName} /></p> - <p>Country: <input type="text" name="country" value={userinfo.country} /></p> - <p>URL: <input type="text" name="url" value={userinfo.url} size="32" /><br /> - <small>Please, start with "http://"</small></p> - <p>About:<br /> - <input type="text" name="descr" value={userinfo.description} style={{ width: '100%' }} /><br /> - <small>Max. 255 symbols</small></p> + <article> + <h1>Settings</h1> + <form> + <p>Avatar: <input type="file" name="avatar" /><br /> + <small>Recommendations: PNG, 96x96, <50Kb. Also, JPG and GIF supported.</small></p> + <p><input type="hidden" name="page" value="about" /><input type="submit" value=" OK " /></p> + <p>Full name: <input type="text" name="fullname" value={userinfo.fullName} /></p> + <p>Country: <input type="text" name="country" value={userinfo.country} /></p> + <p>URL: <input type="text" name="url" value={userinfo.url} size="32" /><br /> + <small>Please, start with "http://"</small></p> + <p>About:<br /> + <input type="text" name="descr" value={userinfo.description} style={{ width: '100%' }} /><br /> + <small>Max. 255 symbols</small></p> + </form> + <fieldset> + <legend>Changing your password</legend> + <form onSubmit={this.updatePassword}> + <input type="hidden" name="page" value="password" /> + <p>Change password: <input type="password" name="password" size="8" value={settings.password} /> + <input type="submit" value=" Update " /><br /> + <i>(max. length - 16 symbols)</i></p> </form> - <fieldset> - <legend>Changing your password</legend> - <form onSubmit={this.updatePassword}> - <input type="hidden" name="page" value="password" /> - <p>Change password: <input type="password" name="password" size="8" value={settings.password} /> - <input type="submit" value=" Update " /><br /> - <i>(max. length - 16 symbols)</i></p> - </form> - </fieldset> + </fieldset> - <form onSubmit={this.updateNotificationSettings}> - <fieldset> - <legend>Notification options</legend> - <p> - <input type="checkbox" name="jnotify" checked={settings.repliesEnabled} /> - Reply notifications ("Message posted") + <form onSubmit={this.updateNotificationSettings}> + <fieldset> + <legend>Notification options</legend> + <p> + <input type="checkbox" name="jnotify" checked={settings.repliesEnabled} /> + Reply notifications ("Message posted") </p> - <p><input type="checkbox" name="subscr_notify" checked={settings.subscriptionsEnabled} /> - Subscriptions notifications ("@user subscribed...") + <p><input type="checkbox" name="subscr_notify" checked={settings.subscriptionsEnabled} /> + Subscriptions notifications ("@user subscribed...") </p> - <p><input type="checkbox" name="recomm" checked={settings.recommendationsEnabled} /> - Posts recommendations ("Recommended by @user") + <p><input type="checkbox" name="recomm" checked={settings.recommendationsEnabled} /> + Posts recommendations ("Recommended by @user") </p> - <p><input type="submit" value=" OK " /></p> - </fieldset> - </form> - <fieldset> - <legend style={{ - background: 'url(//telegram.org/favicon.ico?3) no-repeat', - paddingLeft: '58px', lineHeight: '48px' - }}>Telegram</legend> - {settings.telegramName ? ( - <form action="/settings" method="post"> - <div>Telegram: <b>{{ telegram_name }}</b> — - <input type="hidden" name="page" value="telegram-del" /> - <input type="submit" value=" Disable " /> - </div> - </form> - ) : ( - <p>To connect Telegram account: send any text message to <a href="https://telegram.me/Juick_bot">@Juick_bot</a> - </p> - )} + <p><input type="submit" value=" OK " /></p> </fieldset> - {settings.jids && ( - <form> - <fieldset> - <legend style={{ - background: 'url(//static.juick.com/settings/xmpp.png) no-repeat', - paddingLeft: '58px', lineHeight: '48px' - }}>XMPP accounts - </legend> - <p>Your accounts:</p> - <p> - { - settings.jids.map(jid => - <React.Fragment> - <label><input type="radio" name="delete" value={jid} />${jid}</label><br /> - </React.Fragment> - ) - } - {settings.auths.map(auth => - <React.Fragment> - <label><input type="radio" name="delete" - value={auth.account} />{auth.account}</label> - — <a href="#" - onclick="alert(\'To confirm, please send "AUTH {{ auth.getAuthCode() }}" (without quotes) from this account to "juick@juick.com".\'); return false;">Confirm</a><br /> - </React.Fragment> - )} - </p> - {settings.jids && settings.jids.length > 1( - <p><input type="hidden" name="page" value="jid-del" /><input type="submit" value=" Delete " /></p> - )} - <p>To add new jabber account: send any text message to <a href="xmpp:juick@juick.com?message;body=login">juick@juick.com</a> - </p> - </fieldset> + </form> + <fieldset> + <legend style={{ + background: 'url(//telegram.org/favicon.ico?3) no-repeat', + paddingLeft: '58px', lineHeight: '48px' + }}>Telegram</legend> + {settings.telegramName ? ( + <form action="/settings" method="post"> + <div>Telegram: <b>{{ telegram_name }}</b> — + <input type="hidden" name="page" value="telegram-del" /> + <input type="submit" value=" Disable " /> + </div> </form> - )} - <fieldset> - <legend style={{ - background: 'url(//static.juick.com/settings/email.png) no-repeat', - paddingLeft: '58px', - lineHeight: '48px' - }}>E-mail</legend> - <form> - <p>Add account:<br /> - <input type="text" name="account" /> - <input type="hidden" name="page" value="email-add" /> - <input type="submit" value=" Add " /> + ) : ( + <p>To connect Telegram account: send any text message to <a href="https://telegram.me/Juick_bot">@Juick_bot</a> </p> - </form> - <form> + )} + </fieldset> + {settings.jids && ( + <form> + <fieldset> + <legend style={{ + background: 'url(//static.juick.com/settings/xmpp.png) no-repeat', + paddingLeft: '58px', lineHeight: '48px' + }}>XMPP accounts + </legend> <p>Your accounts:</p> <p> { - settings.emails ? settings.emails.map(email => + settings.jids.map(jid => <React.Fragment> - <label> - <input type="radio" name="account" value="{{ email }}" />{{ email }} - </label> - <br /> - {settings.emails.length > 1 && - <p><input type="hidden" name="page" value="email-del" /><input type="submit" value=" Delete " /></p> - } + <label><input type="radio" name="delete" value={jid} />${jid}</label><br /> </React.Fragment> - ) : `-` + ) } + {settings.auths.map(auth => + <React.Fragment> + <label><input type="radio" name="delete" + value={auth.account} />{auth.account}</label> + — <a href="#" + onclick="alert(\'To confirm, please send "AUTH {{ auth.getAuthCode() }}" (without quotes) from this account to "juick@juick.com".\'); return false;">Confirm</a><br /> + </React.Fragment> + )} </p> - </form> - {settings.emails && - <React.Fragment> - {/** email_off **/} - <form> - You can receive notifications to email:<br /> - Sent to <select name="account"> - <option value="">Disabled</option> - {email.map(email => - <option value={email} selected={email.active == email}> - {email} - </option> - )} - </select> - <input type="hidden" name="page" value="email-subscr" /> - <input type="submit" value="OK" /> - </form> - {/** /email_off **/} - <p> </p> - <p>You can post to Juick via e-mail. Send your <span style="text-decoration: underline">plain text</span> - messages to <span><a href="mailto:juick@juick.com">juick@juick.com</a></span>. You can attach one photo or video file.</p> - </React.Fragment> - } - </fieldset> - <fieldset> - <legend style={{ - background: 'url(//static.juick.com/settings/facebook.png) no-repeat', - paddingLeft: '58px', lineHeight: '48px' - }}> - Facebook + {settings.jids && settings.jids.length > 1( + <p><input type="hidden" name="page" value="jid-del" /><input type="submit" value=" Delete " /></p> + )} + <p>To add new jabber account: send any text message to <a href="xmpp:juick@juick.com?message;body=login">juick@juick.com</a> + </p> + </fieldset> + </form> + )} + <fieldset> + <legend style={{ + background: 'url(//static.juick.com/settings/email.png) no-repeat', + paddingLeft: '58px', + lineHeight: '48px' + }}>E-mail</legend> + <form> + <p>Add account:<br /> + <input type="text" name="account" /> + <input type="hidden" name="page" value="email-add" /> + <input type="submit" value=" Add " /> + </p> + </form> + <form> + <p>Your accounts:</p> + <p> + { + settings.emails ? settings.emails.map(email => + <React.Fragment> + <label> + <input type="radio" name="account" value="{{ email }}" />{{ email }} + </label> + <br /> + {settings.emails.length > 1 && + <p><input type="hidden" name="page" value="email-del" /><input type="submit" value=" Delete " /></p> + } + </React.Fragment> + ) : `-` + } + </p> + </form> + {settings.emails && + <React.Fragment> + {/** email_off **/} + <form> + You can receive notifications to email:<br /> + Sent to <select name="account"> + <option value="">Disabled</option> + {email.map(email => + <option value={email} selected={email.active == email}> + {email} + </option> + )} + </select> + <input type="hidden" name="page" value="email-subscr" /> + <input type="submit" value="OK" /> + </form> + {/** /email_off **/} + <p> </p> + <p>You can post to Juick via e-mail. Send your <span style="text-decoration: underline">plain text</span> + messages to <span><a href="mailto:juick@juick.com">juick@juick.com</a></span>. You can attach one photo or video file.</p> + </React.Fragment> + } + </fieldset> + <fieldset> + <legend style={{ + background: 'url(//static.juick.com/settings/facebook.png) no-repeat', + paddingLeft: '58px', lineHeight: '48px' + }}> + Facebook </legend> - {facebook.connected ? ( - facebook.crosspostEnabled ? - <form action="/settings" method="post"> - <div> - Facebook: <b>Enabled</b> — + {facebook.connected ? ( + facebook.crosspostEnabled ? + <form action="/settings" method="post"> + <div> + Facebook: <b>Enabled</b> — <input type="hidden" name="page" value="facebook-disable" /> - <input type="submit" value=" Disable " /> - </div> - </form> - : - <form action="/settings" method="post"> - <div> - Facebook: <b>Disabled</b> — + <input type="submit" value=" Disable " /> + </div> + </form> + : + <form action="/settings" method="post"> + <div> + Facebook: <b>Disabled</b> — <input type="hidden" name="page" value="facebook-enable" /> - <input type="submit" value=" Enable " /> - </div> - </form> - ) : ( - <p>Cross-posting to Facebook: + <input type="submit" value=" Enable " /> + </div> + </form> + ) : ( + <p>Cross-posting to Facebook: <a href="/_fblogin"> - <img src="//static.juick.com/facebook-connect.png" alt="Connect to Facebook" /> - </a> - </p> - )} - </fieldset> - <fieldset> - <legend style={{background: 'url(//static.juick.com/settings/twitter.png) no-repeat', - paddingLeft: '58px', lineHeight: '48px'}}> - Twitter</legend> - { settings.twitter_name ? - <form action="/settings" method="post"> - <div>Twitter: <b>{ settings.twitter_name }</b> — + <img src="//static.juick.com/facebook-connect.png" alt="Connect to Facebook" /> + </a> + </p> + )} + </fieldset> + <fieldset> + <legend style={{ + background: 'url(//static.juick.com/settings/twitter.png) no-repeat', + paddingLeft: '58px', lineHeight: '48px' + }}> + Twitter</legend> + {settings.twitter_name ? + <form action="/settings" method="post"> + <div>Twitter: <b>{settings.twitter_name}</b> — <input type="hidden" name="page" value="twitter-del" /> <input type="submit" value=" Disable " /> </div> </form> : - <p>Cross-posting to Twitter: <a href="/_twitter"><img src="//static.juick.com/twitter-connect.png" + <p>Cross-posting to Twitter: <a href="/_twitter"><img src="//static.juick.com/twitter-connect.png" alt="Connect to Twitter" /></a></p> - } - </fieldset> + } + </fieldset> - </article> - </div > + </article> ) } }
\ No newline at end of file |