Jihan Kim 2013-05-03
apply HIVE UI CSS, override default font-size of bootstrap
@1f615d17d027d5f66b502e4561eeb34783ac2aaa
app/assets/stylesheets/less/_common.less
--- app/assets/stylesheets/less/_common.less
+++ app/assets/stylesheets/less/_common.less
@@ -24,12 +24,12 @@
     display: none !important;
     visibility: hidden !important;
 }
-
+/*
 .btns {
     font-size: 0;
     .n-btn:first-child { margin-right: 5px; }
 }
-
+*/
 
 /*
 .btn {
app/assets/stylesheets/less/_hiveUI.less
--- app/assets/stylesheets/less/_hiveUI.less
+++ app/assets/stylesheets/less/_hiveUI.less
@@ -1,3 +1,20 @@
+/** 
+ * bootstrap 2.2.1 기준 글자 크기로 조정 
+ * bootstrap 2.3.1 기본 글자 크기는 14px 
+ */
+body { font-size:12px; }
+label, input, button, select, textarea { font-size:12px; }
+select, textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"],
+input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"],
+input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"],
+.uneditable-input { font-size:12px; }
+.btn-group > .btn,
+.btn-group > .dropdown-menu,
+.btn-group > .popover {
+  font-size: 12px;
+}
+
+/** HIVE UI 시작 **/ 
 form { margin:0 0 2px; }
 textarea, input[type="text"], input[type="password"], input[type="datetime"], 
 input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], 
@@ -89,6 +106,7 @@
     }
 }
 a.nbtn, div.nbtn, span.nbtn, p.nbtn {
+    vertical-align:middle;
     &.small  { padding: 3px 10px; }
     &.medium { padding: 6px 20px; }
     &.large  { padding: 9px 30px; font-size:15px; }
@@ -137,6 +155,20 @@
 }
 
 /** input **/
+/* 검색버튼 스타일 */
+.btn-search {
+    width  : 88px;
+    margin : 5px 0 0;
+    padding: 4px 0;
+    border : 1px solid #a9a9a9;
+    color  : @black;
+    text-align : center;
+    font-weight: bold;
+    font-size  : 11px;
+    .border-radius(0 2px 2px 0);
+
+    &:hover { color:@link-hover-color; }    
+}
 /** 화면 중앙의 프로젝트 내 검색 폼 **/
 .form-search {
     .text {
@@ -151,17 +183,7 @@
     }
 
     .btn {
-        width  : 88px;
-        margin : 5px 0 0;
-        padding: 4px 0;
-        border : 1px solid #a9a9a9;
-        color  : @black;
-        text-align : center;
-        font-weight: bold;
-        font-size  : 11px;
-        .border-radius(0 2px 2px 0);
-
-        &:hover { color:@link-hover-color; }
+        .btn-search;
     }
 }
 
app/assets/stylesheets/less/_mixins.less
--- app/assets/stylesheets/less/_mixins.less
+++ app/assets/stylesheets/less/_mixins.less
@@ -3,9 +3,9 @@
 
 // Border Radius
 .border-radius(@radius: 5px){
-    -webkit-border-radius: @radius;
-    -moz-border-radius: @radius;
-    border-radius: @radius;
+    -webkit-border-radius: @radius !important;
+    -moz-border-radius: @radius !important;
+    border-radius: @radius !important;
 }
 .border-radius-bottom(@radius: 5px){
     -webkit-border-bottom-left-radius:@radius;
app/assets/stylesheets/less/_page.less
--- app/assets/stylesheets/less/_page.less
+++ app/assets/stylesheets/less/_page.less
@@ -2515,7 +2515,7 @@
     .repo-url {
         cursor: text;
         margin: 0;
-        width: 350px; /*357px;*/
+        width: 340px; /*357px;*/
         .box-shadow(none);
         .border-radius(2px 0 0 2px);
         &:focus {
@@ -2524,17 +2524,16 @@
         }
     }
     .copy-btn {
-        font-size: 10px;
-        /*color: #B2B2B2;*/
-        border: 1px solid #CCC;
-        border-left: 0 none;
-        line-height: 26px;
-        vertical-align: top;
-        text-decoration: none;
         padding: 0 19px;
         margin-right: 10px;
-        font-weight: bold;
         margin-top:1px;
+        line-height: 28px;
+        border: 1px solid #CCC;
+        border-left: 0 none;
+        vertical-align: top;
+        text-decoration: none;
+        font-size: 10px;
+        font-weight: bold;
         .inline-block;
         .border-radius(0 2px 2px 0);
 
app/views/code/codeView.scala.html
--- app/views/code/codeView.scala.html
+++ app/views/code/codeView.scala.html
@@ -26,7 +26,7 @@
 
 	@prjmenu(project, utils.MenuType.CODE, "main-menu-only")
 
-	<ul class="nav nav-tabs hive-tabs">
+	<ul class="nav nav-tabs">
 		<li class="active">
 			<a href="@routes.CodeApp.codeBrowser(project.owner, project.name)">@Messages("code.files")</a>
 		</li>
@@ -41,15 +41,17 @@
 			 --><input id="repositoryURL" type="text" class="text repo-url" readonly="readonly" value="@CodeApp.getURL(project.owner, project.name)"><!-- 
              --><a id="copyURL" href="#!/copy-url" class="copy-btn btn">COPY TO CLIPBOARD</a>
 
-            <div id="branches" class="btn-group branches" data-name="branch" data-activate="manual">
-				<button data-toggle="dropdown" class="btn dropdown-toggle bgwhite d-label"></button>
-				<button data-toggle="dropdown" class="btn dropdown-toggle bgwhite"><span class="caret"></span></button>
+			<div id="branches" class="btn-group branches" data-name="branch" data-activate="manual">
+				<button class="btn dropdown-toggle large" data-toggle="dropdown">
+					<span class="d-label"></span>
+					<span class="d-caret"><span class="caret"></span></span>
+				</button>
 				<ul class="dropdown-menu">
 					@for(branch <- branches){
 						@makeBranchItem(branch)
 					}
 				</ul>
-			</div> 
+			</div>
 		</div>
 		<hr class="double-sp" />
 		<div class="code-browse-wrap">
app/views/hiveUI.scala.html
--- app/views/hiveUI.scala.html
+++ app/views/hiveUI.scala.html
@@ -1,24 +1,25 @@
+@import utils.TemplateHelper._
 <!DOCTYPE html>
 <html lang="ko">
 <head>
-	<meta charset="utf-8">
-	<title>HIVE UI</title>
-	<meta name="viewport" content="width=device-width, initial-scale=1.0">
-	<link rel="shortcut icon" type="image/png" href="/assets/images/favicon.ico">
-	<link rel="stylesheet" type="text/css" media="screen" href="/assets/stylesheets/bootstrap.css">
-	<link rel="stylesheet" type="text/css" media="screen" href="/assets/stylesheets/nforge.css">
-	<script type="text/javascript" src="/assets/javascripts/lib/jquery/jquery-1.9.0.js"></script>
-	<script type="text/javascript" src="/assets/javascripts/common/hive.Common.js"></script>
-	<script type="text/javascript" src="/assets/javascripts/lib/bootstrap.js"></script>
-	<style type="text/css">
-		body { color:#ccc; }
-		dl { display:inline-block; margin:18px; }
-		dd { margin-left:0; }
-		.gnb-logo { display:inline-block !important; }
-		.gnb-outer { text-align:center; }
-		.subtitle { font-size:24px; font-weight:bold; height:55px; line-height:55px; vertical-align:bottom; }
-		.css { display:none;font-family: Consolas; color: #222; background: #C9EBB5; padding: 3px; border-radius: 3px; border: 1px solid #4CB848; }
-	</style>
+<meta charset="utf-8">
+<title>HIVE UI</title>
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<link rel="shortcut icon" type="image/png" href="@routes.Assets.at("images/favicon.ico")">
+<link rel="stylesheet" type="text/css" media="screen" href="@getCSSLink("bootstrap")">
+<link rel="stylesheet" type="text/css" media="screen" href="@getCSSLink("nforge")">
+<script type="text/javascript" src="@getJSLink("lib/jquery/jquery-1.9.0")"></script>
+<script type="text/javascript" src="@getJSLink("lib/bootstrap")"></script>
+<script type="text/javascript" src="@getJSLink("common/hive.Common")"></script>
+<style type="text/css">
+body { color:#ccc; }
+dl { display:inline-block; margin:18px; }
+dd { margin-left:0; }
+.gnb-logo { display:inline-block !important; }
+.gnb-outer { text-align:center; }
+.subtitle { font-size:24px; font-weight:bold; height:55px; line-height:55px; vertical-align:bottom; }
+.css { display:none;font-family: Consolas; color: #222; background: #C9EBB5; padding: 3px; border-radius: 3px; border: 1px solid #4CB848; }
+</style>
 </head>
 <body>
 
app/views/milestone/list.scala.html
--- app/views/milestone/list.scala.html
+++ app/views/milestone/list.scala.html
@@ -42,11 +42,11 @@
     
     <div class="tab-wrap">
         <div class="pull-right btns">
-            <a href="@routes.MilestoneApp.manageMilestones(projectInst.owner, projectInst.name)" class="n-btn small gray">@Messages("milestone.menu.manage")</a>
-            <a href="@routes.MilestoneApp.newMilestoneForm(projectInst.owner, projectInst.name)" class="n-btn small orange">@Messages("milestone.menu.new")</a>
+            <a href="@routes.MilestoneApp.manageMilestones(projectInst.owner, projectInst.name)" class="nbtn medium">@Messages("milestone.menu.manage")</a>
+            <a href="@routes.MilestoneApp.newMilestoneForm(projectInst.owner, projectInst.name)" class="nbtn medium orange">@Messages("milestone.menu.new")</a>
         </div>
         
-        <ul class="nav nav-tabs hive-tabs">
+        <ul class="nav nav-tabs">
             <li class="@if(mCondition.state.equals("all")){active}">
                 <a href="@makeMilestoneListLink("all")">@Messages("milestone.state.all")</a>
             </li>
app/views/project/memberList.scala.html
--- app/views/project/memberList.scala.html
+++ app/views/project/memberList.scala.html
@@ -19,7 +19,7 @@
                    data-provider="typeahead" autocomplete="off"
 				   placeholder="@Messages("project.members.addMember")"
 				   pattern="^[a-zA-Z0-9-]+([_.][a-zA-Z0-9-]+)*$" title="@Messages("user.wrongloginId.alert")" /><!-- 
-         --><button class="ns-btn" type="submit"><i class="ico ico-plus-blue"></i>@Messages("button.add")</button>
+         --><button type="submit" class="nbtn medium white"><i class="ico ico-plus-blue"></i>@Messages("button.add")</button>
 		</form>
 	</div>
 
@@ -40,20 +40,24 @@
 					<p class="name">(@member.user.name)</p>
 				</div>
 				<div class="td">
+					@if(!project.isOwner(member.user)) {
+					
 					<div class="btn-group" data-name="roleof-@member.user.loginId">
-						<button data-toggle="dropdown" class="btn dropdown-toggle bgwhite d-label">@member.role.name</button>
-						<button data-toggle="dropdown" class="btn dropdown-toggle bgwhite"><span class="caret"></span></button>
-                        @if(!project.isOwner(member.user)) {
+						<button class="btn dropdown-toggle large" data-toggle="dropdown">
+							<span class="d-label">@member.role.name</span>
+							<span class="d-caret"><span class="caret"></span></span>
+						</button>
 						<ul class="dropdown-menu">@memberRole(member.role.name)</ul>
-                        }
 					</div>
-                    @if(!project.isOwner(member.user)) {
+					
 					<p class="btns">
-						<a href="javascript:void(0)" data-action="delete" data-href="@routes.ProjectApp.deleteMember(project.owner, project.name, member.user.id)" class="n-btn small light-gray"><!-- 
+						<a href="javascript:void(0)" data-action="delete" data-href="@routes.ProjectApp.deleteMember(project.owner, project.name, member.user.id)" class="nbtn medium"><!-- 
 						 --><i class="ico ico-delete-small"></i>@Messages("button.delete")</a> 
-						<a href="javascript:void(0)" data-action="apply" data-href="@routes.ProjectApp.editMember(project.owner, project.name, member.user.id)" data-loginId="@member.user.loginId" class="n-btn small orange"><!-- 
+						<a href="javascript:void(0)" data-action="apply" data-href="@routes.ProjectApp.editMember(project.owner, project.name, member.user.id)" data-loginId="@member.user.loginId" class="nbtn medium orange"><!-- 
 						 --><i class="ico ico-apply-small"></i>@Messages("button.apply")</a>
 					</p>
+                    } else {
+                    	<p style="height:65px;">@member.role.name</p>
                     }
 				</div>
 			</div>
app/views/project/newProject.scala.html
--- app/views/project/newProject.scala.html
+++ app/views/project/newProject.scala.html
@@ -14,14 +14,14 @@
 		                        <a href="#!/close" class="ico btn-delete"></a>
 		                    </div>
 		                </div>
-            			<label for="project-name">새 프로젝트 이름을 입력해주세요</label>
+            			<label for="project-name">@Messages("project.name.placeholder")</label>
             		</dt>
             		<dd>
-            			<input id="project-name" type="text" name="name" class="text" placeholder="영문으로 공백없이 작성해 주세요" maxlength="250">
+            			<input id="project-name" type="text" name="name" class="text" placeholder="@Messages("project.name.alert")" maxlength="250">
             		</dd>
             		
             		<dt>
-						<label for="description">프로젝트 설명을 입력해주세요</label>
+						<label for="description">@Messages("project.description.placeholder")</label>
 					</dt>
 					<dd>
 						<textarea id="description" name="overview" class="text textarea.span4" style="resize:vertical;"></textarea>
@@ -30,25 +30,27 @@
 
                 <ul class="options unstyled">
                     <li class="option">
-                        <div class="option-label">공개설정</div>
+                        <div class="option-label">@Messages("project.shareOption")</div>
                         <div class="option-desc">
                             <input name="share_option" type="radio" checked="checked" id="public" value="true" class="radio-btn"><label for="public" class="bg-radiobtn label-public">공개</label>
                             <input name="share_option" type="radio" id="private" value="false" class="radio-btn"><label for="private" class="bg-radiobtn label-private">비공개</label>
-                            <span class="note">비공개 프로젝트도 프로젝트 이름, 설명, 로그 등은 모든 사용자가 볼 수 있습니다.</span>
+                            <span class="note">@Messages("project.private.notice")</span>
                         </div>
                     </li>
                     <li class="option">
-                        <div class="option-label">코드관리시스템</div>
+                        <div class="option-label">@Messages("project.vcs")</div>
                         <div class="option-desc">
-                            <div class="btn-group" data-name="vcs">
-                                <button data-toggle="dropdown" class="btn dropdown-toggle d-label bgwhite"></button>
-                                <button data-toggle="dropdown" class="btn dropdown-toggle bgwhite"><span class="caret"></span></button>
-                                <ul class="dropdown-menu">
+							<div class="btn-group" data-name="vcs">
+								<button class="btn dropdown-toggle large" data-toggle="dropdown">
+									<span class="d-label"></span> 
+									<span class="d-caret"><span class="caret"></span></span>
+								</button>
+								<ul class="dropdown-menu">
                                     @RepositoryService.vcsTypes.map{ v =>
                                         <li data-value="@v._1" @if(v._1 == "GIT"){ data-selected="true" class="active" }><a href="javascript:void(0)">@Messages(v._2)</a></li>
                                     }
-                                </ul>
-                            </div>
+								</ul>
+							</div>
                         </div>
                     </li>
                     
app/views/project/setting.scala.html
--- app/views/project/setting.scala.html
+++ app/views/project/setting.scala.html
@@ -24,10 +24,10 @@
                         <li>@Messages("project.logo.maxFileSize") <span class="point">1MB</span></li>
                         <li>@Messages("project.logo.size") <span class="point">234px × 168px</span></li>
                         <li>
-                            <div class="fake-file-wrap">
-								<input type="file" class="file" name="logoPath" size="1" accept="image/*">
-								<div class="ns-btn">
-									<i class="ico ico-plus-blue"></i>@Messages("button.upload")
+                        	<div class="btn-wrap">
+								<div class="nbtn medium white fake-file-wrap">
+									<i class="ico ico-plus-blue"></i>@Messages("button.upload")<!-- 
+								--> <input type="file" class="file" name="logoPath" accept="image/*">
 								</div>
 							</div>
                         </li>
@@ -36,15 +36,7 @@
             </div>
             <dl class="setting-box right">
             	<dt>
-            	 <!-- 
-                 <div class="n-alert hide" id="alert_msg">
-                     <div class="n-inner">
-                         <span class="msg">@Messages("project.wrongName")</span>
-                         <a href="#" class="ico btn-delete" data-dismiss="alert"></a>
-                     </div>
-                 </div>
-                 -->
-                 <label for="project-name">@Messages("project.name.placeholder")</label>
+					<label for="project-name">@Messages("project.name.placeholder")</label>
                 </dt>
                 <dd>
                     @inputText(projectForm("name"), 'class->"text", 'maxlength -> "250")
@@ -65,7 +57,7 @@
                     <!-- tags will be added here by hive.project.Settings.js -->
                 </div>
                 <input name="newTag" type="text" class="text" style="margin-bottom:0px" data-provider="typeahead" autocomplete="off"/>
-                <button id="addTag" type="button" class="btn-transparent n-btn med gray">@Messages("button.add")</button>
+                <button id="addTag" type="button" class="nbtn medium">@Messages("button.add")</button>
             </div>
         </div>
         
@@ -85,7 +77,7 @@
         **@
     </div>
     <div class="box-wrap bottom">
-        <button id="save" type="submit" class="btn-transparent n-btn orange med">@Messages("button.save")</button>
+        <button id="save" type="submit" class="nbtn orange medium">@Messages("button.save")</button>
     </div>
 	}
 
Add a comment
List