improve show/hide function
This commit is contained in:
42
index.php
42
index.php
@@ -1,4 +1,5 @@
|
||||
<html>
|
||||
<!DOCTYPE html>
|
||||
<html lang="en_EN">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>UAAP | Uberspace Account Administration Panel</title>
|
||||
@@ -23,26 +24,27 @@
|
||||
<hr />
|
||||
|
||||
<div id="outer">
|
||||
<div class="holder">
|
||||
<h2 id="adduser">Add an Email account</h2>
|
||||
<p>You can add a new Email account your primary and all other domains.<br />
|
||||
Please do not add your domain, just everything in front of the @-symbol.</p>
|
||||
<div class="more">
|
||||
<i class="show">more »</i>
|
||||
<i class="hide">« less</i>
|
||||
<form action="submit.php" method="post">
|
||||
<label>Username:</label>
|
||||
<input name="user" title="User" />
|
||||
<label>Password:</label>
|
||||
<input name="pass" title="Password" type="password" />
|
||||
<div class="holder">
|
||||
<h2 id="adduser">Add an Email account</h2>
|
||||
<p>You can add a new Email account your primary and all other domains.<br />
|
||||
Please do not add your domain, just everything in front of the @-symbol.</p>
|
||||
<div class="more">
|
||||
<i class="show">Show »</i>
|
||||
<i class="hide">« Hide</i>
|
||||
<br />
|
||||
<button type="submit" name="action" value="adduser">Add new account</button>
|
||||
<!-- Hidden confirmation box -->
|
||||
<input type="hidden" name="sure" value="yes" />
|
||||
</form>
|
||||
</div> <!-- /more -->
|
||||
<hr />
|
||||
</div> <!-- /holder -->
|
||||
<form action="submit.php" method="post">
|
||||
<label>Username:</label>
|
||||
<input name="user" title="User" />
|
||||
<label>Password:</label>
|
||||
<input name="pass" title="Password" type="password" />
|
||||
<br />
|
||||
<button type="submit" name="action" value="adduser">Add new account</button>
|
||||
<!-- Hidden confirmation box -->
|
||||
<input type="hidden" name="sure" value="yes" />
|
||||
</form>
|
||||
</div> <!-- /more -->
|
||||
<hr />
|
||||
</div> <!-- /holder -->
|
||||
</div> <!-- outer -->
|
||||
|
||||
<h2 id="changepw">Change password of an Email account</h2>
|
||||
|
||||
@@ -25,20 +25,52 @@ button {
|
||||
|
||||
/* Click Toogle */
|
||||
/* always visible */
|
||||
#outer .holder {padding:1em; border:1px solid #ddd; margin:0 20px 10px 0;}
|
||||
#outer .holder p {padding:5px 0 0 0; margin:0;}
|
||||
#outer .holder p.bold {font-weight:bold;}
|
||||
#outer .holder h2 {margin:0; padding:0;}
|
||||
#outer .holder {
|
||||
padding:1em;
|
||||
border:1px solid #ddd;
|
||||
margin:0 20px 10px 0;
|
||||
}
|
||||
#outer .holder p {
|
||||
padding:5px 0 0 0;
|
||||
margin:0;
|
||||
}
|
||||
#outer .holder p.bold {
|
||||
font-weight:bold;
|
||||
}
|
||||
#outer .holder h2 {
|
||||
margin:0;
|
||||
padding:0;
|
||||
}
|
||||
|
||||
/* unclicked style div.more */
|
||||
#outer div.more i {float:right; margin-right:-10px 10px 0 0; cursor:pointer; color:#c00; font-weight:bold;}
|
||||
#outer div.more i.hide {display:none;}
|
||||
#outer div.more p {display:none;}
|
||||
#outer div.more img {display:none;}
|
||||
#outer div.more i {
|
||||
float:left;
|
||||
margin-right:-10px 10px 0 0;
|
||||
cursor:pointer;
|
||||
color:#c00;
|
||||
font-weight:bold;
|
||||
}
|
||||
#outer div.more i.hide {
|
||||
display:none;
|
||||
}
|
||||
#outer div.more p {
|
||||
display:none;
|
||||
}
|
||||
#outer div.more form {
|
||||
display:none;
|
||||
}
|
||||
|
||||
/* clicked style div.click */
|
||||
#outer div.click i.show {display:none;}
|
||||
#outer div.click i.hide {display:block;}
|
||||
#outer div.click p {display:block;}
|
||||
#outer div.click img {display:block; float:left; padding-right:10px;}
|
||||
#outer div.click i.show {
|
||||
display:none;
|
||||
}
|
||||
#outer div.click i.hide {
|
||||
display:block;
|
||||
}
|
||||
#outer div.click p {
|
||||
display:block;
|
||||
}
|
||||
#outer div.click form {
|
||||
display:block;
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user