More progress on the application page.

Created and styled the forms for updating user/timeline information.
Wired the hidden forms to links that expose them using jQuery.
This commit is contained in:
Jonathan Bernard
2011-02-12 07:48:19 -06:00
parent 9c645e9a88
commit 6197363508
4 changed files with 205 additions and 31 deletions

View File

@ -79,6 +79,34 @@ body {
-webkit-border-bottom-left-radius: 0.5em;
border-bottom-left-radius: 0.5em; }
form {
border-top: solid 1px #979681;
padding: 0.5em 0 0.5em 2em;
overflow: hidden; }
form label {
color: #626150;
display: block;
overflow: hidden; }
form label span {
float: left;
width: 6em;
padding-top: 0.1em; }
form input.text-input {
border: 1px solid #979681; }
form .form-col {
overflow: hidden;
float: left;
padding-right: 2em; }
form .form-col input.text-input {
width: 10em; }
form .form-submit {
float: left;
width: 100%;
overflow: hidden; }
form .form-submit input {
border: 1px solid #979681;
background: #f6f3ea; }
#user {
-moz-border-radius-topleft: 0.5em;
-webkit-border-top-left-radius: 0.5em;
@ -86,6 +114,8 @@ body {
-moz-border-radius-topright: 0.5em;
-webkit-border-top-right-radius: 0.5em;
border-top-right-radius: 0.5em; }
#user .control-links {
padding-top: 0.6em; }
#user #fullname, #user #username {
font-weight: bold;
font-size: x-large;
@ -93,11 +123,18 @@ body {
#user #username {
padding-left: 0.2em;
color: #626150; }
#user .control-links {
padding-top: 0.6em; }
#user-info {
display: none; }
#user #change-pwd {
display: none; }
#user #user-info .form-submit {
padding: 0.5em 2em 0.5em 2em;
position: relative; }
#user #user-info .form-submit div {
position: relative;
float: right;
left: -50%; }
#user #user-info .form-submit div input {
position: relative;
left: 50%; }
#timeline #timeline-name, #timeline #timeline-desc {
font-weight: bold; }
@ -105,6 +142,12 @@ body {
color: #626150; }
#timeline .control-links {
padding-top: 0.2em; }
#timeline #timeline-info .form-submit {
width: auto;
float: right;
overflow: inline; }
#timeline-info {
display: none; }
#user-info, #timeline-info {
display: none;
width: 100%;
float: left; }