Add: maestro main menu tab
This commit is contained in:
+41
-16
@@ -22,37 +22,62 @@ header {
|
||||
/*text-align: center;*/
|
||||
}
|
||||
|
||||
section {
|
||||
background-color: #ddddff;
|
||||
}
|
||||
|
||||
article {
|
||||
padding: 1em;
|
||||
}
|
||||
|
||||
footer {
|
||||
height: 70px;
|
||||
padding: 1em;
|
||||
/*padding: 1em;*/
|
||||
color: black;
|
||||
background-color: #007196;
|
||||
clear: left;
|
||||
/*clear: left;*/
|
||||
/*text-align: center;*/
|
||||
}
|
||||
|
||||
|
||||
|
||||
#home {
|
||||
/*color: red;*/
|
||||
}
|
||||
|
||||
/*
|
||||
.player_free {
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
background-color: #f00;
|
||||
}
|
||||
|
||||
.maestro_free {
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
background-color: #0ff;
|
||||
#page-tabs {
|
||||
width: 1024px;
|
||||
height: 30px;
|
||||
}
|
||||
*/
|
||||
|
||||
#page-tabs ul {
|
||||
height: 60px;
|
||||
padding: 0px;
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
#page-tabs ul li {
|
||||
list-style: none;
|
||||
background-color: #eeeeff;
|
||||
color: #aaaadd;
|
||||
float: left;
|
||||
font-size: 1.3em;
|
||||
font-weight: none;
|
||||
line-height: 60px;
|
||||
vertical-align: middle;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#page-tabs ul li.activated {
|
||||
font-weight: bold;
|
||||
color: black;
|
||||
background-color: #ddddff;
|
||||
}
|
||||
|
||||
#page-tabs ul li.widthOneThird {
|
||||
width: 33.33%;
|
||||
}
|
||||
|
||||
#page-tabs ul li.widthQuarter {
|
||||
width: 25%;
|
||||
}
|
||||
|
||||
</style>
|
||||
@@ -1,14 +1,49 @@
|
||||
<div class="container" style="line-height: 40px;">
|
||||
<style>
|
||||
|
||||
.container span {
|
||||
display: inline-block;
|
||||
padding: 0px;
|
||||
margin: 0px;
|
||||
line-height: 70px;
|
||||
}
|
||||
|
||||
|
||||
#company {
|
||||
width: 200px;
|
||||
/*float: left;*/
|
||||
padding: 0px 0px 0px 20px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
#support_email {
|
||||
width: 400px;
|
||||
margin: 0 auto;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#faq {
|
||||
width: 200px;
|
||||
float: right;
|
||||
padding: 14px 20px 0px 0px;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
|
||||
<div class="container" style="line-height: 40px;">
|
||||
|
||||
<span id="company">
|
||||
JINAJU
|
||||
Copyright @JINAJU
|
||||
</span>
|
||||
|
||||
<span id="support_email">
|
||||
문의 : support@jinaju.com
|
||||
</span>
|
||||
|
||||
<span class="col alignRight">
|
||||
<a href="./../main/faq.html" id="faq" class="btn btn-sunflower">FAQ</a>
|
||||
<span id="faq" class="col">
|
||||
<a href="./../main/faq.html" class="btn btn-sunflower">FAQ</a>
|
||||
</span>
|
||||
|
||||
</div>
|
||||
|
||||
+44
-12
@@ -1,16 +1,48 @@
|
||||
<div class="container">
|
||||
<span class="col alignLeft">
|
||||
<a href="./../main/index.html" id="home" class="btn btn-orange" style="padding: 20px;">첫 화면</a>
|
||||
<style>
|
||||
|
||||
.home {
|
||||
display: inline-block;
|
||||
float: left;
|
||||
padding: 0px;
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
.header_menu {
|
||||
float: right;
|
||||
padding: 0px;
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
.header_menu li {
|
||||
float: left;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
|
||||
<div class="container">
|
||||
|
||||
<span class="home">
|
||||
<span class="col">
|
||||
<a href="./../main/index.html" id="login_maestro" class="btn btn-orange">마우스 타자<br/>연습 홈</a>
|
||||
</span>
|
||||
</span>
|
||||
|
||||
<div style="width: 100%; text-align: right;" >
|
||||
<span class="col alignRight">
|
||||
<a href="./../maestro/login.html" id="login_maestro" class="btn btn-sea">마에스트로<br/>로그인</a>
|
||||
</span>
|
||||
|
||||
<span class="col alignRight">
|
||||
<a href="#" target="_blank" id="login_player" class="btn btn-rouge" style="padding: 20px;">학생 연습</a>
|
||||
</span>
|
||||
</div>
|
||||
<nav>
|
||||
<ul class="header_menu">
|
||||
<li>
|
||||
<span class="col">
|
||||
<a href="#" target="_blank" id="login_player" class="btn btn-rouge">학생 연습<br/>앱 실행</a>
|
||||
</span>
|
||||
</li>
|
||||
<li>
|
||||
<span class="col">
|
||||
<a href="./../maestro/login.html" id="login_maestro" class="btn btn-sea">마에스트로<br/>로그인</a>
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
</div>
|
||||
|
||||
@@ -1,11 +1,11 @@
|
||||
<style>
|
||||
.player_free {
|
||||
background-color: #ff0000;
|
||||
/*background-color: #ff0000;*/
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.maestro_free {
|
||||
background-color: #0000ff;
|
||||
/*background-color: #0000ff;*/
|
||||
padding: 20px;
|
||||
}
|
||||
</style>
|
||||
@@ -15,10 +15,10 @@
|
||||
<div class="container">
|
||||
<div class="player_free">
|
||||
<div class="col alignCenter">
|
||||
<a href="./../client/menu_app.html" target="_blank" id="player_free_play" class="btn btn-rouge width400">학생 연습<br/>무료 체험</a>
|
||||
<a href="./../client/menu_app.html" target="_blank" id="player_free_play" class="btn btn-rouge width400">학생 연습 앱<br/>무료 체험</a>
|
||||
</div>
|
||||
|
||||
<ol>
|
||||
<ul id="free_app_list">
|
||||
<li>
|
||||
마우스 클릭 연습
|
||||
</li>
|
||||
@@ -28,7 +28,7 @@
|
||||
<li>
|
||||
한글 키보드 연습
|
||||
</li>
|
||||
</ol>
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
|
||||
@@ -37,7 +37,7 @@
|
||||
<a href="./../maestro/main_menu.html" id="maestro_free_menu" class="btn btn-sea width400">마에스트로<br/>관리자 메뉴 체험</a>
|
||||
</div>
|
||||
|
||||
<ol>
|
||||
<ul id="maestro_preview">
|
||||
<li>
|
||||
플레이어 관리
|
||||
</li>
|
||||
@@ -50,23 +50,23 @@
|
||||
<li>
|
||||
기록
|
||||
</li>
|
||||
</ol>
|
||||
</ul>
|
||||
|
||||
<div class="col alignCenter">
|
||||
<a href="./../maestro/register.html" id="maestro_register" class="btn btn-sea width400">마에스트로<br/>가입</a>
|
||||
</div>
|
||||
|
||||
<ol>
|
||||
<ul id="register_tip">
|
||||
<li>
|
||||
1만원 : 플레이어 20명
|
||||
학생 20명 (1만원 / 1년)
|
||||
</li>
|
||||
<li>
|
||||
2만원 : 플레이어 50명
|
||||
학생 50명 (2만원 / 1년)
|
||||
</li>
|
||||
<li>
|
||||
3만원 : 플레이어 100명
|
||||
학생 100명 (3만원 / 1년)
|
||||
</li>
|
||||
</ol>
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,4 +1,28 @@
|
||||
<script>
|
||||
<style>
|
||||
|
||||
.home {
|
||||
display: inline-block;
|
||||
float: left;
|
||||
padding: 0px;
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
.header_menu {
|
||||
float: right;
|
||||
padding: 0px;
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
.header_menu li {
|
||||
float: left;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
|
||||
<script>
|
||||
|
||||
function logout() {
|
||||
sessionStorage.clear();
|
||||
@@ -10,20 +34,30 @@ function logout() {
|
||||
|
||||
<div class="container">
|
||||
|
||||
<span class="col two">
|
||||
<a href="./../main/index.html" id="home" class="btn btn-orange" style="padding: 1.1em;">첫 화면</a>
|
||||
<span class="home">
|
||||
<span class="col">
|
||||
<a href="./../main/index.html" id="login_maestro" class="btn btn-orange">마우스 타자<br/>연습 홈</a>
|
||||
</span>
|
||||
</span>
|
||||
|
||||
<span class="col two" style="float: right;">
|
||||
<a href="#" id="logout_maestro" class="btn btn-sea" onClick="logout()">마에스트로<br/>로그아웃</a>
|
||||
</span>
|
||||
|
||||
<span class="col two" style="float: right;">
|
||||
<a href="#" target="_blank" id="enter_test_player" class="btn btn-rouge">마에스트로<br/>기록 삭제</a>
|
||||
</span>
|
||||
|
||||
<span class="col two" style="float: right;">
|
||||
<a href="./../client/menu_app.html" target="_blank" id="delete_test_player_history" class="btn btn-rouge">마에스트로<br/>입장</a>
|
||||
</span>
|
||||
<nav>
|
||||
<ul class="header_menu">
|
||||
<li>
|
||||
<span class="col">
|
||||
<a href="./../client/menu_app.html" target="_blank" id="delete_test_player_history" class="btn btn-rouge">마에스트로<br/>앱 실행</a>
|
||||
</span>
|
||||
</li>
|
||||
<li>
|
||||
<span class="col">
|
||||
<a href="#" target="_blank" id="enter_test_player" class="btn btn-sea">마에스트로<br/>앱 기록 삭제</a>
|
||||
</span>
|
||||
</li>
|
||||
<li>
|
||||
<span class="col">
|
||||
<a href="#" id="logout_maestro" class="btn btn-sea" onClick="logout()">마에스트로<br/>로그아웃</a>
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
</div>
|
||||
|
||||
@@ -1,8 +1,78 @@
|
||||
<div class="container">
|
||||
<div class="maestro_manager_user">
|
||||
<style>
|
||||
|
||||
<h1>학생 관리</h1>
|
||||
.login {
|
||||
background-color: #ff0000;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.register {
|
||||
background-color: #0000ff;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
|
||||
.hide {
|
||||
display: none;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
|
||||
<script>
|
||||
|
||||
function tabClicked(tabNo) {
|
||||
for(let i = 0; i < 4; i++) {
|
||||
$("#page-tabs li").filter(":eq(" + i + ")").removeClass("activated");
|
||||
}
|
||||
|
||||
let tabIndex = tabNo - 1;
|
||||
$("#page-tabs li").filter(":eq(" + tabIndex + ")").addClass("activated");
|
||||
|
||||
switch(tabNo) {
|
||||
case 1:
|
||||
$(".player_list").removeClass("hide");
|
||||
$(".search").addClass("hide");
|
||||
$(".mouse_app_list").addClass("hide");
|
||||
$(".typing_app_list").addClass("hide");
|
||||
break;
|
||||
case 2:
|
||||
$(".player_list").addClass("hide");
|
||||
$(".search").removeClass("hide");
|
||||
$(".mouse_app_list").addClass("hide");
|
||||
$(".typing_app_list").addClass("hide");
|
||||
break;
|
||||
case 3:
|
||||
$(".player_list").addClass("hide");
|
||||
$(".search").addClass("hide");
|
||||
$(".mouse_app_list").removeClass("hide");
|
||||
$(".typing_app_list").addClass("hide");
|
||||
break;
|
||||
case 4:
|
||||
$(".player_list").addClass("hide");
|
||||
$(".search").addClass("hide");
|
||||
$(".mouse_app_list").addClass("hide");
|
||||
$(".typing_app_list").removeClass("hide");
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
<div class="container">
|
||||
<div id="page-tabs">
|
||||
<ul>
|
||||
<li class="widthQuarter activated" onClick="tabClicked(1)">학생 목록</li>
|
||||
<li class="widthQuarter" onClick="tabClicked(2)">학생 검색</li>
|
||||
<li class="widthQuarter" onClick="tabClicked(3)">마우스 앱 활성화</li>
|
||||
<li class="widthQuarter" onClick="tabClicked(4)">키보드 앱 활성화</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="player_list">
|
||||
<h2>추가</h2>
|
||||
|
||||
<h3>1명 추가</h3>
|
||||
@@ -39,15 +109,14 @@
|
||||
|
||||
<h2>목록</h2>
|
||||
|
||||
<p>
|
||||
<div>
|
||||
목록
|
||||
<button>보기</button>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<h2>검색</h2>
|
||||
|
||||
<p>
|
||||
<div class="search hide">
|
||||
<div>
|
||||
검색
|
||||
아이디
|
||||
<input type="text" id="search_name"><button>찾기</button><br/>
|
||||
@@ -59,27 +128,19 @@
|
||||
<input type="text" id="result_name"><button>삭제</button><br/>
|
||||
입장 코드
|
||||
<input type="text" id="result_entercode"><button>수정</button>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<hr>
|
||||
|
||||
<div class="maestro_manager_app">
|
||||
|
||||
<h1>과목 관리</h1>
|
||||
|
||||
<h2>마우스</h2>
|
||||
|
||||
<div class="mouse_app_list hide">
|
||||
<form action="/action_page.php" method="get" id="app_mouse">
|
||||
<input type="checkbox" name="mouse">클릭 연습<br/>
|
||||
<input type="checkbox" name="mouse">더블 클릭 연습<br/>
|
||||
<button type="submit" form="app_mouse">적용</button>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
|
||||
<h2>타자</h2>
|
||||
|
||||
<div class="typing_app_list hide">
|
||||
<form action="/action_page.php" method="get" id="app_typing">
|
||||
<input type="checkbox" name="typing">기본 자리<br/>
|
||||
<input type="checkbox" name="typing">왼손 윗글쇠<br/>
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
<style>
|
||||
|
||||
.login {
|
||||
background-color: #ff0000;
|
||||
padding: 20px;
|
||||
@@ -8,6 +9,19 @@
|
||||
background-color: #0000ff;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
|
||||
#page-tabs ul li {
|
||||
/*width: 341px;*/
|
||||
list-style: none;
|
||||
color: #dddddd;
|
||||
float: left;
|
||||
font-size: 1.3em;
|
||||
line-height: 60px;
|
||||
vertical-align: middle;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
@@ -95,11 +109,17 @@ function check_data() {
|
||||
|
||||
$("#input_data").css("display", "none");
|
||||
$("#register_account").css("display", "block");
|
||||
|
||||
$("li").filter(":eq(0)").removeClass("activated");
|
||||
$("li").filter(":eq(1)").addClass("activated");
|
||||
}
|
||||
|
||||
function register_account() {
|
||||
$("#register_account").css("display", "none");
|
||||
$("#banking_guide").css("display", "block");
|
||||
|
||||
$("li").filter(":eq(1)").removeClass("activated");
|
||||
$("li").filter(":eq(2)").addClass("activated");
|
||||
}
|
||||
|
||||
</script>
|
||||
@@ -107,9 +127,17 @@ function register_account() {
|
||||
|
||||
|
||||
<div class="container">
|
||||
<div id="input_data">
|
||||
|
||||
<h1>마에스트로 계정 신청</h1>
|
||||
<div id="page-tabs">
|
||||
<ul>
|
||||
<li class="widthOneThird activated">마에스트로 계정 신청</li>
|
||||
<li class="widthOneThird">신청 정보 확인</li>
|
||||
<li class="widthOneThird">신청 완료</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
|
||||
<div id="input_data">
|
||||
|
||||
(필수) 마에스트로 아이디 : <input type="text" id="maestro_name">
|
||||
<button id="check_id" onClick="check_id()">중복 확인</button><br/>
|
||||
@@ -126,30 +154,29 @@ function register_account() {
|
||||
<input id="check_accept_clauses" type="checkbox" name="accept_clauses">아래 약관을 읽었으며, 모든 내용에 동의합니다.<br/>
|
||||
<br/>
|
||||
|
||||
<div class="col alignCenter">
|
||||
<a id="maestro_register" class="btn btn-sea width400" onClick="check_data()">등록 신청</a>
|
||||
</div>
|
||||
|
||||
<br/>
|
||||
<textarea id="error_message">
|
||||
</textarea>
|
||||
|
||||
<div class="col alignCenter">
|
||||
<a id="agreement_clauses" class="btn btn-orange">전체 약관 읽기</a>
|
||||
</div>
|
||||
|
||||
<h1>약관 주요 내용 요약</h1>
|
||||
|
||||
<p style="text-align: right;">마지막 갱신 : 2018년 6월 26일</p>
|
||||
|
||||
<ol>
|
||||
<li>결제는 계좌 이체(송금)으로만 가능합니다. 신용카드 결제는 준비되지 않았습니다.</li>
|
||||
<ul>
|
||||
<li>결제는 계좌 이체(송금)으로만 가능합니다. 신용카드 결제는 준비되지 않았습니다.</li>
|
||||
<li>서버가 불안정할 수 있습니다. 문제 발생시 메일로 알려주시면 최대한 빨리 정상화 하겠습니다.</li>
|
||||
<li>결제후 1년이 지나면 마에스트로 계정과 학생들의 계정이 비활성화 됩니다.</li>
|
||||
<li>비활성화 되기 전에 연장 결제 해주시면, 남은 기간도 함께 연장됩니다.</li>
|
||||
<li>비활성화된 계정은, 6개월후에 삭제됩니다. 마에스트로 계정 및 학생들의 계정 정보 모두가 사라집니다.</li>
|
||||
<li>서비스 업그레이드는 가능합니다. 업그레이드한 날부터 1년간 업그레이드 서비스가 시작됩니다.</li>
|
||||
</ol>
|
||||
</ul>
|
||||
|
||||
<div class="col alignCenter">
|
||||
<a id="agreement_clauses" class="btn btn-orange">전체 약관 읽기</a>
|
||||
<a id="maestro_register" class="btn btn-sea width400" onClick="check_data()">등록 신청</a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
@@ -190,7 +217,7 @@ function register_account() {
|
||||
|
||||
|
||||
<div id="banking_guide" style="display: none;">
|
||||
<h2>신청 정보 확인</h2>
|
||||
<h2>신청 완료</h2>
|
||||
|
||||
<div>마에스트로 아이디</div>
|
||||
<div class="maestro_name"></div>
|
||||
@@ -208,7 +235,7 @@ function register_account() {
|
||||
<br/>
|
||||
|
||||
<div>
|
||||
방금 이메일 주소로 입금 안내 내용을 보내드렸습니다.
|
||||
방금 <span class="email"></span> 이메일로 입금 안내 내용을 보내드렸습니다.
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
Reference in New Issue
Block a user