refactor: 左侧边栏折叠功能

This commit is contained in:
XPoet 2020-03-30 11:17:47 +08:00
parent a381f3b419
commit 87ba77fdc4
3 changed files with 11 additions and 12 deletions

View File

@ -1,15 +1,5 @@
<script>
let isOpenLeftSide = true;
const foldLeftSide = () => {
document.querySelector('.page-left').style.display = isOpenLeftSide ? 'none' : 'block';
document.querySelector('.page-right').style.width = isOpenLeftSide ? '100%' : '<%= theme.page.right_side_width + '%' %>';
isOpenLeftSide = !isOpenLeftSide;
};
</script>
<nav class="nav"> <nav class="nav">
<button class="fold-left-side-btn" <button class="fold-left-side-btn">
onclick="foldLeftSide()"
>
<i class="fa fa-bars"></i> <i class="fa fa-bars"></i>
</button> </button>
<ul class="menu-list"> <ul class="menu-list">

View File

@ -14,7 +14,8 @@ hexo.extend.helper.register('export_config', function() {
root : config.root, root : config.root,
localsearch: theme.local_search, localsearch: theme.local_search,
themeName: theme.theme_name, themeName: theme.theme_name,
themeVersion: theme.theme_version themeVersion: theme.theme_version,
pageLayout: theme.page
}; };
if (config.search) { if (config.search) {
exportConfig.path = config.search.path; exportConfig.path = config.search.path;

View File

@ -1,3 +1,11 @@
window.addEventListener('DOMContentLoaded', () => { window.addEventListener('DOMContentLoaded', () => {
console.log(`${CONFIG.themeName} v${CONFIG.themeVersion}`); console.log(`${CONFIG.themeName} v${CONFIG.themeVersion}`);
let isOpenLeftSide = true;
document.querySelector('.fold-left-side-btn').addEventListener('click', () => {
document.querySelector('.page-left').style.display = isOpenLeftSide ? 'none' : 'block';
document.querySelector('.page-right').style.width = isOpenLeftSide ? '100%' : `${CONFIG.pageLayout.right_side_width}%`;
isOpenLeftSide = !isOpenLeftSide;
});
}); });