From 782c7cf77b5ba3da5360cc11c85d1399efbee438 Mon Sep 17 00:00:00 2001
From: Vitaly Takmazov
Date: Thu, 28 Jun 2018 20:03:55 +0300
Subject: fix settings layout

---
 vnext/src/components/Settings.js | 342 +++++++++++++++++++--------------------
 1 file changed, 171 insertions(+), 171 deletions(-)

(limited to 'vnext/src/components/Settings.js')

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, &lt;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 &quot;http://&quot;</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, &lt;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 &quot;http://&quot;</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} />
-                                &nbsp;Reply notifications (&quot;Message posted&quot;)
+                <form onSubmit={this.updateNotificationSettings}>
+                    <fieldset>
+                        <legend>Notification options</legend>
+                        <p>
+                            <input type="checkbox" name="jnotify" checked={settings.repliesEnabled} />
+                            &nbsp;Reply notifications (&quot;Message posted&quot;)
                             </p>
-                            <p><input type="checkbox" name="subscr_notify" checked={settings.subscriptionsEnabled} />
-                                &nbsp;Subscriptions notifications (&quot;@user subscribed...&quot;)
+                        <p><input type="checkbox" name="subscr_notify" checked={settings.subscriptionsEnabled} />
+                            &nbsp;Subscriptions notifications (&quot;@user subscribed...&quot;)
                             </p>
-                            <p><input type="checkbox" name="recomm" checked={settings.recommendationsEnabled} />
-                                &nbsp;Posts recommendations (&quot;Recommended by @user&quot;)
+                        <p><input type="checkbox" name="recomm" checked={settings.recommendationsEnabled} />
+                            &nbsp;Posts recommendations (&quot;Recommended by @user&quot;)
                             </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> &mdash;
-                <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>
-                                            &mdash; <a href="#"
-                                                onclick="alert(\'To confirm, please send &quot;AUTH {{ auth.getAuthCode() }}&quot; (without quotes) from this account to &quot;juick@juick.com&quot;.\'); 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> &mdash;
+                <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>
+                                        &mdash; <a href="#"
+                                            onclick="alert(\'To confirm, please send &quot;AUTH {{ auth.getAuthCode() }}&quot; (without quotes) from this account to &quot;juick@juick.com&quot;.\'); 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>&nbsp;</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>&nbsp;</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> &mdash;
+                    {facebook.connected ? (
+                        facebook.crosspostEnabled ?
+                            <form action="/settings" method="post">
+                                <div>
+                                    Facebook: <b>Enabled</b> &mdash;
                 <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> &mdash;
+                                    <input type="submit" value="  Disable  " />
+                                </div>
+                            </form>
+                            :
+                            <form action="/settings" method="post">
+                                <div>
+                                    Facebook: <b>Disabled</b> &mdash;
                 <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> &mdash;
+                                    <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> &mdash;
             <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
-- 
cgit v1.2.3