diff --git a/layouts/simple_world/conf/info.xml b/layouts/simple_world/conf/info.xml index c18ae48b8..94940f107 100644 --- a/layouts/simple_world/conf/info.xml +++ b/layouts/simple_world/conf/info.xml @@ -12,9 +12,13 @@ - 사이트 중심 메뉴 + 상단 메뉴 Global Navigation Menu + + 하단 메뉴 + Footer Navigation Menu + diff --git a/layouts/simple_world/layout.html b/layouts/simple_world/layout.html index 6ac51cd69..801578967 100644 --- a/layouts/simple_world/layout.html +++ b/layouts/simple_world/layout.html @@ -121,7 +121,23 @@ \ No newline at end of file diff --git a/layouts/simple_world/layout.js b/layouts/simple_world/layout.js index e15ffe6ea..b7822271c 100644 --- a/layouts/simple_world/layout.js +++ b/layouts/simple_world/layout.js @@ -2,13 +2,13 @@ $(function() { "use strict"; var menu_width = function() { - if($('.layout_menu>ul>li:first-child').width() > 50) { - $('.layout_menu>ul>li:first-child .layout_dropdown-content, .layout_menu>ul>li:first-child .layout_dropdown-content a').css('width', $('.layout_menu>ul>li:first-child').width()).css('min-width', $('.layout_menu>ul>li:first-child').width()); + if($('#layout_gnb>ul>li:first-child').width() > 50) { + $('#layout_gnb>ul>li:first-child .layout_dropdown-content, #layout_gnb>ul>li:first-child .layout_dropdown-content a').css('width', $('#layout_gnb>ul>li:first-child').width()).css('min-width', $('#layout_gnb>ul>li:first-child').width()); } } $( window ).resize(function() { - if($('.layout_menu>ul>li:first-child').width() > 50) { + if($('#layout_gnb>ul>li:first-child').width() > 50) { menu_width(); } }); @@ -32,7 +32,7 @@ $(function() { obj.classList.remove("is-active"); } else { - $('.layout_menu>ul>li:first-child .layout_dropdown-content, .layout_menu>ul>li:first-child .layout_dropdown-content a').css('width', '').css('min-width', ''); + $('#layout_gnb>ul>li:first-child .layout_dropdown-content, #layout_gnb>ul>li:first-child .layout_dropdown-content a').css('width', '').css('min-width', ''); var targetMenu = $(obj).attr('data-target'); $('#' + targetMenu).slideDown('300'); @@ -47,4 +47,8 @@ $(function() { }); } + // Language Select + $('.language>.toggle').click(function(){ + $('.selectLang').toggle(); + }); }); \ No newline at end of file diff --git a/layouts/simple_world/layout.scss b/layouts/simple_world/layout.scss index f708a284b..704465628 100644 --- a/layouts/simple_world/layout.scss +++ b/layouts/simple_world/layout.scss @@ -206,7 +206,7 @@ body { float: left; } -.layout_menu>ul>li:first-child { +#layout_gnb>ul>li:first-child { float: right; } @@ -231,7 +231,10 @@ body { .layout_menu li a:active, .layout_dropdown:hover .dropbtn, .layout_dropdown:focus .dropbtn, -.layout_dropdown:active .dropbtn { +.layout_dropdown:active .dropbtn, +.language li:hover button, +.language li:focus button, +.language li:active button { background-color: $primary-color; color: layoutGrayContrast($primary-color, 0.710); } @@ -248,7 +251,6 @@ body { box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); } - .layout_menu .layout_dropdown-content a { color: black; padding: 12px 16px; @@ -269,7 +271,59 @@ body { .layout_menu .layout_dropdown:hover .layout_dropdown-content { display: block; } +/* Language */ +.language{ + display: inline-block; + width: 100%; + text-align: right; +} +.language ul::before { + content: ""; + display: block; + clear: both; +} +.language ul { + display: none; + float:right; + width:120px; + clear:both; + margin: 0; + padding: 0; + z-index: 9999999; + box-shadow: 0px 8px 16px 0px rgba(255,255,255,0.2); +} +.language .toggle{ + background:none; + display: block; + float: right; + width:120px; + border:0; + color:#fff; + cursor:pointer; + vertical-align:top; + text-align:right; + padding:0; + height:45px; +} + +.language li{ + list-style:none; + background: lighten($grey, 40%); +} +.language li button { + display:block; + color: black; + background: lighten($grey, 40%); + padding: 12px 16px; + text-decoration: none; + width: 100%; + display: block; + text-align: left; + box-sizing: border-box; + border:0; + cursor:pointer; +} /* Hamberger menu http://callmenick.com/post/animating-css-only-hamburger-menu-icons Licensed under the MIT license, http://www.opensource.org/licenses/mit-license.php Copyright 2014, Call Me Nick http://callmenick.com */ .layout_mobile_menu { @@ -416,7 +470,7 @@ body { background-color: lighten($grey, 31%); } - .layout_menu>ul>li, .layout_menu>ul>li:first-child { + .layout_menu>ul>li, #layout_gnb>ul>li:first-child { float: none; } @@ -461,6 +515,16 @@ body { text-align: left; } + .language ul { + display: none; + float:none; + width:100%; + } + .language .toggle{ + display: block; + float: none; + width:100%; + } /* PC only */ .layout_pc { display: none;