localhots/oldhaven
1
0
Fork 0
Code Releases Activity

Settings form

Browse Source
This commit is contained in:
magnolia-fan 2011-06-22 01:51:20 +04:00
parent d7da0fa3de
commit 79c34273c8
5 changed files with 112 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
public/index.html
View File

@ -5,6 +5,7 @@
<meta charset="utf-8"/>
<link rel="stylesheet" type="text/css" media="screen" href="/stylesheets/layout.css" />
<link rel="stylesheet" type="text/css" media="screen" href="/stylesheets/search.css" />
<link rel="stylesheet" type="text/css" media="screen" href="/stylesheets/settings.css" />
<link rel="stylesheet" type="text/css" media="screen" href="/stylesheets/misc.css" />
<link rel="stylesheet" type="text/css" media="screen" href="/stylesheets/player.css" />
<link rel="stylesheet" type="text/css" media="screen" href="/stylesheets/albums.css" />

1
public/javascripts/beathaven/pages.js
View File

@ -87,6 +87,7 @@ var Pages = {
},
renderSettings: function(data) {
$('#data-container').css('background', 'url(/images/concrete_wall_2.png) 0 -30px repeat');
$('#data-container .inner').html(data);
yaCounter7596904.hit(Ajax.getAnchor(), 'Settings', Ajax.referer);
Ajax.setTitle('Settings');

6
public/javascripts/beathaven/settings.js
View File

@ -4,4 +4,10 @@ var Settings = {
$('.settings').live('click', function() {
Ajax.loadSettingsPage();
})
$('.settings-container .tabs .tab').live('click', function(){
if (!$(this).hasClass('active')) {
$('.settings-container .tabs .tab').removeClass('active');
$(this).addClass('active');
}
})

21
public/settings.html
View File

@ -1 +1,20 @@
hello
<div class="settings-container">
<div class="tabs">
<div class="left-space"></div>
<div class="tab active">Account</div>
<div class="middle-space"></div>
<div class="tab">Music</div>
</div>
<div class="form-container">
<div class="form">
<div class="field">
<div class="label">Username:</div>
<div class="value"><input name="username" type="text"/></div>
</div>
<div class="field">
<div class="label">Email:</div>
<div class="value"><input name="email" type="text"/></div>
</div>
</div>
</div>
</div>

84
public/stylesheets/settings.css Normal file
View File

@ -0,0 +1,84 @@
.settings-container {
margin: 25px;
}
.settings-container .tabs {
height: 26px;
}
.settings-container .tabs > div {
float: left;
height: 25px;
}
.settings-container .tabs .left-space {
width: 15px;
}
.settings-container .tabs .tab {
position: relative;
border-left: #DDD 2px solid;
border-top: #DDD 2px solid;
border-right: #DDD 2px solid;
padding: 0 8px;
line-height: 24px;
margin-top: 2px;
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
background-color: #FAFAFA;
cursor: pointer;
}
.settings-container .tabs .tab.active {
position: relative;
z-index: 200;
background-color: #EAEAEA;
border-left: #CCC 2px solid;
border-top: #CCC 2px solid;
border-right: #CCC 2px solid;
border-bottom: #EAEAEA 6px solid;
margin-top: -2px;
line-height: 29px;
font-weight: bold;
cursor: default;
}
.settings-container .tabs .middle-space {
width: 8px;
}
.settings-container .form-container {
position: relative;
z-index: 100;
height: 500px;
background-color: #EAEAEA;
border-left: #CCC 2px solid;
border-top: #CCC 2px solid;
border-right: #CCC 2px solid;
border-bottom: #CCC 2px solid;
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
}
.settings-container .form-container .form {
margin: 25px;
}
.settings-container .form-container .form .field {
height: 40px;
margin-bottom: 10px;
clear: both;
}
.settings-container .form-container .form .field .label{
float: left;
font-size: 24px;
line-height: 32px;
width: 140px;
padding: 3px 6px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
background-color: #CCC;
margin-right: -10px;
}
.settings-container .form-container .form .field input[type="text"]{
font-size: 24px;
padding: 4px;
border: #CCC 1px solid;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}