fanbinit/rhymix
1
0
Fork 0
mirror of https://github.com/Lastorder-DC/rhymix.git synced 2026-01-03 16:51:40 +09:00
Code Issues Projects Releases Packages Wiki Activity

make the sidebar area over the right side of the layout border

Browse source 
오른쪽 바깥에 사이드바 영역 생성.
This commit is contained in:
MinSoo Kim 2017-03-13 00:54:53 +09:00
parent 2bab4c7a6c
commit b8fc82828d
3 changed files with 31 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

9
layouts/simple_world/conf/info.xml
View file

@ -38,7 +38,7 @@
<var name="left_space" type="select">
<title xml:lang="ko">죄측 공간 만들기</title>
<title xml:lang="en">Make a space on the left</title>
<description xml:lang="ko">본문 좌측에 공간을 만듭니다.</description>
<description xml:lang="ko">본문 좌측에 공간을 만듭니다. 모바일 화면에서는 나타나지 않습니다.</description>
<description xml:lang="en">Make a space on the left of contents area.</description>
<options value="N">
<title xml:lang="ko">만들지 않습니다.</title>
@ -73,7 +73,12 @@
<var name="left_content" type="textarea">
<title xml:lang="ko">사이트 본문 좌측 내용</title>
<title xml:lang="en">The contents of the left of contents area</title>
<description xml:lang="ko">사이트 본문 영역 좌측 영역이 나타나게 선택되었을 경우 추가될 내용을 입력할 수 있습니다.</description>
<description xml:lang="ko">사이트 본문 영역 좌측 영역이 나타나게 선택되었을 경우 추가될 내용을 입력할 수 있습니다. 모바일 화면에서는 나타나지 않습니다. 상단 옵션 중 '죄측 공간 만들기'를 먼저 설정해주십시오.</description>
</var>
<var name="right_content" type="textarea">
<title xml:lang="ko">레이아웃 틀 오른쪽 내용 (width: 160px)</title>
<title xml:lang="en">The right area of the layout frame (width: 160px)</title>
<description xml:lang="ko">레이아웃 상-하단이 만들어내는 직사각형 영역 바깥 오른편에 나타낼 내용을 입력합니다. 공간 폭은 160px 입니다. 작은 화면에서는 나타나지 않습니다.</description>
</var>
<var name="after_content" type="textarea">
<title xml:lang="ko">사이트 본문 하단 내용</title>

9
layouts/simple_world/layout.html
View file

@ -118,9 +118,9 @@
<div class="layout_body layout_canvas">
<!--// CONTENT -->
<div class="layout_content layout_left_content" cond="in_array($layout_info->left_space, array('Y', 'YM'))">
<section class="layout_left layout_dropdown" cond="$layout_info->left_space == 'YM'">
<h1 loop="$GNB->list=>$key1,$val1" cond="$val1['selected']"><a href="{$val1['href']}" target="_blank"|cond="$val1['open_window']=='Y'">{$val1['link']}</a></h1>
<ul class="layout_dropdown-content" loop="$GNB->list=>$key1,$val1" cond="$val1['selected'] && $val1['list']">
<section class="layout_left layout_dropdown" cond="$layout_info->left_space == 'YM' && $val1['selected']">
<h1 loop="$GNB->list=>$key1,$val1"><a href="{$val1['href']}" target="_blank"|cond="$val1['open_window']=='Y'">{$val1['link']}</a></h1>
<ul class="layout_dropdown-content" loop="$GNB->list=>$key1,$val1" cond="$val1['list']">
<li loop="$val1['list']=>$key2,$val2"><a href="{$val2['href']}" class="active"|cond="$val2['selected']" target="_blank"|cond="$val2['open_window']=='Y'">{$val2['link']}</a>
<ul cond="$val2['list']">
<li loop="$val2['list']=>$key3,$val3" class="active"|cond="$val3['selected']"><a href="{$val3['href']}" target="_blank"|cond="$val3['open_window']=='Y'">{$val3['link']}</a></li>
@ -138,6 +138,9 @@
{$layout_info->after_content}
</div>
<!--// CONTENT -->
<div class="layout_outright" cond="trim($layout_info->right_content)">
{$layout_info->right_content}
</div>
</div>
</div>
<footer class="layout_frame layout_footer">

21
layouts/simple_world/layout.scss
View file

@ -12,6 +12,11 @@
@return rgb($return, $return, $return);
}
@mixin layout_box($shadow){
background: #fff;
box-shadow: 0 $shadow/2 $shadow rgba(0,0,0,0.16), 0 $shadow/2 $shadow rgba(0,0,0,0.23);
}
body {
margin:0;
padding:0;
@ -59,19 +64,29 @@ header.layout_frame, footer.layout_frame, .layout_frame.layout_left_content .lay
.layout_body.layout_frame {
background-color: $content_color;
overflow: hidden;
}
.layout_body {
position: relative;
}
.layout_outright{
position: absolute;
top: 15px;
right: 0;
box-sizing: border-box;
width: 160px;
@include layout_box(2px);
margin-right:-170px;
}
.layout_left_content.layout_frame>.layout_canvas {
div.layout_content {
float:left;
width: 20%;
box-sizing: border-box;
padding-right:5px;
section.layout_left{
margin: 2px;
background: #fff;
box-shadow: 0 1px 2px rgba(0,0,0,0.16), 0 1px 2px rgba(0,0,0,0.23);
margin: 2px 2px 10px;
@include layout_box(2px);
h1 {
border-bottom: 1px solid #e0e0e0;
font-weight: 400;