Zeroboard 1.0.7 Front-end Refactoring.

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

modules/board/skins/xe_default/_header.html

@@ -60,9 +60,7 @@
 
 		<!-- 스킨의 상세 설명 -->
 		<!--@if($module_info->comment)-->
-		<p class="boardDescription">{$module_info->comment}
-			<span class="roundCorner topLeft"></span><span class="roundCorner topLeft"></span>
-		</p>
+		<p class="boardDescription">{$module_info->comment}</p>
 		<!--@end-->
     </div>
 

modules/board/skins/xe_default/comment.html

@@ -31,16 +31,17 @@
 					
 					<!--@if(!$comment->isAccessible())-->
 					<!--%import("filter/input_password.xml")-->
-					<div class="secretContent">
-						<form action="./" method="get" onsubmit="return procFilter(this, input_password)">
+						<form action="./" method="get" onsubmit="return procFilter(this, input_password)" class="secretMessage">
 						<input type="hidden" name="mid" value="{$mid}" />
 						<input type="hidden" name="page" value="{$page}" />
 						<input type="hidden" name="document_srl" value="{$comment->get('document_srl')}" />
 						<input type="hidden" name="comment_srl" value="{$comment->get('comment_srl')}" />
-							<div class="title">{$lang->msg_is_secret}</div>
-							<div class="content"><input type="password" name="password" class="inputTypeText" /><span class="button"><input type="submit" value="{$lang->cmd_input}" accesskey="s" /></span></div>
+							<p>&quot;{$lang->msg_is_secret}&quot;</p>
+							<dl>
+								<dt><label for="cpw">비밀번호</label> :</dt>
+								<dd><input type="password" id="cpw" name="password" class="inputText" /><span class="button red"><input type="submit" value="{$lang->cmd_input}" /></span></dd>
+							</dl>
 						</form>
-					</div>
 					<!--@else-->
 					<!--@if($comment->getProfileImage())-->
 						<img src="{$comment->getProfileImage()}" alt="profile" class="commentProfileImage" />

modules/board/skins/xe_default/comment_form.html

@@ -30,20 +30,28 @@
 <input type="hidden" name="parent_srl" value="{$oComment->get('parent_srl')}" />
 
 <div class="boardWrite commentEditor">
+	
+	<h3 class="commentHeader">댓글 쓰기</h3>
 
     <div class="userNameAndPw">
         <!--@if(!$is_logged)-->
-        <label for="userName">{$lang->writer}</label>
-        <input type="text" name="nick_name" value="{$oComment->get('nick_name')}" class="userName inputTypeText" id="userName"/>
+		<dl>
+			<dt><label for="userName">{$lang->writer}</label> :</dt>
+			<dd class="userName"><input type="text" name="nick_name" value="{$oDocument->getNickName()}" class="inputText" id="userName"/></dd>
+		</dl>
+		<dl>
+			<dt><label for="userPw">{$lang->password}</label> :</dt>
+			<dd class="userPw"><input type="password" name="password" value="" id="userPw" class="inputText" /></dd>
+		</dl>
+		<dl>
+			<dt><label for="emailAddress">{$lang->email_address}</label> :</dt>
+			<dd class="emailAddress"><input type="text" name="email_address" value="{htmlspecialchars($oDocument->get('email_address'))}" id="emailAddress" class="inputText"/></dd>
+		</dl>
+		<dl>
+			<dt><label for="homePage">{$lang->homepage}</label> :</dt>
+			<dd class="homePage"><input type="text" name="homepage" value="{htmlspecialchars($oDocument->get('homepage'))}" id="homePage" class="inputText"/></dd>
+		</dl>
 
-        <label for="userPw">{$lang->password}</label>
-        <input type="password" name="password" value="" id="userPw" class="userPw inputTypeText" />
-
-        <label for="emailAddress">{$lang->email_address}</label>
-        <input type="text" name="email_address" value="{htmlspecialchars($oComment->get('email_address'))}" id="emailAddress" class="emailAddress inputTypeText"/>
-
-        <label for="homePage">{$lang->homepage}</label>
-        <input type="text" name="homepage" value="{htmlspecialchars($oComment->get('homepage'))}" id="homePage" class="homePage inputTypeText"/>
         <!--@else-->
         <input type="checkbox" name="notify_message" value="Y" <!--@if($oComment->useNotify())-->checked="checked"<!--@end--> id="notify_message" />
         <label for="notify_message">{$lang->notify}</label>
@@ -54,12 +62,14 @@
     </div>
 
     <div class="editor">{$oComment->getEditor()}</div>
+	
+	<div class="boardNavigation">
+		<span class="button"><input type="button" value="{$lang->cmd_back}" onclick="location.href='{getUrl('act','')}'"/></span>
+		<span class="button"><input type="submit" value="{$lang->cmd_comment_registration}" accesskey="s" /></span>
+	</div>
+	
 </div>
 
-<div class="commentButton tRight">
-    <span class="button"><input type="button" value="{$lang->cmd_back}" onclick="location.href='{getUrl('act','')}'"/></span>
-    <span class="button"><input type="submit" value="{$lang->cmd_comment_registration}" accesskey="s" /></span>
-</div>
 
 </form>
 

modules/board/skins/xe_default/css/black.css

@@ -0,0 +1,148 @@
+@charset "utf-8"; 
+/* NHN > UIT Center > Open UI Platform Team > Jeong Chan Myeong(dece24@nhncorp.com) */
+
+body{ background:#444; color:#fff;}
+
+/* Board Reset */
+.board a{color:#fff;}
+
+/* Board Header */
+.boardHeader .boardTitle{ border-bottom-color:#999; background-image:url(../images/common/iconBoardHeading.gif);}
+.boardHeader .boardTitleText{ border-bottom-color:#ccc; background-image:url(../images/black/lineVr11.gif);}
+.boardHeader .boardTitleText a{ color:#fff;}
+.boardHeader .boardTitleText em{ color:#ccc;}
+.boardHeader .boardDescription{ background:#666; }
+
+/* Board Information */
+.boardInformation li{background-image:url(../images/black/lineVr11.gif);}
+.boardInformation em,
+.boardInformation strong{ color:#ff6600;}
+.boardInformation .infoLeft{ background-image:url(../images/common/iconArticle.gif);}
+.boardInformation .infoRight li.icon{ background:none;}
+.boardInformation .infoRight li.icon a{ background-image:url(../images/common/icons.gif);}
+
+/* Board List Form */
+.boardListForm em,
+.boardListForm strong{color:#ff6600;}
+
+/* Board List */
+.boardList{ border-top-color:#999; border-bottom-color:#999;}
+.boardList .jumpTo button{ background-color:transparent; background-image:url(../images/common/buttonBg2byte.gif);}
+.boardList tr.notice{ background:#555;}
+.boardList tr.bg1{ background:#494949;}
+.boardList tr.bg2{ background:#444;}
+.boardList th{ border-bottom-color:#333; color:#fff; background-color:#666; background-image:url(../images/black/bgThDefault.gif);}
+.boardList th a{ color:#ff6600;}
+.boardList td{ border-top-color:#999; color:#fff;}
+.boardList td .category{ color:#fff; background-image:url(../images/black/lineVr11.gif);}
+.boardList td.title .replyNum{ color:#ccc;}
+.boardList td.title .replyNum sup{ color:#999;}
+
+.boardList td.summary .thumb{ border-color:#999; background:#444;}
+
+.thumbHeader{ border-top-color:#999; border-bottom-color:#999; color:#333; background-color:#666; background-image:url(../images/black/bgThDefault.gif);}
+.thumbHeader a{ color:#ff6600;}
+.thumbHeader .jumpTo button{ background-color:transparent; background-image:url(../images/common/buttonBg2byte.gif);}
+
+.thumbList{ border-bottom-color:#999;}
+.thumbList li .thumb{ background:#444; border-color:#999;}
+.thumbList li .thumb a .text{ color:#ccc;}
+.thumbList li .thumb a .category{ background:#000; opacity:.6; filter:alpha(opacity=60); color:#fff;}
+
+/* Board Navigation */
+
+/* Search Form */
+.boardSearchForm .inputText{ border-color:#999;}
+
+/* Board Read */
+.boardReadBody{ border-top-color:#999; border-bottom-color:#999;}
+.boardReadBody .memberSignature{ border-color:#999;}
+
+.boardReadFooter{ color:#999;}
+.boardReadFooter a{ color:#999;}
+.boardReadFooter dt{ background:#444;}
+.boardReadFooter dd{ background-image:url(../images/black/lineVr11.gif);}
+.boardReadFooter .footerRight dl.noBr dt{ background-image:url(../images/black/lineVr11.gif);}
+
+.boardRead .boardNavigation{ border-top-color:#999;}
+
+.feedbackList{ color:#ccc;}
+.feedbackList .feedbackHeader{ color:#000;}
+.feedbackList .feedbackHeader strong{ color:#ff6600;}
+
+.feedbackList .item{ border-top-color:#999;}
+.feedbackList .reply .indent{ border-left-color:#999;}
+
+/* Time */
+.time *{ color:#ccc;}
+.time dt{ background:#444;}
+.time dd{ background-image:url(../images/black/lineVr11.gif);}
+
+/* Attached File */
+.attachedFile *{ color:#999;}
+.attachedFile dt{ background:#444;}
+.attachedFile dd{ background-image:url(../images/black/lineVr11.gif);}
+.attachedFile dd a{ color:#999;}
+.attachedFile dd a .bubble{ background:#666; border-color:#555;}
+
+.replyForm{ color:#666; background:#f4f4f4;}
+.replyForm .title{ color:#000;}
+.replyForm textarea{ border-color:#ccc;}
+.replyForm .inputText{ border-color:#ccc;}
+
+/* Board Write */
+.boardWrite .boardWriteHeader dd .inputText{ border-color:#ccc;}
+.boardWrite .tag input{ border-color:#ccc;}
+.boardWrite .boardNavigation,
+.boardEditor .boardNavigation{ border-top-color:#999;}
+
+/* UserName & Password */
+.board .userNameAndPw dd .inputText{ border-color:#ccc;}
+
+/* Comment */
+.board .boardEditor{ border-color:#999; background:#555;}
+.board .commentEditor .commentHeader{border-bottom-color:#999; color:#fff;}
+
+/* Secret Message */
+.board .secretMessage dd .inputText{ border-color:#ccc;}
+
+/* Layer */
+#waitingforserverresponse { border-color:#444; color:#444; background-color:#fff;}
+#popup_menu_area{background:#fff; border-color:#eee;}
+#popup_menu_area ul{ border-color:#ddd;}
+#popup_menu_area li a{ color:#000;}
+
+/* Pagination */
+.pagination.a1 a{ color:#fff;}
+.pagination a:hover,
+.pagination a:active,
+.pagination a:focus{ background-color:#505050 !important; }
+.pagination.a1 a,
+.pagination.a1 strong,
+.pagination.a2 a,
+.pagination.a2 strong{ border-color:#666;}
+.pagination.a1 a,
+.pagination.a1 strong,
+.pagination.a1 a.prev,
+.pagination.a1 a.prevEnd,
+.pagination.a1 a.next,
+.pagination.a1 a.nextEnd,
+.pagination.a2 a,
+.pagination.a2 strong,
+.pagination.a2 a.prev,
+.pagination.a2 a.prevEnd,
+.pagination.a2 a.next,
+.pagination.a2 a.nextEnd{ background-color:#444;}
+
+/* Editor */
+.editorTypeSelector a span{ color:#000;}
+
+/* Tag Cloud */
+.tagCloud .tagHeader{border-top-color:#999; border-bottom-color:#999; color:#fff; background-color:#666; background-image:url(../images/black/bgThDefault.gif);}
+.tagCloud li.rank1 a{ background:#12d763; color:#fff;}
+.tagCloud li.rank2 a{ color:#eee;}
+.tagCloud li.rank3 a{ color:#00b4b5;}
+.tagCloud li.rank4 a{ color:#ddd;}
+.tagCloud li.rank5 a{ color:#ccc;}
+
+

modules/board/skins/xe_default/css/board.css

@@ -1,54 +1,43 @@
 @charset "utf-8"; 
 /* NHN > UIT Center > Open UI Platform Team > Jeong Chan Myeong(dece24@nhncorp.com) */
 
-body{ background:#fff;}
-.displayNone{ display:none;}
-
 /* Board Reset */
-.board{ font-family:"나눔고딕", NanumGothic, "맑은 고딕", MalgunGothic, AppleGothic, "굴림", Gulim, "돋움", Dotum, Tahoma, Sans-serif; line-height:normal; font-size:.8em;}
+.board{ font-family:NanumGothic, MalgunGothic, AppleGothic, Gulim, Dotum, Tahoma, Sans-serif; line-height:normal; font-size:.8em;}
 .board *{ font-size:1em;}
 .board label{ cursor:pointer;}
 .board img{ border:0;}
-.board a{ text-decoration:none; color:#000;}
+.board a{ text-decoration:none;}
 .board a:hover,
 .board a:active,
 .board a:focus{ text-decoration:underline;}
 
-/* Board Type */
-.board.classic{}
-.board.zine{}
-.board.gallery{}
-
 /* Board Header */
-.boardHeader{}
 .boardHeader *{ margin:0; padding:0;}
-.boardHeader .boardTitle{ font-size:1.5em; letter-spacing:-.1em; margin-bottom:10px; border-bottom:3px solid #ddd; *zoom:1; background:url(../images/white/iconBoardHeading.gif) no-repeat left center;}
+.boardHeader .boardTitle{ font-size:1.5em; letter-spacing:-.1em; margin-bottom:10px; border-bottom:3px solid; *zoom:1; background-repeat:no-repeat; background-position:left center;}
 .boardHeader .boardTitle:after{ content:""; display:block; clear:both;}
-.boardHeader .boardTitleText{ float:left; clear:both; margin-bottom:-3px; padding:5px 15px 5px 22px; border-bottom:3px solid #666; background:url(../images/white/lineVr11.gif) no-repeat right bottom;}
-.boardHeader .boardTitleText a{ color:#000; text-decoration:none;}
-.boardHeader .boardTitleText em{ font-style:normal; font-weight:normal; color:#666;}
-.boardHeader .boardDescription{ position:relative; padding:7px 15px; -moz-border-radius:3px; -webkit-border-radius:3px; background:#f8f8f8; }
+.boardHeader .boardTitleText{ float:left; clear:both; margin-bottom:-3px; padding:5px 15px 5px 22px; border-bottom:3px solid; background-repeat:no-repeat; background-position:right bottom;}
+.boardHeader .boardTitleText a{ text-decoration:none;}
+.boardHeader .boardTitleText em{ font-style:normal; font-weight:normal;}
+.boardHeader .boardDescription{ position:relative; padding:7px 15px; -moz-border-radius:3px; -webkit-border-radius:3px; }
 
 /* Board Information */
 .boardInformation{ position:relative; width:100%; padding:10px 0; font-size:.85em; line-height:normal; *zoom:1;}
 .boardInformation *{ margin:0; padding:0;}
 .boardInformation:after{ content:""; display:block; float:none; clear:both;}
 .boardInformation ul{ position:relative; overflow:hidden;}
-.boardInformation li{ list-style:none; position:relative; left:-1px; display:block; float:left; padding:0 7px; background:url(../images/white/lineVr11.gif) no-repeat left center;}
-.boardInformation em,
-.boardInformation strong{ color:#ff6600;}
+.boardInformation li{ list-style:none; position:relative; left:-1px; display:block; float:left; padding:0 7px; background-repeat:no-repeat; background-position:left center;}
 .boardInformation strong{ font:bold 11px Tahoma;}
-.boardInformation .infoLeft{ padding-left:18px; float:left; background:url(../images/white/iconArticle.gif) no-repeat left center;}
+.boardInformation .infoLeft{ padding-left:18px; float:left; background-repeat:no-repeat; background-position:left center;}
 .boardInformation .infoRight{ float:right;}
-.boardInformation .infoRight li.icon{ background:none; padding:0; margin-right:3px;}
-.boardInformation .infoRight li.icon a{ display:block; float:left; width:12px; height:12px; overflow:hidden;}
+.boardInformation .infoRight li.icon{ padding:0; margin-right:3px;}
+.boardInformation .infoRight li.icon a{ display:block; float:left; width:12px; height:12px; overflow:hidden; background-repeat:no-repeat;}
 .boardInformation .infoRight li.icon a span{ display:block; width:12px; height:12px; position:relative; z-index:-1; visibility:hidden;}
-.boardInformation .infoRight li.rss a{ background:url(../images/white/iconRss.gif) no-repeat;}
-.boardInformation .infoRight li.tag_info a{ background:url(../images/white/iconTags.gif) no-repeat;}
-.boardInformation .infoRight li.listTypeClassic a{ background:url(../images/white/listTypeClassic.gif) no-repeat;}
-.boardInformation .infoRight li.listTypeZine a{ background:url(../images/white/listTypeZine.gif) no-repeat;}
-.boardInformation .infoRight li.listTypeGallery a{ background:url(../images/white/listTypeGallery.gif) no-repeat;}
-.boardInformation .infoRight li.contributors a{ background:url(../images/white/iconContributors.gif) no-repeat;}
+.boardInformation .infoRight li.rss a{ background-position:0 0;}
+.boardInformation .infoRight li.tag_info a{ background-position:-12px 0;}
+.boardInformation .infoRight li.listTypeClassic a{ background-position:-24px 0;}
+.boardInformation .infoRight li.listTypeZine a{ background-position:-36px 0;}
+.boardInformation .infoRight li.listTypeGallery a{ background-position:-48px 0;}
+.boardInformation .infoRight li.contributors a{ background-position:-60px 0;}
 
 /* Board List Form */
 .boardListForm{ margin:0; line-height:normal;}
@@ -57,59 +46,55 @@ body{ background:#fff;}
 .boardListForm fieldset:after{ content:""; display:block; float:none; clear:both;}
 .boardListForm legend{ position:absolute; width:0; height:0; overflow:hidden; font:0/0 Sans-serif; visibility:hidden;}
 .boardListForm em,
-.boardListForm strong{ font-style:normal; color:#ff6600;}
+.boardListForm strong{ font-style:normal;}
 
 /* Board List */
-.boardList{ border:0; border-top:1px solid #ddd; border-bottom:1px solid #ddd; width:100%;}
+.boardList{ border:0; border-top:1px solid; border-bottom:1px solid; width:100%;}
 .boardList .inputCheck{ width:13px; height:13px;}
 .boardList .jumpTo{ float:left;}
 .boardList .jumpTo *{ vertical-align:middle; *vertical-align:top;}
 .boardList .jumpTo select{ font-size:12px; *margin-right:5px;}
-.boardList .jumpTo button{ border:0; padding:0; margin:0; width:22px; height:20px; text-align:center; background:url(../images/white/buttonBg2byte.gif) no-repeat; font-size:11px; letter-spacing:-1px; cursor:pointer; line-height:20px;}
-.boardList tr.notice{ background:#f8f8f8;}
-.boardList tr.bg1{ background:#fff;}
-.boardList tr.bg2{ background:#fbfbfb;}
-.boardList th{ border:0; border-bottom:1px solid #fff; padding:7px; white-space:nowrap; text-align:center; color:#333; background:#fff url(../images/white/bgThDefault.gif) repeat-x left bottom; line-height:normal;}
+.boardList .jumpTo button{ border:0; padding:0; margin:0; width:22px; height:20px; text-align:center; background-repeat:no-repeat; font-size:11px; letter-spacing:-1px; cursor:pointer; line-height:20px;}
+.boardList th{ border:0; border-bottom:1px solid; padding:7px; white-space:nowrap; text-align:center; background-repeat:repeat-x; background-position:left bottom; line-height:normal;}
 .boardList th.title{ width:100%;}
-.boardList th a{ color:#1978AD;}
 .boardList th a .sort{ vertical-align:middle; margin:0 5px;}
-.boardList td{ border:0; border-top:1px solid #eee; padding:6px; white-space:nowrap; text-align:center; color:#666; line-height:normal; vertical-align:top;}
+.boardList td{ border:0; border-top:1px solid; padding:6px; white-space:nowrap; text-align:center; line-height:normal; vertical-align:top;}
 .boardList td.num{ font:11px Tahoma;}
 .boardList td.check{ font:11px Tahoma;}
-.boardList td .category{ color:#000; padding-right:7px; margin-right:2px; background:url(../images/white/lineVr11.gif) no-repeat right center;}
+.boardList td .category{ padding-right:7px; margin-right:2px; background-repeat:no-repeat; background-position:right center;}
 .boardList td.title{ width:100%; white-space:normal; text-align:left;}
-.boardList td.title .replyNum{ font:11px Tahoma; color:#ccc;}
-.boardList td.title .replyNum sup{ font:10px Tahoma; color:#999;}
+.boardList td.title .replyNum{ font:11px Tahoma;}
+.boardList td.title .replyNum sup{ font:10px Tahoma;}
 .boardList td.author{}
 .boardList td.reading{ font:11px Tahoma;}
 .boardList td.recommend{ font:11px Tahoma;}
 .boardList td.date{ font:11px Tahoma;}
 
 .boardList td.summary { text-align:left; border-top-style:dotted; white-space:normal;}
-.boardList td.summary .thumb{ display:block; float:left; padding:2px; border:1px solid #ddd; background:#fff; margin-right:10px;}
+.boardList td.summary .thumb{ display:block; float:left; padding:2px; border:1px solid; margin-right:10px;}
 .boardList td.summary .thumb img{ display:block;}
 
-.thumbHeader{ border:0; border-top:1px solid #ddd; border-bottom:1px solid #ddd; padding:7px; white-space:nowrap; color:#333; background:#fff url(../images/white/bgThDefault.gif) repeat-x left bottom; line-height:normal; text-align:right; *zoom:1;}
+.thumbHeader{ border:0; border-top:1px solid; border-bottom:1px solid; padding:7px; font-weight:bold; white-space:nowrap; background-repeat:repeat-x; background-position:left bottom; line-height:normal; text-align:right; *zoom:1;}
 .thumbHeader:after{ content:""; display:block; clear:both;}
 .thumbHeader .left{ float:left;}
 .thumbHeader .left input{ width:13px; height:13px; margin-right:10px;}
 .thumbHeader .right{ float:right;}
 .thumbHeader *{ vertical-align:middle;}
-.thumbHeader a{ margin:0 10px; color:#1978AD;}
+.thumbHeader a{ margin:0 10px;}
 .thumbHeader .jumpTo *{ vertical-align:middle; *vertical-align:top;}
 .thumbHeader .jumpTo select{ font-size:12px; *margin-right:5px;}
-.thumbHeader .jumpTo button{ border:0; padding:0; margin:0; width:22px; height:20px; text-align:center; background:url(../images/white/buttonBg2byte.gif) no-repeat; font-size:11px; letter-spacing:-1px; cursor:pointer; line-height:20px;}
+.thumbHeader .jumpTo button{ border:0; padding:0; margin:0; width:22px; height:20px; text-align:center; background-repeat:no-repeat; font-size:11px; letter-spacing:-1px; cursor:pointer; line-height:20px;}
 .thumbHeader .sort{ vertical-align:middle; margin:0 5px;}
 
-.thumbList{ border-bottom:1px solid #ddd; *zoom:1;}
+.thumbList{ border-bottom:1px solid; *zoom:1;}
 .thumbList:after{ content:""; display:block; clear:both;}
 .thumbList li{ margin:10px; list-style:none; overflow:hidden; float:left;}
-.thumbList li .thumb{ position:relative; float:left; clear:both; overflow:hidden; padding:2px; margin-bottom:5px; background:#fff; border:1px solid #ddd;}
+.thumbList li .thumb{ position:relative; float:left; clear:both; overflow:hidden; padding:2px; margin-bottom:5px; border:1px solid;}
 .thumbList li .thumb a{ position:relative; display:block;}
 .thumbList li .thumb a *{ cursor:pointer;}
 .thumbList li .thumb a img{ display:block;}
-.thumbList li .thumb a .text{ position:absolute; left:0; top:50%; margin-top:-.8em; *margin-top:-1.5em; display:block; width:100%; text-align:center; font-size:2em; font-weight:bold; color:#ccc; white-space:nowrap; letter-spacing:-1px;}
-.thumbList li .thumb a .category{ position:absolute; left:0; bottom:0; width:100%; padding:2px 0; background:#000; white-space:nowrap; opacity:.6; filter:alpha(opacity=60); color:#fff; text-indent:4px;}
+.thumbList li .thumb a .text{ position:absolute; left:0; top:50%; margin-top:-.8em; *margin-top:-1.5em; display:block; width:100%; text-align:center; font-size:2em; font-weight:bold; white-space:nowrap; letter-spacing:-1px;}
+.thumbList li .thumb a .category{ position:absolute; left:0; bottom:0; width:100%; padding:2px 0; white-space:nowrap; text-indent:4px;}
 .thumbList li .title{ clear:both; white-space:nowrap; margin-bottom:3px;}
 .thumbList li .title input{ width:13px; height:13px; vertical-align:middle; white-space:nowrap;}
 .thumbList li .author{}
@@ -118,11 +103,11 @@ body{ background:#fff;}
 .thumbList li .date{ font:11px Tahoma;}
 
 /* Board Navigation */
-.boardNavigation{ position:relative; padding:10px 0; *zoom:1; text-align:center;}
-.boardNavigation:after{ content:""; display:block; float:none; clear:both;}
-.boardNavigation .pagination{ padding:5px 0;}
-.boardNavigation .buttonLeft{ float:left; text-align:left;}
-.boardNavigation .buttonRight{ float:right; text-align:right;}
+.board .boardNavigation{ position:relative; padding:10px 0; *zoom:1; text-align:center;}
+.board .boardNavigation:after{ content:""; display:block; float:none; clear:both;}
+.board .boardNavigation .pagination{ padding:5px 0;}
+.board .boardNavigation .buttonLeft{ float:left; text-align:left;}
+.board .boardNavigation .buttonRight{ float:right; text-align:right;}
 
 /* Search Form */
 .boardSearchForm{ margin:0; font-size:.75em; line-height:normal;}
@@ -132,7 +117,7 @@ body{ background:#fff;}
 .boardSearchForm fieldset *{ vertical-align:middle;}
 .boardSearchForm legend{ position:absolute; width:0; height:0; overflow:hidden; font:0/0 Sans-serif; visibility:hidden;}
 .boardSearchForm select{ font-size:12px; height:23px;}
-.boardSearchForm .inputText{ border:1px solid #ccc; width:140px; height:15px; padding:4px 4px 2px 4px; font-size:12px; *margin:-1px 0;}
+.boardSearchForm .inputText{ border:1px solid; width:140px; height:15px; padding:4px 4px 2px 4px; font-size:12px; *margin:-1px 0;}
 
 /* Board Read */
 .boardRead{}
@@ -144,37 +129,36 @@ body{ background:#fff;}
 .boardReadHeader em{ position:relative; top:5px; float:right; font-style:normal; font-weight:bold; font-size:1em;}
 .boardReadHeader a{ font-weight:bold; font-size:1em;}
 
-.boardReadBody{ padding:15px 0; border-top:1px solid #ddd; border-bottom:1px solid #ddd; line-height:1.5em;}
+.boardReadBody{ padding:15px 0; border-top:1px solid; border-bottom:1px solid; line-height:1.5em;}
 .boardReadBody .document_popup_menu{ margin-top:20px; text-align:right;}
 .boardReadBody .document_popup_menu a{ text-decoration:underline;}
 .boardReadBody .xe_content{ margin-bottom:15px;}
-.boardReadBody .memberSignature{ border:1px dotted #ddd;}
+.boardReadBody .memberSignature{ border:1px dotted;}
 .boardReadBody .memberSignature .signature{ margin:10px;}
 
-.boardReadFooter{ padding:10px 0; *zoom:1; color:#666; line-height:1em; font:11px Tahoma;}
+.boardReadFooter{ padding:10px 0; *zoom:1; line-height:1em; font:11px Tahoma;}
 .boardReadFooter:after{ content:""; display:block; float:none; clear:both;}
 .boardReadFooter *{ margin:0; padding:0;}
-.boardReadFooter a{ color:#666; text-decoration:underline; position:relative;}
+.boardReadFooter a{ text-decoration:underline; position:relative;}
 .boardReadFooter .footerLeft{ float:left;}
 .boardReadFooter .footerRight{ float:right;}
 .boardReadFooter dl{ clear:both; position:relative;}
-.boardReadFooter dt{ position:relative; z-index:2; display:inline; padding-right:5px; font-weight:bold; background:#fff;}
-.boardReadFooter dd{ position:relative; z-index:1; left:-5px; display:inline; padding-left:7px; margin-right:5px; background:url(../images/white/lineVr11.gif) no-repeat left center; *zoom:1;}
+.boardReadFooter dt{ position:relative; z-index:2; display:inline; padding-right:5px; font-weight:bold;}
+.boardReadFooter dd{ position:relative; z-index:1; left:-5px; display:inline; padding-left:7px; margin-right:5px; background-repeat:no-repeat; background-position:left center; *zoom:1;}
 .boardReadFooter .footerRight dl{ float:right;}
 .boardReadFooter .footerRight dl.noBr{ position:relative; left:5px; float:right; clear:both; overflow:hidden; white-space:nowrap;}
-.boardReadFooter .footerRight dl.noBr dt{ position:relative; left:-1px; padding-left:10px; background:url(../images/white/lineVr11.gif) no-repeat left center;}
+.boardReadFooter .footerRight dl.noBr dt{ position:relative; left:-1px; padding-left:10px; background-repeat:no-repeat; background-position:left center;}
 .boardReadFooter .footerRight dl.noBr dd{ margin-right:5px;}
 
-.boardRead .boardNavigation{ border-top:1px solid #ddd;}
+.boardRead .boardNavigation{ border-top:1px solid;}
 
-.feedbackList{ position:relative; overflow:hidden; padding-top:15px; margin-bottom:10px; color:#666;}
+.feedbackList{ position:relative; overflow:hidden; padding-top:15px; margin-bottom:10px; }
 .feedbackList *{ margin:0; padding:0;}
-.feedbackList .feedbackHeader{ position:relative; font-weight:bold; color:#000; margin-bottom:10px; font-size:1.5em;}
-.feedbackList .feedbackHeader strong{ color:#ff6600;}
+.feedbackList .feedbackHeader{ position:relative; font-weight:bold; margin-bottom:10px; font-size:1.5em;}
 
-.feedbackList .item{ position:relative; padding-top:10px; margin-bottom:10px; border-top:1px dashed #ddd;}
+.feedbackList .item{ position:relative; padding-top:10px; margin-bottom:10px; border-top:1px dashed;}
 .feedbackList .item .indent{ position:relative;}
-.feedbackList .reply .indent{ border-left:2px solid #eee; padding-left:10px;}
+.feedbackList .reply .indent{ border-left:2px solid; padding-left:10px;}
 .feedbackList .item .header{ font-size:1.5em; margin-bottom:5px;}
 .feedbackList .item .header a{ font-size:1em;}
 .feedbackList .item .comment_popup_menu{ text-align:right; margin-bottom:10px;}
@@ -183,31 +167,31 @@ body{ background:#fff;}
 
 /* Time */
 .time{ position:absolute; top:10px; right:0;}
-.time *{ position:relative; font-size:11px; font-family:Tahoma; color:#666; display:inline;}
-.time dt{ z-index:2; display:inline; padding-right:5px; font-weight:bold; background:#fff;}
-.time dd{ z-index:1; left:-5px; display:inline; padding-left:7px; margin-right:3px; background:url(../images/white/lineVr11.gif) no-repeat left center;}
+.time *{ position:relative; font-size:11px; font-family:Tahoma; display:inline;}
+.time dt{ z-index:2; display:inline; padding-right:5px; font-weight:bold;}
+.time dd{ z-index:1; left:-5px; display:inline; padding-left:7px; margin-right:3px; background-repeat:no-repeat; background-position:left center;}
 
 /* Attached File */
 .attachedFile{ position:relative; margin:0; padding:0; border:none;}
 .item .attachedFile{ position:absolute; left:0; bottom:0;}
 .reply .attachedFile{ position:absolute; left:10px; bottom:0;}
-.attachedFile *{ position:relative; font-size:11px; font-family:Tahoma; color:#666; display:inline;}
-.attachedFile dt{ z-index:2; display:inline; padding-right:5px; font-weight:bold; background:#fff;}
-.attachedFile dd{ z-index:1; left:-5px; display:inline; padding-left:7px; margin-right:5px; background:url(../images/white/lineVr11.gif) no-repeat left center; *zoom:1;}
-.attachedFile dd a{ position:relative; text-decoration:underline; color:#666;}
-.attachedFile dd a .bubble{ position:absolute; display:none; text-decoration:none; background:#f8f8f8; white-space:nowrap; border:1px solid #ddd; padding:2px 5px; left:0; top:-20px; cursor:pointer;}
+.attachedFile *{ position:relative; font-size:11px; font-family:Tahoma; display:inline;}
+.attachedFile dt{ z-index:2; display:inline; padding-right:5px; font-weight:bold;}
+.attachedFile dd{ z-index:1; left:-5px; display:inline; padding-left:7px; margin-right:5px; background-repeat:no-repeat; background-position:left center; *zoom:1;}
+.attachedFile dd a{ position:relative; text-decoration:underline;}
+.attachedFile dd a .bubble{ position:absolute; display:none; text-decoration:none; white-space:nowrap; border:1px solid; padding:2px 5px; left:0; top:-20px; cursor:pointer;}
 .attachedFile dd a:hover .bubble,
 .attachedFile dd a:active .bubble,
 .attachedFile dd a:focus .bubble{ display:block;}
 
-.replyForm{ padding:10px 20px 15px 20px; font-size:.75em; color:#666; margin-bottom:20px; background:#f4f4f4; -moz-border-radius:10px; -webkit-border-radius:10px;}
+.replyForm{ padding:10px 20px 15px 20px; font-size:.75em; margin-bottom:20px; -moz-border-radius:10px; -webkit-border-radius:10px;}
 .replyForm *{ margin:0; padding:0;}
 .replyForm fieldset{ border:0; position:relative;}
 .replyForm fieldset:after{ content:""; display:block; float:none; clear:both;}
 .replyForm legend{ position:absolute; width:0; height:0; overflow:hidden; font:0/0 Sans-serif; visibility:hidden;}
-.replyForm .title{ font-weight:bold; font-size:1.5em; color:#000; margin-bottom:10px;}
-.replyForm textarea{ position:relative; width:95%; height:150px; border:1px solid #ccc; font-size:1em; overflow:auto; padding:10px; margin-bottom:10px;}
-.replyForm .inputText{ border:1px solid #ccc; padding:2px 4px 4px 4px; width:190px; height:15px; vertical-align:middle; *margin:-1px 0;}
+.replyForm .title{ font-weight:bold; font-size:1.5em; margin-bottom:10px;}
+.replyForm textarea{ position:relative; width:95%; height:150px; border:1px solid; font-size:1em; overflow:auto; padding:10px; margin-bottom:10px;}
+.replyForm .inputText{ border:1px solid; padding:2px 4px 4px 4px; width:190px; height:15px; vertical-align:middle; *margin:-1px 0;}
 .replyForm dl{ margin-bottom:10px;}
 .replyForm dt{ width:80px; float:left; padding-top:6px; font-weight:bold;}
 .replyForm dd{ margin-bottom:5px;}
@@ -220,20 +204,11 @@ body{ background:#fff;}
 .boardWrite legend{ position:absolute; width:0; height:0; overflow:hidden; font:0/0 Sans-serif; visibility:hidden;}
 
 .boardWrite .boardWriteHeader dl{ margin-bottom:5px;}
-.boardWrite .boardWriteHeader dl *{ vertical-align:middle; font-family:inherit; font-size:inherit;}
+.boardWrite .boardWriteHeader dl *{ vertical-align:middle;}
 .boardWrite .boardWriteHeader dt{ font-weight:bold; display:inline;}
 .boardWrite .boardWriteHeader dd{ display:inline;}
-.boardWrite .boardWriteHeader .inputText{ border:1px solid #ccc; padding:2px 4px 4px 4px; height:15px; *margin:-1px 0;}
-
-.boardWrite .boardWriteHeader .userNameAndPw{ margin:0;}
-.boardWrite .boardWriteHeader .userNameAndPw dl{ display:inline; white-space:nowrap;}
-.boardWrite .boardWriteHeader .userNameAndPw dt{ position:relative; top:-3px;}
-.boardWrite .boardWriteHeader .userNameAndPw dd{ margin-right:5px;}
-.boardWrite .boardWriteHeader .userNameAndPw dd .inputText{ margin-bottom:5px;}
-.boardWrite .boardWriteHeader .userNameAndPw dd.userName .inputText{ width:80px;}
-.boardWrite .boardWriteHeader .userNameAndPw dd.userPw .inputText{ width:80px;}
-.boardWrite .boardWriteHeader .userNameAndPw dd.emailAddress .inputText{ width:120px;}
-.boardWrite .boardWriteHeader .userNameAndPw dd.homePage .inputText{ width:120px;}
+.boardWrite .boardWriteHeader dd select{ font-size:12px; vertical-align:top; height:23px;}
+.boardWrite .boardWriteHeader dd .inputText{ border:1px solid; padding:3px 4px; height:15px; margin-bottom:5px; font-size:12px; *margin-top:-1px;}
 
 .boardWrite .boardWriteHeader dl.title dd{ white-space:nowrap;}
 .boardWrite .boardWriteHeader dl.title dd .inputText{ width:60%;}
@@ -241,30 +216,46 @@ body{ background:#fff;}
 .boardWrite .boardWriteHeader dl.option input{ width:13px; height:13px;}
 .boardWrite .boardWriteHeader dl.option dd{ margin-right:5px; white-space:nowrap;}
 
-.boardWrite .boardWriteBody{ margin-bottom:10px;}
-.boardWrite .boardWriteBody dt{ padding-top:30px;}
-.boardWrite .boardWriteBody dd{ _zoom:1;}
-.boardWrite .boardWriteBody .styleText,
-.boardWrite .boardWriteBody .plainText,
-.boardWrite .boardWriteBody .htmlText{ display:none;}
-.boardWrite .boardWriteBody iframe,
-.boardWrite .boardWriteBody textarea{ width:95%; height:300px; border:1px solid #ccc; padding:10px; overflow:auto; font-size:1em; margin-bottom:10px;}
-.boardWrite .boardWriteBody .plainText textarea{ *margin:-1px 0;}
-.boardWrite .boardWriteBody .active{ display:block;}
-.boardWrite .boardWriteBody ul{ float:right; position:relative; right:4%;}
-.boardWrite .boardWriteBody li{ float:left; background:#eee; -moz-border-radius-topleft:5px; -moz-border-radius-topright:5px; -webkit-border-radius-topleft:5px; -webkit-border-radius-topright:5px; margin-left:5px;}
-.boardWrite .boardWriteBody li a{ display:block; float:left; text-decoration:none; color:#000; height:20px; padding:7px 15px 0 15px; letter-spacing:-1px;}
-.boardWrite .boardWriteBody li.active a{ font-weight:bold;}
-.boardWrite .boardWriteFooter .inputFile{ width:97%; border:1px solid #ccc; padding:2px 4px 4px 4px; height:23px;}
-.boardWrite .boardNavigation{ padding:10px 0; clear:both;}
+.boardWrite .tag{ clear:both; margin-bottom:10px; *zoom:1;}
+.boardWrite .tag:after{ content:""; display:block; float:none; clear:both;}
+.boardWrite .tag input{ float:left; border:1px solid; width:330px; padding:4px 4px 2px 4px; margin-right:10px; font-size:12px;}
+.boardWrite .tag p{ float:left;}
+
+.boardWrite .boardNavigation,
+.boardEditor .boardNavigation{ border-top:1px solid;}
+
+/* UserName & Password */
+.board .userNameAndPw{ margin:0;}
+.board .userNameAndPw dl{ display:inline; white-space:nowrap;}
+.board .userNameAndPw dt{ position:relative; top:-3px; font-weight:bold; display:inline;}
+.board .userNameAndPw dd{ margin-right:5px; display:inline;}
+.board .userNameAndPw dd .inputText{}
+.board .userNameAndPw dd.userName .inputText{ width:80px;}
+.board .userNameAndPw dd.userPw .inputText{ width:80px;}
+.board .userNameAndPw dd.emailAddress .inputText{ width:120px;}
+.board .userNameAndPw dd.homePage .inputText{ width:120px;}
+.board .userNameAndPw dd .inputText{ border:1px solid; padding:3px 4px; height:15px; margin-bottom:5px; font-size:12px; *margin-top:-1px; vertical-align:middle;}
+
+/* Comment */
+.board .boardEditor{ border:1px solid; margin-bottom:20px;}
+.board .boardEditor .commentEditor{ margin:10px 15px;}
+.board .commentEditor .commentHeader{position:relative; border-bottom:1px solid; font-weight:bold; padding-bottom:5px; margin-bottom:10px; font-size:1.5em;}
+
+/* Secret Message */
+.board .secretMessage{ margin:0;}
+.board .secretMessage p{ text-align:center; margin:0; font-size:2em;}
+.board .secretMessage dl{ text-align:center; margin:15px 0;}
+.board .secretMessage dt{ font-weight:bold; display:inline;}
+.board .secretMessage dd{ margin:0; display:inline;}
+.board .secretMessage dd .inputText{ border:1px solid; padding:3px 4px; height:15px; vertical-align:middle; margin-right:5px;}
 
 /* Layer */
-#waitingforserverresponse { border:2px solid #444444; font-weight:bold; color:#444444; padding: 7px 5px 5px 25px; background:#FFFFFF url("../tpl/images/loading.gif") no-repeat 5px 5px; top:40px; left:40px; position:absolute; z-index:100; visibility:hidden; }
-#popup_menu_area{ position:absolute; background:#fff; border:2px solid #eee; -moz-border-radius:5px; -webkit-border-radius:5px; margin:0; padding:0; z-index:100;}
+#waitingforserverresponse { border:2px solid; font-weight:bold; padding: 7px 5px 5px 25px; top:40px; left:40px; position:absolute; z-index:100; visibility:hidden; }
+#popup_menu_area{ position:absolute; border:2px solid; -moz-border-radius:5px; -webkit-border-radius:5px; margin:0; padding:0; z-index:100;}
 #popup_menu_area *{ margin:0; padding:0; list-style:none; font-size:12px; line-height:normal;}
-#popup_menu_area ul{ border:1px solid #ddd; -moz-border-radius:3px; -webkit-border-radius:3px; padding:10px;}
+#popup_menu_area ul{ border:1px solid; -moz-border-radius:3px; -webkit-border-radius:3px; padding:10px;}
 #popup_menu_area li{ padding-left:20px; background-repeat:no-repeat; background-position:left center; margin-bottom:3px; *margin-bottom:-2px;}
-#popup_menu_area li a{ text-decoration:none; color:#000; white-space:nowrap;}
+#popup_menu_area li a{ text-decoration:none; white-space:nowrap;}
 #popup_menu_area li a:hover,
 #popup_menu_area li a:active,
 #popup_menu_area li a:focus{ font-weight:bold; letter-spacing:-1px;}

modules/board/skins/xe_default/css/pagination.css

@@ -19,51 +19,44 @@
 /* Pagination A1 */
 .pagination.a1 a,
 .pagination.a1 strong{ margin:0 -4px; padding:1px 10px 1px 8px; border:none; border-left:1px solid #ccc; border-right:1px solid #ddd; font-weight:bold; font-size:12px; background:#fff;}
-.pagination.a1 a.prev{ padding-left:10px; background:#fff url(../images/white/arrowPrevA1.gif) no-repeat left center; }
-.pagination.a1 a.prevEnd{ padding-left:15px; background:#fff url(../images/white/arrowPrevEndA1.gif) no-repeat left center; }
-.pagination.a1 a.next{ padding-right:10px; background:#fff url(../images/white/arrowNextA1.gif) no-repeat right center; }
-.pagination.a1 a.nextEnd{ padding-right:15px; background:#fff url(../images/white/arrowNextEndA1.gif) no-repeat right center; }
+.pagination.a1 a.prev{ padding-left:10px; background:#fff url(../images/common/arrowPrevA1.gif) no-repeat left center; }
+.pagination.a1 a.prevEnd{ padding-left:15px; background:#fff url(../images/common/arrowPrevEndA1.gif) no-repeat left center; }
+.pagination.a1 a.next{ padding-right:10px; background:#fff url(../images/common/arrowNextA1.gif) no-repeat right center; }
+.pagination.a1 a.nextEnd{ padding-right:15px; background:#fff url(../images/common/arrowNextEndA1.gif) no-repeat right center; }
 
 /* Pagination A2 */
 .pagination.a2 a,
 .pagination.a2 strong{ margin:0 -4px; padding:0 10px 0 8px; font-weight:bold; font-size:11px; border:none; border-left:1px solid #ddd; border-right:1px solid #ccc; background:#fff; }
-.pagination.a2 a.prev{ padding-left:10px; background:#fff url(../images/white/arrowPrevA1.gif) no-repeat left center; }
-.pagination.a2 a.prevEnd{ padding-left:15px; background:#fff url(../images/white/arrowPrevEndA1.gif) no-repeat left center; }
-.pagination.a2 a.next{ padding-right:10px; background:#fff url(../images/white/arrowNextA1.gif) no-repeat right center; }
-.pagination.a2 a.nextEnd{ padding-right:15px; background:#fff url(../images/white/arrowNextEndA1.gif) no-repeat right center; }
+.pagination.a2 a.prev{ padding-left:10px; background:#fff url(../images/common/arrowPrevA1.gif) no-repeat left center; }
+.pagination.a2 a.prevEnd{ padding-left:15px; background:#fff url(../images/common/arrowPrevEndA1.gif) no-repeat left center; }
+.pagination.a2 a.next{ padding-right:10px; background:#fff url(../images/common/arrowNextA1.gif) no-repeat right center; }
+.pagination.a2 a.nextEnd{ padding-right:15px; background:#fff url(../images/common/arrowNextEndA1.gif) no-repeat right center; }
 
 /* Pagination B1 */
 .pagination.b1 a,
 .pagination.b1 strong{ margin:0 -2px; padding:2px 8px; font-weight:bold; font-size:12px;}
-.pagination.b1 a.prev{ padding-left:16px; background:url(../images/white/arrowPrevB1.gif) no-repeat left center; }
-.pagination.b1 a.next{ padding-right:16px; background:url(../images/white/arrowNextB1.gif) no-repeat right center; }
+.pagination.b1 a.prev{ padding-left:16px; background:url(../images/common/arrowPrevB1.gif) no-repeat left center; }
+.pagination.b1 a.next{ padding-right:16px; background:url(../images/common/arrowNextB1.gif) no-repeat right center; }
 
 /* Pagination B2 */
 .pagination.b2 a,
 .pagination.b2 strong{ margin:0 -2px; padding:2px 6px; font-size:11px;}
-.pagination.b2 a.prev{ padding-left:12px; background:url(../images/white/arrowPrevB1.gif) no-repeat left center; }
-.pagination.b2 a.next{ padding-right:12px; background:url(../images/white/arrowNextB1.gif) no-repeat right center; }
+.pagination.b2 a.prev{ padding-left:12px; background:url(../images/common/arrowPrevB1.gif) no-repeat left center; }
+.pagination.b2 a.next{ padding-right:12px; background:url(../images/common/arrowNextB1.gif) no-repeat right center; }
 
 /* Pagination C1 */
 .pagination.c1 a,
 .pagination.c1 strong{ margin:0 -2px; padding:2px 4px; font-size:12px;}
 .pagination.c1 a.prev,
-.pagination.c1 a.next{ display:inline-block; width:13px; height:14px; padding:3px 4px; margin:0;}
-.pagination.c1 a.prev{ background:url(../images/white/arrowPrevC1.gif) no-repeat center;}
-.pagination.c1 a.next{ background:url(../images/white/arrowNextC1.gif) no-repeat center;}
-.pagination.c1 a.prev span,
-.pagination.c1 a.next span{ position:absolute; width:0; height:0; overflow:hidden; visibility:hidden;}
+.pagination.c1 a.next{ display:inline-block; width:13px; height:14px; padding:3px 4px; margin:0; font-size:0; line-height:0;}
+.pagination.c1 a.prev{ background:url(../images/common/arrowPrevC1.gif) no-repeat center;}
+.pagination.c1 a.next{ background:url(../images/common/arrowNextC1.gif) no-repeat center;}
 
 /* Pagination C2 */
 .pagination.c2 a,
 .pagination.c2 strong{ margin:0 -2px; padding:2px 4px; font-size:11px;}
 .pagination.c2 a.prev,
-.pagination.c2 a.next{ display:inline-block; width:13px; height:14px; padding:3px 4px; margin:0;}
-.pagination.c2 a.prev{ background:url(../images/white/arrowPrevC1.gif) no-repeat center;}
-.pagination.c2 a.next{ background:url(../images/white/arrowNextC1.gif) no-repeat center;}
-.pagination.c2 a.prev span,
-.pagination.c2 a.next span{ position:absolute; width:0; height:0; overflow:hidden; visibility:hidden;}
-
-
-
+.pagination.c2 a.next{ display:inline-block; width:13px; height:14px; padding:3px 4px; margin:0; font-size:0; line-height:0;}
+.pagination.c2 a.prev{ background:url(../images/common/arrowPrevC1.gif) no-repeat center;}
+.pagination.c2 a.next{ background:url(../images/common/arrowNextC1.gif) no-repeat center;}
 

modules/board/skins/xe_default/css/white.css

@@ -0,0 +1,113 @@
+@charset "utf-8"; 
+/* NHN > UIT Center > Open UI Platform Team > Jeong Chan Myeong(dece24@nhncorp.com) */
+
+body{ background:#fff; color:#333;}
+
+/* Board Reset */
+.board a{color:#000;}
+
+/* Board Header */
+.boardHeader .boardTitle{ border-bottom-color:#ddd; background-image:url(../images/common/iconBoardHeading.gif);}
+.boardHeader .boardTitleText{ border-bottom-color:#666; background-image:url(../images/white/lineVr11.gif);}
+.boardHeader .boardTitleText a{ color:#000;}
+.boardHeader .boardTitleText em{ color:#666;}
+.boardHeader .boardDescription{ background:#f8f8f8; }
+
+/* Board Information */
+.boardInformation li{background-image:url(../images/white/lineVr11.gif);}
+.boardInformation em,
+.boardInformation strong{ color:#ff6600;}
+.boardInformation .infoLeft{ background-image:url(../images/common/iconArticle.gif);}
+.boardInformation .infoRight li.icon{ background:none;}
+.boardInformation .infoRight li.icon a{ background-image:url(../images/common/icons.gif);}
+
+/* Board List Form */
+.boardListForm em,
+.boardListForm strong{color:#ff6600;}
+
+/* Board List */
+.boardList{ border-top-color:#ddd; border-bottom-color:#ddd;}
+.boardList .jumpTo button{ background-color:transparent; background-image:url(../images/common/buttonBg2byte.gif);}
+.boardList tr.notice{ background:#f8f8f8;}
+.boardList tr.bg1{ background:#fff;}
+.boardList tr.bg2{ background:#fbfbfb;}
+.boardList th{ border-bottom-color:#fff; color:#333; background-color:#fff; background-image:url(../images/white/bgThDefault.gif);}
+.boardList th a{ color:#1978AD;}
+.boardList td{ border-top-color:#eee; color:#666;}
+.boardList td .category{ color:#000; background-image:url(../images/white/lineVr11.gif);}
+.boardList td.title .replyNum{ color:#ccc;}
+.boardList td.title .replyNum sup{ color:#999;}
+
+.boardList td.summary .thumb{ border-color:#ddd; background:#fff;}
+
+.thumbHeader{ border-top-color:#ddd; border-bottom-color:#ddd; color:#333; background-color:#fff; background-image:url(../images/white/bgThDefault.gif);}
+.thumbHeader a{ color:#1978AD;}
+.thumbHeader .jumpTo button{ background-image:url(../images/common/buttonBg2byte.gif);}
+
+.thumbList{ border-bottom-color:#ddd;}
+.thumbList li .thumb{ background:#fff; border-color:#ddd;}
+.thumbList li .thumb a .text{ color:#ccc;}
+.thumbList li .thumb a .category{ background:#000; opacity:.6; filter:alpha(opacity=60); color:#fff;}
+
+/* Board Navigation */
+
+/* Search Form */
+.boardSearchForm .inputText{ border-color:#ccc;}
+
+/* Board Read */
+.boardReadBody{ border-top-color:#ddd; border-bottom-color:#ddd;}
+.boardReadBody .memberSignature{ border-color:#ddd;}
+
+.boardReadFooter{ color:#666;}
+.boardReadFooter a{ color:#666;}
+.boardReadFooter dt{ background:#fff;}
+.boardReadFooter dd{ background-image:url(../images/white/lineVr11.gif);}
+.boardReadFooter .footerRight dl.noBr dt{ background-image:url(../images/white/lineVr11.gif);}
+
+.boardRead .boardNavigation{ border-top-color:#ddd;}
+
+.feedbackList{ color:#666;}
+.feedbackList .feedbackHeader{ color:#000;}
+.feedbackList .feedbackHeader strong{ color:#ff6600;}
+
+.feedbackList .item{ border-top-color:#ddd;}
+.feedbackList .reply .indent{ border-left-color:#eee;}
+
+/* Time */
+.time *{ color:#666;}
+.time dt{ background:#fff;}
+.time dd{ background-image:url(../images/white/lineVr11.gif);}
+
+/* Attached File */
+.attachedFile *{ color:#666;}
+.attachedFile dt{ background:#fff;}
+.attachedFile dd{ background-image:url(../images/white/lineVr11.gif);}
+.attachedFile dd a{ color:#666;}
+.attachedFile dd a .bubble{ background:#f8f8f8; border-color:#ddd;}
+
+.replyForm{ color:#666; background:#f4f4f4;}
+.replyForm .title{ color:#000;}
+.replyForm textarea{ border-color:#ccc;}
+.replyForm .inputText{ border-color:#ccc;}
+
+/* Board Write */
+.boardWrite .boardWriteHeader dd .inputText{ border-color:#ccc;}
+.boardWrite .tag input{ border-color:#ccc;}
+.boardWrite .boardNavigation,
+.boardEditor .boardNavigation{ border-top-color:#ddd;}
+
+/* UserName & Password */
+.board .userNameAndPw dd .inputText{ border-color:#ccc;}
+
+/* Comment */
+.board .boardEditor{ border-color:#ddd; background:#f8f8f8;}
+.board .commentEditor .commentHeader{border-bottom-color:#ddd; color:#000;}
+
+/* Secret Message */
+.board .secretMessage dd .inputText{ border-color:#ccc;}
+
+/* Layer */
+#waitingforserverresponse { border-color:#444; color:#444; background-color:#fff;}
+#popup_menu_area{background:#fff; border-color:#eee;}
+#popup_menu_area ul{ border-color:#ddd;}
+#popup_menu_area li a{ color:#000;}

modules/board/skins/xe_default/list.html

@@ -37,7 +37,7 @@
         </div>
 
         <div class="buttonRight">
-            <a href="{getUrl('act','dispBoardWrite','document_srl','')}" class="button green"><span>{$lang->cmd_write}</span></a>
+            <a href="{getUrl('act','dispBoardWrite','document_srl','')}" class="button green strong"><span>{$lang->cmd_write}</span></a>
         </div>
 
     <!-- 페이지 네비게이션 -->
@@ -68,7 +68,7 @@
 					<option value="{$key}" <!--@if($search_target==$key)-->selected="selected"<!--@end-->>{$val}</option>
 					<!--@end-->
 				</select>
-				<input type="text" name="search_keyword" value="{htmlspecialchars($search_keyword)}" class="inputText"/>
+				<input type="text" name="search_keyword" value="{htmlspecialchars($search_keyword)}" class="inputText" accesskey="S" title="{$lang->cmd_search}" />
 				<!--@if($last_division)-->
 					<a href="{getUrl('page',1,'document_srl','','division',$last_division,'last_division','')}" class="button"><span>{$lang->cmd_search_next}</span></a>
 				<!--@end-->

modules/board/skins/xe_default/view_document.html

@@ -42,17 +42,18 @@
 	<div class="boardReadBody">
 		<!--@if($oDocument->isSecret() && !$oDocument->isGranted())-->
 			<!--%import("filter/input_password.xml")-->
-			<div class="secretContent">
-				<form action="./" method="get" onsubmit="return procFilter(this, input_password)">
-				<input type="hidden" name="mid" value="{$mid}" />
-				<input type="hidden" name="page" value="{$page}" />
-				<input type="hidden" name="document_srl" value="{$oDocument->document_srl}" />
+			<form action="./" method="get" onsubmit="return procFilter(this, input_password)" class="secretMessage">
+			<input type="hidden" name="mid" value="{$mid}" />
+			<input type="hidden" name="page" value="{$page}" />
+			<input type="hidden" name="document_srl" value="{$oDocument->document_srl}" />
 
-					<div class="title">{$lang->msg_is_secret}</div>
-					<div class="content"><input type="password" name="password" id="cpw" class="inputTypeText" /><span class="button"><input type="submit" value="{$lang->cmd_input}" accesskey="s" /></span></div>
+				<p>&quot;{$lang->msg_is_secret}&quot;</p>
+				<dl>
+					<dt><label for="cpw">비밀번호</label> :</dt>
+					<dd><input type="password" name="password" id="cpw" class="inputText" /><span class="button red"><input type="submit" value="{$lang->cmd_input}" /></span></dd>
+				</dl>
 
-				</form>
-			</div>
+			</form>
 		<!--@else-->
 			{$oDocument->getContent()}
 		<!--@end-->
@@ -168,19 +169,28 @@
     <input type="hidden" name="comment_srl" value="" />
     <input type="hidden" name="content" value="" />
         <div class="boardWrite commentEditor">
+
+		<h3 class="commentHeader">댓글 쓰기</h3>
+
             <div class="userNameAndPw">
                 <!--@if(!$is_logged)-->
-                <label for="userName">{$lang->writer}</label>
-                <input type="text" name="nick_name" value="" class="userName inputTypeText" id="userName"/>
+				<dl>
+					<dt><label for="userName">{$lang->writer}</label> :</dt>
+					<dd class="userName"><input type="text" name="nick_name" value="{$oDocument->getNickName()}" class="inputText" id="userName"/></dd>
+				</dl>
+				<dl>
+					<dt><label for="userPw">{$lang->password}</label> :</dt>
+					<dd class="userPw"><input type="password" name="password" value="" id="userPw" class="inputText" /></dd>
+				</dl>
+				<dl>
+					<dt><label for="emailAddress">{$lang->email_address}</label> :</dt>
+					<dd class="emailAddress"><input type="text" name="email_address" value="{htmlspecialchars($oDocument->get('email_address'))}" id="emailAddress" class="inputText"/></dd>
+				</dl>
+				<dl>
+					<dt><label for="homePage">{$lang->homepage}</label> :</dt>
+					<dd class="homePage"><input type="text" name="homepage" value="{htmlspecialchars($oDocument->get('homepage'))}" id="homePage" class="inputText"/></dd>
+				</dl>
 
-                <label for="userPw">{$lang->password}</label>
-                <input type="password" name="password" value="" id="userPw" class="userPw inputTypeText" />
-
-                <label for="emailAddress">{$lang->email_address}</label>
-                <input type="text" name="email_address" value="" id="emailAddress" class="emailAddress inputTypeText"/>
-
-                <label for="homePage">{$lang->homepage}</label>
-                <input type="text" name="homepage" value="" id="homePage" class="homePage inputTypeText"/>
                 <!--@else-->
                 <input type="checkbox" name="notify_message" value="Y" id="notify_message" />
                 <label for="notify_message">{$lang->notify}</label>
@@ -192,10 +202,12 @@
             </div>
 
             <div class="editor">{$oDocument->getCommentEditor()}</div>
+
+			<div class="boardNavigation">
+				<span class="button red"><input type="submit" value="{$lang->cmd_comment_registration}" accesskey="s" /></span>
+			</div>
+
         </div>
 
-        <div class="commentButton tRight">
-            <span class="button"><input type="submit" value="{$lang->cmd_comment_registration}" accesskey="s" /></span>
-        </div>
     </form>
 <!--@end-->

modules/board/skins/xe_default/write_form.html

@@ -111,8 +111,8 @@
     <div class="editor">{$oDocument->getEditor()}</div>
 
     <div class="tag">
-        <input type="text" name="tags" value="{htmlspecialchars($oDocument->get('tags'))}" class="inputTypeText" />
-        <p class="info">{$lang->about_tag}</p>
+        <input type="text" name="tags" value="{htmlspecialchars($oDocument->get('tags'))}" class="inputTypeText" title="Tag" />
+		<p>{$lang->about_tag}</p>
     </div>
 	
 	<div class="boardNavigation">
@@ -127,7 +127,7 @@
 		<div class="buttonRight">
 			<span class="button"><input type="button" value="{$lang->cmd_back}" onclick="location.href='{getUrl('act','')}'" /></span>
 			<span class="button"><input type="button" value="{$lang->cmd_preview}" onclick="doDocumentPreview(this); return false;" /></span>
-			<span class="button black"><input type="submit" value="{$lang->cmd_registration}" accesskey="s" /></span>
+			<span class="button red strong"><input type="submit" value="{$lang->cmd_registration}" accesskey="s" /></span>
 		</div>
 		
 	</div>

modules/editor/skins/default/css/editor.css

@@ -1,6 +1,5 @@
 @charset "utf-8";
-
-.xeEditor{}
+/* NHN > UIT Center > Open UI Platform Team > Jeong Chan Myeong(dece24@nhncorp.com) */
 
 .editorTypeSelector{ position:relative; right:3px; z-index:10; float:right; clear:both; *zoom:1; margin-bottom:-2px !important;}
 .editorTypeSelector:after{ content:""; display:block; clear:both;}
@@ -11,197 +10,196 @@
 .editorTypeSelector li.active{ background-position:left -24px;}
 .editorTypeSelector li.active a{ background-position:right -24px; font-weight:bold; height:23px;}
 
-.editorList{ clear:both; position:relative; z-index:1; border-top:1px solid #ddd; *zoom:1}
-.editorList .editorItem{ display:none;}
-.editorList.xe #xeEditor,
-.editorList.text #textEditor,
-.editorList.html #htmlEditor{ display:block;}
+.xeEditor{ clear:both; position:relative; z-index:1; border-top:1px solid #ddd; *zoom:1}
  
-.toolBox{ padding:5px 10px 8px 10px !important; background:#fafafa url(../images/buttonSetBg.gif) repeat-x left bottom; *zoom:1;}
+ /* Tool Box */
+.toolBox{ padding:5px 10px 3px 10px !important; *padding-bottom:8px !important; margin-bottom:5px !important; background:#fafafa url(../images/buttonSetBg.gif) repeat-x left bottom; *zoom:1;}
 .toolBox:after{ content:""; display:block; clear:both;}
-.toolBox .toolA{ position:relative; float:left; clear:both; *margin-bottom:5px;}
-.toolBox .toolA ul{ float:left; margin:0 5px 5px 0;}
-.toolBox .toolA li{ float:left; font-size:0; line-height:0;}
-.toolBox .toolA button{ border:0; width:21px; height:21px; background-color:#fff; background-image:url(../images/buttonSet.gif); background-position:no-repeat; cursor:pointer;}
-.toolBox .toolA span{ position:relative; z-index:-1;}
+.toolBox { position:relative;}
+.toolBox .item{ float:left; margin:0 5px 5px 0;}
+.toolBox .item li{ float:left;}
+.toolBox .item li button{ display:block; border:0; width:21px; height:21px; background-color:#fff; background-image:url(../images/buttonSet.gif); background-position:no-repeat; cursor:pointer;}
+.toolBox .item li button span{ position:relative; z-index:-1; font-size:0; line-height:0;}
 
-.toolBox .toolB{ clear:both; position:relative; left:-5px; overflow:hidden;}
-.toolBox .toolB li{ position:relative; left:-1px; display:inline; padding-left:3px; background:url(../images/lineV11.gif) no-repeat left center; *zoom:1;}
-.toolBox .toolB li button{ background:none; border:none; height:21px; *margin:0 -5px; cursor:pointer; font:11px Dotum, Tahoma; letter-spacing:-1px; display:inline; padding:0 !important;}
+.toolBox .extension2{ float:left; position:relative; margin:0 5px 5px 0;}
+.toolBox .extension2 .exButton{ float:left; border:0; width:68px; height:21px; background-color:#fff; background:url(../images/buttonSet.gif) no-repeat -579px 0; cursor:pointer;}
+.toolBox .extension2 .exButton span{ position:relative; z-index:-1; font-size:0; line-height:0;}
+.toolBox .extension2 .exButton:hover,
+.toolBox .extension2 .exButton:focus{ background-position:-579px -21px;}
+.toolBox .extension2 .exButton:active{ background-position:-579px -42px;}
+.toolBox .extension2 ul{ display:none; position:absolute; padding:5px 0; top:26px; right:0; background:#fafafa; border:1px solid #9f9f9f;}
+.toolBox .extension2 li{ float:none; text-align:left; padding:0 10px;}
+.toolBox .extension2 li button{ display:block; background:none; border:none; cursor:pointer; height:18px; font:11px Dotum, Tahoma; white-space:nowrap; width:auto; *width:100%;}
+.toolBox .extension2 li button span{ display:block; z-index:1; white-space:nowrap;}
+.toolBox .extension2 li button span img{ vertical-align:top; width:13px;}
+
+.toolBox .editorHelp{ float:left; position:relative; margin:0 5px 5px 0;}
+.toolBox .editorHelp .helpButton{ float:left; border:0; width:22px; height:21px; background-color:#fff; background:url(../images/buttonSet.gif) no-repeat right top; cursor:pointer;}
+.toolBox .editorHelp .helpButton span{ position:relative; z-index:-1; font-size:0; line-height:0;}
+.toolBox .editorHelp .helpButton:hover,
+.toolBox .editorHelp .helpButton:focus{ background-position:right -21px;}
+.toolBox .editorHelp .helpButton:active{ background-position:right -42px;}
+.toolBox .editorHelp ul#helpList{ display:none; float:none !important; position:absolute; padding:5px 0; top:26px; right:0; background:#fafafa; border:1px solid #9f9f9f;}
+.toolBox .editorHelp ul#helpList li{ list-style:disc; float:none; text-align:left; white-space:nowrap; padding:0 10px 0 0; margin-left:25px;}
+.toolBox .editorHelp ul#helpList li li{ list-style:circle; margin-left:20px;}
 
 /* ToolBox Button Default */
-.toolBox .do{ width:43px;}
-.toolBox .undo button{ width:22px;}
-.toolBox .redo button{ background-position:-22px 0;}
+.toolBox .item.do{ width:43px;}
+.toolBox .item .undo button{ width:22px;}
+.toolBox .item .redo button{ background-position:-22px 0;}
 
-.toolBox .type *{ font-size:12px; line-height:100%;}
-.toolBox .type select{ height:21px;}
-.toolBox .type .hx{}
-.toolBox .type .size .px10{ font-size:10px;}
-.toolBox .type .size .px13{ font-size:13px;}
-.toolBox .type .size .px16{ font-size:16px;}
-.toolBox .type .size .px18{ font-size:18px;}
-.toolBox .type .size .px24{ font-size:24px;}
-.toolBox .type .size .px32{ font-size:32px;}
-.toolBox .type .size .px48{ font-size:48px;}
-.toolBox .type .family{}
+.toolBox .item.type *{ font-size:12px; line-height:100%;}
+.toolBox .item.type select{ height:21px;}
+.toolBox .item.type .hx{}
+.toolBox .item.type .size .px10{ font-size:10px;}
+.toolBox .item.type .size .px13{ font-size:13px;}
+.toolBox .item.type .size .px16{ font-size:16px;}
+.toolBox .item.type .size .px18{ font-size:18px;}
+.toolBox .item.type .size .px24{ font-size:24px;}
+.toolBox .item.type .size .px32{ font-size:32px;}
+.toolBox .item.type .size .px48{ font-size:48px;}
+.toolBox .item.type .family{}
 
-.toolBox .style{ width:214px;}
-.toolBox .bold button{ width:22px; background-position:-43px 0;}
-.toolBox .underline button{ background-position:-65px 0;}
-.toolBox .italic button{ background-position:-86px 0;}
-.toolBox .strike button{ background-position:-107px 0;}
-.toolBox .sup button{ background-position:-128px 0;}
-.toolBox .sub button{ background-position:-149px 0;}
-.toolBox .txColor button{ background-position:-170px 0;}
-.toolBox .bgColor button{ background-position:-191px 0;}
-.toolBox .styleRemover button{ width:45px; background-position:-212px 0;}
+.toolBox .item.style{ width:214px;}
+.toolBox .item .bold button{ width:22px; background-position:-43px 0;}
+.toolBox .item .underline button{ background-position:-65px 0;}
+.toolBox .item .italic button{ background-position:-86px 0;}
+.toolBox .item .strike button{ background-position:-107px 0;}
+.toolBox .item .sup button{ background-position:-128px 0;}
+.toolBox .item .sub button{ background-position:-149px 0;}
+.toolBox .item .txColor button{ background-position:-170px 0;}
+.toolBox .item .bgColor button{ background-position:-191px 0;}
+.toolBox .item .styleRemover button{ width:45px; background-position:-212px 0;}
 
-.toolBox .paragraph{ width:169px;}
-.toolBox .alignLeft button{ width:22px; background-position:-257px 0;}
-.toolBox .alignCenter button{ background-position:-279px 0;}
-.toolBox .alignRight button{ background-position:-300px 0;}
-.toolBox .alignJustify button{ background-position:-321px 0;}
-.toolBox .orderedList button{background-position:-342px 0;}
-.toolBox .unorderedList button{ background-position:-363px 0;}
-.toolBox .outdent button{ background-position:-384px 0;}
-.toolBox .indent button{ background-position:-405px 0;}
+.toolBox .item.paragraph{ width:169px;}
+.toolBox .item .alignLeft button{ width:22px; background-position:-257px 0;}
+.toolBox .item .alignCenter button{ background-position:-279px 0;}
+.toolBox .item .alignRight button{ background-position:-300px 0;}
+.toolBox .item .alignJustify button{ background-position:-321px 0;}
+.toolBox .item .orderedList button{background-position:-342px 0;}
+.toolBox .item .unorderedList button{ background-position:-363px 0;}
+.toolBox .item .outdent button{ background-position:-384px 0;}
+.toolBox .item .indent button{ background-position:-405px 0;}
 
-.toolBox .extension{ width:132px;}
-.toolBox .url button{ width:27px; background-position:-426px 0;}
-.toolBox .blockquote button{ background-position:-453px 0;}
-.toolBox .table button{ background-position:-474px 0;}
-.toolBox .image button{ background-position:-495px 0;}
-.toolBox .movie button{ background-position:-516px 0;}
-.toolBox .emoticon button{ background-position:-537px 0;}
+.toolBox .item.extension1{ width:153px;}
+.toolBox .item .url button{ width:27px; background-position:-426px 0;}
+.toolBox .item .blockquote button{ background-position:-453px 0;}
+.toolBox .item .table button{ background-position:-474px 0;}
+.toolBox .item .image button{ background-position:-495px 0;}
+.toolBox .item .movie button{ background-position:-516px 0;}
+.toolBox .item .file button{ background-position:-537px 0;}
+.toolBox .item .emoticon button{ background-position:-558px 0;}
 
 /* ToolBox Button Hover & Focus & Active */
-.toolBox .undo button:hover,
-.toolBox .undo button:focus{ background-position:0 -21px;}
-.toolBox .undo button:active{ background-position:0 -42px;}
-.toolBox .redo button:hover,
-.toolBox .redo button:focus{ background-position:-22px -21px;}
-.toolBox .redo button:active{ background-position:-22px -42px;}
+.toolBox .item .undo button:hover,
+.toolBox .item .undo button:focus{ background-position:0 -21px;}
+.toolBox .item .undo button:active{ background-position:0 -42px;}
+.toolBox .item .redo button:hover,
+.toolBox .item .redo button:focus{ background-position:-22px -21px;}
+.toolBox .item .redo button:active{ background-position:-22px -42px;}
 
-.toolBox .bold button:hover,
-.toolBox .bold button:focus{ background-position:-43px -21px;}
-.toolBox .bold button:active{ background-position:-43px -42px;}
-.toolBox .underline button:hover,
-.toolBox .underline button:focus{ background-position:-65px -21px;}
-.toolBox .underline button:active{ background-position:-65px -42px;}
-.toolBox .italic button:hover,
-.toolBox .italic button:focus{ background-position:-86px -21px;}
-.toolBox .italic button:active{ background-position:-86px -42px;}
-.toolBox .strike button:hover,
-.toolBox .strike button:focus{ background-position:-107px -21px;}
-.toolBox .strike button:active{ background-position:-107px -42px;}
-.toolBox .sup button:hover,
-.toolBox .sup button:focus{ background-position:-128px -21px;}
-.toolBox .sup button:active{ background-position:-128px -42px;}
-.toolBox .sub button:hover,
-.toolBox .sub button:focus{ background-position:-149px -21px;}
-.toolBox .sub button:active{ background-position:-149px -42px;}
-.toolBox .txColor button:hover,
-.toolBox .txColor button:focus{ background-position:-170px -21px;}
-.toolBox .txColor button:active{ background-position:-170px -42px;}
-.toolBox .bgColor button:hover,
-.toolBox .bgColor button:focus{ background-position:-191px -21px;}
-.toolBox .bgColor button:active{ background-position:-191px -42px;}
-.toolBox .styleRemover button:hover,
-.toolBox .styleRemover button:focus{ background-position:-212px -21px;}
-.toolBox .styleRemover button:active{ background-position:-212px -42px;}
+.toolBox .item .bold button:hover,
+.toolBox .item .bold button:focus{ background-position:-43px -21px;}
+.toolBox .item .bold button:active{ background-position:-43px -42px;}
+.toolBox .item .underline button:hover,
+.toolBox .item .underline button:focus{ background-position:-65px -21px;}
+.toolBox .item .underline button:active{ background-position:-65px -42px;}
+.toolBox .item .italic button:hover,
+.toolBox .item .italic button:focus{ background-position:-86px -21px;}
+.toolBox .item .italic button:active{ background-position:-86px -42px;}
+.toolBox .item .strike button:hover,
+.toolBox .item .strike button:focus{ background-position:-107px -21px;}
+.toolBox .item .strike button:active{ background-position:-107px -42px;}
+.toolBox .item .sup button:hover,
+.toolBox .item .sup button:focus{ background-position:-128px -21px;}
+.toolBox .item .sup button:active{ background-position:-128px -42px;}
+.toolBox .item .sub button:hover,
+.toolBox .item .sub button:focus{ background-position:-149px -21px;}
+.toolBox .item .sub button:active{ background-position:-149px -42px;}
+.toolBox .item .txColor button:hover,
+.toolBox .item .txColor button:focus{ background-position:-170px -21px;}
+.toolBox .item .txColor button:active{ background-position:-170px -42px;}
+.toolBox .item .bgColor button:hover,
+.toolBox .item .bgColor button:focus{ background-position:-191px -21px;}
+.toolBox .item .bgColor button:active{ background-position:-191px -42px;}
+.toolBox .item .styleRemover button:hover,
+.toolBox .item .styleRemover button:focus{ background-position:-212px -21px;}
+.toolBox .item .styleRemover button:active{ background-position:-212px -42px;}
 
-.toolBox .alignLeft button:hover,
-.toolBox .alignLeft button:focus{ background-position:-257px -21px;}
-.toolBox .alignLeft button:active{ background-position:-257px -42px;}
-.toolBox .alignCenter button:hover,
-.toolBox .alignCenter button:focus{ background-position:-279px -21px;}
-.toolBox .alignCenter button:active{ background-position:-279px -42px;}
-.toolBox .alignRight button:hover,
-.toolBox .alignRight button:focus{ background-position:-300px -21px;}
-.toolBox .alignRight button:active{ background-position:-300px -42px;}
-.toolBox .alignJustify button:hover,
-.toolBox .alignJustify button:focus{ background-position:-321px -21px;}
-.toolBox .alignJustify button:active{ background-position:-321px -42px;}
-.toolBox .orderedList button:hover,
-.toolBox .orderedList button:focus{background-position:-342px -21px;}
-.toolBox .orderedList button:active{background-position:-342px -42px;}
-.toolBox .unorderedList button:hover,
-.toolBox .unorderedList button:focus{ background-position:-363px -21px;}
-.toolBox .unorderedList button:active{ background-position:-363px -42px;}
-.toolBox .outdent button:hover,
-.toolBox .outdent button:focus{ background-position:-384px -21px;}
-.toolBox .outdent button:active{ background-position:-384px -42px;}
-.toolBox .indent button:hover,
-.toolBox .indent button:focus{ background-position:-405px -21px;}
-.toolBox .indent button:active{ background-position:-405px -42px;}
+.toolBox .item .alignLeft button:hover,
+.toolBox .item .alignLeft button:focus{ background-position:-257px -21px;}
+.toolBox .item .alignLeft button:active{ background-position:-257px -42px;}
+.toolBox .item .alignCenter button:hover,
+.toolBox .item .alignCenter button:focus{ background-position:-279px -21px;}
+.toolBox .item .alignCenter button:active{ background-position:-279px -42px;}
+.toolBox .item .alignRight button:hover,
+.toolBox .item .alignRight button:focus{ background-position:-300px -21px;}
+.toolBox .item .alignRight button:active{ background-position:-300px -42px;}
+.toolBox .item .alignJustify button:hover,
+.toolBox .item .alignJustify button:focus{ background-position:-321px -21px;}
+.toolBox .item .alignJustify button:active{ background-position:-321px -42px;}
+.toolBox .item .orderedList button:hover,
+.toolBox .item .orderedList button:focus{background-position:-342px -21px;}
+.toolBox .item .orderedList button:active{background-position:-342px -42px;}
+.toolBox .item .unorderedList button:hover,
+.toolBox .item .unorderedList button:focus{ background-position:-363px -21px;}
+.toolBox .item .unorderedList button:active{ background-position:-363px -42px;}
+.toolBox .item .outdent button:hover,
+.toolBox .item .outdent button:focus{ background-position:-384px -21px;}
+.toolBox .item .outdent button:active{ background-position:-384px -42px;}
+.toolBox .item .indent button:hover,
+.toolBox .item .indent button:focus{ background-position:-405px -21px;}
+.toolBox .item .indent button:active{ background-position:-405px -42px;}
 
-.toolBox .url button:hover,
-.toolBox .url button:focus{ background-position:-426px -21px;}
-.toolBox .url button:active{ background-position:-426px -42px;}
-.toolBox .blockquote button:hover,
-.toolBox .blockquote button:focus{ background-position:-453px -21px;}
-.toolBox .blockquote button:active{ background-position:-453px -42px;}
-.toolBox .table button:hover,
-.toolBox .table button:focus{ background-position:-474px -21px;}
-.toolBox .table button:active{ background-position:-474px -42px;}
-.toolBox .image button:hover,
-.toolBox .image button:focus{ background-position:-495px -21px;}
-.toolBox .image button:active{ background-position:-495px -42px;}
-.toolBox .movie button:hover,
-.toolBox .movie button:focus{ background-position:-516px -21px;}
-.toolBox .movie button:active{ background-position:-516px -42px;}
-.toolBox .emoticon button:hover,
-.toolBox .emoticon button:focus{ background-position:-537px -21px;}
-.toolBox .emoticon button:active{ background-position:-537px -42px;}
+.toolBox .item .url button:hover,
+.toolBox .item .url button:focus{ background-position:-426px -21px;}
+.toolBox .item .url button:active{ background-position:-426px -42px;}
+.toolBox .item .blockquote button:hover,
+.toolBox .item .blockquote button:focus{ background-position:-453px -21px;}
+.toolBox .item .blockquote button:active{ background-position:-453px -42px;}
+.toolBox .item .table button:hover,
+.toolBox .item .table button:focus{ background-position:-474px -21px;}
+.toolBox .item .table button:active{ background-position:-474px -42px;}
+.toolBox .item .image button:hover,
+.toolBox .item .image button:focus{ background-position:-495px -21px;}
+.toolBox .item .image button:active{ background-position:-495px -42px;}
+.toolBox .item .movie button:hover,
+.toolBox .item .movie button:focus{ background-position:-516px -21px;}
+.toolBox .item .movie button:active{ background-position:-516px -42px;}
+.toolBox .item .file button:hover,
+.toolBox .item .file button:focus{ background-position:-537px -21px;}
+.toolBox .item .file button:active{ background-position:-537px -42px;}
+.toolBox .item .emoticon button:hover,
+.toolBox .item .emoticon button:focus{ background-position:-558px -21px;}
+.toolBox .item .emoticon button:active{ background-position:-558px -42px;}
 
-/* .xeEditor { }
-.xeEditor .optionABC { clear:both; width:100%; overflow:hidden; background:transparent;}
-.xeEditor .optionABC .selectGroup { white-space:nowrap; display:block; height:21px; margin:0 .5em 0 0; padding-left:1em; float:left;}
-.xeEditor .optionABC .buttonGroup { white-space:nowrap; position:relative; display:block; margin:0 .5em 0 0; float:left; height:21px; overflow:hidden; padding-left:2px;}
-.xeEditor .optionABC .buttonGroup img { float:left; display:block; margin-left:-1px; cursor:pointer;}
-.xeEditor .optionA,
-.xeEditor .optionB,
-.xeEditor .optionC { float:left; background:transparent; padding:.5em 0 .5em .7em; overflow:hidden;}
-.xeEditor .optionA *,
-.xeEditor .optionB *,
-.xeEditor .optionC * { vertical-align:middle;}
-.xeEditor .optionA { background-position:-3px bottom; padding-left:0;}
-.xeEditor .optionA select option { font-size:.9em; }
-.xeEditor .optionDE { width:100%; clear:both; overflow:hidden; background:transparent;height:29px;}
-.xeEditor .optionDE .buttonGroup { white-space:nowrap; position:relative; display:block; float:left; height:21px; overflow:hidden; padding-left:2px;}
-.xeEditor .optionDE img { float:left; display:block; margin-right:.5em; cursor:pointer;}
-.xeEditor .optionD { padding:.5em 0 .5em .8em; overflow:hidden; float:left; border-right:1px solid #e0e0e0;}
-.xeEditor .optionE { padding:4px 0 0 9px; overflow:hidden; float:left;}
+/* Auto Save */
+.xeEditor .editor_autosaved_message{ display:none; background:#fafafa; border:1px solid #ddd; margin:10px; padding:5px 10px; clear:both;}
 
-.xeEditor .editorInfo { background:transparent; padding:.5em; border:1px solid #e1e1dd; color:#999999; position:relative; margin:5px 10px 0 10px;}
-.xeEditor .close { cursor:pointer; position:absolute; top:3px; right:3px; _top:3px; _right:15px;}
-.xeEditor .editor_iframe_box { clear:both; border:1px solid; border-color:#a6a6a6 #d8d8d8 #d8d8d8 #a6a6a6; padding:0; margin:3px 10px 5px 10px; }
-.xeEditor .editor_iframe_textarea { background:#ffffff; clear:both; border:1px solid; border-color:#a6a6a6 #d8d8d8 #d8d8d8 #a6a6a6; margin:5px 10px 0 10px; width:100%; font-size:1em; display:none;}
+/* Editor */
+.xeEditor .toolBox,
+.xeEditor .richEditor,
+.xeEditor .htmlEditor{ display:none;}
+.xeEditor.rich .toolBox,
+.xeEditor.rich .richEditor,
+.xeEditor.html .htmlEditor{ display:block;}
+.xeEditor .richEditor,
+.xeEditor .htmlEditor{ border:0; background:#fff;}
+.xeEditor .htmlEditor{ width:100%; padding:10px 0; font-size:12px;}
 
-.xeEditor .textAreaDragIndicator { text-align:center; background:url(../images/lineTextAreaDrag.gif) repeat-x left center; padding:5px 0 5px 0; }
-.xeEditor .textAreaDragIndicatorBar { background:url(../images/buttonTextAreaDrag.gif) no-repeat center; cursor:move;height:14px;}
+/* Editor Resize Bar */
+.xeEditor .textAreaDragIndicator{ border-top:1px solid #ddd; border-bottom:1px solid #ddd; clear:both; margin-bottom:10px;}
+.xeEditor .textAreaDragIndicator button{ width:100%; height:9px; border:none; cursor:n-resize; background:#f4f4f4 url(../images/buttonTextAreaDrag.gif) no-repeat center center; }
 
-.xeEditor .editor_info { clear:both; padding:5px 10px 0 10px; overflow:hidden;}
-.xeEditor .editor_info .editor_option { float:left; color:#888888; }
-.xeEditor .editor_info .editor_autosaved_message { display:none; color:#888888; float:right; }
-
-.xeEditor .inputTypeTextArea { background:#fbfbfb; padding:1em; width:94%;}
-
-.xeEditor .fileAttach { border:none; table-layout:fixed; margin:0 10px 0 10px; }
-
-.xeEditor .fileAttach .preview { padding:5px; border:1px solid #e1e1dd; width:100px; height:100px; margin-right:10px;}
-.xeEditor .fileAttach .preview img { width:100px; height:100px; }
-
-.xeEditor .fileAttach .fileListArea .fileList { background:transparent; overflow:auto; width:100%; height:auto; border:1px solid; border-color:#a6a6a6 #d8d8d8 #d8d8d8 #a6a6a6; margin-bottom:10px; font-size:11px;}
-.xeEditor .fileAttach .fileListArea .fileList option { line-height:100%; padding-left:.5em;}
-.xeEditor .fileAttach .fileUploadControl { float:left; }
-.xeEditor .fileAttach .file_attach_info { color:#AAAAAA; font-size:.9em; _font-size:8pt; text-align:right;}
-*:first-child+html .xeEditor .fileAttach .file_attach_info { font-size:8pt; }
-
-.xeEditor .fileAttach .fileUploadControl .uploaderButton { display:block; cursor:pointer; background:url(../images/buttonTypeBCenter.gif) repeat-x left center; line-height:100%; overflow:visible; color:#3f4040; margin:0 1px; font-size:.9em; white-space:nowrap;}
-.xeEditor .fileAttach .fileUploadControl .uploaderButton:hover { text-decoration:none;}
-.xeEditor .fileAttach .fileUploadControl .uploaderButton img { vertical-align:middle;}
-.xeEditor .fileAttach .fileUploadControl .uploaderButton .leftCap { width:2px; height:21px; background:url(../images/buttonTypeBLeft.gif) no-repeat; margin:0 .3em 0 0;  position:relative; left:-1px;}
-.xeEditor .fileAttach .fileUploadControl .uploaderButton .rightCap { width:2px; height:21px; background:url(../images/buttonTypeBRight.gif) no-repeat; margin:0 -1px 0 .4em;}
-.xeEditor .fileAttach .fileUploadControl .uploaderButton .icon { margin:0 .2em;} */
+/* File Uploader */
+.xeEditor .fileUploader{ clear:both; position:relative; padding-top:5px; *zoom:1; *margin-bottom:5px;}
+.commentEditor .xeEditor .fileUploader{ border-top:1px solid #ddd;}
+.xeEditor .fileUploader:after{ content:""; display:block; clear:both;}
+.xeEditor .fileUploader .preview{ float:left; width:64px; height:64px; border:1px solid #ddd; padding:2px; margin:0 10px 5px 0; background:#fff;}
+.xeEditor .fileUploader .preview img{ display:block; width:64px; height:64px;}
+.xeEditor .fileUploader .fileListArea{ float:left; width:260px; margin:0 10px 5px 0;}
+.xeEditor .fileUploader .fileListArea select{ width:100%; height:70px; overflow:auto;}
+.xeEditor .fileUploader .fileListArea select option{ font-size:11px;}
+.xeEditor .fileUploader .fileUploadControl{ clear:right;}
+.xeEditor .fileUploader .fileUploadControl .button{ margin-bottom:5px;}
+.xeEditor .fileUploader .file_attach_info{ clear:right; margin:5px 0;}

modules/editor/skins/default/editor.html

@@ -14,7 +14,6 @@
 
 <ul class="editorTypeSelector">
 	<li class="active"><a href="#xeEditor" onclick="return false"><span>스타일 편집기</span></a></li>
-	<li><a href="#textEditor" onclick="return false"><span>텍스트 편집기</span></a></li>
 	
 	<!-- HTML 모드 사용 -->
 	<!--@if($html_mode)-->
@@ -22,186 +21,170 @@
 		<li><a href="#htmlEditor" id="use_html_{$editor_sequence}" onclick="editorChangeMode(this, '{$editor_sequence}')"><span>HTML 편집기</span></a></li>
 		<!--@end-->
 	<!--@end-->
-	</ul>
+</ul>
 
 <!-- 에디터 -->
-<div class="editorList xe">
-<!-- class="editorList xe" | class="editorList text" | class="editorList html" -->
+<div id="xeEditor" class="xeEditor rich">
+<!-- class="xeEditor rich" | class="xeEditor html" -->
 
-	<div id="xeEditor" class="editorItem">
-	
-		<div id="xeEditorOption_{$editor_sequence}" class="toolBox">
-	
-			<!--@if($enable_default_component)-->
-			<!-- 기본 컴포넌트 출력 -->
-			<div class="toolA">
-			
-				<ul class="do">
-					<li class="undo"><button type="button" title="Ctrl+Z:Un Do"><span>Un Do</span></button></li>
-					<li class="redo"><button type="button" title="Ctrl+Y:Re Do"><span>Re Do</span></button></li>
-				</ul>
-				
-				<ul class="type">
-					<li class="hx">
-						<select onchange="editorChangeHeader(this,'{$editor_sequence}')" id="editor_header_{$editor_sequence}">
-							<option value="">{$lang->edit->header}</option>
-							<!--@foreach($lang->edit->header_list as $key=>$obj)-->
-							<option value="{$key}">{$obj}</option>
-							<!--@end-->
-						</select>
-					</li>
-					<li class="size">
-						<select onchange="editorChangeFontSize(this,'{$editor_sequence}')" id="editor_fontsize_{$editor_sequence}">
-							<option value="" selected="selected">{$lang->edit->fontsize}</option>
-							<option value="1" class="px10">10px</option>
-							<option value="2" class="px13">13px</option>
-							<option value="3" class="px16">16px</option>
-							<option value="4" class="px18">18px</option>
-							<option value="5" class="px24">24px</option>
-							<option value="6" class="px32">32px</option>
-							<option value="7" class="px48">48px</option>
-						</select>
-					</li>
-					<li class="family">
-						<select onchange="editorChangeFontName(this,'{$editor_sequence}')" id="editor_font_{$editor_sequence}">
-							<option value="">{$lang->edit->fontname}</option>
-							<!--@foreach($lang->edit->fontlist as $key=>$obj)-->
-							<option style="font-family:{$obj}" value="{$obj}">{$obj}</option>
-							<!--@end-->
-						</select>
-					</li>
-				</ul>
-				
-				<ul class="style">
-					<li class="bold"><button type="button" title="Ctrl+B:{$lang->edit->help_bold}" id="component_{$editor_sequence}_Bold"><span>Bold</span></button></li>
-					<li class="underline"><button type="button" title="Ctrl+U:{$lang->edit->help_underline}" id="component_{$editor_sequence}_Underline"><span>Underline</span></button></li>
-					<li class="italic"><button type="button" title="Ctrl+I:{$lang->edit->help_italic}" id="component_{$editor_sequence}_Italic"><span>Italic</span></button></li>
-					<li class="strike"><button type="button" title="{$lang->edit->help_strike_through}" id="component_{$editor_sequence}_StrikeThrough"><span>Strike</span></button></li>
-					<li class="sup"><button type="button" title="Sup"><span>Sup</span></button></li>
-					<li class="sub"><button type="button" title="Sub"><span>Sub</span></button></li>
-					<li class="txColor"><button type="button" title="{$lang->edit->help_fontcolor}" id="component_{$editor_sequence}_colorpicker_text"><span>Text Color</span></button></li>
-					<li class="bgColor"><button type="button" title="{$lang->edit->help_fontbgcolor}" id="component_{$editor_sequence}_colorpicker_bg"><span>Background Color</span></button></li>
-					<li class="styleRemover"><button type="button" title="Ctrl+D:{$lang->edit->help_remove_format}" id="component_{$editor_sequence}_RemoveFormat"><span>Style Remover</span></button></li>
-				</ul>
-				
-				<ul class="paragraph">
-					<li class="alignLeft"><button type="button" title="{$lang->edit->help_align_left}" id="component_{$editor_sequence}_JustifyLeft"><span>Align Left</span></button></li>
-					<li class="alignCenter"><button type="button" title="{$lang->edit->help_align_center}" id="component_{$editor_sequence}_JustifyCenter"><span>Align Center</span></button></li>
-					<li class="alignRight"><button type="button" title="{$lang->edit->help_align_right}" id="component_{$editor_sequence}_JustifyRight"><span>Align Right</span></button></li>
-					<li class="alignJustify"><button type="button" title="{$lang->edit->help_align_full}" id="component_{$editor_sequence}_JustifyFull"><span>Align Justify</span></button></li>
-					<li class="orderedList"><button type="button" title="{$lang->edit->help_list_number}" id="component_{$editor_sequence}_InsertOrderedList"><span>Orderd List</span></button></li>
-					<li class="unorderedList"><button type="button" title="{$lang->edit->help_list_bullet}" id="component_{$editor_sequence}_InsertUnorderedList"><span>Unordered List</span></button></li>
-					<li class="outdent"><button type="button" title="{$lang->edit->help_remove_indent}" id="component_{$editor_sequence}_Outdent"><span>Outdent</span></button></li>
-					<li class="indent"><button type="button" title="{$lang->edit->help_add_indent}" id="component_{$editor_sequence}_Indent"><span>Indent</span></button></li>
-				</ul>
-				
-				<ul class="extension">
-					<li class="url"><button type="button" title="Ctrl+L:URL" id="component_1_url_link"><span>URL</span></button></li>
-					<li class="blockquote"><button type="button" title="Blockquote" id="component_1_quotation"><span>Blockquote</span></button></li>
-					<li class="table"><button type="button" title="Table" id="component_1_table_maker"><span>Table</span></button></li>
-					<li class="image"><button type="button" title="Image" id="component_1_image_link"><span>Image</span></button></li>
-					<li class="movie"><button type="button" title="Movie" id="component_1_multimedia_link"><span>Movie</span></button></li>
-					<li class="emoticon"><button type="button" title="Emoticon" id="component_1_emoticon"><span>Emoticon</span></button></li>
-				</ul>
-				
-			</div>
-			<!--@end-->
-	
-			<!--@if($enable_component)-->
-			<!-- 확장 컴포넌트 출력 -->
-			<ul id="editor_component_{$editor_sequence}" class="toolB">
-				<!--@foreach($component_list as $component_name => $component)-->
-					<!--@if(substr($component_name,0,11)!="colorpicker")-->
-						<li><button type="button" id="component_{$editor_sequence}_{$component_name}"><span>{$component->title}</span></button></li>
-					<!--@end-->
-				<!--@end-->
+	<div id="xeEditorOption_{$editor_sequence}" class="toolBox">
+
+		<!--@if($enable_default_component)-->
+		<!-- 기본 컴포넌트 출력 -->
+			<ul class="do item">
+				<li class="undo"><button type="button" title="Ctrl+Z:Un Do"><span>Un Do</span></button></li>
+				<li class="redo"><button type="button" title="Ctrl+Y:Re Do"><span>Re Do</span></button></li>
 			</ul>
-			<!--@end-->
-	
-		</div>
-	
-		<!--@if(!$_COOKIE['EditorInfo'])-->
-		<!-- 에디터 안내 출력 -->
-		<div id="editorInfo_{$editor_sequence}" class="editorInfo" >
-			{$lang->about_dblclick_in_editor}
-			<span id="for_ie_help_{$editor_sequence}" style="display:none">{$lang->edit->help_use_paragrapth}</span>
-			<img src="./images/buttonClose.gif" alt="close" width="13" height="13" class="close" onclick="closeEditorInfo('{$editor_sequence}'); return false;" />
-		</div>
+			
+			<ul class="type item">
+				<li class="hx">
+					<select onchange="editorChangeHeader(this,'{$editor_sequence}')" id="editor_header_{$editor_sequence}">
+						<option value="">{$lang->edit->header}</option>
+						<!--@foreach($lang->edit->header_list as $key=>$obj)-->
+						<option value="{$key}">{$obj}</option>
+						<!--@end-->
+					</select>
+				</li>
+				<li class="size">
+					<select onchange="editorChangeFontSize(this,'{$editor_sequence}')" id="editor_fontsize_{$editor_sequence}">
+						<option value="" selected="selected">{$lang->edit->fontsize}</option>
+						<option value="1" class="px10">10px</option>
+						<option value="2" class="px13">13px</option>
+						<option value="3" class="px16">16px</option>
+						<option value="4" class="px18">18px</option>
+						<option value="5" class="px24">24px</option>
+						<option value="6" class="px32">32px</option>
+						<option value="7" class="px48">48px</option>
+					</select>
+				</li>
+				<li class="family">
+					<select onchange="editorChangeFontName(this,'{$editor_sequence}')" id="editor_font_{$editor_sequence}">
+						<option value="">{$lang->edit->fontname}</option>
+						<!--@foreach($lang->edit->fontlist as $key=>$obj)-->
+						<option style="font-family:{$obj}" value="{$obj}">{$obj}</option>
+						<!--@end-->
+					</select>
+				</li>
+			</ul>
+			
+			<ul class="style item">
+				<li class="bold"><button type="button" title="Ctrl+B:{$lang->edit->help_bold}" id="component_{$editor_sequence}_Bold"><span>Bold</span></button></li>
+				<li class="underline"><button type="button" title="Ctrl+U:{$lang->edit->help_underline}" id="component_{$editor_sequence}_Underline"><span>Underline</span></button></li>
+				<li class="italic"><button type="button" title="Ctrl+I:{$lang->edit->help_italic}" id="component_{$editor_sequence}_Italic"><span>Italic</span></button></li>
+				<li class="strike"><button type="button" title="{$lang->edit->help_strike_through}" id="component_{$editor_sequence}_StrikeThrough"><span>Strike</span></button></li>
+				<li class="sup"><button type="button" title="Sup"><span>Sup</span></button></li>
+				<li class="sub"><button type="button" title="Sub"><span>Sub</span></button></li>
+				<li class="txColor"><button type="button" title="{$lang->edit->help_fontcolor}" id="component_{$editor_sequence}_colorpicker_text"><span>Text Color</span></button></li>
+				<li class="bgColor"><button type="button" title="{$lang->edit->help_fontbgcolor}" id="component_{$editor_sequence}_colorpicker_bg"><span>Background Color</span></button></li>
+				<li class="styleRemover"><button type="button" title="Ctrl+D:{$lang->edit->help_remove_format}" id="component_{$editor_sequence}_RemoveFormat"><span>Style Remover</span></button></li>
+			</ul>
+			
+			<ul class="paragraph item">
+				<li class="alignLeft"><button type="button" title="{$lang->edit->help_align_left}" id="component_{$editor_sequence}_JustifyLeft"><span>Align Left</span></button></li>
+				<li class="alignCenter"><button type="button" title="{$lang->edit->help_align_center}" id="component_{$editor_sequence}_JustifyCenter"><span>Align Center</span></button></li>
+				<li class="alignRight"><button type="button" title="{$lang->edit->help_align_right}" id="component_{$editor_sequence}_JustifyRight"><span>Align Right</span></button></li>
+				<li class="alignJustify"><button type="button" title="{$lang->edit->help_align_full}" id="component_{$editor_sequence}_JustifyFull"><span>Align Justify</span></button></li>
+				<li class="orderedList"><button type="button" title="{$lang->edit->help_list_number}" id="component_{$editor_sequence}_InsertOrderedList"><span>Orderd List</span></button></li>
+				<li class="unorderedList"><button type="button" title="{$lang->edit->help_list_bullet}" id="component_{$editor_sequence}_InsertUnorderedList"><span>Unordered List</span></button></li>
+				<li class="outdent"><button type="button" title="{$lang->edit->help_remove_indent}" id="component_{$editor_sequence}_Outdent"><span>Outdent</span></button></li>
+				<li class="indent"><button type="button" title="{$lang->edit->help_add_indent}" id="component_{$editor_sequence}_Indent"><span>Indent</span></button></li>
+			</ul>
+			
+			<ul class="extension1 item">
+				<li class="url"><button type="button" title="Ctrl+L:URL" id="component_1_url_link"><span>URL</span></button></li>
+				<li class="blockquote"><button type="button" title="Blockquote" id="component_1_quotation"><span>Blockquote</span></button></li>
+				<li class="table"><button type="button" title="Table" id="component_1_table_maker"><span>Table</span></button></li>
+				<li class="image"><button type="button" title="Image" id="component_1_image_link"><span>Image</span></button></li>
+				<li class="movie"><button type="button" title="Movie" id="component_1_multimedia_link"><span>Movie</span></button></li>
+				<li class="file"><button type="button" title="File" id="component_1_file"><span>Movie</span></button></li>
+				<li class="emoticon"><button type="button" title="Emoticon" id="component_1_emoticon"><span>Emoticon</span></button></li>
+			</ul>
+			
 		<!--@end-->
-	
-		<!-- HTML 모드 사용 기능 및 자동저장 메세지 출력용 -->
-		<!--@if($html_mode || $enable_autosave)-->
-		<div class="editor_info">
-			<!--@if($html_mode)-->
-			<div class="editor_option">
-				<input type="checkbox" id="use_html_{$editor_sequence}" value="Y" onclick="editorChangeMode(this, '{$editor_sequence}');" /> <label for="use_html_{$editor_sequence}">HTML</label>
+		<!--@if($enable_component)-->
+		<!-- 확장 컴포넌트 출력 -->
+			<div class="extension2">
+				<button type="button" class="exButton" title="확장 콤포넌트"><span>확장 콤포넌트</span></button>
+				<ul id="editor_component_{$editor_sequence}">
+					<!--@foreach($component_list as $component_name => $component)-->
+						<!--@if(substr($component_name,0,11)!="colorpicker")-->
+							<li><button type="button" id="component_{$editor_sequence}_{$component_name}"><span><img src="../../components/{$component_name}/icon.gif" alt="" /> {$component->title}</span></button></li>
+						<!--@end-->
+					<!--@end-->
+				</ul>
 			</div>
-			<!--@end-->
-			<!--@if($enable_autosave)-->
-			<div class="editor_autosaved_message" id="editor_autosaved_message_{$editor_sequence}"></div>
-			<!--@end-->
+		<!--@end-->
+		
+		<div class="editorHelp">
+			<button type="button" class="helpButton" title="도움말"><span>도움말</span></button>
+			<ul id="helpList">
+				<!--@if(!$_COOKIE['EditorInfo'])-->
+				<!-- 에디터 안내 출력 -->
+				<li>{$lang->about_dblclick_in_editor}</li>
+				<li>{$lang->edit->help_use_paragrapth}</li>
+				<!--@end-->
+				<li>단축키 안내
+					<ul>
+						<li>Un Do : Ctrl+Z</li>
+						<li>Re Do : Ctrl+Y</li>
+						<li>Bold : Ctrl+B</li>
+						<li>Underline : Ctrl+U</li>
+						<li>Italic : Ctrl+I</li>
+						<li>Style Remover : Ctrl+D</li>
+						<li>URL : Ctrl+L</li>
+					</ul>
+				</li>
+			</ul>
 		</div>
-		<!--@end-->
-	
-		<!-- 에디터 출력 -->
-		<div class="editor_iframe_box"><iframe id="editor_iframe_{$editor_sequence}" frameborder="0" height="{$editor_height}" style="background-color:transparent;" allowTransparency="true"></iframe></div>
-		<textarea id="editor_textarea_{$editor_sequence}" class="editor_iframe_textarea" style="display:none; height:{$editor_height}"  rows="10" cols="10"></textarea>
-	
-		<!-- 에디터 크기 조절 bar -->
-		<!--@if($enable_resizable)-->
-		<div class="textAreaDragIndicator"><div class="textAreaDragIndicatorBar" id="editor_drag_bar_{$editor_sequence}"></div></div>
-		<!--@end-->
-	
-	<!--@if($allow_fileupload)-->
-		<!-- 첨부파일 영역 -->
-		<!--%import("../../tpl/js/uploader.js",optimized=false)-->
-		<!--%import("../../tpl/js/swfupload.js",optimized=false)-->
-		<script type="text/javascript">//<![CDATA[
-			editorUploadInit(
-				{
-					"editorSequence" : {$editor_sequence},
-					"sessionName" : "{session_name()}",
-					"allowedFileSize" : "{$file_config->allowed_filesize}",
-					"allowedFileTypes" : "{$file_config->allowed_filetypes}",
-					"allowedFileTypesDescription" : "{$file_config->allowed_filetypes}",
-					"insertedFiles" : {(int)$files_count},
-					"replaceButtonID" : "swfUploadButton{$editor_sequence}",
-					"fileListAreaID" : "uploaded_file_list_{$editor_sequence}",
-					"previewAreaID" : "preview_uploaded_{$editor_sequence}",
-					"uploaderStatusID" : "uploader_status_{$editor_sequence}"
-				}
-			);
-		//]]></script>
-		<table cellspacing="0" class="fileAttach">
-		<col width="120" />
-		<col width="100%" />
-		<tr valign="top">
-			<td width="120"><div class="preview" id="preview_uploaded_{$editor_sequence}"></div></td>
-			<td>
-				<!-- 파일 업로드 영역 -->
-				<div class="fileListArea">
-					<select id="uploaded_file_list_{$editor_sequence}" multiple="multiple" size="5" class="fileList"></select>
-				</div>
-				<div class="fileUploadControl">
-					<span id="swfUploadButton{$editor_sequence}"><span class="button"><button type="button">{$lang->edit->upload_file}</button></span></span>
-					<a href="#" onclick="removeUploadedFile('{$editor_sequence}');return false;" class="button"><span>{$lang->edit->delete_selected}</span></a>
-					<a href="#" onclick="insertUploadedFile('{$editor_sequence}');return false;" class="button"><span>{$lang->edit->link_file}</span></a>
-				</div>
-				<div class="file_attach_info" id="uploader_status_{$editor_sequence}">{$upload_status}</div>
-			</td>
-		</tr>
-		</table>
-	<!--@end-->
-	</div>
-	
-	<div id="textEditor" class="editorItem">
-		여기에  class "textEditor"의 내용 입력
-	</div>
-	
-	<div id="htmlEditor" class="editorItem">
-		여기에  class "htmlEditor"의 내용 입력
 	</div>
 
+	<!--@if($enable_autosave)-->
+	<p class="editor_autosaved_message" id="editor_autosaved_message_{$editor_sequence}"></p>
+	<!--@end-->
+
+	<!-- 에디터 출력 -->
+	<iframe id="editor_iframe_{$editor_sequence}" class="richEditor" frameborder="0" height="{$editor_height}"></iframe>
+	<textarea id="editor_textarea_{$editor_sequence}" class="htmlEditor" style="height:{$editor_height}"  rows="5" cols="20"></textarea>
+
+	<!-- 에디터 크기 조절 bar -->
+	<!--@if($enable_resizable)-->
+	<div class="textAreaDragIndicator"><button type="button" id="editor_drag_bar_{$editor_sequence}"></button></div>
+	<!--@end-->
+
+<!--@if($allow_fileupload)-->
+	<!-- 첨부파일 영역 -->
+	<!--%import("../../tpl/js/uploader.js",optimized=false)-->
+	<!--%import("../../tpl/js/swfupload.js",optimized=false)-->
+	<script type="text/javascript">//<![CDATA[
+		editorUploadInit(
+			{
+				"editorSequence" : {$editor_sequence},
+				"sessionName" : "{session_name()}",
+				"allowedFileSize" : "{$file_config->allowed_filesize}",
+				"allowedFileTypes" : "{$file_config->allowed_filetypes}",
+				"allowedFileTypesDescription" : "{$file_config->allowed_filetypes}",
+				"insertedFiles" : {(int)$files_count},
+				"replaceButtonID" : "swfUploadButton{$editor_sequence}",
+				"fileListAreaID" : "uploaded_file_list_{$editor_sequence}",
+				"previewAreaID" : "preview_uploaded_{$editor_sequence}",
+				"uploaderStatusID" : "uploader_status_{$editor_sequence}"
+			}
+		);
+	//]]></script>
+	<!-- 파일 업로드 영역 -->
+	<div class="fileUploader">
+		<div class="preview" id="preview_uploaded_{$editor_sequence}"></div>
+		<div class="fileListArea">
+			<select id="uploaded_file_list_{$editor_sequence}" multiple="multiple" class="fileList"></select>
+		</div>
+		<div class="fileUploadControl">
+			<span class="button" id="swfUploadButton{$editor_sequence}"><button type="button">{$lang->edit->upload_file}</button></span>
+			<span class="button"><button type="button" onclick="removeUploadedFile('{$editor_sequence}');return false;">{$lang->edit->delete_selected}</button></span>
+			<span class="button"><button type="button" onclick="insertUploadedFile('{$editor_sequence}');return false;">{$lang->edit->link_file}</button></span>
+		</div>
+		<div class="file_attach_info" id="uploader_status_{$editor_sequence}">{$upload_status}</div>
+	</div>
+<!--@end-->
 </div>
 
 <!-- 에디터 활성화 -->