diff --git a/scripts/tags/dropmenu.js b/scripts/tags/dropmenu.js new file mode 100644 index 0000000..34bcce6 --- /dev/null +++ b/scripts/tags/dropmenu.js @@ -0,0 +1,88 @@ +'use strict'; + +function postMenu(args, content) { + args = args.join(' ').split(',') + let text = args[0] || '' + let icon = args[1] || '' + if (icon.length > 0) { + return `
+ + ${text} + + +
` + } else { + return `
+ ${text} + + +
` + } +} +function postSubmenu(args, content) { + args = args.join(' ').split(',') + let text = args[0] || '' + let icon = args[1] || '' + if (icon.length > 0) { + return `
  • + + + ${text} + + +
  • ` + } else { + return `
  • + ${text} + +
  • ` + } +} + +function postMenuItem(args) { + args = args.join(' ').split(',') + let text = args[0] || '' + let url = args[1] || '' + text = text.trim() + url = url.trim() + if (url.length > 0) { + url = "href='" + url + "'" + } + let icon = '' + if (args.length > 2) { + icon = args[2].trim() + } + if (url.length > 0) { + if (icon.length > 0) { + return `
  • + + + ${text} + +
  • ` + } else { + return `
  • + + ${text} + +
  • ` + } + } else { + if (text == 'hr') { + return `
    ` + } + } + +} + +hexo.extend.tag.register('menu', postMenu, {ends: true}); +hexo.extend.tag.register('submenu', postSubmenu, {ends: true}); +hexo.extend.tag.register('menuitem', postMenuItem); diff --git a/source/css/_layout/navbar.styl b/source/css/_layout/navbar.styl index 2e20abf..c498e91 100644 --- a/source/css/_layout/navbar.styl +++ b/source/css/_layout/navbar.styl @@ -242,6 +242,9 @@ ul.list-v margin-top: 0 - 32px - $gap * 0.5 >li>a + trans() + display: block + color: alpha($color-text, 85%) font-size: $fontsize-meta font-weight: bold line-height: 33px @@ -255,6 +258,19 @@ ul.list-v border-bottom: none >i margin-right: 4px + &.current + border-left-color: alpha($color-theme, 80%) + border-bottom-color: alpha($color-theme, 80%) + &:hover + color: $color-theme + border-left-color: $color-theme + border-bottom-color: $color-theme + background: bgcolor($color-theme) + + &:active,&.active + color: $color-theme + border-left-color: $color-theme + border-bottom-color: $color-theme .l_header .menu @@ -262,9 +278,19 @@ ul.list-v padding: 0 8px .l_header ul>li>a - trans() - display: block color: alpha($color-text, 85%) + &.current + border-left-color: alpha($color-theme, 80%) + border-bottom-color: alpha($color-theme, 80%) + &:hover + color: $color-theme + border-left-color: $color-theme + border-bottom-color: $color-theme + background: bgcolor($color-theme) + &:active,&.active + color: $color-theme + border-left-color: $color-theme + border-bottom-color: $color-theme i.music animation: rotate-effect 1.5s linear infinite @keyframes rotate-effect @@ -278,20 +304,7 @@ ul.list-v transform: rotate(270deg) 100% transform: rotate(360deg) - &.current - border-left-color: alpha($color-theme, 80%) - border-bottom-color: alpha($color-theme, 80%) - &:hover - color: $color-theme - border-left-color: $color-theme - border-bottom-color: $color-theme - background: bgcolor($color-theme) - - &:active,&.active - color: $color-theme - border-left-color: $color-theme - border-bottom-color: $color-theme .menu-phone li ul.list-v right: "calc(100% - 0.5 * %s)" % $gap diff --git a/source/css/_tag-plugins/dropmenu.styl b/source/css/_tag-plugins/dropmenu.styl new file mode 100644 index 0000000..b4ea989 --- /dev/null +++ b/source/css/_tag-plugins/dropmenu.styl @@ -0,0 +1,25 @@ +div.dropmenu + display: inline-block + position: relative + line-height: 2.4 + cursor: default + trans() + color: alpha($color-text, 85%) + background: $color-card + border-radius: $border-codeblock + border: 1px solid darken($color-codeblock, 6) + padding: 0 $gap + padding-top: 1px + &:hover + background: $color-codeblock + >ul + display: block + margin-left: 0 - $gap * 0.5 + margin-top: 0 - $border-codeblock + ul>li + list-style: none + >a + &:hover + text-decoration: none !important + .list-v .list-v + left: "calc(100% - 0.5 * %s)" % $gap diff --git a/source/css/_tag-plugins/folding.styl b/source/css/_tag-plugins/folding.styl index 592c324..bca4109 100644 --- a/source/css/_tag-plugins/folding.styl +++ b/source/css/_tag-plugins/folding.styl @@ -2,7 +2,7 @@ details display: block padding: $gap margin: $gap-block 0 - overflow: hidden + // overflow: hidden border-radius: $border-codeblock border: 1px solid darken($color-block, 4) background: $color-card