simplify login form

This commit is contained in:
Andrew Dolgov 2019-02-19 14:27:53 +03:00
parent 848bb6579c
commit 4f720f906e
8 changed files with 237 additions and 219 deletions

View File

@ -914,43 +914,51 @@ body.ttrss_main #feedEditDlg img.feedIcon {
height: auto; height: auto;
width: auto; width: auto;
} }
body.ttrss_login { body.ttrss_login .container {
padding: 2em; background: #f5f5f5;
font-size: 14px; color: black;
display: flex;
flex-direction: column;
width: 100%;
height: 100%;
position: absolute;
} }
body.ttrss_login fieldset { body.ttrss_login .container .footer {
margin-left: auto; text-align: center;
margin-right: auto; padding: 10px;
display: block;
width: 400px;
border-width: 0px;
} }
body.ttrss_login label { body.ttrss_login .container .center {
width: 100%;
display: flex;
align-items: center;
flex-grow: 1;
justify-content: center;
}
body.ttrss_login .container .center .login-form {
background: white;
padding: 20px;
border: 1px solid #ddd;
box-shadow: 0px 1px 1px -1px rgba(0, 0, 0, 0.1);
}
body.ttrss_login .container .center .login-form form {
margin: 0px;
}
body.ttrss_login fieldset > label:first-of-type {
width: 120px; width: 120px;
margin-right: 20px; margin-right: 20px;
display: inline-block; display: inline-block;
text-align: right; text-align: right;
color: gray; font-weight: bold;
} }
body.ttrss_login div.header { body.ttrss_login fieldset {
border: 0px solid #257aa7; border-width: 0;
border-bottom-width: 1px; padding: 5px 0px;
margin-bottom: 1em;
padding-bottom: 5px;
} }
body.ttrss_login div.footer { body.ttrss_login fieldset.narrow {
margin-top: 1em; padding: 2px 0px;
padding-top: 5px;
border: 0px solid #257aa7;
border-top-width: 1px;
text-align: center;
color: gray;
font-size: 12px;
} }
body.ttrss_login a.forgotpass { body.ttrss_login fieldset.align-right {
text-align: right; text-align: right;
font-size: 11px;
display: inline-block;
} }
body.ttrss_login a { body.ttrss_login a {
color: #257aa7; color: #257aa7;
@ -968,12 +976,7 @@ body.ttrss_login div.footer a:hover {
color: #257aa7; color: #257aa7;
} }
body.ttrss_login div.row { body.ttrss_login div.row {
padding: 0px 0px 5px 0px; padding-bottom: 5px;
}
body.ttrss_login div.row-error {
color: red;
text-align: center;
padding: 0px 0px 5px 0px;
} }
body.ttrss_main .dijitDialog h1:first-of-type, body.ttrss_main .dijitDialog h1:first-of-type,
body.ttrss_main .dijitDialog h2:first-of-type, body.ttrss_main .dijitDialog h2:first-of-type,

File diff suppressed because one or more lines are too long

View File

@ -1086,46 +1086,60 @@ body.ttrss_main {
} }
body.ttrss_login { body.ttrss_login {
padding : 2em;
font-size : 14px;
fieldset { .container {
margin-left : auto; background : @color-panel-bg;
margin-right : auto; color : @default-fg;
display : block; display : flex;
width : 400px; flex-direction: column;
border-width : 0px; width : 100%;
height : 100%;
position : absolute;
.footer {
text-align : center;
padding : 10px;
} }
label { .center {
width : 100%;
display : flex;
align-items: center;
flex-grow : 1;
justify-content : center;
.login-form {
form {
margin : 0px;
}
background : white;
padding : 20px;
border : 1px solid #ddd;
box-shadow : 0px 1px 1px -1px rgba(0,0,0,0.1);
}
}
}
fieldset > label:first-of-type {
width : 120px; width : 120px;
margin-right : 20px; margin-right : 20px;
display : inline-block; display : inline-block;
text-align : right; text-align : right;
color : gray; font-weight : bold;
} }
div.header { fieldset {
border: 0px solid @color-accent; border-width : 0;
border-bottom-width: 1px; padding : 5px 0px;
margin-bottom : 1em;
padding-bottom : 5px;
} }
div.footer { fieldset.narrow {
margin-top : 1em; padding : 2px 0px;
padding-top : 5px;
border: 0px solid @color-accent;
border-top-width: 1px;
text-align : center;
color : gray;
font-size : 12px;
} }
a.forgotpass { fieldset.align-right {
text-align : right; text-align : right;
font-size : 11px;
display : inline-block;
} }
a { a {
@ -1148,13 +1162,7 @@ body.ttrss_login {
} }
div.row { div.row {
padding : 0px 0px 5px 0px; padding-bottom : 5px;
}
div.row-error {
color : red;
text-align : center;
padding : 0px 0px 5px 0px;
} }
} }

101
include/login_form.php Normal file → Executable file
View File

@ -62,62 +62,56 @@ function bwLimitChange(elem) {
<?php $return = urlencode($_SERVER["REQUEST_URI"]) ?> <?php $return = urlencode($_SERVER["REQUEST_URI"]) ?>
<form action="public.php?return=<?php echo $return ?>" <div class="container">
dojoType="dijit.form.Form" method="POST" id="loginForm" name="loginForm">
<input dojoType="dijit.form.TextBox" style="display : none" name="op" value="login"> <div class="center">
<div class="login-form">
<div class='header'> <form action="public.php?return=<?php echo $return ?>"
<img src="images/logo_wide.png"> dojoType="dijit.form.Form" method="POST">
</div>
<div class='form'> <?php print_hidden("op", "login"); ?>
<fieldset>
<?php if ($_SESSION["login_error_msg"]) { ?> <?php if ($_SESSION["login_error_msg"]) { ?>
<div class="row-error"> <?php echo format_error($_SESSION["login_error_msg"]) ?>
<?php echo $_SESSION["login_error_msg"] ?>
</div>
<?php $_SESSION["login_error_msg"] = ""; ?> <?php $_SESSION["login_error_msg"] = ""; ?>
<?php } ?> <?php } ?>
<div class="row">
<fieldset>
<label><?php echo __("Login:") ?></label> <label><?php echo __("Login:") ?></label>
<input name="login" id="login" dojoType="dijit.form.TextBox" type="text" <input name="login" id="login" dojoType="dijit.form.TextBox" type="text"
onchange="fetchProfiles()" onfocus="fetchProfiles()" onblur="fetchProfiles()" onchange="fetchProfiles()" onfocus="fetchProfiles()" onblur="fetchProfiles()"
style="width : 220px" required="1" value="<?php echo $_SESSION["fake_login"] ?>" />
required="1" </fieldset>
value="<?php echo $_SESSION["fake_login"] ?>" />
</div>
<fieldset>
<div class="row">
<label><?php echo __("Password:") ?></label> <label><?php echo __("Password:") ?></label>
<input type="password" name="password" required="1" <input type="password" name="password" required="1"
dojoType="dijit.form.TextBox" dojoType="dijit.form.TextBox"
style="width : 220px" class="input input-text" class="input input-text"
value="<?php echo $_SESSION["fake_password"] ?>"/> value="<?php echo $_SESSION["fake_password"] ?>"/>
<label></label>
<?php if (strpos(PLUGINS, "auth_internal") !== FALSE) { ?> <?php if (strpos(PLUGINS, "auth_internal") !== FALSE) { ?>
<a class='forgotpass' href="public.php?op=forgotpass"><?php echo __("I forgot my password") ?></a> <a href="public.php?op=forgotpass"><?php echo __("I forgot my password") ?></a>
<?php } ?> <?php } ?>
</div> </fieldset>
<fieldset>
<div class="row">
<label><?php echo __("Profile:") ?></label> <label><?php echo __("Profile:") ?></label>
<select disabled='disabled' name="profile" id="profile" dojoType='dijit.form.Select' <select disabled='disabled' name="profile" id="profile" dojoType='dijit.form.Select'>
style='width : 220px; margin : 0px'> <option><?php echo __("Default profile") ?></option>
<option><?php echo __("Default profile") ?></option></select> </select>
</fieldset>
</div> <fieldset class="narrow">
<label> </label>
<div class="row"> <label id="bw_limit_label"><input dojoType="dijit.form.CheckBox" name="bw_limit" id="bw_limit"
<label>&nbsp;</label> type="checkbox" onchange="bwLimitChange(this)">
<input dojoType="dijit.form.CheckBox" name="bw_limit" id="bw_limit" type="checkbox" <?php echo __("Use less traffic") ?></label>
onchange="bwLimitChange(this)"> </fieldset>
<label id="bw_limit_label" style='display : inline' for="bw_limit"><?php echo __("Use less traffic") ?></label>
</div>
<div dojoType="dijit.Tooltip" connectId="bw_limit_label" position="below" style="display:none"> <div dojoType="dijit.Tooltip" connectId="bw_limit_label" position="below" style="display:none">
<?php echo __("Does not display images in articles, reduces automatic refreshes."); ?> <?php echo __("Does not display images in articles, reduces automatic refreshes."); ?>
@ -125,32 +119,39 @@ function bwLimitChange(elem) {
<?php if (SESSION_COOKIE_LIFETIME > 0) { ?> <?php if (SESSION_COOKIE_LIFETIME > 0) { ?>
<div class="row"> <fieldset class="narrow">
<label>&nbsp;</label> <label> </label>
<label>
<input dojoType="dijit.form.CheckBox" name="remember_me" id="remember_me" type="checkbox"> <input dojoType="dijit.form.CheckBox" name="remember_me" id="remember_me" type="checkbox">
<label style='display : inline' for="remember_me"><?php echo __("Remember me") ?></label> <?php echo __("Remember me") ?>
</div> </label>
</fieldset>
<?php } ?> <?php } ?>
<div class="row" style='text-align : right'> <hr/>
<button dojoType="dijit.form.Button" type="submit"><?php echo __('Log in') ?></button>
<fieldset class="align-right">
<label> </label>
<button dojoType="dijit.form.Button" type="submit" class="alt-primary"><?php echo __('Log in') ?></button>
<?php if (defined('ENABLE_REGISTRATION') && ENABLE_REGISTRATION) { ?> <?php if (defined('ENABLE_REGISTRATION') && ENABLE_REGISTRATION) { ?>
<button onclick="return gotoRegForm()" dojoType="dijit.form.Button"> <button onclick="return gotoRegForm()" dojoType="dijit.form.Button">
<?php echo __("Create new account") ?></button> <?php echo __("Create new account") ?></button>
<?php } ?> <?php } ?>
</div>
</fieldset> </fieldset>
</form>
</div>
</div>
<div class="footer">
<a href="https://tt-rss.org/">Tiny Tiny RSS</a>
&copy; 2005&ndash;<?php echo date('Y') ?> <a href="https://fakecake.org/">Andrew Dolgov</a>
</div>
</div> </div>
<div class='footer'> </body>
<a href="http://tt-rss.org/">Tiny Tiny RSS</a> </html>
&copy; 2005&ndash;<?php echo date('Y') ?> <a href="http://fakecake.org/">Andrew Dolgov</a>
</div>
</form>
</body></html>

View File

@ -915,43 +915,51 @@ body.ttrss_main #feedEditDlg img.feedIcon {
height: auto; height: auto;
width: auto; width: auto;
} }
body.ttrss_login { body.ttrss_login .container {
padding: 2em; background: #222;
font-size: 14px; color: #ccc;
display: flex;
flex-direction: column;
width: 100%;
height: 100%;
position: absolute;
} }
body.ttrss_login fieldset { body.ttrss_login .container .footer {
margin-left: auto; text-align: center;
margin-right: auto; padding: 10px;
display: block;
width: 400px;
border-width: 0px;
} }
body.ttrss_login label { body.ttrss_login .container .center {
width: 100%;
display: flex;
align-items: center;
flex-grow: 1;
justify-content: center;
}
body.ttrss_login .container .center .login-form {
background: white;
padding: 20px;
border: 1px solid #ddd;
box-shadow: 0px 1px 1px -1px rgba(0, 0, 0, 0.1);
}
body.ttrss_login .container .center .login-form form {
margin: 0px;
}
body.ttrss_login fieldset > label:first-of-type {
width: 120px; width: 120px;
margin-right: 20px; margin-right: 20px;
display: inline-block; display: inline-block;
text-align: right; text-align: right;
color: gray; font-weight: bold;
} }
body.ttrss_login div.header { body.ttrss_login fieldset {
border: 0px solid #b87d2c; border-width: 0;
border-bottom-width: 1px; padding: 5px 0px;
margin-bottom: 1em;
padding-bottom: 5px;
} }
body.ttrss_login div.footer { body.ttrss_login fieldset.narrow {
margin-top: 1em; padding: 2px 0px;
padding-top: 5px;
border: 0px solid #b87d2c;
border-top-width: 1px;
text-align: center;
color: gray;
font-size: 12px;
} }
body.ttrss_login a.forgotpass { body.ttrss_login fieldset.align-right {
text-align: right; text-align: right;
font-size: 11px;
display: inline-block;
} }
body.ttrss_login a { body.ttrss_login a {
color: #b87d2c; color: #b87d2c;
@ -969,12 +977,7 @@ body.ttrss_login div.footer a:hover {
color: #b87d2c; color: #b87d2c;
} }
body.ttrss_login div.row { body.ttrss_login div.row {
padding: 0px 0px 5px 0px; padding-bottom: 5px;
}
body.ttrss_login div.row-error {
color: red;
text-align: center;
padding: 0px 0px 5px 0px;
} }
body.ttrss_main .dijitDialog h1:first-of-type, body.ttrss_main .dijitDialog h1:first-of-type,
body.ttrss_main .dijitDialog h2:first-of-type, body.ttrss_main .dijitDialog h2:first-of-type,

File diff suppressed because one or more lines are too long

View File

@ -915,43 +915,51 @@ body.ttrss_main #feedEditDlg img.feedIcon {
height: auto; height: auto;
width: auto; width: auto;
} }
body.ttrss_login { body.ttrss_login .container {
padding: 2em; background: #222;
font-size: 14px; color: #ccc;
display: flex;
flex-direction: column;
width: 100%;
height: 100%;
position: absolute;
} }
body.ttrss_login fieldset { body.ttrss_login .container .footer {
margin-left: auto; text-align: center;
margin-right: auto; padding: 10px;
display: block;
width: 400px;
border-width: 0px;
} }
body.ttrss_login label { body.ttrss_login .container .center {
width: 100%;
display: flex;
align-items: center;
flex-grow: 1;
justify-content: center;
}
body.ttrss_login .container .center .login-form {
background: white;
padding: 20px;
border: 1px solid #ddd;
box-shadow: 0px 1px 1px -1px rgba(0, 0, 0, 0.1);
}
body.ttrss_login .container .center .login-form form {
margin: 0px;
}
body.ttrss_login fieldset > label:first-of-type {
width: 120px; width: 120px;
margin-right: 20px; margin-right: 20px;
display: inline-block; display: inline-block;
text-align: right; text-align: right;
color: gray; font-weight: bold;
} }
body.ttrss_login div.header { body.ttrss_login fieldset {
border: 0px solid #257aa7; border-width: 0;
border-bottom-width: 1px; padding: 5px 0px;
margin-bottom: 1em;
padding-bottom: 5px;
} }
body.ttrss_login div.footer { body.ttrss_login fieldset.narrow {
margin-top: 1em; padding: 2px 0px;
padding-top: 5px;
border: 0px solid #257aa7;
border-top-width: 1px;
text-align: center;
color: gray;
font-size: 12px;
} }
body.ttrss_login a.forgotpass { body.ttrss_login fieldset.align-right {
text-align: right; text-align: right;
font-size: 11px;
display: inline-block;
} }
body.ttrss_login a { body.ttrss_login a {
color: #257aa7; color: #257aa7;
@ -969,12 +977,7 @@ body.ttrss_login div.footer a:hover {
color: #257aa7; color: #257aa7;
} }
body.ttrss_login div.row { body.ttrss_login div.row {
padding: 0px 0px 5px 0px; padding-bottom: 5px;
}
body.ttrss_login div.row-error {
color: red;
text-align: center;
padding: 0px 0px 5px 0px;
} }
body.ttrss_main .dijitDialog h1:first-of-type, body.ttrss_main .dijitDialog h1:first-of-type,
body.ttrss_main .dijitDialog h2:first-of-type, body.ttrss_main .dijitDialog h2:first-of-type,

File diff suppressed because one or more lines are too long