start editing setting page

some relevant stuff updated
This commit is contained in:
devin 2012-04-10 01:06:29 +08:00
parent 695c1dee58
commit 6006f1b3c6
6 changed files with 112 additions and 76 deletions

View File

@ -151,6 +151,8 @@ var orbitDesktop = function(dom){
}, function(){
$(this).addClass('op01');
});
// simple dropdown menu
var $sdm = $('.sdm');
if( !$sdm.children('.sdm_o') ){
@ -255,12 +257,13 @@ var orbitDesktop = function(dom){
}
else
$("#"+$(this).attr("data-category")).append(element);
},over:function(){
},
over:function(){
$(this).find('span.tile').removeClass('op06');
},
out:function(){
out:function(){
$(this).find('span.tile').addClass('op06');
}
}
});
$('#holder').tinyscrollbar({ axis: 'x'});
var $sdm = $('.sdm');
@ -291,7 +294,8 @@ var orbitDesktop = function(dom){
var bindHandlers = function(){
$("select#change_theme").change(function(){
o.changeTheme($(this).val());
})
});
$('#panel_r').tinyscrollbar({ axis: 'y'});
}
if(!o.desktopData[o.currentface]){
$(o.contentHolder).empty().load("/desktop/"+target,function(){

View File

@ -173,6 +173,7 @@ a, a:hover { text-decoration: none; }
}
.appholder {
position: relative;
z-index: 2;
padding-bottom: 12px;
}
.holder_f {
@ -180,8 +181,8 @@ a, a:hover { text-decoration: none; }
width: 100%;
height: 100%;
padding: 0;
/* left: 0;
top: 0; */
left: 0;
top: 0;
}
.dtitle {
font-size: 30px;
@ -213,6 +214,10 @@ a, a:hover { text-decoration: none; }
top: 0;
}
/* panel */
#panel_l { background-color: #f0f0f0; float: left; }
#panel_r { margin-left: 252px; position: relative;}
/* simple dropdown menu */
.sdm {}
.sdm:hover .sdm_o { display: block; }
@ -227,6 +232,22 @@ a, a:hover { text-decoration: none; }
.sdm_o li:first-child { border: none; }
.sdm_o .admtxt { display: block; line-height: 36px; }
.sdm_o .admtxt:hover { background-color: #F0F0F0; }
/* simple menu */
.s_menu { font-size: 15px; line-height: 36px; }
.s_menu li { border-top: solid 1px #ddd; }
.s_menu li:first-child { border: none; }
.s_menu a { display: block; }
/* simple tabs */
.s_tab { font-size: 15px; line-height: 36px; }
.stb_h {}
.stb_v {}
.s_tab li { display: inline-block; }
.s_tab a { display: block; }
.st_c { display: none; }
.st_c:first-child { display: block; }
/* theme color opacity */
.op10 { opacity: 1; }
.op09 { opacity: 0.9; }
@ -247,6 +268,8 @@ a, a:hover { text-decoration: none; }
.wh1 { width: 30px; }
.wh2 { width: 36px; }
.wh3 { width: 60px; }
.w100 { width: 100%; }
.pw { width: 572px; }
.h1 { height: 96px; }
.h2 { height: 228px; }
@ -254,6 +277,7 @@ a, a:hover { text-decoration: none; }
.hh1 { height: 30px; }
.hh2 { height: 36px; }
.hh3 { height: 60px; }
.ph { height: 516px; }
.hp { padding-left: 12px; padding-right: 12px; }
.vp { padding-top: 12px; padding-bottom: 12px; }
@ -287,12 +311,9 @@ a, a:hover { text-decoration: none; }
/* tiny scrollbar */
#holder .viewport { width: auto; height: 516px; overflow: hidden; position: relative; }
#holder .overview { position: absolute; left: 0; top: 0; }
#holder .scrollbar {
position: absolute;
bottom: 0;
left: 0;
height: 12px;
}
#holder .scrollbar { position: absolute; }
#holder .scrollbar.sb_h { left: 0; bottom: 0; height: 12px; }
#holder .scrollbar.sb_v { right: 0; top: 0; width: 12px; }
#holder .track { height: 100%; width: 12px; position: relative; }
#holder .thumb { height: 12px; width: 12px; cursor: pointer; overflow: hidden; position: absolute; top: 0; }
#holder .thumb .end { overflow: hidden; height: 12px; width: 12px; }
@ -331,4 +352,3 @@ a, a:hover { text-decoration: none; }
.grp{
min-height:540px;
}

View File

@ -13,7 +13,7 @@
</div>
<div id="holder">
<div class="scrollbar"><div class="track"><div class="thumb thmc2"><div class="end"></div></div></div></div>
<div class="scrollbar sb_h"><div class="track"><div class="thumb thmc2"><div class="end"></div></div></div></div>
<div class="viewport">
<div id="group_wrapper" class="overview">

View File

@ -13,7 +13,7 @@
</div>
</div>
<div id="holder">
<div class="scrollbar op01"><div class="track"><div class="thumb thmc2"><div class="end"></div></div></div></div>
<div class="scrollbar sb_h op01"><div class="track"><div class="thumb thmc2"><div class="end"></div></div></div></div>
<div class="viewport">
<div id="group_wrapper" class="overview">
<div class="group">

View File

@ -5,7 +5,7 @@
</div>
</div>
<div id="holder">
<div class="scrollbar"><div class="track"><div class="thumb thmc2"><div class="end"></div></div></div></div>
<div class="scrollbar sb_h"><div class="track"><div class="thumb thmc2"><div class="end"></div></div></div></div>
<div class="viewport">
<div id="group_wrapper" class="overview">
<div class="group">
@ -19,70 +19,70 @@
</div>
<ul class="grp" id="section1">
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxt">Garage Band</h1>
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxt">Garage Band</h1>
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxt">Garage Band</h1>
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxt">Garage Band</h1>
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxt">Garage Band</h1>
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxt">Garage Band</h1>
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxt">Garage Band</h1>
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxt">Garage Band</h1>
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxt">Garage Band</h1>
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxt">Garage Band</h1>
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxt">Garage Band</h1>
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxt">Garage Band</h1>
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxt">Garage Band</h1>
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxt">Garage Band</h1>
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxt">Garage Band</h1>
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxt">Garage Band</h1>
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxt">Garage Band</h1>
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxt">Garage Band</h1>
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxt">Garage Band</h1>
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxt">Garage Band</h1>
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxt">Garage Band</h1>
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxt">Garage Band</h1>
<h1 class="appname thmtxth">Garage Band</h1>
</li>
@ -99,70 +99,70 @@
</div>
<ul class="grp" id="section2">
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxt">Garage Band</h1>
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxt">Garage Band</h1>
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxt">Garage Band</h1>
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxt">Garage Band</h1>
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxt">Garage Band</h1>
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxt">Garage Band</h1>
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxt">Garage Band</h1>
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxt">Garage Band</h1>
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxt">Garage Band</h1>
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxt">Garage Band</h1>
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxt">Garage Band</h1>
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxt">Garage Band</h1>
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxt">Garage Band</h1>
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxt">Garage Band</h1>
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxt">Garage Band</h1>
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxt">Garage Band</h1>
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxt">Garage Band</h1>
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxt">Garage Band</h1>
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxt">Garage Band</h1>
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxt">Garage Band</h1>
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxt">Garage Band</h1>
<h1 class="appname thmtxth">Garage Band</h1>
</li>
<li class="element w1 hh2 hp vp" data-category="abc">
<h1 class="appname thmtxt">Garage Band</h1>
<h1 class="appname thmtxth">Garage Band</h1>
</li>
</ul>

View File

@ -5,19 +5,34 @@
</div>
</div>
<div id="holder">
<div class="scrollbar"><div class="track"><div class="thumb thmc2"><div class="end"></div></div></div></div>
<div class="viewport">
<div class="overview">
<ul>
<li><a href="" class="admtxt">Overview</a></li>
<li><a href="" class="admtxt">Account</a></li>
<li><a href="" class="admtxt">Sections</a></li>
<li><a href="" class="admtxt">Theme</a></li>
<li><a href="" class="admtxt">Connection</a></li>
</ul>
<div id="panel_l" class="ph">
<div class="s_menu sm_v">
<ul>
<li><a href="" class="admtxt hh2 w2 hp">Overview</a></li>
<li><a href="" class="admtxt hh2 w2 hp">Account</a></li>
<li><a href="" class="admtxt hh2 w2 hp">Sections</a></li>
<li><a href="" class="admtxt hh2 w2 hp">Theme</a></li>
<li><a href="" class="admtxt hh2 w2 hp">Connection</a></li>
</ul>
</div>
</div>
<div id="panel_r" class="ph pw admbg">
<div class="s_tab stb_h">
<ul>
<li><a href="#st1" class="hh2 hp thmtxt thmc1">Select Theme</a></li>
<li><a href="#st2" class="hh2 hp admtxt">Custom Theme</a></li>
</ul>
</div>
<div class="scrollbar sb_v"><div class="track"><div class="thumb thmc2"><div class="end"></div></div></div></div>
<div class="viewport">
<div class="overview w100">
<div id="st1" class="st_c hp vp">try</div>
<div id="st2" class="st_c hp vp">test</div>
</div>
</div>
</div>
<div class="clear"></div>
<<<<<<< HEAD
=======
<select id="change_theme">
<option value='default'>Default Theme</option>
<option value='snake'>Snake Theme</option>
@ -27,8 +42,5 @@
</select>
<br />
<button onClick="od.tempFunc();">Save</button>
>>>>>>> desktop_harry
</div>
</div>
</div>
</div>