/document/tpl/ UI cleaning.

/comment/tpl/ UI cleaning.
Deprecated 'checkboxToggleAll()' function removed.

git-svn-id: http://xe-core.googlecode.com/svn/branches/maserati@11888 201d5d3c-b55e-5fd7-737f-ddc643e51545
This commit is contained in:
ChanMyeong 2012-10-24 15:51:49 +00:00
parent 5ae8565457
commit 9705b6abf1
20 changed files with 346 additions and 510 deletions

View file

@ -1,12 +1,12 @@
<load target="./js/config.js" usecdn="true" />
<load target="../install/lang/lang.xml" usecdn="true" />
<load target="../../session/tpl/js/session.js" usecdn="true" />
<div cond="$XE_VALIDATOR_MESSAGE" class="message {$XE_VALIDATOR_MESSAGE_TYPE}">
<p>{$XE_VALIDATOR_MESSAGE}</p>
</div>
<div class="x_page-header">
<h1>{$lang->menu_gnb_sub['adminConfigurationGeneral']}</h1>
</div>
<div cond="$XE_VALIDATOR_MESSAGE" class="message {$XE_VALIDATOR_MESSAGE_TYPE}">
<p>{$XE_VALIDATOR_MESSAGE}</p>
</div>
<section class="section">
<h1>{$lang->subtitle_primary}</h1>
<form action="./" method="post" enctype="multipart/form-data" class="x_form-horizontal">

View file

@ -64,7 +64,9 @@ body>.x,
.x .x_btn-group>.x_btn:first-child{border-bottom-left-radius:2px;border-top-left-radius:2px}
.x input[type="radio"],
.x input[type="checkbox"]{margin:0}
.x td select, .x td textarea, .x td input{margin-bottom:0}
.x td select,
.x td textarea,
.x td input{margin-bottom:0}
.x a.x_icon-question-sign,
.x button.x_icon-question-sign{cursor:help}
.x .x_nav-tabs>li>a{padding-top:6px;padding-bottom:6px}
@ -111,6 +113,7 @@ body>.x,
.x select[multiple]{height:auto}
.x textarea{vertical-align:top}
.x .x_tab-content{overflow-x:hidden}
.x .x_table thead th{vertical-align:top}
/* Custom Styles */
.x .section{margin:20px 0 40px 0}
.x .section>h1{position:relative;border-bottom:1px solid #ddd}
@ -126,8 +129,8 @@ body>.x,
.x .btnArea{padding:8px 0;margin:20px 0;border-top:1px solid #ccc}
.x li.active>a,
.x a.active{color:#000;font-weight:bold;text-decoration:none}
.x .module_search+[readonly]{border-top-right-radius:0;border-bottom-right-radius:0}
.x .module_search+[readonly]+a.x_btn{border-top-left-radius:0;border-bottom-left-radius:0;vertical-align:top;margin-left:-5px}
.x .module_search+[readonly]{vertical-align:top;border-top-right-radius:0;border-bottom-right-radius:0}
.x .module_search+[readonly]+a.x_btn{vertical-align:top;border-top-left-radius:0;border-bottom-left-radius:0;margin-left:-5px}
.x .fileBtn{position:relative;display:inline-block;overflow:hidden;cursor:pointer}
.x .fileBtn>input[type="file"]{position:absolute;top:0;right:0;height:100%;overflow:hidden;opacity:0;border:0;filter:alpha(opacity=0);margin:0;padding:0;cursor:pointer;-webkit-transform:scale(3, 3);-webkit-transform-origin:0 0;-moz-transform:scale(3, 3);-moz-transform-origin:100% 0;-o-transform:scale(3, 3);-o-transform-origin:100% 0;filter:progid:DXImageTransform.Microsoft.Matrix(M11=3.0,M22=3.0);}
/* Image Sprite */
@ -171,13 +174,16 @@ to{-o-transform:rotate(360deg)}
.x>.xin>.skipNav>a:focus{height:auto;margin:5px 0;padding:8px 0;background:#fff}
.x>.xin>.header{border-radius:5px 5px 0 0;padding:10px 15px;zoom:1;border-bottom:1px solid #ddd;background:#f6f6f6;background:-webkit-gradient(linear, left top, left bottom, from(#F6F6F6), to(#F1F1F1));background:-moz-linear-gradient(top,#F6F6F6,#F1F1F1);background:-o-linear-gradient(top,#F6F6F6,#F1F1F1)}
.x>.xin>.header:after{content:"";display:block;clear:both}
.x>.xin>.body{zoom:1;padding:0 20px 0 200px}
.x>.xin>.body{position:relative;zoom:1;padding:0 20px 0 200px}
.x>.xin>.body.wide{padding:0 20px 0 60px}
.x>.xin>.body:after{content:"";display:block;clear:both}
.x>.xin>.body>.content{width:100%;padding:1px 0 0 0;float:right;margin:0 0 30px -100%;outline:none}
.x>.xin>.body>.content>*:first-child{margin-top:0}
.x>.xin>.body>.gnb{width:180px;position:fixed;top:73px;left:10px}
.x>.xin>.body.wide>.gnb{width:36px}
@media all and (max-height:700px){
.x>.xin>.body>.gnb{position:absolute;top:0;left:0}
}
@media all and (max-width:980px){
.x>.xin>.body,
.x>.xin>.body.wide{padding:0}

View file

@ -64,7 +64,9 @@ body>.x,
.x .x_btn-group>.x_btn:first-child{border-bottom-left-radius:2px;border-top-left-radius:2px}
.x input[type="radio"],
.x input[type="checkbox"]{margin:0}
.x td select, .x td textarea, .x td input{margin-bottom:0}
.x td select,
.x td textarea,
.x td input{margin-bottom:0}
.x a.x_icon-question-sign,
.x button.x_icon-question-sign{cursor:help}
.x .x_nav-tabs>li>a{padding-top:6px;padding-bottom:6px}
@ -111,6 +113,7 @@ body>.x,
.x select[multiple]{height:auto}
.x textarea{vertical-align:top}
.x .x_tab-content{overflow-x:hidden}
.x .x_table thead th{vertical-align:top}
/* Custom Styles */
.x .section{margin:20px 0 40px 0}
.x .section>h1{position:relative;border-bottom:1px solid #ddd}
@ -126,8 +129,8 @@ body>.x,
.x .btnArea{padding:8px 0;margin:20px 0;border-top:1px solid #ccc}
.x li.active>a,
.x a.active{color:#000;font-weight:bold;text-decoration:none}
.x .module_search+[readonly]{border-top-right-radius:0;border-bottom-right-radius:0}
.x .module_search+[readonly]+a.x_btn{border-top-left-radius:0;border-bottom-left-radius:0;vertical-align:top;margin-left:-5px}
.x .module_search+[readonly]{vertical-align:top;border-top-right-radius:0;border-bottom-right-radius:0}
.x .module_search+[readonly]+a.x_btn{vertical-align:top;border-top-left-radius:0;border-bottom-left-radius:0;margin-left:-5px}
.x .fileBtn{position:relative;display:inline-block;overflow:hidden;cursor:pointer}
.x .fileBtn>input[type="file"]{position:absolute;top:0;right:0;height:100%;overflow:hidden;opacity:0;border:0;filter:alpha(opacity=0);margin:0;padding:0;cursor:pointer;-webkit-transform:scale(3, 3);-webkit-transform-origin:0 0;-moz-transform:scale(3, 3);-moz-transform-origin:100% 0;-o-transform:scale(3, 3);-o-transform-origin:100% 0;filter:progid:DXImageTransform.Microsoft.Matrix(M11=3.0,M22=3.0);}
/* Image Sprite */
@ -171,13 +174,16 @@ to{-o-transform:rotate(360deg)}
.x>.xin>.skipNav>a:focus{height:auto;margin:5px 0;padding:8px 0;background:#fff}
.x>.xin>.header{border-radius:5px 5px 0 0;padding:10px 15px;zoom:1;border-bottom:1px solid #ddd;background:#f6f6f6;background:-webkit-gradient(linear, left top, left bottom, from(#F6F6F6), to(#F1F1F1));background:-moz-linear-gradient(top,#F6F6F6,#F1F1F1);background:-o-linear-gradient(top,#F6F6F6,#F1F1F1)}
.x>.xin>.header:after{content:"";display:block;clear:both}
.x>.xin>.body{zoom:1;padding:0 20px 0 200px}
.x>.xin>.body{position:relative;zoom:1;padding:0 20px 0 200px}
.x>.xin>.body.wide{padding:0 20px 0 60px}
.x>.xin>.body:after{content:"";display:block;clear:both}
.x>.xin>.body>.content{width:100%;padding:1px 0 0 0;float:right;margin:0 0 30px -100%;outline:none}
.x>.xin>.body>.content>*:first-child{margin-top:0}
.x>.xin>.body>.gnb{width:180px;position:fixed;top:73px;left:10px}
.x>.xin>.body.wide>.gnb{width:36px}
@media all and (max-height:700px){
.x>.xin>.body>.gnb{position:absolute;top:0;left:0}
}
@media all and (max-width:980px){
.x>.xin>.body,
.x>.xin>.body.wide{padding:0}

View file

@ -94,7 +94,7 @@ jQuery(function($){
return false;
});
// GNB
function GNB(){
$.fn.gnb = function(){
var $xBody = $('.x>.xin>.body');
var $xContent = $xBody.children('#content.content');
var $xGnb = $xBody.find('>.gnb');
@ -142,8 +142,8 @@ jQuery(function($){
$xBody.addClass('wide');
reflow();
});
}
GNB();
};
$('.gnb').gnb();
// Default Language Selection
$('.x #lang')
.mouseleave(function(){
@ -180,6 +180,7 @@ jQuery(function($){
// Section Toggle
var $section_heading = $('.x .section').find('>h1:first');
$section_heading.append('<button type="button" class="snToggle x_icon-chevron-up">Toggle this section</button>');
$('.x .section.collapse>h1>.snToggle').removeClass('x_icon-chevron-up').addClass('x_icon-chevron-down');
$section_heading.find('>.snToggle').click(function(){
var $this = $(this);
var $section = $this.closest('.section');
@ -205,56 +206,68 @@ jQuery(function($){
}
});
// Vertical Divider
$('.x i').each(function(){
var $this = $(this);
if($this.text() == '|'){
$this.addClass('vr').filter(':first-child, :last-child').remove();
}
});
$.fn.vr = function(){
this.each(function(){
var $this = $(this);
if($this.text() == '|'){
$this.addClass('vr').filter(':first-child, :last-child').remove();
}
});
};
$('.x i').vr();
// label[for] + input[id]/textarea[id]/select[id] creator
$('label:not([for])').each(function(index){
index = index + 1;
var $this = $(this);
var input = 'input, textarea, select';
var check = ':radio, :checkbox';
var id = '[id]';
var value = 'i' + index;
if($this.next(input).filter(id).not(check).length){
// next input, textarea, select id true
$this.attr('for', $this.next().attr('id'));
} else if ($this.next(input).not(id).not(check).length) {
// next input, textarea, select id false
$this.attr('for', value).next().attr('id', value);
} else if ($this.prev(check).filter(id).length) {
// prev :radio :checkbox id true
$this.attr('for', $this.prev().attr('id'));
} else if ($this.prev(check).not(id).length) {
// prev :radio :checkbox id false
$this.attr('for', value).prev().attr('id', value);
} else if ($this.children(input).filter(id).length) {
// children id true
$this.attr('for', $this.children(input).filter(id).eq(0).attr('id'));
} else if ($this.children(input).not(id).length) {
// children id false
$this.attr('for', value).children(input).not(id).eq(0).attr('id', value);
}
});
$.fn.labelMaker = function(){
this.each(function(index){
index = index + 1;
var $this = $(this);
var input = 'input, textarea, select';
var check = ':radio, :checkbox';
var id = '[id]';
var value = 'i' + index;
if($this.next(input).filter(id).not(check).length){
// next input, textarea, select id true
$this.attr('for', $this.next().attr('id'));
} else if ($this.next(input).not(id).not(check).length) {
// next input, textarea, select id false
$this.attr('for', value).next().attr('id', value);
} else if ($this.prev(check).filter(id).length) {
// prev :radio :checkbox id true
$this.attr('for', $this.prev().attr('id'));
} else if ($this.prev(check).not(id).length) {
// prev :radio :checkbox id false
$this.attr('for', value).prev().attr('id', value);
} else if ($this.children(input).filter(id).length) {
// children id true
$this.attr('for', $this.children(input).filter(id).eq(0).attr('id'));
} else if ($this.children(input).not(id).length) {
// children id false
$this.attr('for', value).children(input).not(id).eq(0).attr('id', value);
}
});
};
$('label:not([for])').labelMaker();
// :radio, :checkbox checked class
$(':radio, :checkbox').change(function(){
var $this = $(this);
if($this.is(':checked')){
$this.parent('label').addClass('checked');
}
$(':radio, :checkbox').not(':checked').parent('label').removeClass('checked');
}).change();
$.fn.checkToggle = function(){
this.change(function(){
var $this = $(this);
if($this.is(':checked')){
$this.parent('label').addClass('checked');
}
$(':radio, :checkbox').not(':checked').parent('label').removeClass('checked');
});
};
$(':radio, :checkbox').checkToggle();
// File input .overlap style
$('input[type="file"].overlap').each(function(){
var $this = $(this);
$this.wrap('<span class="fileBtn" />').before('<button type="button">');
var $button = $this.prev('button');
$button.text($this.attr('title')).addClass($this.attr('class')).removeClass('overlap');
$this.attr('class','overlap').width($button.width()).height($button.height()).offset($button.offset());
});
$.fn.fileTypeOverlap = function(){
this.each(function(){
var $this = $(this);
$this.wrap('<span class="fileBtn" />').before('<button type="button">');
var $button = $this.prev('button');
$button.text($this.attr('title')).addClass($this.attr('class')).removeClass('overlap');
$this.attr('class','overlap').width($button.width()).height($button.height()).offset($button.offset());
});
};
$('input[type="file"].overlap').fileTypeOverlap();
// Email Masking
$.fn.xeMask = function(){
this
@ -283,7 +296,18 @@ jQuery(function($){
})
};
$('.masked').xeMask();
// Table Col Span
$.fn.tableSpan = function(){
this.each(function(){
var $this = $(this);
var thNum = $this.find('>thead>tr:eq(0)>th').length;
var $tdTarget = $this.find('>tbody>tr:eq(0)>td:only-child');
if(thNum != $tdTarget.attr('colspan')){
$tdTarget.attr('colspan', thNum).css('text-align','center');
}
});
};
$('table').tableSpan();
});
// Modal Window
jQuery(function($){

View file

@ -94,7 +94,7 @@ jQuery(function($){
return false;
});
// GNB
function GNB(){
$.fn.gnb = function(){
var $xBody = $('.x>.xin>.body');
var $xContent = $xBody.children('#content.content');
var $xGnb = $xBody.find('>.gnb');
@ -142,8 +142,8 @@ jQuery(function($){
$xBody.addClass('wide');
reflow();
});
}
GNB();
};
$('.gnb').gnb();
// Default Language Selection
$('.x #lang')
.mouseleave(function(){
@ -180,6 +180,7 @@ jQuery(function($){
// Section Toggle
var $section_heading = $('.x .section').find('>h1:first');
$section_heading.append('<button type="button" class="snToggle x_icon-chevron-up">Toggle this section</button>');
$('.x .section.collapse>h1>.snToggle').removeClass('x_icon-chevron-up').addClass('x_icon-chevron-down');
$section_heading.find('>.snToggle').click(function(){
var $this = $(this);
var $section = $this.closest('.section');
@ -205,56 +206,68 @@ jQuery(function($){
}
});
// Vertical Divider
$('.x i').each(function(){
var $this = $(this);
if($this.text() == '|'){
$this.addClass('vr').filter(':first-child, :last-child').remove();
}
});
$.fn.vr = function(){
this.each(function(){
var $this = $(this);
if($this.text() == '|'){
$this.addClass('vr').filter(':first-child, :last-child').remove();
}
});
};
$('.x i').vr();
// label[for] + input[id]/textarea[id]/select[id] creator
$('label:not([for])').each(function(index){
index = index + 1;
var $this = $(this);
var input = 'input, textarea, select';
var check = ':radio, :checkbox';
var id = '[id]';
var value = 'i' + index;
if($this.next(input).filter(id).not(check).length){
// next input, textarea, select id true
$this.attr('for', $this.next().attr('id'));
} else if ($this.next(input).not(id).not(check).length) {
// next input, textarea, select id false
$this.attr('for', value).next().attr('id', value);
} else if ($this.prev(check).filter(id).length) {
// prev :radio :checkbox id true
$this.attr('for', $this.prev().attr('id'));
} else if ($this.prev(check).not(id).length) {
// prev :radio :checkbox id false
$this.attr('for', value).prev().attr('id', value);
} else if ($this.children(input).filter(id).length) {
// children id true
$this.attr('for', $this.children(input).filter(id).eq(0).attr('id'));
} else if ($this.children(input).not(id).length) {
// children id false
$this.attr('for', value).children(input).not(id).eq(0).attr('id', value);
}
});
$.fn.labelMaker = function(){
this.each(function(index){
index = index + 1;
var $this = $(this);
var input = 'input, textarea, select';
var check = ':radio, :checkbox';
var id = '[id]';
var value = 'i' + index;
if($this.next(input).filter(id).not(check).length){
// next input, textarea, select id true
$this.attr('for', $this.next().attr('id'));
} else if ($this.next(input).not(id).not(check).length) {
// next input, textarea, select id false
$this.attr('for', value).next().attr('id', value);
} else if ($this.prev(check).filter(id).length) {
// prev :radio :checkbox id true
$this.attr('for', $this.prev().attr('id'));
} else if ($this.prev(check).not(id).length) {
// prev :radio :checkbox id false
$this.attr('for', value).prev().attr('id', value);
} else if ($this.children(input).filter(id).length) {
// children id true
$this.attr('for', $this.children(input).filter(id).eq(0).attr('id'));
} else if ($this.children(input).not(id).length) {
// children id false
$this.attr('for', value).children(input).not(id).eq(0).attr('id', value);
}
});
};
$('label:not([for])').labelMaker();
// :radio, :checkbox checked class
$(':radio, :checkbox').change(function(){
var $this = $(this);
if($this.is(':checked')){
$this.parent('label').addClass('checked');
}
$(':radio, :checkbox').not(':checked').parent('label').removeClass('checked');
}).change();
$.fn.checkToggle = function(){
this.change(function(){
var $this = $(this);
if($this.is(':checked')){
$this.parent('label').addClass('checked');
}
$(':radio, :checkbox').not(':checked').parent('label').removeClass('checked');
});
};
$(':radio, :checkbox').checkToggle();
// File input .overlap style
$('input[type="file"].overlap').each(function(){
var $this = $(this);
$this.wrap('<span class="fileBtn" />').before('<button type="button">');
var $button = $this.prev('button');
$button.text($this.attr('title')).addClass($this.attr('class')).removeClass('overlap');
$this.attr('class','overlap').width($button.width()).height($button.height()).offset($button.offset());
});
$.fn.fileTypeOverlap = function(){
this.each(function(){
var $this = $(this);
$this.wrap('<span class="fileBtn" />').before('<button type="button">');
var $button = $this.prev('button');
$button.text($this.attr('title')).addClass($this.attr('class')).removeClass('overlap');
$this.attr('class','overlap').width($button.width()).height($button.height()).offset($button.offset());
});
};
$('input[type="file"].overlap').fileTypeOverlap();
// Email Masking
$.fn.xeMask = function(){
this
@ -283,7 +296,18 @@ jQuery(function($){
})
};
$('.masked').xeMask();
// Table Col Span
$.fn.tableSpan = function(){
this.each(function(){
var $this = $(this);
var thNum = $this.find('>thead>tr:eq(0)>th').length;
var $tdTarget = $this.find('>tbody>tr:eq(0)>td:only-child');
if(thNum != $tdTarget.attr('colspan')){
$tdTarget.attr('colspan', thNum).css('text-align','center');
}
});
};
$('table').tableSpan();
});
// Modal Window
jQuery(function($){