xaoxuu
/
hexo-theme-stellar
mirror of https://github.com/xaoxuu/hexo-theme-stellar
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

[opt] rename widgets

This commit is contained in:
xaoxuu 2022-11-23 21:54:21 +08:00
parent 904be4160c
commit a88cb29bbb
19 changed files with 57 additions and 55 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
layout/_partial/sidebar/index.ejs
View File

@ -47,7 +47,7 @@ function layoutWidgets() {
var el = ''; var el = '';
el += '<div class="widgets">'; el += '<div class="widgets">';
if (page.layout == 'wiki' && proj && page.menu_id == 'wiki') { if (page.layout == 'wiki' && proj && page.menu_id == 'wiki') {
el += '<div class="widget-wrap logo-wrap wiki"><div class="widget-body">'; el += '<widget class="widget-wrapper logo-wrap wiki"><div class="widget-body">';
// all products // all products
el += '<a style="filter: grayscale(100%)" class="wiki-home cap" href="' + url_for(config.wiki_dir) + '">'; el += '<a style="filter: grayscale(100%)" class="wiki-home cap" href="' + url_for(config.wiki_dir) + '">';
el += '<svg aria-hidden="true" viewBox="0 0 16 16" width="1rem" height="1rem" fill="currentColor"><path fill-rule="evenodd" d="M7.78 12.53a.75.75 0 01-1.06 0L2.47 8.28a.75.75 0 010-1.06l4.25-4.25a.75.75 0 011.06 1.06L4.81 7h7.44a.75.75 0 010 1.5H4.81l2.97 2.97a.75.75 0 010 1.06z"></path></svg>'; el += '<svg aria-hidden="true" viewBox="0 0 16 16" width="1rem" height="1rem" fill="currentColor"><path fill-rule="evenodd" d="M7.78 12.53a.75.75 0 01-1.06 0L2.47 8.28a.75.75 0 010-1.06l4.25-4.25a.75.75 0 011.06 1.06L4.81 7h7.44a.75.75 0 010 1.5H4.81l2.97 2.97a.75.75 0 010 1.06z"></path></svg>';
@ -69,7 +69,7 @@ function layoutWidgets() {
let sub = proj.subtitle; let sub = proj.subtitle;
el += layoutTitle(main, url, sub); el += layoutTitle(main, url, sub);
} }
el += '</div></div>'; el += '</div></widget>';
} }
if (page.sidebar) { if (page.sidebar) {
page.sidebar.forEach((w, i) => { page.sidebar.forEach((w, i) => {
@ -87,7 +87,7 @@ function layoutWidgets() {
Object.assign(widget, w) Object.assign(widget, w)
} }
if (widget && widget.layout) { if (widget && widget.layout) {
el += partial('widgets/' + widget.layout, {item: widget}) el += partial('../widgets/' + widget.layout, {item: widget})
} }
}); });
} }

4
layout/_partial/sidebar/widgets/ghissues.ejs → layout/_partial/widgets/ghissues.ejs
View File

@ -21,7 +21,7 @@ function layoutDiv() {
if (item.labels) { if (item.labels) {
item.api += '&labels=' + item.labels; item.api += '&labels=' + item.labels;
} }
el += '<div class="widget-wrap" id="timeline">'; el += '<widget class="widget-wrapper timeline">';
if (item.title) { if (item.title) {
el += '<div class="widget-header cap theme dis-select">'; el += '<div class="widget-header cap theme dis-select">';
el += '<span class="name">' + item.title + '</span>'; el += '<span class="name">' + item.title + '</span>';
@ -37,7 +37,7 @@ function layoutDiv() {
el += '>'; el += '>';
el += '</div>'; el += '</div>';
el += '</div>'; el += '</div>';
el += '</div>'; el += '</widget>';
return el; return el;
} }
%> %>

4
layout/_partial/sidebar/widgets/ghrepo.ejs → layout/_partial/widgets/ghrepo.ejs
View File

@ -18,7 +18,7 @@ function layoutDiv() {
return el; return el;
} }
// 布局 // 布局
el += '<div class="widget-wrap" id="repo-info">'; el += '<widget class="widget-wrapper ghrepo">';
// body // body
el += '<div class="widget-body">'; el += '<div class="widget-body">';
el += '<div class="items stellar-ghinfo-api" api="' + theme.api_host.ghapi + '/repos/' + repo + '">'; el += '<div class="items stellar-ghinfo-api" api="' + theme.api_host.ghapi + '/repos/' + repo + '">';
@ -45,7 +45,7 @@ function layoutDiv() {
el += '</a>'; el += '</a>';
el += '</div>'; el += '</div>';
el += '</div>'; el += '</div>';
el += '</div>'; el += '</widget>';
return el; return el;
} }
%> %>

6
layout/_partial/sidebar/widgets/ghuser.ejs → layout/_partial/widgets/ghuser.ejs
View File

@ -22,7 +22,7 @@ function layoutDiv() {
return el; return el;
} }
el += '<div class="widget-wrap" id="github-user">'; el += '<widget class="widget-wrapper ghuser">';
// body // body
el += '<div class="widget-body stellar-ghinfo-api" api="' + theme.api_host.ghapi + '/users/' + item.username + '">'; el += '<div class="widget-body stellar-ghinfo-api" api="' + theme.api_host.ghapi + '/users/' + item.username + '">';
if (item.avatar) { if (item.avatar) {
@ -47,10 +47,10 @@ function layoutDiv() {
el += '</a>'; el += '</a>';
// menu // menu
if (item.menu) { if (item.menu) {
el += partial('../menu', {where: 'sidebar'}); el += partial('../sidebar/menu', {where: 'sidebar'});
} }
el += '</div>'; el += '</div>';
el += '</div>'; el += '</widget>';
return el; return el;
} }
%> %>

4
layout/_partial/sidebar/widgets/markdown.ejs → layout/_partial/widgets/markdown.ejs
View File

@ -2,7 +2,7 @@
function layoutDiv() { function layoutDiv() {
if (!item.content?.length) return '' if (!item.content?.length) return ''
var el = ''; var el = '';
el += '<div class="widget-wrap" id="markdown">'; el += '<widget class="widget-wrapper markdown">';
if (item.title?.length > 0) { if (item.title?.length > 0) {
el += '<div class="widget-header cap theme dis-select">'; el += '<div class="widget-header cap theme dis-select">';
el += '<span class="name">' + item.title + '</span>'; el += '<span class="name">' + item.title + '</span>';
@ -11,7 +11,7 @@ function layoutDiv() {
el += '<div class="widget-body fs14">'; el += '<div class="widget-body fs14">';
el += markdown(item.content); el += markdown(item.content);
el += '</div>'; el += '</div>';
el += '</div>'; el += '</widget>';
return el; return el;
} }
%> %>

4
layout/_partial/sidebar/widgets/recent.ejs → layout/_partial/widgets/recent.ejs
View File

@ -1,6 +1,6 @@
<% <%
function layoutDiv() { function layoutDiv() {
var el = '<div class="widget-wrap" id="recent">'; var el = '<widget class="widget-wrapper recent">';
// header // header
el += '<div class="widget-header cap theme dis-select">'; el += '<div class="widget-header cap theme dis-select">';
el += '<span class="name">' + __("meta.recent_update") + '</span>'; el += '<span class="name">' + __("meta.recent_update") + '</span>';
@ -44,7 +44,7 @@ function layoutDiv() {
el += ''; el += '';
}); });
el += '</div>'; el += '</div>';
el += '</div>'; el += '</widget>';
return el; return el;
} }
%> %>

4
layout/_partial/sidebar/widgets/related.ejs → layout/_partial/widgets/related.ejs
View File

@ -15,7 +15,7 @@ function layoutDiv() {
} }
var el = ''; var el = '';
if (related.length > 0) { if (related.length > 0) {
el += '<div class="widget-wrap" id="related">'; el += '<widget class="widget-wrapper related">';
el += '<div class="widget-header cap theme dis-select">'; el += '<div class="widget-header cap theme dis-select">';
var title = __('btn.wiki'); var title = __('btn.wiki');
if (proj.tags && proj.tags[0]) { if (proj.tags && proj.tags[0]) {
@ -34,7 +34,7 @@ function layoutDiv() {
el += '</a>'; el += '</a>';
}); });
el += '</div>'; el += '</div>';
el += '</div>'; el += '</widget>';
} }
return el; return el;
} }

4
layout/_partial/sidebar/widgets/tagcloud.ejs → layout/_partial/widgets/tagcloud.ejs
View File

@ -8,7 +8,7 @@ function layoutDiv() {
delete opts['title']; delete opts['title'];
delete opts['layout']; delete opts['layout'];
opts.class = 'tag '; opts.class = 'tag ';
el += '<div class="widget-wrap" id="tagcloud">'; el += '<widget class="widget-wrapper tagcloud">';
if (item.title) { if (item.title) {
el += '<div class="widget-header cap theme dis-select">'; el += '<div class="widget-header cap theme dis-select">';
el += '<span class="name">' + item.title + '</span>'; el += '<span class="name">' + item.title + '</span>';
@ -17,7 +17,7 @@ function layoutDiv() {
el += '<div class="widget-body fs14">'; el += '<div class="widget-body fs14">';
el += tagcloud(site.tags, opts); el += tagcloud(site.tags, opts);
el += '</div>'; el += '</div>';
el += '</div>'; el += '</widget>';
return el; return el;
} }
%> %>

4
layout/_partial/sidebar/widgets/timeline.ejs → layout/_partial/widgets/timeline.ejs
View File

@ -4,7 +4,7 @@ function layoutDiv() {
if (item.api == undefined) { if (item.api == undefined) {
return el; return el;
} }
el += '<div class="widget-wrap" id="timeline">'; el += '<widget class="widget-wrapper timeline">';
if (item.title) { if (item.title) {
el += '<div class="widget-header cap theme dis-select">'; el += '<div class="widget-header cap theme dis-select">';
el += '<span class="name">' + item.title + '</span>'; el += '<span class="name">' + item.title + '</span>';
@ -20,7 +20,7 @@ function layoutDiv() {
el += '>'; el += '>';
el += '</div>'; el += '</div>';
el += '</div>'; el += '</div>';
el += '</div>'; el += '</widget>';
return el; return el;
} }
%> %>

4
layout/_partial/sidebar/widgets/toc.ejs → layout/_partial/widgets/toc.ejs
View File

@ -63,7 +63,7 @@ function layoutDiv(fallback) {
var el = ''; var el = '';
if (type.length > 0) { if (type.length > 0) {
el += '<div class="widget-wrap ' + type + '" id="toc">'; el += '<widget class="widget-wrapper toc ' + type + '" id="toc">';
if (page.layout !== 'wiki') { if (page.layout !== 'wiki') {
// post 布局 // post 布局
el += layoutTocHeader(page.toc_title); el += layoutTocHeader(page.toc_title);
@ -90,7 +90,7 @@ function layoutDiv(fallback) {
el += '</div>'; el += '</div>';
} }
} }
el += '</div>'; el += '</widget>';
} else if (item.fallback) { } else if (item.fallback) {
el += partial(item.fallback, {item: theme.data.widgets[item.fallback]}); el += partial(item.fallback, {item: theme.data.widgets[item.fallback]});
} }

1
source/css/_layout/index.styl
View File

@ -1,4 +1,5 @@
@import 'partial/*' @import 'partial/*'
@import 'tag-plugins/*' @import 'tag-plugins/*'
@import 'sidebar/*' @import 'sidebar/*'
@import 'widgets/*'
@import 'pages/*' @import 'pages/*'

5
source/css/_layout/sidebar/sidebar.styl
View File

@ -8,12 +8,13 @@
margin: var(--gap-l) var(--gap-l) 0 margin: var(--gap-l) var(--gap-l) 0
margin-top: "calc(2 * %s)" % var(--gap-l) margin-top: "calc(2 * %s)" % var(--gap-l)
@media screen and (min-width: $device-mobile-max) @media screen and (min-width: $device-mobile-max)
>.widgets:first-child>.widget-wrap:first-child >.widgets:first-child>.widget-wrapper:first-child
margin-top: "calc(2 * %s)" % var(--gap-l) margin-top: "calc(2 * %s)" % var(--gap-l)
@media screen and (max-width: $device-mobile-max) @media screen and (max-width: $device-mobile-max)
height: 100vh height: 100vh
.l_left[layout=wiki] .l_left[layout=wiki]
padding-bottom: 0 padding-bottom: 0
height: 100vh height: 100vh
@ -100,7 +101,7 @@
opacity: 1 !important opacity: 1 !important
.l_left .widgets .widget-wrap.logo-wrap.wiki .l_left .widgets .widget-wrapper.logo-wrap.wiki
margin-bottom: 1.5rem margin-bottom: 1.5rem
flex-direction: column flex-direction: column
align-items: flex-start align-items: flex-start

2
source/css/_layout/sidebar/ghrepo.styl → source/css/_layout/widgets/ghrepo.styl
View File

@ -1,4 +1,4 @@
.widget-wrap#repo-info .widget-wrapper.ghrepo
.widget-body .widget-body
a.repo a.repo
display: block display: block

22
source/css/_layout/sidebar/ghuser.styl → source/css/_layout/widgets/ghuser.styl
View File

@ -1,14 +1,14 @@
.widget-wrap#github-user .widget-wrapper.ghuser
.widget-header+.widget-body .widget-header+.widget-body
margin: 0.75rem 0 margin: 0.75rem 0
.widget-wrap#github-user .widget-body .widget-wrapper.ghuser .widget-body
text-align: center text-align: center
background: var(--card) background: var(--card)
border-radius: $border-card border-radius: $border-card
padding: 1rem padding: 1rem
box-shadow: $boxshadow-card box-shadow: $boxshadow-card
.widget-wrap#github-user .widget-body .avatar .widget-wrapper.ghuser .widget-body .avatar
display: block display: block
border-radius: 100% border-radius: 100%
margin: 1rem auto 1.25rem auto margin: 1rem auto 1.25rem auto
@ -19,17 +19,17 @@
@media screen and (max-width: $device-tablet) @media screen and (max-width: $device-tablet)
max-width: 50% max-width: 50%
.widget-wrap#github-user .widget-body .username .widget-wrapper.ghuser .widget-body .username
font-weight: 900 font-weight: 900
font-size: $fs-h2 font-size: $fs-h2
color: var(--text-p0) color: var(--text-p0)
margin: 0.5rem 0 margin: 0.5rem 0
.widget-wrap#github-user .widget-body .bio .widget-wrapper.ghuser .widget-body .bio
font-size: $fs-13 font-size: $fs-13
margin: 0.5rem 0 margin: 0.5rem 0
.widget-wrap#github-user .widget-body .follow .widget-wrapper.ghuser .widget-body .follow
font-weight: 500 font-weight: 500
border-radius: 64px border-radius: 64px
padding: 0.5rem 1rem padding: 0.5rem 1rem
@ -48,7 +48,7 @@
&:hover &:hover
background: $color-hover background: $color-hover
.widget-wrap#github-user .widget-body .menu .widget-wrapper.ghuser .widget-body .menu
margin-bottom: 0 margin-bottom: 0
background: none background: none
a:hover a:hover
@ -67,14 +67,14 @@
border-radius: 4px border-radius: 4px
background: $color-theme background: $color-theme
.widget-wrap#github-user .widget-body .buttons .widget-wrapper.ghuser .widget-body .buttons
margin: 1rem 0 margin: 1rem 0
align-self: stretch align-self: stretch
display: grid display: grid
grid-gap: 2px grid-gap: 2px
grid-template-columns: repeat(auto-fill, "calc((100% - 2 * %s) / 3)" % 2px) grid-template-columns: repeat(auto-fill, "calc((100% - 2 * %s) / 3)" % 2px)
.widget-wrap#github-user .widget-body .btn .widget-wrapper.ghuser .widget-body .btn
display: flex display: flex
flex-direction: column flex-direction: column
align-items: center align-items: center
@ -87,12 +87,12 @@
background: var(--block) background: var(--block)
.widget-wrap#github-user .widget-body .buttons .btn .title .widget-wrapper.ghuser .widget-body .buttons .btn .title
font-size: 1rem font-size: 1rem
font-weight: 700 font-weight: 700
.widget-wrap#github-user .widget-body .buttons .btn .desc .widget-wrapper.ghuser .widget-body .buttons .btn .desc
font-size: $fs-12 font-size: $fs-12
color: var(--text-p3) color: var(--text-p3)
font-weight: 500 font-weight: 500

2
source/css/_layout/sidebar/toc_blog.styl → source/css/_layout/widgets/toc_blog.styl
View File

@ -1,3 +1,3 @@
.widget-wrap.single#toc .doc-tree .widget-wrapper.toc.single .doc-tree
&.active>.toc &.active>.toc
border-left: 2px solid var(--block-hover) border-left: 2px solid var(--block-hover)

8
source/css/_layout/sidebar/toc_common.styl → source/css/_layout/widgets/toc_common.styl
View File

@ -1,10 +1,10 @@
.widget-wrap.single#toc .widget-header .widget-wrapper.toc.single .widget-header
font-weight: 500 font-weight: 500
font-size: $fs-12 font-size: $fs-12
>span >span
margin: 0.5rem 0 margin: 0.5rem 0
#toc .widget-body .toc .widget-body
margin-top: 0 margin-top: 0
ul ul, ul ol ul ul, ul ol
padding-left: 0 padding-left: 0
@ -34,7 +34,7 @@
padding-left: 2.9rem padding-left: 2.9rem
#toc .toc-item .toc .toc-item
color: var(--text-p2) color: var(--text-p2)
font-size: $fs-12 font-size: $fs-12
padding: 0 padding: 0
@ -44,7 +44,7 @@
border-left-color: @color border-left-color: @color
.toc-child .toc-item .toc-child .toc-item
padding: 0 padding: 0
#toc a.toc-link .toc a.toc-link
color: inherit color: inherit
display: block display: block
line-height: 1.2 line-height: 1.2

8
source/css/_layout/sidebar/toc_wiki.styl → source/css/_layout/widgets/toc_wiki.styl
View File

@ -1,14 +1,14 @@
.widget-wrap#toc .widget-wrapper.toc
.widget-header .widget-header
margin-top: 1rem margin-top: 1rem
.widget-wrap.multi#toc .widget-header .widget-wrapper.toc.multi .widget-header
color: var(--text-p1) color: var(--text-p1)
font-size: $fs-14 font-size: $fs-14
// 其它分页链接 // 其它分页链接
.widget-wrap.multi#toc .doc-tree .widget-wrapper.toc.multi .doc-tree
border-radius: $border-block border-radius: $border-block
background: var(--block) background: var(--block)
overflow: hidden overflow: hidden
@ -34,7 +34,7 @@
// 当前分页链接 // 当前分页链接
.widget-wrap.multi#toc .doc-tree.active .widget-wrapper.toc.multi .doc-tree.active
a.doc-tree-link a.doc-tree-link
background: var(--block) background: var(--block)
font-weight: 700 font-weight: 700

12
source/css/_layout/sidebar/widgets.styl → source/css/_layout/widgets/widgets.styl
View File

@ -8,7 +8,7 @@
scrollbar(0, 0) scrollbar(0, 0)
z-index: 1 z-index: 1
line-height: 1.2 line-height: 1.2
.widget-wrap .widget-wrapper
margin: 1rem 0 2rem margin: 1rem 0 2rem
.widget-header .widget-header
padding-left: var(--gap-l) padding-left: var(--gap-l)
@ -50,12 +50,12 @@
line-height: 1.5 line-height: 1.5
.widget-header+.widget-body .widget-header+.widget-body
margin-top: 0 margin-top: 0
.widget-wrap+.widget-wrap .widget-header .widget-wrapper+.widget-wrapper .widget-header
margin-top: 3rem margin-top: 3rem
.l_left .widgets .l_left .widgets
.widget-wrap#recent .widget-body .widget-wrapper.recent .widget-body
display: flex display: flex
flex-direction: column flex-direction: column
align-items: flex-start align-items: flex-start
@ -70,7 +70,7 @@
color: var(--text-p2) color: var(--text-p2)
&:hover &:hover
color: $color-hover color: $color-hover
.widget-wrap#related .widget-body a .widget-wrapper.related .widget-body a
margin-top: 0.5rem margin-top: 0.5rem
margin-bottom: 1rem margin-bottom: 1rem
.title .title
@ -79,7 +79,7 @@
.excerpt .excerpt
-webkit-line-clamp: 3 -webkit-line-clamp: 3
.widget-wrap#tagcloud .widget-body .widget-wrapper.tagcloud .widget-body
margin-top: 0.25rem margin-top: 0.25rem
a a
word-break: break-word word-break: break-word
@ -88,7 +88,7 @@
&:hover &:hover
color: $color-hover color: $color-hover
.widget-wrap#timeline .widget-body .widget-wrapper.timeline .widget-body
margin-top: 0.5rem margin-top: 0.5rem
.tag-plugin.timeline .timenode .tag-plugin.timeline .timenode
.header .header

8
source/js/main.js
View File

@ -111,12 +111,12 @@ const init = {
} }
} }
if (topSeg) { if (topSeg) {
$("#toc a.toc-link").removeClass("active") $(".toc#toc a.toc-link").removeClass("active")
var link = "#" + topSeg.attr("id") var link = "#" + topSeg.attr("id")
if (link != '#undefined') { if (link != '#undefined') {
$('#toc a.toc-link[href="' + encodeURI(link) + '"]').addClass("active") $('.toc#toc a.toc-link[href="' + encodeURI(link) + '"]').addClass("active")
} else { } else {
$('#toc a.toc-link:first').addClass("active") $('.toc#toc a.toc-link:first').addClass("active")
} }
} }
}) })
@ -124,7 +124,7 @@ const init = {
}, },
sidebar: () => { sidebar: () => {
stellar.jQuery(() => { stellar.jQuery(() => {
$("#toc a.toc-link").click(function (e) { $(".toc#toc a.toc-link").click(function (e) {
l_body.classList.remove("sidebar"); l_body.classList.remove("sidebar");
}); });
}) })