wixon/wixon_blog
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

mobile - update

Browse Source
This commit is contained in:
lbard33
2026-01-16 16:12:48 +09:00
parent 2635aff0ea
commit 39de8edde4
8 changed files with 305 additions and 112 deletions
Download Patch File Download Diff File Expand all files Collapse all files

109
templates/base.html
View File

@@ -2,6 +2,7 @@
<html>
<head>
<title>WIXON Blog</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/uikit/3.6.16/css/uikit.min.css"/>
<link rel="stylesheet" href="/static/css/style.css"/>
<!-- include libraries(jQuery, bootstrap) -->
@@ -19,51 +20,57 @@
{% block staticfiles %}{% endblock %}
</head>
<body>
<div class="nav__div">
<span class="uk-icon menu__open" uk-icon="icon: menu"></span>
<span class="nav__title">WXNNER BLOG</span>
</div>
<div class="body__wrap">
<div class="nav__div">
<span class="uk-icon menu__open" uk-icon="icon: menu"></span>
<span class="nav__title">WXNNER BLOG</span>
</div>
<div class="menu__wrap">
<div class="menu__close"><button class="uk-icon" uk-icon="icon: close"></button></div>
<div class="menu__box">
<ul>
<li><a href="/list">최신테크뉴스</a></li>
<li><a href="/list/NEWS">WXN 뉴스</a></li>
<li><a href="/list/IT">IT 요즘</a></li>
<!-- <li><a href="/list">IT활용자료(윅슨전용)</a></li> -->
<li><a href="/list/ETC">ETC</a></li>
<div class="menu__wrap">
<div class="menu__close"><button class="uk-icon" uk-icon="icon: close"></button></div>
<div class="menu__box">
<ul>
<li><a href="/list">최신테크뉴스</a></li>
<li><a href="/list/NEWS">WXN 뉴스</a></li>
<li><a href="/list/IT">IT 요즘</a></li>
<!-- <li><a href="/list">IT활용자료(윅슨전용)</a></li> -->
<li><a href="/list/ETC">ETC</a></li>
</ul>
</div>
<ul class="login__section">
{% if g.is_login %}
<li>
<a class="user__nav__open" href="#">{{ g.user_info.mb_name }} <span class="uk-icon" uk-icon="icon: triangle-down"></span></a>
<div class="login_nav">
<ul>
<li class="uk-active"><a href="/write">포스트 작성</a></li>
<li class="uk-active"><a href="/admin/">관리자 페이지</a></li>
<li class="uk-active"><a href="/logout">LOGOUT</a></li>
</ul>
</div>
</li>
{% else %}
<li class="login__btn"><a href="/login">LOGIN</a></li>
{% endif %}
</ul>
</div>
<ul class="login__section">
{% if g.is_login %}
<li>
<a class="user__nav__open" href="#">{{ g.user_info.mb_name }} <span class="uk-icon" uk-icon="icon: triangle-down"></span></a>
<div class="login_nav">
<ul>
<li class="uk-active"><a href="/write">포스트 작성</a></li>
<li class="uk-active"><a href="/admin/">관리자 페이지</a></li>
<li class="uk-active"><a href="/logout">LOGOUT</a></li>
</ul>
</div>
</li>
{% else %}
<li class="login__btn"><a href="/login">LOGIN</a></li>
{% endif %}
</ul>
</div>
<div class="wixon__wrap">
<header>
<div class="header__inner">
<h1><a href="/"><img src="/static/images/logo.png" alt="WIXON" /></a></h1>
</div>
</header>
<div class="wixon__wrap">
<header>
<div class="header__inner">
<h1><a href="/"><img src="/static/images/logo.png" alt="WIXON" /></a></h1>
</div>
</header>
{% block content %}{% endblock %}
{% block content %}{% endblock %}
<script>
$(document).ready(function(){
function isMobile() {
return $(window).width() <= 1023;
}
// 로그인 메뉴 활성화
let check_state = 0;
@@ -80,17 +87,29 @@
// 메뉴 토글
$(".menu__open").click(function() {
$(".menu__wrap").show();
$(".nav__div").animate({"right":"-68px"}, 300, function(){
$(".menu__wrap").animate({"right":"0"}, 700);
});
if(isMobile()){
// 모바일용 메뉴 동작
$(".menu__wrap").fadeIn(300).css({"right": "0"});
}else{
// PC용 메뉴 동작
$(".menu__wrap").show();
$(".nav__div").animate({"right": "-68px"}, 300, function(){
$(".menu__wrap").animate({"right": "0"}, 700);
});
}
});
$('.menu__close').click(function() {
$(".menu__wrap").animate({"right":"-440px"}, 700, function(){
$(".menu__wrap").hide();
$(".nav__div").animate({"right":"0"}, 300);
});
if (isMobile()) {
// 모바일용 메뉴 닫기
$(".menu__wrap").fadeOut(300);
} else {
// PC용 메뉴 닫기
$(".menu__wrap").animate({"right": "-440px"}, 700, function(){
$(".menu__wrap").hide();
$(".nav__div").animate({"right": "0"}, 300);
});
}
});
})
</script>