diff --git a/settings.yaml b/settings.yaml index a1b3117e..df8772e9 100644 --- a/settings.yaml +++ b/settings.yaml @@ -446,6 +446,7 @@ spec: - $formkit: repeater if: $get(nav).value === 'custom-category' name: navCustomCategory + key: navCustomCategory label: 自定义分类 value: [ ] children: @@ -455,6 +456,7 @@ spec: - $formkit: repeater if: $get(nav).value === 'custom-tag' name: navCustomTag + key: navCustomTag label: 自定义标签 value: [ ] children: @@ -464,6 +466,7 @@ spec: - $formkit: repeater if: $get(nav).value === 'custom-url' name: navCustomUrl + key: navCustomUrl label: 自定义路径 value: [ ] children: @@ -554,7 +557,7 @@ spec: - $formkit: group name: widgetss label: 侧边栏内容 - help: 目前提供的小部件有：profile（站点资料）, wechat（微信）, power（爱发电赞助）, welcome（小板报）, steam（Steam卡片）, music（音乐卡片）, friend-link（通讯录）, recent-posts（近期文章）, comments（最新评论）, categories（文章分类）, tags（文章标签）, stat（统计）, tags-stat（标签&归档&统计）, adbox（广告区域）。你可以随意组合或排序，以逗号隔开。 + help: 目前提供的小部件有：profile（个人卡片）, wechat（公众号）, power（爱发电赞助）, welcome（小板报）, steam（Steam卡片）, music（音乐卡片）, friend-link（通讯录）, recent-posts（最新文章）, comments（最新评论）, categories（文章分类）, tags（文章标签）, stat（统计）, tags-stat（标签&归档&统计）, adbox（广告区域）。你可以随意组合或排序，以逗号隔开。 value: indexWidgets: profile,wechat,comments,recent-posts,categories,tags-stat postWidgets: profile,wechat,toc,comments,recent-posts,categories,tags-stat @@ -2324,10 +2327,6 @@ spec: - group: style label: 样式 formSchema: - - $formkit: checkbox - name: enableChangeColorScheme - label: 允许访客切换配色 - value: true - $formkit: radio name: colorScheme label: 默认配色 diff --git a/templates/assets/css/post-copyright-one.css b/templates/assets/css/post-copyright-one.css index 6535e35f..3eb5dfba 100644 --- a/templates/assets/css/post-copyright-one.css +++ b/templates/assets/css/post-copyright-one.css @@ -310,7 +310,6 @@ img.post-copyright__author_img_front { display: -moz-box; display: -webkit-flex; display: -ms-flexbox; - display: box; display: flex; margin: 10px } diff --git a/templates/assets/css/post-copyright.css b/templates/assets/css/post-copyright.css index ccbf9204..b73ddfce 100644 --- a/templates/assets/css/post-copyright.css +++ b/templates/assets/css/post-copyright.css @@ -211,4 +211,4 @@ .post-reward .reward-main .reward-all { background:var(--heo-card-bg); -} +} \ No newline at end of file diff --git a/templates/assets/icon/demo.css b/templates/assets/icon/demo.css new file mode 100644 index 00000000..a67054a0 --- /dev/null +++ b/templates/assets/icon/demo.css @@ -0,0 +1,539 @@ +/* Logo 字体 */ +@font-face { + font-family: "iconfont logo"; + src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834'); + src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834#iefix') format('embedded-opentype'), + url('https://at.alicdn.com/t/font_985780_km7mi63cihi.woff?t=1545807318834') format('woff'), + url('https://at.alicdn.com/t/font_985780_km7mi63cihi.ttf?t=1545807318834') format('truetype'), + url('https://at.alicdn.com/t/font_985780_km7mi63cihi.svg?t=1545807318834#iconfont') format('svg'); +} + +.logo { + font-family: "iconfont logo"; + font-size: 160px; + font-style: normal; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +/* tabs */ +.nav-tabs { + position: relative; +} + +.nav-tabs .nav-more { + position: absolute; + right: 0; + bottom: 0; + height: 42px; + line-height: 42px; + color: #666; +} + +#tabs { + border-bottom: 1px solid #eee; +} + +#tabs li { + cursor: pointer; + width: 100px; + height: 40px; + line-height: 40px; + text-align: center; + font-size: 16px; + border-bottom: 2px solid transparent; + position: relative; + z-index: 1; + margin-bottom: -1px; + color: #666; +} + + +#tabs .active { + border-bottom-color: #f00; + color: #222; +} + +.tab-container .content { + display: none; +} + +/* 页面布局 */ +.main { + padding: 30px 100px; + width: 960px; + margin: 0 auto; +} + +.main .logo { + color: #333; + text-align: left; + margin-bottom: 30px; + line-height: 1; + height: 110px; + margin-top: -50px; + overflow: hidden; + *zoom: 1; +} + +.main .logo a { + font-size: 160px; + color: #333; +} + +.helps { + margin-top: 40px; +} + +.helps pre { + padding: 20px; + margin: 10px 0; + border: solid 1px #e7e1cd; + background-color: #fffdef; + overflow: auto; +} + +.icon_lists { + width: 100% !important; + overflow: hidden; + *zoom: 1; +} + +.icon_lists li { + width: 100px; + margin-bottom: 10px; + margin-right: 20px; + text-align: center; + list-style: none !important; + cursor: default; +} + +.icon_lists li .code-name { + line-height: 1.2; +} + +.icon_lists .icon { + display: block; + height: 100px; + line-height: 100px; + font-size: 42px; + margin: 10px auto; + color: #333; + -webkit-transition: font-size 0.25s linear, width 0.25s linear; + -moz-transition: font-size 0.25s linear, width 0.25s linear; + transition: font-size 0.25s linear, width 0.25s linear; +} + +.icon_lists .icon:hover { + font-size: 100px; +} + +.icon_lists .svg-icon { + /* 通过设置 font-size 来改变图标大小 */ + width: 1em; + /* 图标和文字相邻时，垂直对齐 */ + vertical-align: -0.15em; + /* 通过设置 color 来改变 SVG 的颜色/fill */ + fill: currentColor; + /* path 和 stroke 溢出 viewBox 部分在 IE 下会显示 + normalize.css 中也包含这行 */ + overflow: hidden; +} + +.icon_lists li .name, +.icon_lists li .code-name { + color: #666; +} + +/* markdown 样式 */ +.markdown { + color: #666; + font-size: 14px; + line-height: 1.8; +} + +.highlight { + line-height: 1.5; +} + +.markdown img { + vertical-align: middle; + max-width: 100%; +} + +.markdown h1 { + color: #404040; + font-weight: 500; + line-height: 40px; + margin-bottom: 24px; +} + +.markdown h2, +.markdown h3, +.markdown h4, +.markdown h5, +.markdown h6 { + color: #404040; + margin: 1.6em 0 0.6em 0; + font-weight: 500; + clear: both; +} + +.markdown h1 { + font-size: 28px; +} + +.markdown h2 { + font-size: 22px; +} + +.markdown h3 { + font-size: 16px; +} + +.markdown h4 { + font-size: 14px; +} + +.markdown h5 { + font-size: 12px; +} + +.markdown h6 { + font-size: 12px; +} + +.markdown hr { + height: 1px; + border: 0; + background: #e9e9e9; + margin: 16px 0; + clear: both; +} + +.markdown p { + margin: 1em 0; +} + +.markdown>p, +.markdown>blockquote, +.markdown>.highlight, +.markdown>ol, +.markdown>ul { + width: 80%; +} + +.markdown ul>li { + list-style: circle; +} + +.markdown>ul li, +.markdown blockquote ul>li { + margin-left: 20px; + padding-left: 4px; +} + +.markdown>ul li p, +.markdown>ol li p { + margin: 0.6em 0; +} + +.markdown ol>li { + list-style: decimal; +} + +.markdown>ol li, +.markdown blockquote ol>li { + margin-left: 20px; + padding-left: 4px; +} + +.markdown code { + margin: 0 3px; + padding: 0 5px; + background: #eee; + border-radius: 3px; +} + +.markdown strong, +.markdown b { + font-weight: 600; +} + +.markdown>table { + border-collapse: collapse; + border-spacing: 0px; + empty-cells: show; + border: 1px solid #e9e9e9; + width: 95%; + margin-bottom: 24px; +} + +.markdown>table th { + white-space: nowrap; + color: #333; + font-weight: 600; +} + +.markdown>table th, +.markdown>table td { + border: 1px solid #e9e9e9; + padding: 8px 16px; + text-align: left; +} + +.markdown>table th { + background: #F7F7F7; +} + +.markdown blockquote { + font-size: 90%; + color: #999; + border-left: 4px solid #e9e9e9; + padding-left: 0.8em; + margin: 1em 0; +} + +.markdown blockquote p { + margin: 0; +} + +.markdown .anchor { + opacity: 0; + transition: opacity 0.3s ease; + margin-left: 8px; +} + +.markdown .waiting { + color: #ccc; +} + +.markdown h1:hover .anchor, +.markdown h2:hover .anchor, +.markdown h3:hover .anchor, +.markdown h4:hover .anchor, +.markdown h5:hover .anchor, +.markdown h6:hover .anchor { + opacity: 1; + display: inline-block; +} + +.markdown>br, +.markdown>p>br { + clear: both; +} + + +.hljs { + display: block; + background: white; + padding: 0.5em; + color: #333333; + overflow-x: auto; +} + +.hljs-comment, +.hljs-meta { + color: #969896; +} + +.hljs-string, +.hljs-variable, +.hljs-template-variable, +.hljs-strong, +.hljs-emphasis, +.hljs-quote { + color: #df5000; +} + +.hljs-keyword, +.hljs-selector-tag, +.hljs-type { + color: #a71d5d; +} + +.hljs-literal, +.hljs-symbol, +.hljs-bullet, +.hljs-attribute { + color: #0086b3; +} + +.hljs-section, +.hljs-name { + color: #63a35c; +} + +.hljs-tag { + color: #333333; +} + +.hljs-title, +.hljs-attr, +.hljs-selector-id, +.hljs-selector-class, +.hljs-selector-attr, +.hljs-selector-pseudo { + color: #795da3; +} + +.hljs-addition { + color: #55a532; + background-color: #eaffea; +} + +.hljs-deletion { + color: #bd2c00; + background-color: #ffecec; +} + +.hljs-link { + text-decoration: underline; +} + +/* 代码高亮 */ +/* PrismJS 1.15.0 +https://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript */ +/** + * prism.js default theme for JavaScript, CSS and HTML + * Based on dabblet (http://dabblet.com) + * @author Lea Verou + */ +code[class*="language-"], +pre[class*="language-"] { + color: black; + background: none; + text-shadow: 0 1px white; + font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace; + text-align: left; + white-space: pre; + word-spacing: normal; + word-break: normal; + word-wrap: normal; + line-height: 1.5; + + -moz-tab-size: 4; + -o-tab-size: 4; + tab-size: 4; + + -webkit-hyphens: none; + -moz-hyphens: none; + -ms-hyphens: none; + hyphens: none; +} + +pre[class*="language-"]::-moz-selection, +pre[class*="language-"] ::-moz-selection, +code[class*="language-"]::-moz-selection, +code[class*="language-"] ::-moz-selection { + text-shadow: none; + background: #b3d4fc; +} + +pre[class*="language-"]::selection, +pre[class*="language-"] ::selection, +code[class*="language-"]::selection, +code[class*="language-"] ::selection { + text-shadow: none; + background: #b3d4fc; +} + +@media print { + + code[class*="language-"], + pre[class*="language-"] { + text-shadow: none; + } +} + +/* Code blocks */ +pre[class*="language-"] { + padding: 1em; + margin: .5em 0; + overflow: auto; +} + +:not(pre)>code[class*="language-"], +pre[class*="language-"] { + background: #f5f2f0; +} + +/* Inline code */ +:not(pre)>code[class*="language-"] { + padding: .1em; + border-radius: .3em; + white-space: normal; +} + +.token.comment, +.token.prolog, +.token.doctype, +.token.cdata { + color: slategray; +} + +.token.punctuation { + color: #999; +} + +.namespace { + opacity: .7; +} + +.token.property, +.token.tag, +.token.boolean, +.token.number, +.token.constant, +.token.symbol, +.token.deleted { + color: #905; +} + +.token.selector, +.token.attr-name, +.token.string, +.token.char, +.token.builtin, +.token.inserted { + color: #690; +} + +.token.operator, +.token.entity, +.token.url, +.language-css .token.string, +.style .token.string { + color: #9a6e3a; + background: hsla(0, 0%, 100%, .5); +} + +.token.atrule, +.token.attr-value, +.token.keyword { + color: #07a; +} + +.token.function, +.token.class-name { + color: #DD4A68; +} + +.token.regex, +.token.important, +.token.variable { + color: #e90; +} + +.token.important, +.token.bold { + font-weight: bold; +} + +.token.italic { + font-style: italic; +} + +.token.entity { + cursor: help; +} diff --git a/templates/assets/icon/demo_index.html b/templates/assets/icon/demo_index.html new file mode 100644 index 00000000..b6c9e024 --- /dev/null +++ b/templates/assets/icon/demo_index.html @@ -0,0 +1,3963 @@ + + + + + iconfont Demo + + + + + + + + + + + + + +
+

+ + +

+
+ + + 查看项目 + +
+
+
+
    + +
  • + +
    aifadian-line
    +
    
    +
    • + +
  • + +
    账号
    +
    
    +
    • + +
  • + +
    作者
    +
    
    +
    • + +
  • + +
    微信
    +
    
    +
    • + +
  • + +
    编辑
    +
    
    +
    • + +
  • + +
    check-circle
    +
    
    +
    • + +
  • + +
    dashboard
    +
    
    +
    • + +
  • + +
    bullseye
    +
    
    +
    • + +
  • + +
    logo-moment
    +
    
    +
    • + +
  • + +
    leetcode
    +
    
    +
    • + +
  • + +
    gitlab
    +
    
    +
    • + +
  • + +
    csdn
    +
    
    +
    • + +
  • + +
    dribbble
    +
    
    +
    • + +
  • + +
    yuque
    +
    
    +
    • + +
  • + +
    linkedin
    +
    
    +
    • + +
  • + +
    youtube
    +
    
    +
    • + +
  • + +
    Instagram
    +
    
    +
    • + +
  • + +
    slack
    +
    
    +
    • + +
  • + +
    百度
    +
    
    +
    • + +
  • + +
    discord-line
    +
    
    +
    • + +
  • + +
    cnblogs
    +
    
    +
    • + +
  • + +
    juejin
    +
    
    +
    • + +
  • + +
    steam
    +
    
    +
    • + +
  • + +
    telegram
    +
    
    +
    • + +
  • + +
    toutiao
    +
    
    +
    • + +
  • + +
    微信
    +
    
    +
    • + +
  • + +
    豆瓣
    +
    
    +
    • + +
  • + +
    知乎
    +
    
    +
    • + +
  • + +
    微信公众号
    +
    
    +
    • + +
  • + +
    猜你喜欢
    +
    
    +
    • + +
  • + +
    eicon_map-2-line
    +
    
    +
    • + +
  • + +
    circle
    +
    
    +
    • + +
  • + +
    creative-commons-nd-line
    +
    
    +
    • + +
  • + +
    creative-commons-by-line
    +
    
    +
    • + +
  • + +
    creative-commons-nc-line
    +
    
    +
    • + +
  • + +
    copyright-line
    +
    
    +
    • + +
  • + +
    font
    +
    
    +
    • + +
  • + +
    stopwatch
    +
    
    +
    • + +
  • + +
    file-lines
    +
    
    +
    • + +
  • + +
    square-poll-vertical
    +
    
    +
    • + +
  • + +
    universal-access
    +
    
    +
    • + +
  • + +
    hourglass-start
    +
    
    +
    • + +
  • + +
    通讯录07
    +
    
    +
    • + +
  • + +
    arrow-right
    +
    
    +
    • + +
  • + +
    arrow-left
    +
    
    +
    • + +
  • + +
    dice
    +
    
    +
    • + +
  • + +
    copy
    +
    
    +
    • + +
  • + +
    cube
    +
    
    +
    • + +
  • + +
    circle-arrow-right
    +
    
    +
    • + +
  • + +
    clock
    +
    
    +
    • + +
  • + +
    book
    +
    
    +
    • + +
  • + +
    calendar-alt
    +
    
    +
    • + +
  • + +
    eye-outline
    +
    
    +
    • + +
  • + +
    circle-half-stroke
    +
    
    +
    • + +
  • + +
    arrow-up
    +
    
    +
    • + +
  • + +
    file-word
    +
    
    +
    • + +
  • + +
    fire
    +
    
    +
    • + +
  • + +
    dove
    +
    
    +
    • + +
  • + +
    gear
    +
    
    +
    • + +
  • + +
    inbox
    +
    
    +
    • + +
  • + +
    history
    +
    
    +
    • + +
  • + +
    magnifying-glass
    +
    
    +
    • + +
  • + +
    message
    +
    
    +
    • + +
  • + +
    moon
    +
    
    +
    • + +
  • + +
    shapes
    +
    
    +
    • + +
  • + +
    shuffle
    +
    
    +
    • + +
  • + +
    language
    +
    
    +
    • + +
  • + +
    tags
    +
    
    +
    • + +
  • + +
    train
    +
    
    +
    • + +
  • + +
    warning
    +
    
    +
    • + +
  • + +
    circle-arrow-up-right-1
    +
    
    +
    • + +
  • + +
    fish
    +
    
    +
    • + +
  • + +
    envelope
    +
    
    +
    • + +
  • + +
    music
    +
    
    +
    • + +
  • + +
    fan
    +
    
    +
    • + +
  • + +
    heartbeat-bold
    +
    
    +
    • + +
  • + +
    link
    +
    
    +
    • + +
  • + +
    chevron-left
    +
    
    +
    • + +
  • + +
    rocket
    +
    
    +
    • + +
  • + +
    lightbulb
    +
    
    +
    • + +
  • + +
    shoe-prints
    +
    
    +
    • + +
  • + +
    images
    +
    
    +
    • + +
  • + +
    box-archive
    +
    
    +
    • + +
  • + +
    artstation
    +
    
    +
    • + +
  • + +
    paper-plane
    +
    
    +
    • + +
  • + +
    house-chimney
    +
    
    +
    • + +
  • + +
    grip-vertical
    +
    
    +
    • + +
  • + +
    bars
    +
    
    +
    • + +
  • + +
    arrows-left-right
    +
    
    +
    • + +
  • + +
    book-open
    +
    
    +
    • + +
  • + +
    list-ul
    +
    
    +
    • + +
  • + +
    comments
    +
    
    +
    • + +
  • + +
    comment-sms
    +
    
    +
    • + +
  • + +
    angles-right
    +
    
    +
    • + +
  • + +
    tag
    +
    
    +
    • + +
  • + +
    chevron-right
    +
    
    +
    • + +
  • + +
    radio
    +
    
    +
    • + +
  • + +
    forward
    +
    
    +
    • + +
  • + +
    window-restore
    +
    
    +
    • + +
  • + +
    backward
    +
    
    +
    • + +
  • + +
    download
    +
    
    +
    • + +
  • + +
    comment-medical
    +
    
    +
    • + +
  • + +
    paste
    +
    
    +
    • + +
  • + +
    arrow-rotate-right
    +
    
    +
    • + +
  • + +
    play
    +
    
    +
    • + +
  • + +
    circle-xmark
    +
    
    +
    • + +
  • + +
    angle-down
    +
    
    +
    • + +
  • + +
    chart-line
    +
    
    +
    • + +
  • + +
    pencil
    +
    
    +
    • + +
  • + +
    thumbtack
    +
    
    +
    • + +
  • + +
    location-dot
    +
    
    +
    • + +
  • + +
    fw-fire
    +
    
    +
    • + +
  • + +
    calendar-days
    +
    
    +
    • + +
  • + +
    angle-right
    +
    
    +
    • + +
  • + +
    dice-d20
    +
    
    +
    • + +
  • + +
    instagram
    +
    
    +
    • + +
  • + +
    xmark
    +
    
    +
    • + +
  • + +
    spinner
    +
    
    +
    • + +
  • + +
    bullhorn
    +
    
    +
    • + +
  • + +
    stream
    +
    
    +
    • + +
  • + +
    caret-left
    +
    
    +
    • + +
  • + +
    folder-open
    +
    
    +
    • + +
  • + +
    thumbs-up
    +
    
    +
    • + +
  • + +
    angle-double-down
    +
    
    +
    • + +
  • + +
    sign-out-alt
    +
    
    +
    • + +
  • + +
    angle-double-left
    +
    
    +
    • + +
  • + +
    angle-double-right
    +
    
    +
    • + +
  • + +
    angle-left
    +
    
    +
    • + +
  • + +
    fw-eye
    +
    
    +
    • + +
  • + +
    repeat
    +
    
    +
    • + +
  • + +
    shuffle
    +
    
    +
    • + +
  • + +
    arrows-rotate
    +
    
    +
    • + +
  • + +
    pause
    +
    
    +
    • + +
  • + +
    heartbeat
    +
    
    +
    • + +
  • + +
    jike
    +
    
    +
    • + +
  • + +
    jike
    +
    
    +
    • + +
  • + +
    heartbeat
    +
    
    +
    • + +
  • + +
    rss
    +
    
    +
    • + +
  • + +
    qq
    +
    
    +
    • + +
  • + +
    github
    +
    
    +
    • + +
  • + +
    bilibili
    +
    
    +
    • + +
  • + +
    paper-plane
    +
    
    +
    • + +
  • + +
    hashtag
    +
    
    +
    • + +
  • + +
    hand-heart-fill
    +
    
    +
    • + +
  • + +
    plant-fill
    +
    
    +
    • + +
  • + +
    qrcode
    +
    
    +
    • + +
  • + +
    weibo
    +
    
    +
    • + +
  • + +
    copyright
    +
    
    +
    • + +
  • + +
    bolt
    +
    
    +
    • + +
  • + +
    circle-info
    +
    
    +
    • + +
  • + +
    triangle-exclamation
    +
    
    +
    • + +
  • + +
    circle-check
    +
    
    +
    • + +
  • + +
    circle-minus
    +
    
    +
    • + +
  • + +
    circle-plus
    +
    
    +
    • + +
  • + +
    circle-dot
    +
    
    +
    • + +
  • + +
    scissors
    +
    
    +
    • + +
  • + +
    arrow-down
    +
    
    +
    • + +
  • + +
    灯泡
    +
    
    +
    • + +
  • + +
    弹幕
    +
    
    +
    • + +
  • + +
    总览
    +
    
    +
    • + +
  • + +
    灵感
    +
    
    +
    • + +
  • + +
    三明治
    +
    
    +
    • + +
  • + +
    keyboard
    +
    
    +
    • + +
  • + +
    tiktok
    +
    
    +
    • + +
+
+

Unicode 引用

+
+ +

Unicode 是字体在网页端最原始的应用方式，特点是：

+
    +
  • 支持按字体的方式去动态调整图标大小，颜色等等。
    • +
  • 默认情况下不支持多色，直接添加多色图标会自动去色。
    • +
+
+

注意：新版 iconfont 支持两种方式引用多色图标：SVG symbol 引用方式和彩色字体图标模式。（使用彩色字体图标需要在「编辑项目」中开启「彩色」选项后并重新生成。）

+
+

Unicode 使用步骤如下：

+

第一步：拷贝项目下面生成的 @font-face

+
@font-face {
+  font-family: 'haofont';
+  src: url('iconfont.eot?t=1697559754295'); /* IE9 */
+  src: url('iconfont.eot?t=1697559754295#iefix') format('embedded-opentype'), /* IE6-IE8 */
+       url('iconfont.woff2?t=1697559754295') format('woff2'),
+       url('iconfont.woff?t=1697559754295') format('woff'),
+       url('iconfont.ttf?t=1697559754295') format('truetype'),
+       url('iconfont.svg?t=1697559754295#haofont') format('svg');
+}
+
+

第二步：定义使用 iconfont 的样式

+
.haofont {
+  font-family: "haofont" !important;
+  font-size: 16px;
+  font-style: normal;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+

第三步：挑选相应图标并获取字体编码，应用于页面

+
+<span class="haofont">&#x33;</span>
+
+
+

"haofont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。

+
+
+
+
+
    + +
  • + +
    + aifadian-line +
    +
    .hao-icon-aifadian-line +
    +
    • + +
  • + +
    + 账号 +
    +
    .hao-icon-zhanghao1 +
    +
    • + +
  • + +
    + 作者 +
    +
    .hao-icon-zuozhe +
    +
    • + +
  • + +
    + 微信 +
    +
    .hao-icon-weixin1 +
    +
    • + +
  • + +
    + 编辑 +
    +
    .hao-icon-bianji +
    +
    • + +
  • + +
    + check-circle +
    +
    .hao-icon-check-circle +
    +
    • + +
  • + +
    + dashboard +
    +
    .hao-icon-dashboard +
    +
    • + +
  • + +
    + bullseye +
    +
    .hao-icon-bullseye +
    +
    • + +
  • + +
    + logo-moment +
    +
    .hao-icon-logo-moment +
    +
    • + +
  • + +
    + leetcode +
    +
    .hao-icon-leetcode +
    +
    • + +
  • + +
    + gitlab +
    +
    .hao-icon-gitlab +
    +
    • + +
  • + +
    + csdn +
    +
    .hao-icon-csdn +
    +
    • + +
  • + +
    + dribbble +
    +
    .hao-icon-dribbble +
    +
    • + +
  • + +
    + yuque +
    +
    .hao-icon-yuque +
    +
    • + +
  • + +
    + linkedin +
    +
    .hao-icon-linkedin +
    +
    • + +
  • + +
    + youtube +
    +
    .hao-icon-youtube +
    +
    • + +
  • + +
    + Instagram +
    +
    .hao-icon-Instagram +
    +
    • + +
  • + +
    + slack +
    +
    .hao-icon-slack +
    +
    • + +
  • + +
    + 百度 +
    +
    .hao-icon-baidu +
    +
    • + +
  • + +
    + discord-line +
    +
    .hao-icon-discord-line +
    +
    • + +
  • + +
    + cnblogs +
    +
    .hao-icon-cnblogs +
    +
    • + +
  • + +
    + juejin +
    +
    .hao-icon-juejin +
    +
    • + +
  • + +
    + steam +
    +
    .hao-icon-steam +
    +
    • + +
  • + +
    + telegram +
    +
    .hao-icon-telegram +
    +
    • + +
  • + +
    + toutiao +
    +
    .hao-icon-toutiao +
    +
    • + +
  • + +
    + 微信 +
    +
    .hao-icon-weixin +
    +
    • + +
  • + +
    + 豆瓣 +
    +
    .hao-icon-douban +
    +
    • + +
  • + +
    + 知乎 +
    +
    .hao-icon-29 +
    +
    • + +
  • + +
    + 微信公众号 +
    +
    .hao-icon-weixingongzhonghao +
    +
    • + +
  • + +
    + 猜你喜欢 +
    +
    .hao-icon-cainixihuan +
    +
    • + +
  • + +
    + eicon_map-2-line +
    +
    .hao-icon-eicon_map-2-line1 +
    +
    • + +
  • + +
    + circle +
    +
    .hao-icon-yuan +
    +
    • + +
  • + +
    + creative-commons-nd-line +
    +
    .hao-icon-creative-commons-nd-line +
    +
    • + +
  • + +
    + creative-commons-by-line +
    +
    .hao-icon-creative-commons-by-line +
    +
    • + +
  • + +
    + creative-commons-nc-line +
    +
    .hao-icon-creative-commons-nc-line +
    +
    • + +
  • + +
    + copyright-line +
    +
    .hao-icon-copyright-line +
    +
    • + +
  • + +
    + font +
    +
    .hao-icon-font +
    +
    • + +
  • + +
    + stopwatch +
    +
    .hao-icon-stopwatch +
    +
    • + +
  • + +
    + file-lines +
    +
    .hao-icon-file-lines +
    +
    • + +
  • + +
    + square-poll-vertical +
    +
    .hao-icon-square-poll-vertical +
    +
    • + +
  • + +
    + universal-access +
    +
    .hao-icon-universal-access +
    +
    • + +
  • + +
    + hourglass-start +
    +
    .hao-icon-hourglass-start +
    +
    • + +
  • + +
    + 通讯录07 +
    +
    .hao-icon-tongxunlu07 +
    +
    • + +
  • + +
    + arrow-right +
    +
    .hao-icon-arrow-right +
    +
    • + +
  • + +
    + arrow-left +
    +
    .hao-icon-arrow-left +
    +
    • + +
  • + +
    + dice +
    +
    .hao-icon-dice +
    +
    • + +
  • + +
    + copy +
    +
    .hao-icon-copy +
    +
    • + +
  • + +
    + cube +
    +
    .hao-icon-cube +
    +
    • + +
  • + +
    + circle-arrow-right +
    +
    .hao-icon-circle-arrow-right +
    +
    • + +
  • + +
    + clock +
    +
    .hao-icon-clock +
    +
    • + +
  • + +
    + book +
    +
    .hao-icon-book +
    +
    • + +
  • + +
    + calendar-alt +
    +
    .hao-icon-calendar-alt +
    +
    • + +
  • + +
    + eye-outline +
    +
    .hao-icon-eye-outline +
    +
    • + +
  • + +
    + circle-half-stroke +
    +
    .hao-icon-circle-half-stroke +
    +
    • + +
  • + +
    + arrow-up +
    +
    .hao-icon-arrow-up +
    +
    • + +
  • + +
    + file-word +
    +
    .hao-icon-file-word +
    +
    • + +
  • + +
    + fire +
    +
    .hao-icon-fire +
    +
    • + +
  • + +
    + dove +
    +
    .hao-icon-dove +
    +
    • + +
  • + +
    + gear +
    +
    .hao-icon-gear +
    +
    • + +
  • + +
    + inbox +
    +
    .hao-icon-inbox +
    +
    • + +
  • + +
    + history +
    +
    .hao-icon-history +
    +
    • + +
  • + +
    + magnifying-glass +
    +
    .hao-icon-magnifying-glass +
    +
    • + +
  • + +
    + message +
    +
    .hao-icon-message +
    +
    • + +
  • + +
    + moon +
    +
    .hao-icon-moon +
    +
    • + +
  • + +
    + shapes +
    +
    .hao-icon-shapes +
    +
    • + +
  • + +
    + shuffle +
    +
    .hao-icon-shuffle +
    +
    • + +
  • + +
    + language +
    +
    .hao-icon-language +
    +
    • + +
  • + +
    + tags +
    +
    .hao-icon-tags +
    +
    • + +
  • + +
    + train +
    +
    .hao-icon-train +
    +
    • + +
  • + +
    + warning +
    +
    .hao-icon-warning +
    +
    • + +
  • + +
    + circle-arrow-up-right-1 +
    +
    .hao-icon-circle-arrow-up-right-1 +
    +
    • + +
  • + +
    + fish +
    +
    .hao-icon-fish +
    +
    • + +
  • + +
    + envelope +
    +
    .hao-icon-envelope +
    +
    • + +
  • + +
    + music +
    +
    .hao-icon-music +
    +
    • + +
  • + +
    + fan +
    +
    .hao-icon-fan +
    +
    • + +
  • + +
    + heartbeat-bold +
    +
    .hao-icon-heartbeat-bold +
    +
    • + +
  • + +
    + link +
    +
    .hao-icon-link +
    +
    • + +
  • + +
    + chevron-left +
    +
    .hao-icon-chevron-left +
    +
    • + +
  • + +
    + rocket +
    +
    .hao-icon-rocket +
    +
    • + +
  • + +
    + lightbulb +
    +
    .hao-icon-lightbulb +
    +
    • + +
  • + +
    + shoe-prints +
    +
    .hao-icon-shoe-prints +
    +
    • + +
  • + +
    + images +
    +
    .hao-icon-images +
    +
    • + +
  • + +
    + box-archive +
    +
    .hao-icon-box-archive +
    +
    • + +
  • + +
    + artstation +
    +
    .hao-icon-artstation +
    +
    • + +
  • + +
    + paper-plane +
    +
    .hao-icon-paper-plane +
    +
    • + +
  • + +
    + house-chimney +
    +
    .hao-icon-house-chimney +
    +
    • + +
  • + +
    + grip-vertical +
    +
    .hao-icon-grip-vertical +
    +
    • + +
  • + +
    + bars +
    +
    .hao-icon-bars +
    +
    • + +
  • + +
    + arrows-left-right +
    +
    .hao-icon-arrows-left-right +
    +
    • + +
  • + +
    + book-open +
    +
    .hao-icon-book-open +
    +
    • + +
  • + +
    + list-ul +
    +
    .hao-icon-list-ul +
    +
    • + +
  • + +
    + comments +
    +
    .hao-icon-comments +
    +
    • + +
  • + +
    + comment-sms +
    +
    .hao-icon-comment-sms +
    +
    • + +
  • + +
    + angles-right +
    +
    .hao-icon-angles-right +
    +
    • + +
  • + +
    + tag +
    +
    .hao-icon-tag +
    +
    • + +
  • + +
    + chevron-right +
    +
    .hao-icon-chevron-right +
    +
    • + +
  • + +
    + radio +
    +
    .hao-icon-radio +
    +
    • + +
  • + +
    + forward +
    +
    .hao-icon-forward +
    +
    • + +
  • + +
    + window-restore +
    +
    .hao-icon-window-restore +
    +
    • + +
  • + +
    + backward +
    +
    .hao-icon-backward +
    +
    • + +
  • + +
    + download +
    +
    .hao-icon-download +
    +
    • + +
  • + +
    + comment-medical +
    +
    .hao-icon-comment-medical +
    +
    • + +
  • + +
    + paste +
    +
    .hao-icon-paste +
    +
    • + +
  • + +
    + arrow-rotate-right +
    +
    .hao-icon-arrow-rotate-right +
    +
    • + +
  • + +
    + play +
    +
    .hao-icon-play +
    +
    • + +
  • + +
    + circle-xmark +
    +
    .hao-icon-circle-xmark +
    +
    • + +
  • + +
    + angle-down +
    +
    .hao-icon-angle-down +
    +
    • + +
  • + +
    + chart-line +
    +
    .hao-icon-chart-line +
    +
    • + +
  • + +
    + pencil +
    +
    .hao-icon-pencil +
    +
    • + +
  • + +
    + thumbtack +
    +
    .hao-icon-thumbtack +
    +
    • + +
  • + +
    + location-dot +
    +
    .hao-icon-location-dot +
    +
    • + +
  • + +
    + fw-fire +
    +
    .hao-icon-fw-fire +
    +
    • + +
  • + +
    + calendar-days +
    +
    .hao-icon-calendar-days +
    +
    • + +
  • + +
    + angle-right +
    +
    .hao-icon-angle-right +
    +
    • + +
  • + +
    + dice-d20 +
    +
    .hao-icon-dice-d20 +
    +
    • + +
  • + +
    + instagram +
    +
    .hao-icon-instagram +
    +
    • + +
  • + +
    + xmark +
    +
    .hao-icon-xmark +
    +
    • + +
  • + +
    + spinner +
    +
    .hao-icon-spinner +
    +
    • + +
  • + +
    + bullhorn +
    +
    .hao-icon-bullhorn +
    +
    • + +
  • + +
    + stream +
    +
    .hao-icon-stream +
    +
    • + +
  • + +
    + caret-left +
    +
    .hao-icon-caret-left +
    +
    • + +
  • + +
    + folder-open +
    +
    .hao-icon-folder-open +
    +
    • + +
  • + +
    + thumbs-up +
    +
    .hao-icon-thumbs-up +
    +
    • + +
  • + +
    + angle-double-down +
    +
    .hao-icon-angle-double-down +
    +
    • + +
  • + +
    + sign-out-alt +
    +
    .hao-icon-sign-out-alt +
    +
    • + +
  • + +
    + angle-double-left +
    +
    .hao-icon-angle-double-left +
    +
    • + +
  • + +
    + angle-double-right +
    +
    .hao-icon-angle-double-right +
    +
    • + +
  • + +
    + angle-left +
    +
    .hao-icon-angle-left +
    +
    • + +
  • + +
    + fw-eye +
    +
    .hao-icon-fw-eye +
    +
    • + +
  • + +
    + repeat +
    +
    .hao-icon-repeat +
    +
    • + +
  • + +
    + shuffle +
    +
    .hao-icon-shuffle1 +
    +
    • + +
  • + +
    + arrows-rotate +
    +
    .hao-icon-arrows-rotate +
    +
    • + +
  • + +
    + pause +
    +
    .hao-icon-pause +
    +
    • + +
  • + +
    + heartbeat +
    +
    .hao-icon-heartbeat +
    +
    • + +
  • + +
    + jike +
    +
    .hao-icon-a-2 +
    +
    • + +
  • + +
    + jike +
    +
    .hao-icon-jike +
    +
    • + +
  • + +
    + heartbeat +
    +
    .hao-icon-heartbeat1 +
    +
    • + +
  • + +
    + rss +
    +
    .hao-icon-rss +
    +
    • + +
  • + +
    + qq +
    +
    .hao-icon-qq +
    +
    • + +
  • + +
    + github +
    +
    .hao-icon-github +
    +
    • + +
  • + +
    + bilibili +
    +
    .hao-icon-bilibili +
    +
    • + +
  • + +
    + paper-plane +
    +
    .hao-icon-paper-plane1 +
    +
    • + +
  • + +
    + hashtag +
    +
    .hao-icon-hashtag +
    +
    • + +
  • + +
    + hand-heart-fill +
    +
    .hao-icon-hand-heart-fill +
    +
    • + +
  • + +
    + plant-fill +
    +
    .hao-icon-plant-fill +
    +
    • + +
  • + +
    + qrcode +
    +
    .hao-icon-qrcode +
    +
    • + +
  • + +
    + weibo +
    +
    .hao-icon-weibo +
    +
    • + +
  • + +
    + copyright +
    +
    .hao-icon-copyright +
    +
    • + +
  • + +
    + bolt +
    +
    .hao-icon-bolt +
    +
    • + +
  • + +
    + circle-info +
    +
    .hao-icon-circle-info +
    +
    • + +
  • + +
    + triangle-exclamation +
    +
    .hao-icon-triangle-exclamation +
    +
    • + +
  • + +
    + circle-check +
    +
    .hao-icon-circle-check +
    +
    • + +
  • + +
    + circle-minus +
    +
    .hao-icon-circle-minus +
    +
    • + +
  • + +
    + circle-plus +
    +
    .hao-icon-circle-plus +
    +
    • + +
  • + +
    + circle-dot +
    +
    .hao-icon-circle-dot +
    +
    • + +
  • + +
    + scissors +
    +
    .hao-icon-scissors +
    +
    • + +
  • + +
    + arrow-down +
    +
    .hao-icon-arrow-down +
    +
    • + +
  • + +
    + 灯泡 +
    +
    .hao-icon-dengpao +
    +
    • + +
  • + +
    + 弹幕 +
    +
    .hao-icon-danmu +
    +
    • + +
  • + +
    + 总览 +
    +
    .hao-icon-zonglan +
    +
    • + +
  • + +
    + 灵感 +
    +
    .hao-icon-linggan +
    +
    • + +
  • + +
    + 三明治 +
    +
    .hao-icon-sanmingzhi +
    +
    • + +
  • + +
    + keyboard +
    +
    .hao-icon-keyboard +
    +
    • + +
  • + +
    + tiktok +
    +
    .hao-icon-tiktok +
    +
    • + +
+
+

font-class 引用

+
+ +

font-class 是 Unicode 使用方式的一种变种，主要是解决 Unicode 书写不直观，语意不明确的问题。

+

与 Unicode 使用方式相比，具有如下特点：

+
    +
  • 相比于 Unicode 语意明确，书写更直观。可以很容易分辨这个 icon 是什么。
    • +
  • 因为使用 class 来定义图标，所以当要替换图标时，只需要修改 class 里面的 Unicode 引用。
    • +
+

使用步骤如下：

+

第一步：引入项目下面生成的 fontclass 代码：

+
<link rel="stylesheet" href="./iconfont.css">
+
+

第二步：挑选相应图标并获取类名，应用于页面：

+
<span class="haofont hao-icon-xxx"></span>
+
+
+

" + haofont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。

+
+
+
+
+
    + +
  • + +
    aifadian-line
    +
    #hao-icon-aifadian-line
    +
    • + +
  • + +
    账号
    +
    #hao-icon-zhanghao1
    +
    • + +
  • + +
    作者
    +
    #hao-icon-zuozhe
    +
    • + +
  • + +
    微信
    +
    #hao-icon-weixin1
    +
    • + +
  • + +
    编辑
    +
    #hao-icon-bianji
    +
    • + +
  • + +
    check-circle
    +
    #hao-icon-check-circle
    +
    • + +
  • + +
    dashboard
    +
    #hao-icon-dashboard
    +
    • + +
  • + +
    bullseye
    +
    #hao-icon-bullseye
    +
    • + +
  • + +
    logo-moment
    +
    #hao-icon-logo-moment
    +
    • + +
  • + +
    leetcode
    +
    #hao-icon-leetcode
    +
    • + +
  • + +
    gitlab
    +
    #hao-icon-gitlab
    +
    • + +
  • + +
    csdn
    +
    #hao-icon-csdn
    +
    • + +
  • + +
    dribbble
    +
    #hao-icon-dribbble
    +
    • + +
  • + +
    yuque
    +
    #hao-icon-yuque
    +
    • + +
  • + +
    linkedin
    +
    #hao-icon-linkedin
    +
    • + +
  • + +
    youtube
    +
    #hao-icon-youtube
    +
    • + +
  • + +
    Instagram
    +
    #hao-icon-Instagram
    +
    • + +
  • + +
    slack
    +
    #hao-icon-slack
    +
    • + +
  • + +
    百度
    +
    #hao-icon-baidu
    +
    • + +
  • + +
    discord-line
    +
    #hao-icon-discord-line
    +
    • + +
  • + +
    cnblogs
    +
    #hao-icon-cnblogs
    +
    • + +
  • + +
    juejin
    +
    #hao-icon-juejin
    +
    • + +
  • + +
    steam
    +
    #hao-icon-steam
    +
    • + +
  • + +
    telegram
    +
    #hao-icon-telegram
    +
    • + +
  • + +
    toutiao
    +
    #hao-icon-toutiao
    +
    • + +
  • + +
    微信
    +
    #hao-icon-weixin
    +
    • + +
  • + +
    豆瓣
    +
    #hao-icon-douban
    +
    • + +
  • + +
    知乎
    +
    #hao-icon-29
    +
    • + +
  • + +
    微信公众号
    +
    #hao-icon-weixingongzhonghao
    +
    • + +
  • + +
    猜你喜欢
    +
    #hao-icon-cainixihuan
    +
    • + +
  • + +
    eicon_map-2-line
    +
    #hao-icon-eicon_map-2-line1
    +
    • + +
  • + +
    circle
    +
    #hao-icon-yuan
    +
    • + +
  • + +
    creative-commons-nd-line
    +
    #hao-icon-creative-commons-nd-line
    +
    • + +
  • + +
    creative-commons-by-line
    +
    #hao-icon-creative-commons-by-line
    +
    • + +
  • + +
    creative-commons-nc-line
    +
    #hao-icon-creative-commons-nc-line
    +
    • + +
  • + +
    copyright-line
    +
    #hao-icon-copyright-line
    +
    • + +
  • + +
    font
    +
    #hao-icon-font
    +
    • + +
  • + +
    stopwatch
    +
    #hao-icon-stopwatch
    +
    • + +
  • + +
    file-lines
    +
    #hao-icon-file-lines
    +
    • + +
  • + +
    square-poll-vertical
    +
    #hao-icon-square-poll-vertical
    +
    • + +
  • + +
    universal-access
    +
    #hao-icon-universal-access
    +
    • + +
  • + +
    hourglass-start
    +
    #hao-icon-hourglass-start
    +
    • + +
  • + +
    通讯录07
    +
    #hao-icon-tongxunlu07
    +
    • + +
  • + +
    arrow-right
    +
    #hao-icon-arrow-right
    +
    • + +
  • + +
    arrow-left
    +
    #hao-icon-arrow-left
    +
    • + +
  • + +
    dice
    +
    #hao-icon-dice
    +
    • + +
  • + +
    copy
    +
    #hao-icon-copy
    +
    • + +
  • + +
    cube
    +
    #hao-icon-cube
    +
    • + +
  • + +
    circle-arrow-right
    +
    #hao-icon-circle-arrow-right
    +
    • + +
  • + +
    clock
    +
    #hao-icon-clock
    +
    • + +
  • + +
    book
    +
    #hao-icon-book
    +
    • + +
  • + +
    calendar-alt
    +
    #hao-icon-calendar-alt
    +
    • + +
  • + +
    eye-outline
    +
    #hao-icon-eye-outline
    +
    • + +
  • + +
    circle-half-stroke
    +
    #hao-icon-circle-half-stroke
    +
    • + +
  • + +
    arrow-up
    +
    #hao-icon-arrow-up
    +
    • + +
  • + +
    file-word
    +
    #hao-icon-file-word
    +
    • + +
  • + +
    fire
    +
    #hao-icon-fire
    +
    • + +
  • + +
    dove
    +
    #hao-icon-dove
    +
    • + +
  • + +
    gear
    +
    #hao-icon-gear
    +
    • + +
  • + +
    inbox
    +
    #hao-icon-inbox
    +
    • + +
  • + +
    history
    +
    #hao-icon-history
    +
    • + +
  • + +
    magnifying-glass
    +
    #hao-icon-magnifying-glass
    +
    • + +
  • + +
    message
    +
    #hao-icon-message
    +
    • + +
  • + +
    moon
    +
    #hao-icon-moon
    +
    • + +
  • + +
    shapes
    +
    #hao-icon-shapes
    +
    • + +
  • + +
    shuffle
    +
    #hao-icon-shuffle
    +
    • + +
  • + +
    language
    +
    #hao-icon-language
    +
    • + +
  • + +
    tags
    +
    #hao-icon-tags
    +
    • + +
  • + +
    train
    +
    #hao-icon-train
    +
    • + +
  • + +
    warning
    +
    #hao-icon-warning
    +
    • + +
  • + +
    circle-arrow-up-right-1
    +
    #hao-icon-circle-arrow-up-right-1
    +
    • + +
  • + +
    fish
    +
    #hao-icon-fish
    +
    • + +
  • + +
    envelope
    +
    #hao-icon-envelope
    +
    • + +
  • + +
    music
    +
    #hao-icon-music
    +
    • + +
  • + +
    fan
    +
    #hao-icon-fan
    +
    • + +
  • + +
    heartbeat-bold
    +
    #hao-icon-heartbeat-bold
    +
    • + +
  • + +
    link
    +
    #hao-icon-link
    +
    • + +
  • + +
    chevron-left
    +
    #hao-icon-chevron-left
    +
    • + +
  • + +
    rocket
    +
    #hao-icon-rocket
    +
    • + +
  • + +
    lightbulb
    +
    #hao-icon-lightbulb
    +
    • + +
  • + +
    shoe-prints
    +
    #hao-icon-shoe-prints
    +
    • + +
  • + +
    images
    +
    #hao-icon-images
    +
    • + +
  • + +
    box-archive
    +
    #hao-icon-box-archive
    +
    • + +
  • + +
    artstation
    +
    #hao-icon-artstation
    +
    • + +
  • + +
    paper-plane
    +
    #hao-icon-paper-plane
    +
    • + +
  • + +
    house-chimney
    +
    #hao-icon-house-chimney
    +
    • + +
  • + +
    grip-vertical
    +
    #hao-icon-grip-vertical
    +
    • + +
  • + +
    bars
    +
    #hao-icon-bars
    +
    • + +
  • + +
    arrows-left-right
    +
    #hao-icon-arrows-left-right
    +
    • + +
  • + +
    book-open
    +
    #hao-icon-book-open
    +
    • + +
  • + +
    list-ul
    +
    #hao-icon-list-ul
    +
    • + +
  • + +
    comments
    +
    #hao-icon-comments
    +
    • + +
  • + +
    comment-sms
    +
    #hao-icon-comment-sms
    +
    • + +
  • + +
    angles-right
    +
    #hao-icon-angles-right
    +
    • + +
  • + +
    tag
    +
    #hao-icon-tag
    +
    • + +
  • + +
    chevron-right
    +
    #hao-icon-chevron-right
    +
    • + +
  • + +
    radio
    +
    #hao-icon-radio
    +
    • + +
  • + +
    forward
    +
    #hao-icon-forward
    +
    • + +
  • + +
    window-restore
    +
    #hao-icon-window-restore
    +
    • + +
  • + +
    backward
    +
    #hao-icon-backward
    +
    • + +
  • + +
    download
    +
    #hao-icon-download
    +
    • + +
  • + +
    comment-medical
    +
    #hao-icon-comment-medical
    +
    • + +
  • + +
    paste
    +
    #hao-icon-paste
    +
    • + +
  • + +
    arrow-rotate-right
    +
    #hao-icon-arrow-rotate-right
    +
    • + +
  • + +
    play
    +
    #hao-icon-play
    +
    • + +
  • + +
    circle-xmark
    +
    #hao-icon-circle-xmark
    +
    • + +
  • + +
    angle-down
    +
    #hao-icon-angle-down
    +
    • + +
  • + +
    chart-line
    +
    #hao-icon-chart-line
    +
    • + +
  • + +
    pencil
    +
    #hao-icon-pencil
    +
    • + +
  • + +
    thumbtack
    +
    #hao-icon-thumbtack
    +
    • + +
  • + +
    location-dot
    +
    #hao-icon-location-dot
    +
    • + +
  • + +
    fw-fire
    +
    #hao-icon-fw-fire
    +
    • + +
  • + +
    calendar-days
    +
    #hao-icon-calendar-days
    +
    • + +
  • + +
    angle-right
    +
    #hao-icon-angle-right
    +
    • + +
  • + +
    dice-d20
    +
    #hao-icon-dice-d20
    +
    • + +
  • + +
    instagram
    +
    #hao-icon-instagram
    +
    • + +
  • + +
    xmark
    +
    #hao-icon-xmark
    +
    • + +
  • + +
    spinner
    +
    #hao-icon-spinner
    +
    • + +
  • + +
    bullhorn
    +
    #hao-icon-bullhorn
    +
    • + +
  • + +
    stream
    +
    #hao-icon-stream
    +
    • + +
  • + +
    caret-left
    +
    #hao-icon-caret-left
    +
    • + +
  • + +
    folder-open
    +
    #hao-icon-folder-open
    +
    • + +
  • + +
    thumbs-up
    +
    #hao-icon-thumbs-up
    +
    • + +
  • + +
    angle-double-down
    +
    #hao-icon-angle-double-down
    +
    • + +
  • + +
    sign-out-alt
    +
    #hao-icon-sign-out-alt
    +
    • + +
  • + +
    angle-double-left
    +
    #hao-icon-angle-double-left
    +
    • + +
  • + +
    angle-double-right
    +
    #hao-icon-angle-double-right
    +
    • + +
  • + +
    angle-left
    +
    #hao-icon-angle-left
    +
    • + +
  • + +
    fw-eye
    +
    #hao-icon-fw-eye
    +
    • + +
  • + +
    repeat
    +
    #hao-icon-repeat
    +
    • + +
  • + +
    shuffle
    +
    #hao-icon-shuffle1
    +
    • + +
  • + +
    arrows-rotate
    +
    #hao-icon-arrows-rotate
    +
    • + +
  • + +
    pause
    +
    #hao-icon-pause
    +
    • + +
  • + +
    heartbeat
    +
    #hao-icon-heartbeat
    +
    • + +
  • + +
    jike
    +
    #hao-icon-a-2
    +
    • + +
  • + +
    jike
    +
    #hao-icon-jike
    +
    • + +
  • + +
    heartbeat
    +
    #hao-icon-heartbeat1
    +
    • + +
  • + +
    rss
    +
    #hao-icon-rss
    +
    • + +
  • + +
    qq
    +
    #hao-icon-qq
    +
    • + +
  • + +
    github
    +
    #hao-icon-github
    +
    • + +
  • + +
    bilibili
    +
    #hao-icon-bilibili
    +
    • + +
  • + +
    paper-plane
    +
    #hao-icon-paper-plane1
    +
    • + +
  • + +
    hashtag
    +
    #hao-icon-hashtag
    +
    • + +
  • + +
    hand-heart-fill
    +
    #hao-icon-hand-heart-fill
    +
    • + +
  • + +
    plant-fill
    +
    #hao-icon-plant-fill
    +
    • + +
  • + +
    qrcode
    +
    #hao-icon-qrcode
    +
    • + +
  • + +
    weibo
    +
    #hao-icon-weibo
    +
    • + +
  • + +
    copyright
    +
    #hao-icon-copyright
    +
    • + +
  • + +
    bolt
    +
    #hao-icon-bolt
    +
    • + +
  • + +
    circle-info
    +
    #hao-icon-circle-info
    +
    • + +
  • + +
    triangle-exclamation
    +
    #hao-icon-triangle-exclamation
    +
    • + +
  • + +
    circle-check
    +
    #hao-icon-circle-check
    +
    • + +
  • + +
    circle-minus
    +
    #hao-icon-circle-minus
    +
    • + +
  • + +
    circle-plus
    +
    #hao-icon-circle-plus
    +
    • + +
  • + +
    circle-dot
    +
    #hao-icon-circle-dot
    +
    • + +
  • + +
    scissors
    +
    #hao-icon-scissors
    +
    • + +
  • + +
    arrow-down
    +
    #hao-icon-arrow-down
    +
    • + +
  • + +
    灯泡
    +
    #hao-icon-dengpao
    +
    • + +
  • + +
    弹幕
    +
    #hao-icon-danmu
    +
    • + +
  • + +
    总览
    +
    #hao-icon-zonglan
    +
    • + +
  • + +
    灵感
    +
    #hao-icon-linggan
    +
    • + +
  • + +
    三明治
    +
    #hao-icon-sanmingzhi
    +
    • + +
  • + +
    keyboard
    +
    #hao-icon-keyboard
    +
    • + +
  • + +
    tiktok
    +
    #hao-icon-tiktok
    +
    • + +
+
+

Symbol 引用

+
+ +

这是一种全新的使用方式，应该说这才是未来的主流，也是平台目前推荐的用法。相关介绍可以参考这篇文章 + 这种用法其实是做了一个 SVG 的集合，与另外两种相比具有如下特点：

+
    +
  • 支持多色图标了，不再受单色限制。
    • +
  • 通过一些技巧，支持像字体那样，通过 font-size, color 来调整样式。
    • +
  • 兼容性较差，支持 IE9+，及现代浏览器。
    • +
  • 浏览器渲染 SVG 的性能一般，还不如 png。
    • +
+

使用步骤如下：

+

第一步：引入项目下面生成的 symbol 代码：

+
<script src="./iconfont.js"></script>
+
+

第二步：加入通用 CSS 代码（引入一次就行）：

+
<style>
+.icon {
+  width: 1em;
+  height: 1em;
+  vertical-align: -0.15em;
+  fill: currentColor;
+  overflow: hidden;
+}
+</style>
+
+

第三步：挑选相应图标并获取类名，应用于页面：

+
<svg class="icon" aria-hidden="true">
+  <use xlink:href="#icon-xxx"></use>
+</svg>
+
+
+
+ +
+
+ + + diff --git a/templates/assets/icon/iconfont.css b/templates/assets/icon/iconfont.css new file mode 100644 index 00000000..734397d6 --- /dev/null +++ b/templates/assets/icon/iconfont.css @@ -0,0 +1,674 @@ +@font-face { + font-family: "haofont"; /* Project id 4159149 */ + src: url('iconfont.eot?t=1697559754295'); /* IE9 */ + src: url('iconfont.eot?t=1697559754295#iefix') format('embedded-opentype'), /* IE6-IE8 */ + url('iconfont.woff2?t=1697559754295') format('woff2'), + url('iconfont.woff?t=1697559754295') format('woff'), + url('iconfont.ttf?t=1697559754295') format('truetype'), + url('iconfont.svg?t=1697559754295#haofont') format('svg'); +} + +.haofont { + font-family: "haofont" !important; + font-size: 16px; + font-style: normal; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +.hao-icon-aifadian-line:before { + content: "\e695"; +} + +.hao-icon-zhanghao1:before { + content: "\e696"; +} + +.hao-icon-zuozhe:before { + content: "\e694"; +} + +.hao-icon-weixin1:before { + content: "\e693"; +} + +.hao-icon-bianji:before { + content: "\e691"; +} + +.hao-icon-check-circle:before { + content: "\e77d"; +} + +.hao-icon-dashboard:before { + content: "\e6f7"; +} + +.hao-icon-bullseye:before { + content: "\eaff"; +} + +.hao-icon-logo-moment:before { + content: "\e690"; +} + +.hao-icon-leetcode:before { + content: "\ebf2"; +} + +.hao-icon-gitlab:before { + content: "\e692"; +} + +.hao-icon-csdn:before { + content: "\e68a"; +} + +.hao-icon-dribbble:before { + content: "\e87f"; +} + +.hao-icon-yuque:before { + content: "\e880"; +} + +.hao-icon-linkedin:before { + content: "\e73b"; +} + +.hao-icon-youtube:before { + content: "\e765"; +} + +.hao-icon-Instagram:before { + content: "\e68b"; +} + +.hao-icon-slack:before { + content: "\eca1"; +} + +.hao-icon-baidu:before { + content: "\e68c"; +} + +.hao-icon-discord-line:before { + content: "\e7af"; +} + +.hao-icon-cnblogs:before { + content: "\e68d"; +} + +.hao-icon-juejin:before { + content: "\e68e"; +} + +.hao-icon-steam:before { + content: "\ec22"; +} + +.hao-icon-telegram:before { + content: "\ec25"; +} + +.hao-icon-toutiao:before { + content: "\e68f"; +} + +.hao-icon-weixin:before { + content: "\e686"; +} + +.hao-icon-douban:before { + content: "\e687"; +} + +.hao-icon-29:before { + content: "\e688"; +} + +.hao-icon-weixingongzhonghao:before { + content: "\e689"; +} + +.hao-icon-cainixihuan:before { + content: "\e684"; +} + +.hao-icon-eicon_map-2-line1:before { + content: "\e685"; +} + +.hao-icon-yuan:before { + content: "\e833"; +} + +.hao-icon-creative-commons-nd-line:before { + content: "\e67a"; +} + +.hao-icon-creative-commons-by-line:before { + content: "\e67b"; +} + +.hao-icon-creative-commons-nc-line:before { + content: "\e67c"; +} + +.hao-icon-copyright-line:before { + content: "\e67d"; +} + +.hao-icon-font:before { + content: "\e67e"; +} + +.hao-icon-stopwatch:before { + content: "\e67f"; +} + +.hao-icon-file-lines:before { + content: "\e680"; +} + +.hao-icon-square-poll-vertical:before { + content: "\e681"; +} + +.hao-icon-universal-access:before { + content: "\e682"; +} + +.hao-icon-hourglass-start:before { + content: "\e683"; +} + +.hao-icon-tongxunlu07:before { + content: "\e679"; +} + +.hao-icon-arrow-right:before { + content: "\e600"; +} + +.hao-icon-arrow-left:before { + content: "\e601"; +} + +.hao-icon-dice:before { + content: "\e602"; +} + +.hao-icon-copy:before { + content: "\e603"; +} + +.hao-icon-cube:before { + content: "\e604"; +} + +.hao-icon-circle-arrow-right:before { + content: "\e605"; +} + +.hao-icon-clock:before { + content: "\e606"; +} + +.hao-icon-book:before { + content: "\e607"; +} + +.hao-icon-calendar-alt:before { + content: "\e608"; +} + +.hao-icon-eye-outline:before { + content: "\e609"; +} + +.hao-icon-circle-half-stroke:before { + content: "\e60a"; +} + +.hao-icon-arrow-up:before { + content: "\e60b"; +} + +.hao-icon-file-word:before { + content: "\e60c"; +} + +.hao-icon-fire:before { + content: "\e60d"; +} + +.hao-icon-dove:before { + content: "\e60e"; +} + +.hao-icon-gear:before { + content: "\e60f"; +} + +.hao-icon-inbox:before { + content: "\e610"; +} + +.hao-icon-history:before { + content: "\e611"; +} + +.hao-icon-magnifying-glass:before { + content: "\e612"; +} + +.hao-icon-message:before { + content: "\e613"; +} + +.hao-icon-moon:before { + content: "\e614"; +} + +.hao-icon-shapes:before { + content: "\e615"; +} + +.hao-icon-shuffle:before { + content: "\e616"; +} + +.hao-icon-language:before { + content: "\e617"; +} + +.hao-icon-tags:before { + content: "\e618"; +} + +.hao-icon-train:before { + content: "\e619"; +} + +.hao-icon-warning:before { + content: "\e61a"; +} + +.hao-icon-circle-arrow-up-right-1:before { + content: "\e61b"; +} + +.hao-icon-fish:before { + content: "\e61c"; +} + +.hao-icon-envelope:before { + content: "\e61d"; +} + +.hao-icon-music:before { + content: "\e61e"; +} + +.hao-icon-fan:before { + content: "\e61f"; +} + +.hao-icon-heartbeat-bold:before { + content: "\e620"; +} + +.hao-icon-link:before { + content: "\e621"; +} + +.hao-icon-chevron-left:before { + content: "\e622"; +} + +.hao-icon-rocket:before { + content: "\e623"; +} + +.hao-icon-lightbulb:before { + content: "\e624"; +} + +.hao-icon-shoe-prints:before { + content: "\e625"; +} + +.hao-icon-images:before { + content: "\e626"; +} + +.hao-icon-box-archive:before { + content: "\e627"; +} + +.hao-icon-artstation:before { + content: "\e628"; +} + +.hao-icon-paper-plane:before { + content: "\e629"; +} + +.hao-icon-house-chimney:before { + content: "\e62a"; +} + +.hao-icon-grip-vertical:before { + content: "\e62b"; +} + +.hao-icon-bars:before { + content: "\e62c"; +} + +.hao-icon-arrows-left-right:before { + content: "\e62d"; +} + +.hao-icon-book-open:before { + content: "\e62e"; +} + +.hao-icon-list-ul:before { + content: "\e62f"; +} + +.hao-icon-comments:before { + content: "\e630"; +} + +.hao-icon-comment-sms:before { + content: "\e631"; +} + +.hao-icon-angles-right:before { + content: "\e632"; +} + +.hao-icon-tag:before { + content: "\e633"; +} + +.hao-icon-chevron-right:before { + content: "\e634"; +} + +.hao-icon-radio:before { + content: "\e635"; +} + +.hao-icon-forward:before { + content: "\e636"; +} + +.hao-icon-window-restore:before { + content: "\e637"; +} + +.hao-icon-backward:before { + content: "\e638"; +} + +.hao-icon-download:before { + content: "\e639"; +} + +.hao-icon-comment-medical:before { + content: "\e63a"; +} + +.hao-icon-paste:before { + content: "\e63b"; +} + +.hao-icon-arrow-rotate-right:before { + content: "\e63c"; +} + +.hao-icon-play:before { + content: "\e63d"; +} + +.hao-icon-circle-xmark:before { + content: "\e63e"; +} + +.hao-icon-angle-down:before { + content: "\e63f"; +} + +.hao-icon-chart-line:before { + content: "\e640"; +} + +.hao-icon-pencil:before { + content: "\e641"; +} + +.hao-icon-thumbtack:before { + content: "\e642"; +} + +.hao-icon-location-dot:before { + content: "\e643"; +} + +.hao-icon-fw-fire:before { + content: "\e644"; +} + +.hao-icon-calendar-days:before { + content: "\e645"; +} + +.hao-icon-angle-right:before { + content: "\e646"; +} + +.hao-icon-dice-d20:before { + content: "\e647"; +} + +.hao-icon-instagram:before { + content: "\e648"; +} + +.hao-icon-xmark:before { + content: "\e649"; +} + +.hao-icon-spinner:before { + content: "\e64a"; +} + +.hao-icon-bullhorn:before { + content: "\e64b"; +} + +.hao-icon-stream:before { + content: "\e64c"; +} + +.hao-icon-caret-left:before { + content: "\e64d"; +} + +.hao-icon-folder-open:before { + content: "\e64e"; +} + +.hao-icon-thumbs-up:before { + content: "\e64f"; +} + +.hao-icon-angle-double-down:before { + content: "\e650"; +} + +.hao-icon-sign-out-alt:before { + content: "\e651"; +} + +.hao-icon-angle-double-left:before { + content: "\e652"; +} + +.hao-icon-angle-double-right:before { + content: "\e653"; +} + +.hao-icon-angle-left:before { + content: "\e654"; +} + +.hao-icon-fw-eye:before { + content: "\e655"; +} + +.hao-icon-repeat:before { + content: "\e656"; +} + +.hao-icon-shuffle1:before { + content: "\e657"; +} + +.hao-icon-arrows-rotate:before { + content: "\e658"; +} + +.hao-icon-pause:before { + content: "\e659"; +} + +.hao-icon-heartbeat:before { + content: "\e65a"; +} + +.hao-icon-a-2:before { + content: "\e65b"; +} + +.hao-icon-jike:before { + content: "\e65c"; +} + +.hao-icon-heartbeat1:before { + content: "\e65d"; +} + +.hao-icon-rss:before { + content: "\e65e"; +} + +.hao-icon-qq:before { + content: "\e65f"; +} + +.hao-icon-github:before { + content: "\e660"; +} + +.hao-icon-bilibili:before { + content: "\e661"; +} + +.hao-icon-paper-plane1:before { + content: "\e662"; +} + +.hao-icon-hashtag:before { + content: "\e663"; +} + +.hao-icon-hand-heart-fill:before { + content: "\e664"; +} + +.hao-icon-plant-fill:before { + content: "\e665"; +} + +.hao-icon-qrcode:before { + content: "\e666"; +} + +.hao-icon-weibo:before { + content: "\e667"; +} + +.hao-icon-copyright:before { + content: "\e668"; +} + +.hao-icon-bolt:before { + content: "\e669"; +} + +.hao-icon-circle-info:before { + content: "\e66a"; +} + +.hao-icon-triangle-exclamation:before { + content: "\e66b"; +} + +.hao-icon-circle-check:before { + content: "\e66c"; +} + +.hao-icon-circle-minus:before { + content: "\e66d"; +} + +.hao-icon-circle-plus:before { + content: "\e66e"; +} + +.hao-icon-circle-dot:before { + content: "\e66f"; +} + +.hao-icon-scissors:before { + content: "\e670"; +} + +.hao-icon-arrow-down:before { + content: "\e671"; +} + +.hao-icon-dengpao:before { + content: "\e672"; +} + +.hao-icon-danmu:before { + content: "\e673"; +} + +.hao-icon-zonglan:before { + content: "\e674"; +} + +.hao-icon-linggan:before { + content: "\e675"; +} + +.hao-icon-sanmingzhi:before { + content: "\e676"; +} + +.hao-icon-keyboard:before { + content: "\e677"; +} + +.hao-icon-tiktok:before { + content: "\e678"; +} + diff --git a/templates/assets/icon/iconfont.eot b/templates/assets/icon/iconfont.eot new file mode 100644 index 00000000..df99f543 Binary files /dev/null and b/templates/assets/icon/iconfont.eot differ diff --git a/templates/assets/icon/iconfont.js b/templates/assets/icon/iconfont.js new file mode 100644 index 00000000..f332ce33 --- /dev/null +++ b/templates/assets/icon/iconfont.js @@ -0,0 +1 @@ +window._iconfont_svg_string_4159149='',function(a){var c=(c=document.getElementsByTagName("script"))[c.length-1],l=c.getAttribute("data-injectcss"),c=c.getAttribute("data-disable-injectsvg");if(!c){var h,o,s,i,m,t=function(c,l){l.parentNode.insertBefore(c,l)};if(l&&!a.__iconfont__svg__cssinject__){a.__iconfont__svg__cssinject__=!0;try{document.write("")}catch(c){console&&console.log(c)}}h=function(){var c,l=document.createElement("div");l.innerHTML=a._iconfont_svg_string_4159149,(l=l.getElementsByTagName("svg")[0])&&(l.setAttribute("aria-hidden","true"),l.style.position="absolute",l.style.width=0,l.style.height=0,l.style.overflow="hidden",l=l,(c=document.body).firstChild?t(l,c.firstChild):c.appendChild(l))},document.addEventListener?~["complete","loaded","interactive"].indexOf(document.readyState)?setTimeout(h,0):(o=function(){document.removeEventListener("DOMContentLoaded",o,!1),h()},document.addEventListener("DOMContentLoaded",o,!1)):document.attachEvent&&(s=h,i=a.document,m=!1,v(),i.onreadystatechange=function(){"complete"==i.readyState&&(i.onreadystatechange=null,z())})}function z(){m||(m=!0,s())}function v(){try{i.documentElement.doScroll("left")}catch(c){return void setTimeout(v,50)}z()}}(window); \ No newline at end of file diff --git a/templates/assets/icon/iconfont.json b/templates/assets/icon/iconfont.json new file mode 100644 index 00000000..10b7a4cf --- /dev/null +++ b/templates/assets/icon/iconfont.json @@ -0,0 +1,1157 @@ +{ + "id": "4159149", + "name": "halo-theme-hao", + "font_family": "haofont", + "css_prefix_text": "hao-icon-", + "description": "", + "glyphs": [ + { + "icon_id": "37108822", + "name": "aifadian-line", + "font_class": "aifadian-line", + "unicode": "e695", + "unicode_decimal": 59029 + }, + { + "icon_id": "25554762", + "name": "账号", + "font_class": "zhanghao1", + "unicode": "e696", + "unicode_decimal": 59030 + }, + { + "icon_id": "7551371", + "name": "作者", + "font_class": "zuozhe", + "unicode": "e694", + "unicode_decimal": 59028 + }, + { + "icon_id": "5699518", + "name": "微信", + "font_class": "weixin1", + "unicode": "e693", + "unicode_decimal": 59027 + }, + { + "icon_id": "11717193", + "name": "编辑", + "font_class": "bianji", + "unicode": "e691", + "unicode_decimal": 59025 + }, + { + "icon_id": "4765721", + "name": "check-circle", + "font_class": "check-circle", + "unicode": "e77d", + "unicode_decimal": 59261 + }, + { + "icon_id": "141594", + "name": "dashboard", + "font_class": "dashboard", + "unicode": "e6f7", + "unicode_decimal": 59127 + }, + { + "icon_id": "27363262", + "name": "bullseye", + "font_class": "bullseye", + "unicode": "eaff", + "unicode_decimal": 60159 + }, + { + "icon_id": "15811221", + "name": "logo-moment", + "font_class": "logo-moment", + "unicode": "e690", + "unicode_decimal": 59024 + }, + { + "icon_id": "15378535", + "name": "leetcode", + "font_class": "leetcode", + "unicode": "ebf2", + "unicode_decimal": 60402 + }, + { + "icon_id": "1261753", + "name": "gitlab", + "font_class": "gitlab", + "unicode": "e692", + "unicode_decimal": 59026 + }, + { + "icon_id": "3506983", + "name": "csdn", + "font_class": "csdn", + "unicode": "e68a", + "unicode_decimal": 59018 + }, + { + "icon_id": "4936971", + "name": "dribbble", + "font_class": "dribbble", + "unicode": "e87f", + "unicode_decimal": 59519 + }, + { + "icon_id": "4936975", + "name": "yuque", + "font_class": "yuque", + "unicode": "e880", + "unicode_decimal": 59520 + }, + { + "icon_id": "7239801", + "name": "linkedin", + "font_class": "linkedin", + "unicode": "e73b", + "unicode_decimal": 59195 + }, + { + "icon_id": "7239959", + "name": "youtube", + "font_class": "youtube", + "unicode": "e765", + "unicode_decimal": 59237 + }, + { + "icon_id": "12856616", + "name": "Instagram", + "font_class": "Instagram", + "unicode": "e68b", + "unicode_decimal": 59019 + }, + { + "icon_id": "15378797", + "name": "slack", + "font_class": "slack", + "unicode": "eca1", + "unicode_decimal": 60577 + }, + { + "icon_id": "20312928", + "name": "百度", + "font_class": "baidu", + "unicode": "e68c", + "unicode_decimal": 59020 + }, + { + "icon_id": "23179715", + "name": "discord-line", + "font_class": "discord-line", + "unicode": "e7af", + "unicode_decimal": 59311 + }, + { + "icon_id": "26267545", + "name": "cnblogs", + "font_class": "cnblogs", + "unicode": "e68d", + "unicode_decimal": 59021 + }, + { + "icon_id": "26267597", + "name": "juejin", + "font_class": "juejin", + "unicode": "e68e", + "unicode_decimal": 59022 + }, + { + "icon_id": "27365294", + "name": "steam", + "font_class": "steam", + "unicode": "ec22", + "unicode_decimal": 60450 + }, + { + "icon_id": "27365309", + "name": "telegram", + "font_class": "telegram", + "unicode": "ec25", + "unicode_decimal": 60453 + }, + { + "icon_id": "28283466", + "name": "toutiao", + "font_class": "toutiao", + "unicode": "e68f", + "unicode_decimal": 59023 + }, + { + "icon_id": "736510", + "name": "微信", + "font_class": "weixin", + "unicode": "e686", + "unicode_decimal": 59014 + }, + { + "icon_id": "785018", + "name": "豆瓣", + "font_class": "douban", + "unicode": "e687", + "unicode_decimal": 59015 + }, + { + "icon_id": "17447588", + "name": "知乎", + "font_class": "29", + "unicode": "e688", + "unicode_decimal": 59016 + }, + { + "icon_id": "28650243", + "name": "微信公众号", + "font_class": "weixingongzhonghao", + "unicode": "e689", + "unicode_decimal": 59017 + }, + { + "icon_id": "24915807", + "name": "猜你喜欢", + "font_class": "cainixihuan", + "unicode": "e684", + "unicode_decimal": 59012 + }, + { + "icon_id": "29788405", + "name": "eicon_map-2-line", + "font_class": "eicon_map-2-line1", + "unicode": "e685", + "unicode_decimal": 59013 + }, + { + "icon_id": "12300445", + "name": "circle", + "font_class": "yuan", + "unicode": "e833", + "unicode_decimal": 59443 + }, + { + "icon_id": "36563383", + "name": "creative-commons-nd-line", + "font_class": "creative-commons-nd-line", + "unicode": "e67a", + "unicode_decimal": 59002 + }, + { + "icon_id": "36563384", + "name": "creative-commons-by-line", + "font_class": "creative-commons-by-line", + "unicode": "e67b", + "unicode_decimal": 59003 + }, + { + "icon_id": "36563385", + "name": "creative-commons-nc-line", + "font_class": "creative-commons-nc-line", + "unicode": "e67c", + "unicode_decimal": 59004 + }, + { + "icon_id": "36563386", + "name": "copyright-line", + "font_class": "copyright-line", + "unicode": "e67d", + "unicode_decimal": 59005 + }, + { + "icon_id": "36566343", + "name": "font", + "font_class": "font", + "unicode": "e67e", + "unicode_decimal": 59006 + }, + { + "icon_id": "36566344", + "name": "stopwatch", + "font_class": "stopwatch", + "unicode": "e67f", + "unicode_decimal": 59007 + }, + { + "icon_id": "36566345", + "name": "file-lines", + "font_class": "file-lines", + "unicode": "e680", + "unicode_decimal": 59008 + }, + { + "icon_id": "36566354", + "name": "square-poll-vertical", + "font_class": "square-poll-vertical", + "unicode": "e681", + "unicode_decimal": 59009 + }, + { + "icon_id": "36566355", + "name": "universal-access", + "font_class": "universal-access", + "unicode": "e682", + "unicode_decimal": 59010 + }, + { + "icon_id": "36566356", + "name": "hourglass-start", + "font_class": "hourglass-start", + "unicode": "e683", + "unicode_decimal": 59011 + }, + { + "icon_id": "32467217", + "name": "通讯录07", + "font_class": "tongxunlu07", + "unicode": "e679", + "unicode_decimal": 59001 + }, + { + "icon_id": "34999293", + "name": "arrow-right", + "font_class": "arrow-right", + "unicode": "e600", + "unicode_decimal": 58880 + }, + { + "icon_id": "34999294", + "name": "arrow-left", + "font_class": "arrow-left", + "unicode": "e601", + "unicode_decimal": 58881 + }, + { + "icon_id": "34999295", + "name": "dice", + "font_class": "dice", + "unicode": "e602", + "unicode_decimal": 58882 + }, + { + "icon_id": "34999296", + "name": "copy", + "font_class": "copy", + "unicode": "e603", + "unicode_decimal": 58883 + }, + { + "icon_id": "34999297", + "name": "cube", + "font_class": "cube", + "unicode": "e604", + "unicode_decimal": 58884 + }, + { + "icon_id": "34999298", + "name": "circle-arrow-right", + "font_class": "circle-arrow-right", + "unicode": "e605", + "unicode_decimal": 58885 + }, + { + "icon_id": "34999299", + "name": "clock", + "font_class": "clock", + "unicode": "e606", + "unicode_decimal": 58886 + }, + { + "icon_id": "34999300", + "name": "book", + "font_class": "book", + "unicode": "e607", + "unicode_decimal": 58887 + }, + { + "icon_id": "34999301", + "name": "calendar-alt", + "font_class": "calendar-alt", + "unicode": "e608", + "unicode_decimal": 58888 + }, + { + "icon_id": "34999302", + "name": "eye-outline", + "font_class": "eye-outline", + "unicode": "e609", + "unicode_decimal": 58889 + }, + { + "icon_id": "34999303", + "name": "circle-half-stroke", + "font_class": "circle-half-stroke", + "unicode": "e60a", + "unicode_decimal": 58890 + }, + { + "icon_id": "34999304", + "name": "arrow-up", + "font_class": "arrow-up", + "unicode": "e60b", + "unicode_decimal": 58891 + }, + { + "icon_id": "34999305", + "name": "file-word", + "font_class": "file-word", + "unicode": "e60c", + "unicode_decimal": 58892 + }, + { + "icon_id": "34999306", + "name": "fire", + "font_class": "fire", + "unicode": "e60d", + "unicode_decimal": 58893 + }, + { + "icon_id": "34999307", + "name": "dove", + "font_class": "dove", + "unicode": "e60e", + "unicode_decimal": 58894 + }, + { + "icon_id": "34999308", + "name": "gear", + "font_class": "gear", + "unicode": "e60f", + "unicode_decimal": 58895 + }, + { + "icon_id": "34999309", + "name": "inbox", + "font_class": "inbox", + "unicode": "e610", + "unicode_decimal": 58896 + }, + { + "icon_id": "34999310", + "name": "history", + "font_class": "history", + "unicode": "e611", + "unicode_decimal": 58897 + }, + { + "icon_id": "34999311", + "name": "magnifying-glass", + "font_class": "magnifying-glass", + "unicode": "e612", + "unicode_decimal": 58898 + }, + { + "icon_id": "34999312", + "name": "message", + "font_class": "message", + "unicode": "e613", + "unicode_decimal": 58899 + }, + { + "icon_id": "34999313", + "name": "moon", + "font_class": "moon", + "unicode": "e614", + "unicode_decimal": 58900 + }, + { + "icon_id": "34999314", + "name": "shapes", + "font_class": "shapes", + "unicode": "e615", + "unicode_decimal": 58901 + }, + { + "icon_id": "34999315", + "name": "shuffle", + "font_class": "shuffle", + "unicode": "e616", + "unicode_decimal": 58902 + }, + { + "icon_id": "34999316", + "name": "language", + "font_class": "language", + "unicode": "e617", + "unicode_decimal": 58903 + }, + { + "icon_id": "34999317", + "name": "tags", + "font_class": "tags", + "unicode": "e618", + "unicode_decimal": 58904 + }, + { + "icon_id": "34999318", + "name": "train", + "font_class": "train", + "unicode": "e619", + "unicode_decimal": 58905 + }, + { + "icon_id": "34999319", + "name": "warning", + "font_class": "warning", + "unicode": "e61a", + "unicode_decimal": 58906 + }, + { + "icon_id": "34999440", + "name": "circle-arrow-up-right-1", + "font_class": "circle-arrow-up-right-1", + "unicode": "e61b", + "unicode_decimal": 58907 + }, + { + "icon_id": "35000181", + "name": "fish", + "font_class": "fish", + "unicode": "e61c", + "unicode_decimal": 58908 + }, + { + "icon_id": "35005759", + "name": "envelope", + "font_class": "envelope", + "unicode": "e61d", + "unicode_decimal": 58909 + }, + { + "icon_id": "35005760", + "name": "music", + "font_class": "music", + "unicode": "e61e", + "unicode_decimal": 58910 + }, + { + "icon_id": "35005761", + "name": "fan", + "font_class": "fan", + "unicode": "e61f", + "unicode_decimal": 58911 + }, + { + "icon_id": "35005762", + "name": "heartbeat-bold", + "font_class": "heartbeat-bold", + "unicode": "e620", + "unicode_decimal": 58912 + }, + { + "icon_id": "35005763", + "name": "link", + "font_class": "link", + "unicode": "e621", + "unicode_decimal": 58913 + }, + { + "icon_id": "35005764", + "name": "chevron-left", + "font_class": "chevron-left", + "unicode": "e622", + "unicode_decimal": 58914 + }, + { + "icon_id": "35005765", + "name": "rocket", + "font_class": "rocket", + "unicode": "e623", + "unicode_decimal": 58915 + }, + { + "icon_id": "35005766", + "name": "lightbulb", + "font_class": "lightbulb", + "unicode": "e624", + "unicode_decimal": 58916 + }, + { + "icon_id": "35005767", + "name": "shoe-prints", + "font_class": "shoe-prints", + "unicode": "e625", + "unicode_decimal": 58917 + }, + { + "icon_id": "35005768", + "name": "images", + "font_class": "images", + "unicode": "e626", + "unicode_decimal": 58918 + }, + { + "icon_id": "35005769", + "name": "box-archive", + "font_class": "box-archive", + "unicode": "e627", + "unicode_decimal": 58919 + }, + { + "icon_id": "35005770", + "name": "artstation", + "font_class": "artstation", + "unicode": "e628", + "unicode_decimal": 58920 + }, + { + "icon_id": "35006038", + "name": "paper-plane", + "font_class": "paper-plane", + "unicode": "e629", + "unicode_decimal": 58921 + }, + { + "icon_id": "35006420", + "name": "house-chimney", + "font_class": "house-chimney", + "unicode": "e62a", + "unicode_decimal": 58922 + }, + { + "icon_id": "35006421", + "name": "grip-vertical", + "font_class": "grip-vertical", + "unicode": "e62b", + "unicode_decimal": 58923 + }, + { + "icon_id": "35006529", + "name": "bars", + "font_class": "bars", + "unicode": "e62c", + "unicode_decimal": 58924 + }, + { + "icon_id": "35006720", + "name": "arrows-left-right", + "font_class": "arrows-left-right", + "unicode": "e62d", + "unicode_decimal": 58925 + }, + { + "icon_id": "35006745", + "name": "book-open", + "font_class": "book-open", + "unicode": "e62e", + "unicode_decimal": 58926 + }, + { + "icon_id": "35006771", + "name": "list-ul", + "font_class": "list-ul", + "unicode": "e62f", + "unicode_decimal": 58927 + }, + { + "icon_id": "35006776", + "name": "comments", + "font_class": "comments", + "unicode": "e630", + "unicode_decimal": 58928 + }, + { + "icon_id": "35006786", + "name": "comment-sms", + "font_class": "comment-sms", + "unicode": "e631", + "unicode_decimal": 58929 + }, + { + "icon_id": "35006799", + "name": "angles-right", + "font_class": "angles-right", + "unicode": "e632", + "unicode_decimal": 58930 + }, + { + "icon_id": "35006808", + "name": "tag", + "font_class": "tag", + "unicode": "e633", + "unicode_decimal": 58931 + }, + { + "icon_id": "35007390", + "name": "chevron-right", + "font_class": "chevron-right", + "unicode": "e634", + "unicode_decimal": 58932 + }, + { + "icon_id": "35007411", + "name": "radio", + "font_class": "radio", + "unicode": "e635", + "unicode_decimal": 58933 + }, + { + "icon_id": "35007429", + "name": "forward", + "font_class": "forward", + "unicode": "e636", + "unicode_decimal": 58934 + }, + { + "icon_id": "35007439", + "name": "window-restore", + "font_class": "window-restore", + "unicode": "e637", + "unicode_decimal": 58935 + }, + { + "icon_id": "35007440", + "name": "backward", + "font_class": "backward", + "unicode": "e638", + "unicode_decimal": 58936 + }, + { + "icon_id": "35007441", + "name": "download", + "font_class": "download", + "unicode": "e639", + "unicode_decimal": 58937 + }, + { + "icon_id": "35007442", + "name": "comment-medical", + "font_class": "comment-medical", + "unicode": "e63a", + "unicode_decimal": 58938 + }, + { + "icon_id": "35007443", + "name": "paste", + "font_class": "paste", + "unicode": "e63b", + "unicode_decimal": 58939 + }, + { + "icon_id": "35007453", + "name": "arrow-rotate-right", + "font_class": "arrow-rotate-right", + "unicode": "e63c", + "unicode_decimal": 58940 + }, + { + "icon_id": "35007688", + "name": "play", + "font_class": "play", + "unicode": "e63d", + "unicode_decimal": 58941 + }, + { + "icon_id": "35007727", + "name": "circle-xmark", + "font_class": "circle-xmark", + "unicode": "e63e", + "unicode_decimal": 58942 + }, + { + "icon_id": "35007730", + "name": "angle-down", + "font_class": "angle-down", + "unicode": "e63f", + "unicode_decimal": 58943 + }, + { + "icon_id": "35007961", + "name": "chart-line", + "font_class": "chart-line", + "unicode": "e640", + "unicode_decimal": 58944 + }, + { + "icon_id": "35007979", + "name": "pencil", + "font_class": "pencil", + "unicode": "e641", + "unicode_decimal": 58945 + }, + { + "icon_id": "35007981", + "name": "thumbtack", + "font_class": "thumbtack", + "unicode": "e642", + "unicode_decimal": 58946 + }, + { + "icon_id": "35008008", + "name": "location-dot", + "font_class": "location-dot", + "unicode": "e643", + "unicode_decimal": 58947 + }, + { + "icon_id": "35008010", + "name": "fw-fire", + "font_class": "fw-fire", + "unicode": "e644", + "unicode_decimal": 58948 + }, + { + "icon_id": "35011718", + "name": "calendar-days", + "font_class": "calendar-days", + "unicode": "e645", + "unicode_decimal": 58949 + }, + { + "icon_id": "35011769", + "name": "angle-right", + "font_class": "angle-right", + "unicode": "e646", + "unicode_decimal": 58950 + }, + { + "icon_id": "35011951", + "name": "dice-d20", + "font_class": "dice-d20", + "unicode": "e647", + "unicode_decimal": 58951 + }, + { + "icon_id": "35012020", + "name": "instagram", + "font_class": "instagram", + "unicode": "e648", + "unicode_decimal": 58952 + }, + { + "icon_id": "35012394", + "name": "xmark", + "font_class": "xmark", + "unicode": "e649", + "unicode_decimal": 58953 + }, + { + "icon_id": "35012584", + "name": "spinner", + "font_class": "spinner", + "unicode": "e64a", + "unicode_decimal": 58954 + }, + { + "icon_id": "35013409", + "name": "bullhorn", + "font_class": "bullhorn", + "unicode": "e64b", + "unicode_decimal": 58955 + }, + { + "icon_id": "35013645", + "name": "stream", + "font_class": "stream", + "unicode": "e64c", + "unicode_decimal": 58956 + }, + { + "icon_id": "35013722", + "name": "caret-left", + "font_class": "caret-left", + "unicode": "e64d", + "unicode_decimal": 58957 + }, + { + "icon_id": "35013735", + "name": "folder-open", + "font_class": "folder-open", + "unicode": "e64e", + "unicode_decimal": 58958 + }, + { + "icon_id": "35013743", + "name": "thumbs-up", + "font_class": "thumbs-up", + "unicode": "e64f", + "unicode_decimal": 58959 + }, + { + "icon_id": "35013890", + "name": "angle-double-down", + "font_class": "angle-double-down", + "unicode": "e650", + "unicode_decimal": 58960 + }, + { + "icon_id": "35014014", + "name": "sign-out-alt", + "font_class": "sign-out-alt", + "unicode": "e651", + "unicode_decimal": 58961 + }, + { + "icon_id": "35014035", + "name": "angle-double-left", + "font_class": "angle-double-left", + "unicode": "e652", + "unicode_decimal": 58962 + }, + { + "icon_id": "35014057", + "name": "angle-double-right", + "font_class": "angle-double-right", + "unicode": "e653", + "unicode_decimal": 58963 + }, + { + "icon_id": "35014071", + "name": "angle-left", + "font_class": "angle-left", + "unicode": "e654", + "unicode_decimal": 58964 + }, + { + "icon_id": "35014207", + "name": "fw-eye", + "font_class": "fw-eye", + "unicode": "e655", + "unicode_decimal": 58965 + }, + { + "icon_id": "35014454", + "name": "repeat", + "font_class": "repeat", + "unicode": "e656", + "unicode_decimal": 58966 + }, + { + "icon_id": "35014456", + "name": "shuffle", + "font_class": "shuffle1", + "unicode": "e657", + "unicode_decimal": 58967 + }, + { + "icon_id": "35014457", + "name": "arrows-rotate", + "font_class": "arrows-rotate", + "unicode": "e658", + "unicode_decimal": 58968 + }, + { + "icon_id": "35014462", + "name": "pause", + "font_class": "pause", + "unicode": "e659", + "unicode_decimal": 58969 + }, + { + "icon_id": "35014584", + "name": "heartbeat", + "font_class": "heartbeat", + "unicode": "e65a", + "unicode_decimal": 58970 + }, + { + "icon_id": "35014836", + "name": "jike", + "font_class": "a-2", + "unicode": "e65b", + "unicode_decimal": 58971 + }, + { + "icon_id": "35015039", + "name": "jike", + "font_class": "jike", + "unicode": "e65c", + "unicode_decimal": 58972 + }, + { + "icon_id": "35015857", + "name": "heartbeat", + "font_class": "heartbeat1", + "unicode": "e65d", + "unicode_decimal": 58973 + }, + { + "icon_id": "35017946", + "name": "rss", + "font_class": "rss", + "unicode": "e65e", + "unicode_decimal": 58974 + }, + { + "icon_id": "35017947", + "name": "qq", + "font_class": "qq", + "unicode": "e65f", + "unicode_decimal": 58975 + }, + { + "icon_id": "35017948", + "name": "github", + "font_class": "github", + "unicode": "e660", + "unicode_decimal": 58976 + }, + { + "icon_id": "35017949", + "name": "bilibili", + "font_class": "bilibili", + "unicode": "e661", + "unicode_decimal": 58977 + }, + { + "icon_id": "35018014", + "name": "paper-plane", + "font_class": "paper-plane1", + "unicode": "e662", + "unicode_decimal": 58978 + }, + { + "icon_id": "35037164", + "name": "hashtag", + "font_class": "hashtag", + "unicode": "e663", + "unicode_decimal": 58979 + }, + { + "icon_id": "35045021", + "name": "hand-heart-fill", + "font_class": "hand-heart-fill", + "unicode": "e664", + "unicode_decimal": 58980 + }, + { + "icon_id": "35045029", + "name": "plant-fill", + "font_class": "plant-fill", + "unicode": "e665", + "unicode_decimal": 58981 + }, + { + "icon_id": "35045310", + "name": "qrcode", + "font_class": "qrcode", + "unicode": "e666", + "unicode_decimal": 58982 + }, + { + "icon_id": "35045337", + "name": "weibo", + "font_class": "weibo", + "unicode": "e667", + "unicode_decimal": 58983 + }, + { + "icon_id": "35048154", + "name": "copyright", + "font_class": "copyright", + "unicode": "e668", + "unicode_decimal": 58984 + }, + { + "icon_id": "35062060", + "name": "bolt", + "font_class": "bolt", + "unicode": "e669", + "unicode_decimal": 58985 + }, + { + "icon_id": "35062061", + "name": "circle-info", + "font_class": "circle-info", + "unicode": "e66a", + "unicode_decimal": 58986 + }, + { + "icon_id": "35062062", + "name": "triangle-exclamation", + "font_class": "triangle-exclamation", + "unicode": "e66b", + "unicode_decimal": 58987 + }, + { + "icon_id": "35062174", + "name": "circle-check", + "font_class": "circle-check", + "unicode": "e66c", + "unicode_decimal": 58988 + }, + { + "icon_id": "35062175", + "name": "circle-minus", + "font_class": "circle-minus", + "unicode": "e66d", + "unicode_decimal": 58989 + }, + { + "icon_id": "35062176", + "name": "circle-plus", + "font_class": "circle-plus", + "unicode": "e66e", + "unicode_decimal": 58990 + }, + { + "icon_id": "35062177", + "name": "circle-dot", + "font_class": "circle-dot", + "unicode": "e66f", + "unicode_decimal": 58991 + }, + { + "icon_id": "35079571", + "name": "scissors", + "font_class": "scissors", + "unicode": "e670", + "unicode_decimal": 58992 + }, + { + "icon_id": "35091245", + "name": "arrow-down", + "font_class": "arrow-down", + "unicode": "e671", + "unicode_decimal": 58993 + }, + { + "icon_id": "35219684", + "name": "灯泡", + "font_class": "dengpao", + "unicode": "e672", + "unicode_decimal": 58994 + }, + { + "icon_id": "35219685", + "name": "弹幕", + "font_class": "danmu", + "unicode": "e673", + "unicode_decimal": 58995 + }, + { + "icon_id": "35219686", + "name": "总览", + "font_class": "zonglan", + "unicode": "e674", + "unicode_decimal": 58996 + }, + { + "icon_id": "35219687", + "name": "灵感", + "font_class": "linggan", + "unicode": "e675", + "unicode_decimal": 58997 + }, + { + "icon_id": "35219688", + "name": "三明治", + "font_class": "sanmingzhi", + "unicode": "e676", + "unicode_decimal": 58998 + }, + { + "icon_id": "35384532", + "name": "keyboard", + "font_class": "keyboard", + "unicode": "e677", + "unicode_decimal": 58999 + }, + { + "icon_id": "35406224", + "name": "tiktok", + "font_class": "tiktok", + "unicode": "e678", + "unicode_decimal": 59000 + } + ] +} diff --git a/templates/assets/icon/iconfont.svg b/templates/assets/icon/iconfont.svg new file mode 100644 index 00000000..82c4189d --- /dev/null +++ b/templates/assets/icon/iconfont.svg @@ -0,0 +1,347 @@ + + + + Created by iconfont + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/templates/assets/icon/iconfont.ttf b/templates/assets/icon/iconfont.ttf new file mode 100644 index 00000000..e9531fba Binary files /dev/null and b/templates/assets/icon/iconfont.ttf differ diff --git a/templates/assets/icon/iconfont.woff b/templates/assets/icon/iconfont.woff new file mode 100644 index 00000000..cce29218 Binary files /dev/null and b/templates/assets/icon/iconfont.woff differ diff --git a/templates/assets/icon/iconfont.woff2 b/templates/assets/icon/iconfont.woff2 new file mode 100644 index 00000000..248f6d22 Binary files /dev/null and b/templates/assets/icon/iconfont.woff2 differ diff --git a/templates/assets/js/comment/artalk.js b/templates/assets/js/comment/artalk.js index b1306148..88eaf6cb 100644 --- a/templates/assets/js/comment/artalk.js +++ b/templates/assets/js/comment/artalk.js @@ -6,7 +6,7 @@ el: '#artalk-wrap', server: GLOBAL_CONFIG.source.artalk.artalkUrl, site: GLOBAL_CONFIG.source.artalk.siteName, - pageKey: location.pathname, + pageKey: location.pathname.replace(/\/page\/\d$/, ""), darkMode: false, countEl: '#ArtalkCount' }, null)) diff --git a/templates/assets/js/comment/twikoo.js b/templates/assets/js/comment/twikoo.js index 9ee2a9ff..21d958b7 100644 --- a/templates/assets/js/comment/twikoo.js +++ b/templates/assets/js/comment/twikoo.js @@ -5,6 +5,7 @@ el: '#twikoo-wrap', envId: GLOBAL_CONFIG.source.twikoo.twikooUrl, region: '', + path: location.pathname.replace(/\/page\/\d$/, ""), onCommentLoaded: function () { btf.loadLightbox(document.querySelectorAll('#twikoo .tk-content img:not(.tk-owo-emotion)')) typeof hljs === 'object' && hljs.highlightAll() diff --git a/templates/assets/js/comment/waline.js b/templates/assets/js/comment/waline.js index c7a9717e..94cc7b40 100644 --- a/templates/assets/js/comment/waline.js +++ b/templates/assets/js/comment/waline.js @@ -6,7 +6,7 @@ serverURL: GLOBAL_CONFIG.source.waline.serverURL, pageview: false, dark: 'html[data-theme="dark"]', - path: window.location.pathname, + path: window.location.pathname.replace(/\/page\/\d$/, ""), comment: false, locale:GLOBAL_CONFIG.source.waline.locale }, null)) diff --git a/templates/assets/js/custom.js b/templates/assets/js/custom.js index b25d40bb..1a33028b 100644 --- a/templates/assets/js/custom.js +++ b/templates/assets/js/custom.js @@ -1,13 +1,331 @@ + + /* 获取直属子元素 */ function getChildren(el, className) { for (let item of el.children) if (item.className === className) return item; return null; } +function parseExpression(expression, occupied) { + if (expression === "${full}") { + return occupied; + } + const match = expression.replaceAll("full", occupied).match(/^\$\{([<>=]{1,2}.+)\?(.+):(.+)}$/); + if (match) { + return eval(`occupied${match[1]} ? ${match[2]} : ${match[3]}`); + } + throw new Error(`Invalid expression "${expression}"`); +} + +function extractHeight(occupied, width, height) { + const occupiedWidth = width.endsWith("%") + ? occupied * (Number(width.slice(0, -1)) / 100) + : Number(width); + height = height.replaceAll("cwidth", occupiedWidth); + if (height.startsWith("${") && height.endsWith("}")) { + return parseExpression(height, occupied); + } else { + return height; + } +} + // 跳转链接的卡片 document.addEventListener("DOMContentLoaded", () => { + // 分栏 tab + customElements.define( + "hao-tabs", + class HaoTabs extends HTMLElement { + constructor() { + super(); + this.options = { + id: this.getAttribute("id") || '', + index: this.getAttribute("index") || '' + }; + const id = this.options.id + const index = this.options.index + const _temp = getChildren(this, "_tpl"); + let _innerHTML = _temp.innerHTML.trim().replace(/^(
)|(
)$/g, ""); + let navs = ""; + let contents = ""; + let newIndex = 0; + + _innerHTML.replace( + /{tabs-item([^}]*)}([\s\S]*?){\/tabs-item}/g, + function ($0, $1, $2) { + newIndex +=1; + let active ='' + if(index!='' && index!=null){ + if(newIndex == index){ + active = 'active'; + } + }else{ + if(newIndex==1){ + active = 'active' + } + } + navs += ` +
    • + `; + contents += ` +
    + ${$2.trim().replace(/^(
    )|(
    )$/g, "")} + +
    + `; + } + ); + let htmlStr = ` +
    + +
    ${contents}
    +
    + + `; + this.innerHTML = htmlStr; + } + } + ); + + // github仓库 + customElements.define( + "hao-github", + class GithubDom extends HTMLElement { + constructor() { + super(); + this.owner = this.getAttribute("owner") || ""; + this.repo = this.getAttribute("repo") || ""; + if (this.owner.length === 0 || this.repo.length === 0) { + return; + } + this.innerHTML = ` +
    ` + this.fetchDataAndRender(); + } + async fetchDataAndRender() { + try { + const res = await this.fetchRepoInfo(); + const commits = await this.fetchRepoCommits(); + this.render(res, commits); + } catch (error) { + console.error("Error:", error); + } + } + async fetchRepoInfo() { + const response = await fetch(`/apis/api.plugin.halo.run/v1alpha1/plugins/HaoTag/github/repository?owner=${this.owner}&repo=${this.repo}`); + const data = await response.json(); + return data.data.repository; + } + async fetchRepoCommits() { + const response = await fetch(`https://api.github.com/repos/${this.owner}/${this.repo}/stats/participation`); + const commits = await response.json(); + return commits.all; + } + render(res, commits) { + let updatedAtDate = new Date(res.updatedAt); + let currentYear = new Date().getFullYear(); + let dateFormatOptions = { month: 'long', day: 'numeric' }; + if (updatedAtDate.getFullYear() !== currentYear) { + dateFormatOptions.year = 'numeric'; + } + let updatedAt = updatedAtDate.toLocaleDateString("en-US", dateFormatOptions); + let points = commits.map((value, index) => `${index*3},${value+1}`).join(' '); + let polyline = this.generatePolyline(points); + this.innerHTML = this.generateHTMLTemplate(res, polyline, updatedAt); + } + generatePolyline(points) { + return ``; + } + generateHTMLTemplate(res, polyline, updatedAt) { + return `
    +
    +
    + + ${res.name} + + + Public + +

    + ${res.description || ""} +

    +
    +
    + + + + + + + + + + + ${polyline} + + + + + + + +
    +
    +
    + + + ${res.primaryLanguage.name || "Unknown"} + + + + ${res.stargazerCount || 0} + + + + ${res.licenseInfo.nickname || "NO LICENCE"} + + + + + + ${res.forks.totalCount || 0} + + + + ${res.issues.totalCount || 0} + + + + ${res.pullRequests.totalCount || 0} + + + Updated on ${updatedAt || "Unknown"} + +
    +
    + ` + } + } + ); + + + // 彩虹虚线 + customElements.define( + "hao-dotted", + class DottedDom extends HTMLElement { + constructor() { + super(); + this.startColor = this.getAttribute("begin") || "#ff6c6c"; + this.endColor = this.getAttribute("end") || "#1989fa"; + this.innerHTML = ` + + `; + } + } + ); + + // 进度条 + customElements.define( + "hao-progress", + class ProgressDom extends HTMLElement { + constructor() { + super(); + this.options = { + percentage: /^\d{1,3}%$/.test(this.getAttribute("pct")) + ? this.getAttribute("pct") + : "50%", + color: this.getAttribute("color") || "#ff6c6c", + }; + this.innerHTML = ` + +
    +
    +
    +
    ${this.options.percentage}
    +     + `; + } + } + ); + + // 小标记 + customElements.define( + "hao-sign", + class SignDom extends HTMLElement { + constructor() { + super(); + this.options = { + type: this.getAttribute("type"), // 小标签类型 + content: this.innerHTML, // 内容 + }; + this.render(); + } + render() { + this.innerHTML = `${this.options.content}`; + } + } + ); + + + // B站视频 + customElements.define( + "hao-bilibili", + class BiliBiliDom extends HTMLElement { + constructor() { + super(); + this.options = { + bvid: this.getAttribute("bvid"), + page: +(this.getAttribute("page") || "1"), + width: this.getAttribute("width") || "100%", + height: this.getAttribute("height") || "500", + autoplay: this.getAttribute("autoplay") || 0, + }; + this.render(); + } + render() { + if (!this.options.bvid) return (this.innerHTML = "请填写正确的bvid"); + const realHeight = extractHeight(this.parentElement.offsetWidth, this.options.width, this.options.height); + this.setAttribute("height", realHeight); + this.innerHTML = ` + `; + } + } + ); + + // pdf + customElements.define( + "hao-pdf", + class PDFDom extends HTMLElement { + constructor() { + super(); + this.options = { + src: this.getAttribute("src") || "", + width: this.getAttribute("width") || "100%", + height: this.getAttribute("height") || "500", + }; + this.render(); + } + render() { + if (!this.options.src) return (this.innerHTML = "请填写正确的pdf链接"); + const realHeight = extractHeight(this.parentElement.offsetWidth, this.options.width, this.options.height); + this.setAttribute("height", realHeight); + this.innerHTML = ` +
    + +
    `; + } + } + ); + customElements.define( "hao-introduction-card", class HaoIntroductionCard extends HTMLElement { @@ -333,23 +651,23 @@ document.addEventListener("DOMContentLoaded", () => { // } // } // navs += ` - //
    • - // `; + //
    • + // `; // contents += ` - //
    - // ${$2.trim().replace(/^(
    )|(
    )$/g, "")} - // - //
    - // `; + //
    + // ${$2.trim().replace(/^(
    )|(
    )$/g, "")} + // + //
    + // `; // } // ); // let htmlStr = ` - //
    - // - //
    ${contents}
    - //
    - // - // `; + //
    + // + //
    ${contents}
    + //
    + // + // `; // this.innerHTML = htmlStr; // } // } diff --git a/templates/assets/js/main.js b/templates/assets/js/main.js index 29c6cf3b..581948b5 100644 --- a/templates/assets/js/main.js +++ b/templates/assets/js/main.js @@ -159,7 +159,7 @@ document.addEventListener('DOMContentLoaded', function () { const cardToc = document.getElementById("card-toc"); cardToc?.remove(); const $mobileTocButton = document.getElementById("mobile-toc-button") - if($mobileTocButton){ + if ($mobileTocButton) { $('#mobile-toc-button').attr('style', 'display: none'); } } else { @@ -167,16 +167,29 @@ document.addEventListener('DOMContentLoaded', function () { tocSelector: '.toc-content', contentSelector: '.post-content', headingSelector: 'h1,h2,h3,h4,h5,h6', - collapseDepth: 6, - headingsOffset: 70, + listItemClass: 'toc-item', + activeLinkClass: 'active', + activeListItemClass: 'active', + headingsOffset: -400, scrollSmooth: true, scrollSmoothOffset: -70, - tocScrollOffset: 50 + tocScrollOffset: 50, }); + const $cardTocLayout = document.getElementById('card-toc') + const $cardToc = $cardTocLayout.getElementsByClassName('toc-content')[0] + + // toc元素點擊 + $cardToc.addEventListener('click', (ele) => { + if (window.innerWidth < 900) { + $cardTocLayout.classList.remove("open"); + } + }) + } } + /** * Rightside */ @@ -210,13 +223,19 @@ document.addEventListener('DOMContentLoaded', function () { : saveToLocal.set('aside-status', 'hide', 2) $htmlDom.toggle('hide-aside') }, - runMobileToc: () => { - const $cardToc = document.getElementById("card-toc") - if ($cardToc.classList.contains("open")) { - $cardToc.classList.remove("open"); - } else { - $cardToc.classList.add("open"); - } + runMobileToc: item => { + const tocEle = document.getElementById("card-toc"); + tocEle.style.transformOrigin = `right ${item.getBoundingClientRect().top + 17}px`; + tocEle.style.transition = "transform 0.3s ease-in-out"; + tocEle.classList.toggle("open"); + tocEle.addEventListener( + "transitionend", + () => { + tocEle.style.transition = ""; + tocEle.style.transformOrigin = ""; + }, + { once: true } + ); }, } @@ -230,7 +249,7 @@ document.addEventListener('DOMContentLoaded', function () { rightSideFn.showOrHideBtn() break case "mobile-toc-button": - rightSideFn.runMobileToc(); + rightSideFn.runMobileToc(this); break; case 'readmode': rightSideFn.switchReadMode() diff --git a/templates/assets/libs/aplayer/music.css b/templates/assets/libs/aplayer/music.css index a185247b..c47e96c2 100644 --- a/templates/assets/libs/aplayer/music.css +++ b/templates/assets/libs/aplayer/music.css @@ -60,9 +60,11 @@ body[data-type=music] #page { #page-header.not-top-img #nav .back-home-button, #page-header.not-top-img #nav a { color:#F7F7FA; - } +#page-header.not-top-img #nav .back-home-button:hover{ + color: var(--heo-card-bg); +} body[data-type=music] #footer, body[data-type=music] #nav-music { @@ -588,4 +590,6 @@ body[data-type=music] #nav-music { left: 0; top: 0; } + + } \ No newline at end of file diff --git a/templates/assets/libs/tocbot/4.18.2/tocbot.css b/templates/assets/libs/tocbot/4.18.2/tocbot.css index 054d963d..8bcd2c66 100644 --- a/templates/assets/libs/tocbot/4.18.2/tocbot.css +++ b/templates/assets/libs/tocbot/4.18.2/tocbot.css @@ -1 +1 @@ -.toc{overflow-y:auto}.toc>.toc-list{overflow:hidden;position:relative}.toc>.toc-list li{list-style:none}.js-toc{overflow-y:hidden}.toc-list{margin:0;padding-left:10px}a.toc-link{color:currentColor;height:100%}.is-collapsible{max-height:1000px;overflow:hidden;transition:all 300ms ease-in-out}.is-collapsed{max-height:0}.is-position-fixed{position:fixed !important;top:0}.is-active-link{font-weight:700}.toc-link::before{background-color:#EEE;content:' ';display:inline-block;height:inherit;left:0;margin-top:-1px;position:absolute;width:2px}.is-active-link::before{background-color:#54BC4B} +.toc{overflow-y:auto}.toc>.toc-list{overflow:hidden;position:relative}.toc>.toc-list li{list-style:none}.js-toc{overflow-y:hidden}.toc-list{margin:0;padding-left:10px}a.toc-link{color:currentColor;height:100%}.is-collapsible{max-height:1000px;overflow:hidden;transition:all 300ms ease-in-out}.is-collapsed{max-height:0}.is-position-fixed{position:fixed !important;top:0}.is-active-link{font-weight:700}.toc-link::before{content:' ';display:inline-block;height:inherit;left:0;margin-top:-1px;position:absolute;width:2px}.is-active-link::before{background-color:#54BC4B} diff --git a/templates/assets/zhheo/blogex.js b/templates/assets/zhheo/blogex.js index f97bc485..41989caf 100644 --- a/templates/assets/zhheo/blogex.js +++ b/templates/assets/zhheo/blogex.js @@ -479,7 +479,7 @@ window.onkeydown = function (e) { // document.querySelector('#algolia-search').addEventListener('wheel', (e) => { // e.preventDefault() // }) -document.querySelector('#console').addEventListener('wheel', (e) => { +document.querySelector('#console') && document.querySelector('#console').addEventListener('wheel', (e) => { e.preventDefault() }) // document.querySelector('#loading-box').addEventListener('wheel', (e) => { diff --git a/templates/assets/zhheo/commentBarrage.js b/templates/assets/zhheo/commentBarrage.js index f011d00a..21fb74be 100644 --- a/templates/assets/zhheo/commentBarrage.js +++ b/templates/assets/zhheo/commentBarrage.js @@ -12,7 +12,7 @@ if(GLOBAL_CONFIG.htmlType!='comments' && document.querySelector('#post-comment') //token获取见上方 accessToken: GLOBAL_CONFIG.source.twikoo.accessToken, mailMd5: GLOBAL_CONFIG.source.comments.mailMd5, - pageUrl: window.location.pathname, + pageUrl: window.location.pathname.replace(/\/page\/\d$/, ""), barrageTimer: [], barrageList: [], siteName: GLOBAL_CONFIG.source.artalk.siteName, diff --git a/templates/assets/zhheo/zhheoblog.css b/templates/assets/zhheo/zhheoblog.css index a8f72422..a7ea1e03 100644 --- a/templates/assets/zhheo/zhheoblog.css +++ b/templates/assets/zhheo/zhheoblog.css @@ -1645,12 +1645,13 @@ blockquote footer cite::before { object-fit: cover; } -#recent-posts>.recent-post-item.col1.alternate .left_radius, #recent-posts>.recent-post-item.col1.alternate .right_radius { - width:75%; - display: flex; - height: 220px +@media screen and (min-width: 1300px) { + #recent-posts > .recent-post-item.col1.alternate .left_radius, #recent-posts > .recent-post-item.col1.alternate .right_radius { + width: 75%; + display: flex; + height: 220px + } } - #recent-posts > .recent-post-item .post_cover img.post_bg:hover { transform: scale(1.1); } @@ -2245,8 +2246,9 @@ blockquote footer cite::before { /*}*/ #aside-content #card-toc .toc-content { + position: relative; overflow-y: auto; - max-height: calc(100vh - 120px); + max-height: calc(100vh - 300px); } @media screen and (max-width: 900px) { @@ -2301,10 +2303,10 @@ blockquote footer cite::before { position: absolute; top: 0.6rem; right: 1.2rem; - color: rgb(169, 169, 169); + color: #a9a9a9; content: attr(progress-percentage); font-style: italic; - font-size: 1.2rem; + font-size: 1.2rem } #aside-content :only-child > .card-widget { @@ -2763,9 +2765,13 @@ blockquote footer cite::before { #page-header.nav-fixed #nav #site-name, #page-header.nav-fixed #nav #toggle-menu, #page-header.nav-fixed #nav a { - color: var(--heo-fontcolor); text-shadow: none; } +@media screen and (min-width: 900px) { + #page-header.nav-fixed #nav #site-name:hover { + color: var(--heo-white); + } +} #page-header.nav-visible #nav { transition: all 0.5s ease 0s; @@ -3107,7 +3113,7 @@ ul { #pagination .page-number.current { background: rgb(0, 121, 255); - color: var(--white); + color: var(--heo-card-bg); cursor: default; border-radius: 5px; } @@ -4856,7 +4862,7 @@ html { color: var(--heo-white); } -.nav-fixed #nav a { +.nav-fixed #nav a{ color: var(--heo-fontcolor); transition: 0.3s; } @@ -4943,7 +4949,7 @@ html { transition: 0.3s; display: flex; justify-content: center; - z-index: 1000 !important; + z-index: 999 !important; -webkit-user-select: none; } @@ -6125,6 +6131,7 @@ i.fab { .nav-fixed #nav a:hover { background: var(--heo-main); + color: var(--heo-white); transition: 0.3s; } @@ -6298,22 +6305,13 @@ img.footer_mini_logo { height: 50px; margin: 0 1rem; cursor: pointer; - transition: cubic-bezier(0, 0, 0, 1.29) 0.5s; + transition: cubic-bezier(0,0,0,1.29) .5s; } img.footer_mini_logo:hover { -webkit-backface-visibility: hidden; -webkit-transform-style: preserve-3d; -} - -@media screen and (min-width: 1300px) { - img.footer_mini_logo:hover { - transform: scale(1.03); - } - - img.footer_mini_logo:active { - transform: scale(0.97); - } + transform: scale(1.2) } /* logo居中 */ @@ -6559,6 +6557,10 @@ a.console_switchbutton { transition: 0s; } +.nav-fixed #nav #site-name{ + color: var(--heo-fontcolor); +} + /* 导航栏名称样式 */ #nav #site-name { color: var(--heo-fontcolor); @@ -6581,8 +6583,13 @@ a.console_switchbutton { color: var(--heo-fontcolor) } -.page #nav #site-name:hover { - color: var(--heo-card-bg) +body[data-type=music] .page #nav #site-name span{ + color: var(--heo-white); +} +@media screen and (max-width: 768px) { + .page #nav #site-name span:hover { + color: var(--heo-card-bg); + } } /* 搜索 */ @@ -7905,24 +7912,24 @@ div#banners { @media screen and (min-width: 1300px) { .topGroup { - display: flex; + display:flex; flex-direction: row; flex-wrap: wrap; - justify-content: flex-end; - height: calc(328px + 0.5rem); + justify-content: space-between; + height: calc(328px + .5rem); align-content: space-between; - width: calc(600px + 1.5rem); + width: calc(50% - .25rem); position: relative; animation: slide-in .6s .1s backwards } div#bannerGroup { - width: calc(100% - 600px - 2rem); - margin-right: 0.5rem; - height: calc(328px + 0.5rem); + width: calc(50% - .25rem); + margin-right: .5rem; + height: calc(328px + .5rem); display: flex; flex-direction: column; - justify-content: space-between; + justify-content: space-between } div#banners { @@ -7939,7 +7946,7 @@ div#banners { flex-direction: column; overflow: hidden; transition: 0.3s; - clip-path: inset(0 0 0 0 round 12px); + will-change: transform; animation: slide-in .6s .1s backwards; } @@ -8023,8 +8030,8 @@ div#banners { height: 100%; top: 0; left: 0; - background: var(--heo-theme); - color: var(--heo-white); + background: var(--heo-lighttext); + color: var(--heo-card-bg); padding-left: 0.5rem; display: flex; flex-direction: column; @@ -8047,7 +8054,7 @@ div#banners { #banners:hover #banner-hover { opacity: 1; padding-left: 2rem; - background: #4259efc9; + background: var(--heo-theme-op-deep); backdrop-filter: blur(15px); -webkit-backdrop-filter: blur(15px); -webkit-backface-visibility: hidden; @@ -8064,19 +8071,19 @@ div#banners { .topGroup .todayCard { position: absolute; - width: calc(600px + 1rem); + width: 100%; height: 100%; z-index: 1; top: 0; - left: 0; - background: var(--card-bg); + right: 0; + background: var(--heo-card-bg); border-radius: 12px; - margin-left: 0.5rem; + margin-left: .5rem; overflow: hidden; - transition: 0.3s; + transition: .3s; display: flex; cursor: pointer; - pointer-events: all; + pointer-events: all } .topGroup .todayCard::after { @@ -8148,8 +8155,8 @@ div#banners { } .topGroup .banner-button:hover { - background: var(--heo-theme); - color: var(--heo-white); + background: var(--heo-lighttext); + color: var(--heo-card-bg); } .topGroup .banner-button i { @@ -8361,7 +8368,7 @@ a.categoryButton:hover { /* 首页分类条展示 */ #category-bar { - padding: 0.4rem 1rem 0.4rem 0.5rem; + padding: 0.4rem 1rem 0.4rem 0.7rem; background: var(--heo-card-bg); border-radius: 12px; display: flex; @@ -8372,6 +8379,9 @@ a.categoryButton:hover { transition: 0.3s; width: 100%; justify-content: space-between; + -webkit-user-select: none; + display: flex; + align-items: center } @media screen and (min-width: 1300px) { @@ -9249,14 +9259,19 @@ ins.adsbygoogle { @media screen and (min-width: 1300px) { .recent-post-top .recent-post-item { - margin-right: 0px; - margin-bottom: 0.5rem; + width:calc(100% / 3 - .25rem); + margin-left: 0 } .recent-post-top .recent-post-item:active { transform: scale(0.97); } + .recent-post-top .recent-post-item { + margin-right: 0; + margin-bottom: .5rem + } + .recent-post-top { overflow-x: visible; } @@ -9587,10 +9602,6 @@ span.recent-post-top-text { right: 0; } - #rightside { - display: none - } - /* 背景 */ #web_bg { background: none !important; @@ -9685,16 +9696,17 @@ span.recent-post-top-text { /* 文章目录 */ #aside-content #card-toc .toc-content .toc-link.active { - line-height: 1.2; + line-height: 24px; border-radius: 12px; border-left-color: var(--heo-hovertext); background-color: var(--heo-card-bg); color: var(--heo-lighttext); - font-weight: bold; + font-weight: 700; font-size: 20px; + position: relative; } -[data-theme=dark].toc .toc-item.active .toc-link .toc-text { +[data-theme=dark].toc-list .toc-item.active .toc-link{ color: var(--heo-white); } @@ -9704,27 +9716,31 @@ span.recent-post-top-text { } #aside-content #card-toc .toc-content .toc-link { - line-height: 1.2; + line-height: 24px; padding: 8px; - border-left: 0px solid transparent; + border-left: 0 solid transparent; border-radius: 12px; color: var(--heo-secondtext); cursor: default; + min-height: 40px; + display: flex; + align-items: center; + } -#aside-content #card-toc .toc-content .toc-link:not(.active) span { +#aside-content #card-toc .toc-content a.toc-link:not(.active) { opacity: 0.6; cursor: pointer; filter: blur(1px); transition: 0.3s; } -#aside-content #card-toc:hover .toc-content .toc-link:not(.active) span { +#aside-content #card-toc:hover .toc-content a.toc-link:not(.active) { filter: blur(0px); opacity: 1; } -#aside-content #card-toc .toc-content .toc-link:not(.active) span:hover { +#aside-content #card-toc .toc-content a:hover.toc-link:not(.active) { color: var(--heo-lighttext); } @@ -10165,6 +10181,7 @@ div#author-info__sayhi:hover { #aside-content .item-headline + div, #aside-content .item-headline + ul { padding: 0; + -webkit-user-select: none; } @media screen and (min-width: 1300px) { @@ -11773,7 +11790,7 @@ blockquote p { .post-reward .reward-main .reward-all { border-radius: 12px; - background: var(--heo-background); + background: var(--heo-card-bg); border: var(--style-border-always); padding: 0.8rem; display: flex; @@ -11819,20 +11836,18 @@ a.reward-main-btn:hover { color: var(--heo-red); } - - /* 赞赏背景 */ - #quit-box { position: fixed; width: 100vw; - height: 100vh; - background: rgba(0, 0, 0, .4); + height: calc(100vh); + background: rgba(0,0,0,.2); + opacity: 0.01; top: 0; left: 0; display: none; - z-index: 101; - margin: 0 !important; + z-index: 109; + margin: 0!important } .post-tools-left #quit-box { @@ -11841,6 +11856,7 @@ a.reward-main-btn:hover { @media screen and (max-width: 768px) { #quit-box { + z-index:109; display: none!important; } } @@ -11980,7 +11996,7 @@ a.reward-main-btn:hover { overflow: hidden; cursor: pointer; opacity: 0; - z-index: 1002 + z-index: 999 } @@ -12110,12 +12126,12 @@ a.reward-main-btn:hover { #pagination .pagination .extend { width: 100%; height: 2.5rem; - margin: 0.2rem 1rem 1rem 1rem; + margin: .2rem 0 1rem 0; border-radius: 12px; line-height: 2.5rem; background: var(--heo-card-bg); border: var(--style-border-always); - box-shadow: var(--heo-shadow-border); + box-shadow: var(--heo-shadow-border) } #pagination .pagination .extend i { @@ -12354,6 +12370,11 @@ div#post-comment { width: 100%; } +.tk-content img { + max-height: 1100px!important; + max-width: 100%!important; + border-radius: 12px +} #post-comment .comment-tips.show { display: flex; @@ -12370,6 +12391,7 @@ div#post-comment { width: 32px !important; height: 32px !important; box-shadow: var(--heo-shadow-border); + margin-right: 16px!important } .tk-avatar.tk-has-avatar { @@ -12378,6 +12400,10 @@ div#post-comment { border-radius: 32px !important; } +.tk-avatar.tk-has-avatar img { + border-radius: 32px!important; +} + .tk-row .tk-avatar { display: none; } @@ -12803,6 +12829,11 @@ button.el-button.tk-cancel.el-button--default.el-button--small { pointer-events: none; } +.OwO.OwO-open .OwO-body { + animation: .3s ease .1s 1 normal both running donate_effcet +} + + @keyframes owoIn { 0% { transform: translate(0, -95%); @@ -12998,7 +13029,7 @@ button.el-button.tk-cancel.el-button--default.el-button--small { } .post-reward .reward-main { - z-index: 1003; + z-index: 999; } .tk-meta-input .el-input .el-input-group__prepend { @@ -15104,7 +15135,7 @@ span.hexo-douban-pagenum { background: var(--heo-secondbg); display: flex; overflow: hidden; - z-index: 1002; + z-index: 999; transition: 0.3s; } @@ -15245,8 +15276,6 @@ span.hexo-douban-pagenum { animation-delay: 1.8s; } - - #about-page .author-img { margin: 0 30px; border-radius: 50%; @@ -15255,10 +15284,18 @@ span.hexo-douban-pagenum { position: relative; background: var(--heo-secondbg); user-select: none; + transition: .3s } #about-page .author-img img { border-radius: 200px; + overflow: hidden; + width: 180px; + height: 180px +} + +#about-page .author-img:hover { + transform: scale(1.1) } #about-page .author-img::before { @@ -15291,8 +15328,6 @@ span.hexo-douban-pagenum { } } - - #about-page .author-title { font-size: 2rem; font-weight: bold; @@ -17430,18 +17465,6 @@ a#toPageButton.haveValue:hover { } } - -/* 文章目录样式 */ -a.toc-link { - color: currentColor; - height:0%; -} -/* 文章目录样式 */ -#aside-content #card-toc .toc-content .is-active-link { - font-weight: 700; - font-size: 20px; - color: var(--heo-lighttext); -} /* code样式 */ code:not([class]) { color: var(--heo-white); diff --git a/templates/modules/common/rightside.html b/templates/modules/common/rightside.html index 012793ae..ca380f68 100644 --- a/templates/modules/common/rightside.html +++ b/templates/modules/common/rightside.html @@ -11,7 +11,7 @@
    - + diff --git a/templates/modules/footer.html b/templates/modules/footer.html index 9f4d24e4..207d62d5 100644 --- a/templates/modules/footer.html +++ b/templates/modules/footer.html @@ -4,7 +4,7 @@