mirror of
https://github.com/Lastorder-DC/rhymix.git
synced 2026-01-07 18:51:41 +09:00
Issue 2444. Panel UI update. #properties
git-svn-id: http://xe-core.googlecode.com/svn/branches/maserati@11368 201d5d3c-b55e-5fd7-737f-ddc643e51545
This commit is contained in:
ChanMyeong
parent
ce154f8056
commit
3008a568a7
3 changed files with 107 additions and 29 deletions
|
|
@ -8,6 +8,9 @@ body>.x{margin:0}
|
|||
}
|
||||
body>.x,.x table,.x input,.x textarea,.x select,.x button{font-size:13px}
|
||||
.x strong, .x th{font-weight:600}
|
||||
.x [disabled]{cursor:not-allowed}
|
||||
.x button[disabled]{color:#ccc !important}
|
||||
.x a[target="_blank"]:after{ content:"";display:inline-block;width:14px;height:14px;vertical-align:middle;margin:0 0 0 2px;background-position:-120px -72px;opacity:.3;filter:alpha(opacity=30)}
|
||||
/* Bootstrap Override */
|
||||
.x .x_page-header{padding-bottom:0}
|
||||
.x h1,.x h2,.x h3,.x h4,.x h5,.x h6{line-height:1.5;font-weight:600;color:#666}
|
||||
|
|
@ -29,7 +32,10 @@ body>.x,.x table,.x input,.x textarea,.x select,.x button{font-size:13px}
|
|||
.x .x_btn-group>.x_btn:last-child,
|
||||
.x .x_btn-group>.x_dropdown-toggle{border-top-right-radius:2px;border-bottom-right-radius:2px}
|
||||
.x .x_btn-group>.x_btn:first-child{border-bottom-left-radius:2px;border-top-left-radius:2px}
|
||||
.x a.x_icon-question-sign,
|
||||
.x button.x_icon-question-sign{cursor:help}
|
||||
/* Image Sprite */
|
||||
.x a[target="_blank"]:after,
|
||||
.x>.body>.gnb>ul>li>a:before,
|
||||
.x .dashboard>section>h2:before{background-image:url(../../../../common/img/glyphicons-halflings.png);background-repeat:no-repeat}
|
||||
.x>.body>.gnb>ul>li.open>a:before,
|
||||
|
|
|
|||
6
modules/admin/tpl/css/admin.min.css
vendored
6
modules/admin/tpl/css/admin.min.css
vendored
|
|
@ -8,6 +8,9 @@ body>.x{margin:0}
|
|||
}
|
||||
body>.x,.x table,.x input,.x textarea,.x select,.x button{font-size:13px}
|
||||
.x strong, .x th{font-weight:600}
|
||||
.x [disabled]{cursor:not-allowed}
|
||||
.x button[disabled]{color:#ccc !important}
|
||||
.x a[target="_blank"]:after{ content:"";display:inline-block;width:14px;height:14px;vertical-align:middle;margin:0 0 0 2px;background-position:-120px -72px;opacity:.3;filter:alpha(opacity=30)}
|
||||
/* Bootstrap Override */
|
||||
.x .x_page-header{padding-bottom:0}
|
||||
.x h1,.x h2,.x h3,.x h4,.x h5,.x h6{line-height:1.5;font-weight:600;color:#666}
|
||||
|
|
@ -29,7 +32,10 @@ body>.x,.x table,.x input,.x textarea,.x select,.x button{font-size:13px}
|
|||
.x .x_btn-group>.x_btn:last-child,
|
||||
.x .x_btn-group>.x_dropdown-toggle{border-top-right-radius:2px;border-bottom-right-radius:2px}
|
||||
.x .x_btn-group>.x_btn:first-child{border-bottom-left-radius:2px;border-top-left-radius:2px}
|
||||
.x a.x_icon-question-sign,
|
||||
.x button.x_icon-question-sign{cursor:help}
|
||||
/* Image Sprite */
|
||||
.x a[target="_blank"]:after,
|
||||
.x>.body>.gnb>ul>li>a:before,
|
||||
.x .dashboard>section>h2:before{background-image:url(../../../../common/img/glyphicons-halflings.png);background-repeat:no-repeat}
|
||||
.x>.body>.gnb>ul>li.open>a:before,
|
||||
|
|
|
|||
|
|
@ -34,26 +34,55 @@
|
|||
<button type="button" class="x_btn x_btn-small x_btn-inverse"><i class="x_icon-plus x_icon-white"></i> 사이트맵 추가</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col" id="add_root">
|
||||
<section>
|
||||
<h1><a href="#" target="_blank">{사이트맵 이름}</a></h1>
|
||||
<ul class="nav">
|
||||
<li><a href="#add" data-show="#add">메뉴 추가 <i class="x_icon-circle-arrow-right"></i></a></li>
|
||||
<li><button type="button" disabled>붙여넣기</button></li>
|
||||
<li><button type="button">삭제</button></li>
|
||||
</ul>
|
||||
</section>
|
||||
<button type="button" class="x_close" data-hide="#add_root">×</button>
|
||||
</div>
|
||||
<div class="col" id="properties">
|
||||
<section>
|
||||
<h1><a href="#" target="_blank">{메뉴 이름}</a></h1>
|
||||
<ul>
|
||||
<li><strong>메뉴 ID</strong>: idx0</li>
|
||||
<li><strong>메뉴 타입</strong>: 문서 페이지</li>
|
||||
<li class="add"><a href="#add" data-show="#add">메뉴 추가 <i class="x_icon-circle-arrow-right"></i></a></li>
|
||||
<li><button type="button">잘라내기</button></li>
|
||||
<li><button type="button">복사</button></li>
|
||||
<li><button type="button" disabled>붙여넣기</button></li>
|
||||
<li><button type="button" onClick="confirm('메뉴를 삭제하면 콘텐츠도 삭제됩니다. 정말 삭제하시겠습니까?')">삭제</button></li>
|
||||
<li class="default"><a href="#default" data-show="#default">기본 설정 <i class="x_icon-circle-arrow-right"></i></a></li>
|
||||
<li><a href="#imgbtn" data-show="#imgbtn">이미지 버튼 <i class="x_icon-circle-arrow-right"></i></a></li>
|
||||
<li><a href="#design" data-show="#design">디자인 <i class="x_icon-circle-arrow-right"></i></a></li>
|
||||
<li><a href="#auth" data-show="#auth">권한 <i class="x_icon-circle-arrow-right"></i></a></li>
|
||||
<li><a href="#details" data-show="#details">상세 설정 <i class="x_icon-circle-arrow-right"></i></a></li>
|
||||
</ul>
|
||||
</section>
|
||||
<button type="button" class="x_close" data-hide="#properties">×</button>
|
||||
</div>
|
||||
<div class="col" id="add">
|
||||
<section>
|
||||
<h1>메뉴 추가</h1>
|
||||
<ul>
|
||||
<ul class="nav">
|
||||
<li><a href="#add_page" data-show="#add_page" data-param='{ "t" : "value of t" }'>문서 페이지 <i class="x_icon-circle-arrow-right"></i></a></li>
|
||||
<li><a href="#add_page" data-show="#add_page">위젯 페이지 <i class="x_icon-circle-arrow-right"></i></a></li>
|
||||
<li><a href="#add_page" data-show="#add_page">게시판 <i class="x_icon-circle-arrow-right"></i></a></li>
|
||||
<li><a href="#add_url" data-show="#add_url">URL 링크 <i class="x_icon-circle-arrow-right"></i></a></li>
|
||||
</ul>
|
||||
<div class="x_btn-group" style="margin:0;padding:10px 0;border-top:1px solid #ccc;text-align:right">
|
||||
<div class="x_btn-group" style="margin:0;padding:10px 0;text-align:right">
|
||||
<a href="#download" class="x_btn x_btn-small x_btn-inverse" data-show="#download"><i class="x_icon-plus x_icon-white"></i> 다른 메뉴타입설치</a>
|
||||
</div>
|
||||
</section>
|
||||
<button type="button" class="x_close" data-hide="#add">×</button>
|
||||
</div>
|
||||
|
||||
<div class="col" id="add_page">
|
||||
<fieldset>
|
||||
<h1>문서 페이지</h1>
|
||||
<h1>{문서 페이지}</h1>
|
||||
<ul>
|
||||
<li>
|
||||
<label for="menuName1">메뉴이름(브라우저 제목)</label>
|
||||
|
|
@ -74,7 +103,6 @@
|
|||
</fieldset>
|
||||
<button type="button" class="x_close" data-hide="#add_page">×</button>
|
||||
</div>
|
||||
|
||||
<div class="col" id="add_url">
|
||||
<fieldset>
|
||||
<h1>URL 링크</h1>
|
||||
|
|
@ -95,17 +123,6 @@
|
|||
</div>
|
||||
<div class="x_tab-pane" id="linkMenu">
|
||||
<input type="text" required title="메뉴 링크" disabled placeholder="메뉴를 선택하면 자동 입력됨" />
|
||||
<script>
|
||||
jQuery(function($){
|
||||
// #linkMenu prototype
|
||||
setTimeout(function(){
|
||||
$('.mapi').clone().removeClass().removeAttr('id').addClass('clone').appendTo('#linkMenu').find('li').removeAttr('id').removeAttr('class').find('ins, .side').remove();
|
||||
$('.clone a').click(function(){
|
||||
$('#linkMenu>input').val($(this).text());
|
||||
});
|
||||
}, 1000);
|
||||
});
|
||||
</script>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -217,24 +234,52 @@ jQuery(function($){
|
|||
.mapi .jstree-hovered>.x_icon-home{background-image:url({getUrl('')}common/img/glyphicons-halflings-white.png);opacity:1;filter:alpha(opacity=100)}
|
||||
/* li>.side */
|
||||
.mapi .side{position:absolute;z-index:2;top:0;right:0;line-height:0}
|
||||
.mapi .side>button{border:0;border-radius:3px;width:23px;height:23px;overflow:hidden;line-height:0;text-indent:24px;background:url({getUrl('')}common/img/glyphicons-halflings.png) no-repeat;-webkit-transition:.3s;-moz-transition:.3s;-o-transition:.3s}
|
||||
.mapi .side>button{border:0;border-radius:3px;width:23px;height:23px;overflow:hidden;font-size:0;line-height:0;text-indent:24px;background:url({getUrl('')}common/img/glyphicons-halflings.png) no-repeat;-webkit-transition:.3s;-moz-transition:.3s;-o-transition:.3s}
|
||||
.mapi .side>button[data-toggle="#add"]{background-position:4px -91px}
|
||||
.mapi .side>button[data-toggle="#info"]{background-position:-428px 5px}
|
||||
.mapi .side>button:hover,
|
||||
.mapi .side>button:focus{background-color:#333;background-image:url({getUrl('')}common/img/glyphicons-halflings-white.png)}
|
||||
/* Plugin style override */
|
||||
.mapi a>.jstree-icon{display:none}
|
||||
/* Add */
|
||||
#add li{border-top:1px solid #ddd;position:relative;white-space:nowrap}
|
||||
#add li:first-child{border-top:0}
|
||||
#add li>a{display:block;padding:6px 15px 6px 8px;color:#333;text-decoration:none;background:#fff;-webkit-transition:.3s;-moz-transition:.3s;-o-transition:.3s}
|
||||
#add li>a:hover,
|
||||
#add li>a:focus,
|
||||
#add li.active>a{background:#666;color:#fff}
|
||||
#add li>a>i{position:absolute;top:7px;right:5px;opacity:.5;filter:alpha(opacity=50)}
|
||||
#add li>a:hover>i,
|
||||
#add li>a:focus>i,
|
||||
#add li.active>a>i{background-image:url({getUrl('')}common/img/glyphicons-halflings-white.png);background-repeat:no-repeat;opacity:1;filter:alpha(opacity=100)}
|
||||
/* Nav */
|
||||
.col .nav li{border-bottom:1px solid #ddd;position:relative;white-space:nowrap}
|
||||
.col .nav li:first-child{border-top:0}
|
||||
.col .nav li>a,
|
||||
.col .nav li>button{text-align:left;color:#000;background-color:transparent;border:0;display:block;padding:5px 15px 5px 8px;color:#333;text-decoration:none;background:#fff;-webkit-transition:.3s;-moz-transition:.3s;-o-transition:.3s}
|
||||
.col .nav li>button{width:100%}
|
||||
.col .nav li>a:hover,
|
||||
.col .nav li>a:focus,
|
||||
.col .nav li.active>a,
|
||||
.col .nav li>button:hover,
|
||||
.col .nav li>button:focus{background:#666;color:#fff}
|
||||
.col .nav li>a>i{position:absolute;top:50%;right:5px;margin:-7px 0 0 0;opacity:.5;filter:alpha(opacity=50)}
|
||||
.col .nav li>a:hover>i,
|
||||
.col .nav li>a:focus>i,
|
||||
.col .nav li.active>a>i{background-image:url({getUrl('')}common/img/glyphicons-halflings-white.png);background-repeat:no-repeat;opacity:1;filter:alpha(opacity=100)}
|
||||
/* Properties */
|
||||
#properties ul{margin:15px 0 0 0;padding:0 0 8px 0;border-bottom:1px solid #ddd}
|
||||
#properties li{position:relative;white-space:nowrap}
|
||||
#properties li.navitem>a,
|
||||
#properties li.navitem>button{margin:0 -8px}
|
||||
#properties li>a,
|
||||
#properties li>button{position:relative;display:block;padding:0 8px;height:30px;line-height:30px;background-color:transparent;border:0;text-align:left;text-decoration:none}
|
||||
#properties li>a{padding:0 24px 0 8px}
|
||||
#properties li.add{border:1px solid #ddd;border-left:0;border-right:0;margin-top:8px;margin-bottom:8px}
|
||||
#properties li.default{margin:8px 0 0 0;padding-top:8px;border-top:1px solid #ddd}
|
||||
#properties li.add>a{height:32px;line-height:32px}
|
||||
#properties li>button{width:100%}
|
||||
#properties li>a:hover,
|
||||
#properties li>button:hover,
|
||||
#properties li>a:active,
|
||||
#properties li>button:active,
|
||||
#properties li>a:focus,
|
||||
#properties li>button:focus,
|
||||
#properties li.active>a{background-color:#666;color:#fff}
|
||||
#properties li>*>i{position:absolute;top:50%;right:5px;margin:-7px 0 0 0;opacity:.5;filter:alpha(opacity=50)}
|
||||
#properties li>*:hover>i,
|
||||
#properties li>*:active>i,
|
||||
#properties li>*:focus>i,
|
||||
#properties li.active>*>i{background-image:url({getUrl('')}common/img/glyphicons-halflings-white.png);opacity:1;filter:alpha(opacity=100)}
|
||||
/* Add Page */
|
||||
#add_page ul{margin:15px 0}
|
||||
/* Add URL */
|
||||
|
|
@ -463,6 +508,27 @@ jQuery(function($){
|
|||
var wHeigh = $(window).height();
|
||||
$('#site').height(wHeigh - 270).children('.col').height(wHeigh - 315);
|
||||
}).resize();
|
||||
// #linkMenu copy and set text to input
|
||||
setTimeout(function(){
|
||||
$('.mapi').clone().removeClass().removeAttr('id').addClass('clone').appendTo('#linkMenu').find('li').removeAttr('id').removeAttr('class').find('ins, .side').remove();
|
||||
$('.clone a').click(function(){
|
||||
$('#linkMenu>input').val($(this).text());
|
||||
});
|
||||
}, 1000);
|
||||
// Navigation a active/inactive
|
||||
var $navAnchor = $('a>i.x_icon-circle-arrow-right').parent('a');
|
||||
$navAnchor.click(function(){
|
||||
$(this).parent('li').addClass('active').siblings('li').removeClass('active');
|
||||
});
|
||||
$('.x_close[data-hide]').click(function(){
|
||||
var inactiveTarget = $(this).attr('data-hide');
|
||||
$navAnchor.each(function(){
|
||||
var href = $(this).attr('href');
|
||||
if(href == inactiveTarget){
|
||||
$(this).parent('li').removeClass('active');
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
||||
//]]>
|
||||
</script>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue