99 lines
4.6 KiB
HTML
99 lines
4.6 KiB
HTML
|
|
<nav class="uk-navbar">
|
|
<a class="uk-navbar-brand" data-uk-offcanvas="{target:'#offcanvas-nav',mode:'push'}"
|
|
onmouseover="$('#brand-img').addClass('brand-img-animation')"
|
|
onmouseout="$('#brand-img').removeClass('brand-img-animation')">
|
|
<img id="brand-img" class="brand-img-animation" width="28px;" height="28px;"
|
|
alt="logo" src="//cdn.apihub.net/img/spinner.png" style="margin-top: 4px;">
|
|
</a>
|
|
<ul class="uk-navbar-nav">
|
|
<li
|
|
{% if page.url contains "/json/" %}class="uk-active"{% endif %}
|
|
{% if page.url contains "/jwt/" %}class="uk-active"{% endif %}
|
|
{% if page.url contains "/base64/" %}class="uk-active"{% endif %}
|
|
{% if page.url contains "/unicode/" %}class="uk-active"{% endif %}
|
|
{% if page.url contains "/wsp/" %}class="uk-active"{% endif %}
|
|
{% if page.url contains "/redis/" %}class="uk-active"{% endif %}
|
|
{% if page.url contains "/timestamp/" %}class="uk-active"{% endif %}
|
|
><a href="/">开发小工具</a></li>
|
|
<li {% if page.url contains "/pages/" %}class="uk-active"{% endif %}><a href="/pages/">笔记</a></li>
|
|
<li {% if page.url contains "/gpt/" %}class="uk-active"{% endif %}><a href="/gpt/">GPT</a></li>
|
|
</ul>
|
|
<div id="offcanvas-nav" class="uk-offcanvas">
|
|
<div class="uk-offcanvas-bar">
|
|
<ul class="uk-nav uk-nav-offcanvas" style="padding-top:10px" data-uk-nav>
|
|
<li><a href="/pages/">笔记</a></li>
|
|
|
|
<li class="uk-nav-divider"></li>
|
|
<li><a href="/gpt/">GPT</a></li>
|
|
|
|
<li class="uk-nav-divider"></li>
|
|
<li><a href="/redis/">网页版 redis 客户端</a></li>
|
|
|
|
<li class="uk-nav-divider"></li>
|
|
<li><a href="/json/">Json 格式化</a></li>
|
|
<li><a href="/jwt/">JWT 解码</a></li>
|
|
<li><a href="/wsp/">WebSocket 联调</a></li>
|
|
<li><a href="/base64/">Base64 编解码</a></li>
|
|
<li><a href="/unicode/">\uxxxx 转中文</a></li>
|
|
<li><a href="/timestamp/">时间戳 ⇄ 时间</a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<script>
|
|
hotkeys('ctrl+b,command+b', function(event,handler) {
|
|
if ($('#offcanvas-nav').is(":visible")) {
|
|
UIkit.offcanvas.hide()
|
|
} else {
|
|
UIkit.offcanvas.show('#offcanvas-nav')
|
|
}
|
|
})
|
|
</script>
|
|
|
|
<div class="uk-navbar-flip">
|
|
<ul class="uk-navbar-nav uk-hidden-small" >
|
|
{% if page.url contains "/json/" %}{% else %}<li><a href="/json/">Json 格式化</a></li>{% endif %}
|
|
{% if page.url contains "/jwt/" %}{% else %}<li><a href="/jwt/">JWT 解码</a></li>{% endif %}
|
|
{% if page.url contains "/base64/" %}{% else %}<li><a href="/base64/">Base64 编解码</a></li>{% endif %}
|
|
{% if page.url contains "/wsp/" %}{% else %}<li><a href="/wsp/">WebSocket 联调</a></li>{% endif %}
|
|
<li><a href="/">更多 <i class="uk-icon-angle-double-right"></i></a></li>
|
|
</ul>
|
|
</div>
|
|
|
|
<ul id="header-extend" class="uk-navbar-nav uk-navbar-content uk-hidden-small" style="padding-left: 0px;">
|
|
<!-- // 示例: $('.xxx').appendTo('#header-extend') -->
|
|
{% raw %}
|
|
<li style="float:right">
|
|
<div id="header-notify" v-bind:class="{'uk-alert':true, 'uk-alert-danger':level=='danger', 'uk-alert-warning':level=='warning', 'uk-alert-success':level=='success'}"
|
|
style="display:none;margin-bottom:0px;" v-show="msg">
|
|
{{msg}}
|
|
</div>
|
|
<script>
|
|
vm_header_notify = new Vue({
|
|
el: '#header-notify',
|
|
data: {
|
|
level:'',
|
|
msg: ''
|
|
},
|
|
methods: {
|
|
notify: function(msg, level, duration) {
|
|
// msg: 字符串不能太长
|
|
// level: 'danger' 红色, 'warning'黄色,'success'绿色, '' 蓝色
|
|
if (isNaN(duration)) {
|
|
duration= 3000
|
|
}
|
|
if (msg.length > 110) {
|
|
msg = msg.substring(0, 100)
|
|
}
|
|
this.msg = msg
|
|
this.level = level
|
|
setTimeout(function(){vm_header_notify.msg = ''; vm_header_notify.level = ''}, duration)
|
|
}
|
|
}
|
|
})
|
|
</script>
|
|
</li>
|
|
{% endraw %}
|
|
</ul>
|
|
|
|
</nav> |