Site edit. File upload input button UI change. .overlap button style added.

git-svn-id: http://xe-core.googlecode.com/svn/branches/maserati@11760 201d5d3c-b55e-5fd7-737f-ddc643e51545

modules/admin/tpl/css/admin.css

@@ -110,7 +110,8 @@ body>.x,.x label,.x table,.x input,.x textarea,.x select,.x button{font-size:13p
 .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 input[type="file"].overlap{position:absolute;overflow:hidden;opacity:0;border:0;filter:alpha(opacity=0);padding:3px 9px;cursor:pointer}
+.x .fileBtn{position:relative;display:inline-block}
+.x .fileBtn>input[type="file"]{position:absolute;overflow:hidden;opacity:0;border:0;filter:alpha(opacity=0);padding:3px 9px;cursor:pointer}
 /* Image Sprite */
 .x a[target="_blank"]:after,
 .x>.body>.gnb>ul>li>a>i,

modules/admin/tpl/css/admin.min.css

@@ -110,7 +110,8 @@ body>.x,.x label,.x table,.x input,.x textarea,.x select,.x button{font-size:13p
 .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 input[type="file"].overlap{position:absolute;overflow:hidden;opacity:0;border:0;filter:alpha(opacity=0);padding:3px 9px;cursor:pointer}
+.x .fileBtn{position:relative;display:inline-block}
+.x .fileBtn>input[type="file"]{position:absolute;overflow:hidden;opacity:0;border:0;filter:alpha(opacity=0);padding:3px 9px;cursor:pointer}
 /* Image Sprite */
 .x a[target="_blank"]:after,
 .x>.body>.gnb>ul>li>a>i,

modules/admin/tpl/js/admin.js

@@ -190,9 +190,10 @@ jQuery(function($){
 // File input .overlap style
 	$('input[type="file"].overlap').each(function(){
 		var $this = $(this);
-		var $btn = $this.prev('button');
+		$this.wrap('<span class="fileBtn" />').before('<button type="button">');
-		$this.parent().css('position','relative');
+		var $button = $this.prev('button');
-		$this.width($btn.width()).height($btn.height()).offset($btn.offset());
+		$button.text($this.attr('title')).addClass($this.attr('class')).removeClass('overlap');
+		$this.attr('class','overlap').width($button.width()).height($button.height()).offset($button.offset());
 	});
 // Email Masking
 	$.fn.xeMask = function(){

modules/admin/tpl/js/admin.min.js

@@ -190,9 +190,10 @@ jQuery(function($){
 // File input .overlap style
 	$('input[type="file"].overlap').each(function(){
 		var $this = $(this);
-		var $btn = $this.prev('button');
+		$this.wrap('<span class="fileBtn" />').before('<button type="button">');
-		$this.parent().css('position','relative');
+		var $button = $this.prev('button');
-		$this.width($btn.width()).height($btn.height()).offset($btn.offset());
+		$button.text($this.attr('title')).addClass($this.attr('class')).removeClass('overlap');
+		$this.attr('class','overlap').width($button.width()).height($button.height()).offset($button.offset());
 	});
 // Email Masking
 	$.fn.xeMask = function(){

modules/menu/tpl/sitemap.html

@@ -242,8 +242,7 @@
 				</figure>
 				<div class="btnBoth">
 					<button type="button" class="fileRemover x_btn x_pull-left">삭제</button>
-					<button type="button" class="fileTrigger x_btn x_btn-primary x_pull-right">변경</button>
+					<input type="file" class="overlap x_btn x_btn-primary x_pull-right" title="변경">
-					<input type="file">
 				</div>
 			</form>
 			<form action="">
@@ -254,8 +253,7 @@
 				</figure>
 				<div class="btnBoth">
 					<button type="button" class="fileRemover x_btn x_pull-left">삭제</button>
-					<button type="button" class="fileTrigger x_btn x_btn-primary x_pull-right">이미지 올리기</button>
+					<input type="file" class="overlap x_btn x_btn-primary x_pull-right" title="이미지 올리기">
-					<input type="file">
 				</div>
 			</form>
 			<form action="">
@@ -266,8 +264,7 @@
 				</figure>
 				<div class="btnBoth">
 					<button type="button" class="fileRemover x_btn x_pull-left">삭제</button>
-					<button type="button" class="fileTrigger x_btn x_btn-primary x_pull-right">이미지 올리기</button>
+					<input type="file" class="overlap x_btn x_btn-primary x_pull-right" title="이미지 올리기">
-					<input type="file">
 				</div>
 			</form>
 		</fieldset>
@@ -2698,9 +2695,6 @@ setTimeout(function(){
 	});
 */
 // File upload
-	$('.fileTrigger').click(function(){
-		$(this).next('input[type="file"]').click();
-	});
 	$('input[type="file"]').change(function(){
 		$(this).closest('form').submit();
 	});