[opt] menubar

This commit is contained in:
xaoxuu 2024-01-17 23:39:14 +08:00
parent ea81cd4b01
commit 750bbf8b19
5 changed files with 32 additions and 24 deletions

View File

@ -25,14 +25,29 @@ logo:
subtitle: '' # '文字1 | 文字2' (鼠标放上去会切换到文字2) subtitle: '' # '文字1 | 文字2' (鼠标放上去会切换到文字2)
# 侧边栏主功能导航菜单 # 侧边栏主功能导航菜单
# 自己可以增加任意的键值对 menubar:
# 键:就是 menu_id后面需要用到 columns: 4 # 一行多少个
# 值:就是显示的 md 链接,方括号内支持文字和图片标签 items: # 可按照自己需求增加,符合以下格式即可
menu: # - id: post
# post: '[btn.blog](/)' # theme: '#1BCDFC'
# wiki: '[btn.wiki](/wiki/)' # icon: '<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><path fill="currentColor" fill-rule="evenodd" d="M5.879 2.879C5 3.757 5 5.172 5 8v8c0 2.828 0 4.243.879 5.121C6.757 22 8.172 22 11 22h2c2.828 0 4.243 0 5.121-.879C19 20.243 19 18.828 19 16V8c0-2.828 0-4.243-.879-5.121C17.243 2 15.828 2 13 2h-2c-2.828 0-4.243 0-5.121.879M8.25 17a.75.75 0 0 1 .75-.75h3a.75.75 0 0 1 0 1.5H9a.75.75 0 0 1-.75-.75M9 12.25a.75.75 0 0 0 0 1.5h6a.75.75 0 0 0 0-1.5zM8.25 9A.75.75 0 0 1 9 8.25h6a.75.75 0 0 1 0 1.5H9A.75.75 0 0 1 8.25 9" clip-rule="evenodd"/><path fill="currentColor" d="M5.235 4.058C5 4.941 5 6.177 5 8v8c0 1.823 0 3.058.235 3.942L5 19.924c-.975-.096-1.631-.313-2.121-.803C2 18.243 2 16.828 2 14v-4c0-2.829 0-4.243.879-5.121c.49-.49 1.146-.707 2.121-.803zm13.53 15.884C19 19.058 19 17.822 19 16V8c0-1.823 0-3.059-.235-3.942l.235.018c.975.096 1.631.313 2.121.803C22 5.757 22 7.17 22 9.999v4c0 2.83 0 4.243-.879 5.122c-.49.49-1.146.707-2.121.803z" opacity=".5"/></svg>'
# friends: '[友链](/friends/)' # title: 博客
# about: '[关于](/about/)' # url: /
# - id: wiki
# theme: '#3DC550'
# icon: '<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><path fill="currentColor" fill-rule="evenodd" d="M14.25 4.48v3.057c0 .111 0 .27.02.406a.936.936 0 0 0 .445.683a.96.96 0 0 0 .783.072c.13-.04.272-.108.378-.159L17 8.005l1.124.534c.106.05.248.119.378.16a.958.958 0 0 0 .783-.073a.936.936 0 0 0 .444-.683c.021-.136.021-.295.021-.406V3.031c.113-.005.224-.01.332-.013C21.154 2.98 22 3.86 22 4.933v11.21c0 1.112-.906 2.01-2.015 2.08c-.97.06-2.108.179-2.985.41c-1.082.286-1.99 1.068-3.373 1.436c-.626.167-1.324.257-1.627.323V5.174c.32-.079 1.382-.203 1.674-.371c.184-.107.377-.216.576-.323m5.478 8.338a.75.75 0 0 1-.546.91l-4 1a.75.75 0 0 1-.364-1.456l4-1a.75.75 0 0 1 .91.546" clip-rule="evenodd"/><path fill="currentColor" d="M18.25 3.151c-.62.073-1.23.18-1.75.336a8.2 8.2 0 0 0-.75.27v3.182l.75-.356l.008-.005a1.13 1.13 0 0 1 .492-.13c.047 0 .094.004.138.01c.175.029.315.1.354.12l.009.005l.749.356V3.647z"/><path fill="currentColor" d="M12 5.214c-.334-.064-1.057-.161-1.718-.339C8.938 4.515 8.05 3.765 7 3.487c-.887-.234-2.041-.352-3.018-.412C2.886 3.007 2 3.9 2 4.998v11.146c0 1.11.906 2.01 2.015 2.079c.97.06 2.108.179 2.985.41c.486.129 1.216.431 1.873.726c1.005.451 2.052.797 3.127 1.034z" opacity=".5"/><path fill="currentColor" d="M4.273 12.818a.75.75 0 0 1 .91-.545l4 1a.75.75 0 1 1-.365 1.455l-4-1a.75.75 0 0 1-.545-.91m.909-4.545a.75.75 0 1 0-.364 1.455l4 1a.75.75 0 0 0 .364-1.455z"/></svg>'
# title: 项目
# url: /wiki/
# - id: notes
# theme: '#FA6400'
# icon: '<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><path fill="currentColor" d="M20 12a8 8 0 1 1-16 0a8 8 0 0 1 16 0" opacity=".5"/><path fill="currentColor" d="M17.712 5.453c1.047-.193 2.006-.259 2.797-.152c.77.103 1.536.393 1.956 1.064c.446.714.312 1.542-.012 2.258c-.33.728-.918 1.499-1.672 2.268c-1.516 1.547-3.836 3.226-6.597 4.697c-2.763 1.472-5.495 2.484-7.694 2.92c-1.095.217-2.098.299-2.923.201c-.8-.095-1.6-.383-2.032-1.075c-.47-.752-.296-1.63.07-2.379c.375-.768 1.032-1.586 1.872-2.403L4 12.416c0 .219.083.71.168 1.146c.045.23.09.444.123.596c-.652.666-1.098 1.263-1.339 1.756c-.277.567-.208.825-.145.925c.072.116.305.305.937.38c.609.073 1.44.018 2.455-.183c2.02-.4 4.613-1.351 7.28-2.772c2.667-1.42 4.85-3.015 6.23-4.423c.694-.707 1.15-1.334 1.377-1.836c.233-.515.167-.75.107-.844c-.07-.112-.289-.294-.883-.374c-.542-.072-1.272-.041-2.163.112L16.87 5.656c.338-.101.658-.17.842-.203"/></svg>'
# title: 探索
# url: /notes/
# - id: social
# theme: '#F44336'
# icon: '<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><path fill="currentColor" d="m13.629 20.472l-.542.916c-.483.816-1.69.816-2.174 0l-.542-.916c-.42-.71-.63-1.066-.968-1.262c-.338-.197-.763-.204-1.613-.219c-1.256-.021-2.043-.098-2.703-.372a5 5 0 0 1-2.706-2.706C2 14.995 2 13.83 2 11.5v-1c0-3.273 0-4.91.737-6.112a5 5 0 0 1 1.65-1.651C5.59 2 7.228 2 10.5 2h3c3.273 0 4.91 0 6.113.737a5 5 0 0 1 1.65 1.65C22 5.59 22 7.228 22 10.5v1c0 2.33 0 3.495-.38 4.413a5 5 0 0 1-2.707 2.706c-.66.274-1.447.35-2.703.372c-.85.015-1.275.022-1.613.219c-.338.196-.548.551-.968 1.262" opacity=".5"/><path fill="currentColor" d="M10.99 14.308c-1.327-.978-3.49-2.84-3.49-4.593c0-2.677 2.475-3.677 4.5-1.609c2.025-2.068 4.5-1.068 4.5 1.609c0 1.752-2.163 3.615-3.49 4.593c-.454.335-.681.502-1.01.502c-.329 0-.556-.167-1.01-.502"/></svg>'
# title: 社交
# url: /friends/
######## Main ######## ######## Main ########

View File

@ -95,15 +95,9 @@ function layoutDiv() {
nodes.push('/'); nodes.push('/');
// menu_id // menu_id
el += '<span class="sep"></span>'; el += '<span class="sep"></span>';
if (page.menu_id && theme.menu[page.menu_id]?.url) { let url = url_for(theme.site_tree.wiki.base_dir);
let url = url_for(theme.menu[page.menu_id]?.url); nodes.push(url);
nodes.push(url); el += '<a class="cap breadcrumb" id="menu" href="' + url + '">' + __("btn.wiki") + '</a>';
el += '<a class="cap breadcrumb" id="menu" href="' + url + '">' + __(theme.menu[page.menu_id]?.title) + '</a>';
} else {
let url = url_for(theme.site_tree.wiki.base_dir);
nodes.push(url);
el += '<a class="cap breadcrumb" id="menu" href="' + url + '">' + __("btn.wiki") + '</a>';
}
// 项目名 // 项目名
let proj = theme.wiki.tree[page.wiki]; let proj = theme.wiki.tree[page.wiki];
if (proj != null) { if (proj != null) {

View File

@ -2,12 +2,11 @@
function layoutDiv() { function layoutDiv() {
var el = '' var el = ''
el += `<nav class="menu dis-select${where == 'main' ? ' mobile-hidden' : ''}">` el += `<nav class="menu dis-select${where == 'main' ? ' mobile-hidden' : ''}">`
for (let id of Object.keys(theme.menu)) { for (let item of theme.menubar.items) {
let item = theme.menu[id] if (item == undefined || item.id == null || item.url == null) {
if (item == undefined || item.length == 0) {
continue continue
} }
el += `<a class="nav-item${id == page.menu_id ? ' active' : ''}" title="${item.title}" href="${url_for(item.url)}"` el += `<a class="nav-item${item.id == page.menu_id ? ' active' : ''}" title="${item.title}" href="${url_for(item.url)}"`
if (item.theme?.length > 0) { if (item.theme?.length > 0) {
el += ` style="color:${item.theme}"` el += ` style="color:${item.theme}"`
} }

View File

@ -2,7 +2,7 @@
width: 100% width: 100%
display: grid display: grid
margin: 8px 0 margin: 8px 0
grid-template-columns: repeat(4, 1fr) grid-template-columns: repeat(hexo-config('menubar.columns'), 1fr)
grid-gap: 8px grid-gap: 8px
&::-webkit-scrollbar &::-webkit-scrollbar
display: none display: none

View File

@ -2,10 +2,10 @@
margin-top: 2px margin-top: 2px
.widget-wrapper.toc.multi .widget-wrapper.toc.multi
// .widget-header.cap // .widget-header
// color: $color-theme // color: $color-theme
// filter: brightness(75%) // filter: brightness(75%)
.widget-body+.widget-header.cap .widget-body+.widget-header
margin-top: 28px margin-top: 28px
// //