Style generation form.

This commit is contained in:
Andrew Tomaka 2011-12-05 23:39:06 -05:00
parent aec02a77dd
commit 70ec06dde1
4 changed files with 72 additions and 29 deletions

View file

@ -4,27 +4,37 @@ html {
body {
margin: 0px;
background-color: #a0a0a0;
background: url(../img/body_background.png);
font-family: Helvetica, Arial, sans-serif;
font-size: 13px;
}
input {
background: #fff;
#wrapper {
width: 380px;
margin: auto;
margin-top: 150px;
}
font-family: Helvetica, Arial, sans-serif;
font-size: 13px;
#box {
background-color: #fff;
width: 100%;
padding: 2px 2px;
border: 1px solid #ccc;
}
#header {
background-color: #E6E8FA;
background: url(../img/header_background.png);
border-bottom: 1px solid #ccc;
text-align: center;
padding: 10px;
margin-bottom: 10px;
}
#generate {
width: 325px;
border: 2px;
border-color: #b8b8b8 #e2e2e2 #e2e2e2 #b8b8b8;
border-style: solid;
}
input.focus {
background: #ebfdd7;
margin: auto;
}
label {
@ -35,10 +45,28 @@ label {
font-weight: bold;
}
#wrapper {
width: 380px;
margin: auto;
margin-top: 200px;
input {
background: #fff;
font-family: Helvetica, Arial, sans-serif;
font-size: 13px;
padding: 5px;
width: 315px;
border: 1px;
border-color: #b8b8b8 #e2e2e2 #e2e2e2 #b8b8b8;
border-style: solid;
}
#
input:focus {
background: #FFE4E1;
outline: 0;
}
button {
width: 100%;
}
.form_row {
margin-bottom: 10px;
}

BIN
img/body_background.png Executable file

Binary file not shown.

After

Width:  |  Height:  |  Size: 196 B

BIN
img/header_background.png Executable file

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.1 KiB

View file

@ -13,18 +13,31 @@
<body>
<div id="wrapper">
<div id="login">
<div id="box">
<div id="header">
<h1>Passwdgen v1.0</h1>
</div>
<div id="generate">
<form action="" method="post" id="generate">
<div class="sepH_a">
<div class="form_row">
<label for="root">Root Domain:</label>
<input type="text" id="root" name="root" />
</div>
<div class="sepH_b">
<div class="form_row">
<label for="master">Master Password:</label>
<input type="password" id="master" name="master" />
<input type="password" id="master" name="master" autocomplete="off" />
</div>
<div class="form_row">
<button type="submit">Generate</button>
</div>
</form>
<div class="form_row">
<label for="master">Site Password:</label>
<input type="password" id="password" name="password" autocomplete="off" />
</div>
</div>
</div>
</div>
@ -34,6 +47,8 @@
head.ready(function() {
$('input').corner('round 4px');
$('button').corner('round 4px');
$('#box').corner('round bottom');
});
</script>
</body>