3단 메뉴를 위한 스타일 정리.

This commit is contained in:
MinSoo Kim 2017-03-13 01:25:14 +09:00
parent 26ec403186
commit e41057a4e6
2 changed files with 29 additions and 16 deletions

View file

@ -103,7 +103,12 @@
<li loop="$GNB->list=>$key1,$val1" class="<!--@if($val1['selected'])-->active <!--@endif--><!--@if($val1['list'])-->layout_dropdown<!--@endif-->"> <li loop="$GNB->list=>$key1,$val1" class="<!--@if($val1['selected'])-->active <!--@endif--><!--@if($val1['list'])-->layout_dropdown<!--@endif-->">
<a href="{$val1['href']}" target="_blank"|cond="$val1['open_window']=='Y'"><span>{$val1['link']}</span></a> <a href="{$val1['href']}" target="_blank"|cond="$val1['open_window']=='Y'"><span>{$val1['link']}</span></a>
<ul cond="$val1['list']" class="layout_dropdown-content"> <ul cond="$val1['list']" class="layout_dropdown-content">
<li loop="$val1['list']=>$key2,$val2" class="active"|cond="$val2['selected']"><a href="{$val2['href']}" target="_blank"|cond="$val2['open_window']=='Y'">{$val2['link']}</a></li> <li loop="$val1['list']=>$key2,$val2" class="active"|cond="$val2['selected']">
<a href="{$val2['href']}" 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>
</ul>
</li>
</ul> </ul>
</li> </li>
<li id="layout_search_link"> <li id="layout_search_link">

View file

@ -101,23 +101,28 @@ header.layout_frame, footer.layout_frame, .layout_frame.layout_left_content .lay
text-decoration: none; text-decoration: none;
} }
} }
ul.layout_dropdown-content { ul{
display: block;
position: relative;
z-index: none;
padding: 0;
margin: 0;
list-style: none; list-style: none;
a { &.layout_dropdown-content {
display: block; display: block;
padding: 14px 16px; position: relative;
text-decoration: none; z-index: none;
color: #000; padding: 0;
&.active { margin: 0;
background: #e0e0e0; a {
display: block;
padding: 14px 16px;
text-decoration: none;
color: #000;
&.active {
background: #e0e0e0;
}
&:hover, &:active, &:focus {
background: #eeeeee;
}
} }
&:hover, &:active, &:focus { ul {
background: #eeeeee; padding-left: 10px;
} }
} }
} }
@ -243,10 +248,13 @@ header.layout_frame {
background-color: lighten($grey, 31%); background-color: lighten($grey, 31%);
ul { ul {
list-style-type: none; list-style-type: none;
padding: 0;
overflow: hidden; overflow: hidden;
max-width:1050px; max-width:1050px;
margin:0 auto; margin:0 auto;
padding: 0;
&.layout_dropdown-content ul{
padding-left:10px;
}
} }
li a, .dropbtn { li a, .dropbtn {
display: inline-block; display: inline-block;