study-area-cn
/
study-area-cn.old
Archived
2
1
Fork 3
Code Issues Pull Requests Actions Projects Releases Wiki Activity

优化移动端，优化打印

This commit is contained in:
cxykevin 2024-08-10 21:33:50 +08:00
parent 80b25beeb7
commit 98f651a562
2 changed files with 28 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
theme/css/page.css
View File

@ -106,3 +106,15 @@ h2 {
margin-top: 10px !important;
margin-right: 4px !important;
}
@media (max-width: 641px) {
.hideonmobile {
display: none !important;
}
}
@media (min-width: 640px) {
.hideonmobile {
display: inline-flex !important;
}
}

24
theme/index.hbs
View File

@ -57,14 +57,19 @@
</head>
<body style="margin:0;padding:0;">
{{#if is_print }}
{{#toc}}{{/toc}}
{{/if}}
<mdui-layout>
{{#unless is_print }}
<mdui-top-app-bar class="topbar" scroll-behavior="elevate">
<mdui-button-icon icon="menu" id="open-drawer"></mdui-button-icon>
<mdui-button id="open-study-env">实验环境</mdui-button>
<mdui-button class="hideonmobile" id="open-study-env">实验环境</mdui-button>
<mdui-top-app-bar-title>{{ book_title }}</mdui-top-app-bar-title>
<div style="flex-grow: 1"></div>
{{#previous}}
<mdui-button id="previous—page" href="{{ path_to_root }}{{link}}">上一章</mdui-button>
<mdui-button id="previous—page" class="hideonmobile" href="{{ path_to_root }}{{link}}">上一章</mdui-button>
{{/previous}}
{{#next}}
<mdui-button id="next—page" href="{{ path_to_root }}{{link}}">下一章</mdui-button>
@ -73,20 +78,18 @@
<mdui-button-icon icon="web" href="{{git_repository_url}}"></mdui-button-icon>
{{/if}}
{{#if print_enable}}
<mdui-button-icon href="{{ path_to_root }}print.html" title="Print this book" aria-label="Print this book"
icon="print">
<mdui-button-icon class="hideonmobile" href="{{ path_to_root }}print.html" title="Print this book"
aria-label="Print this book" icon="print">
</mdui-button-icon>
{{/if}}
</mdui-top-app-bar>
<mdui-navigation-drawer close-on-overlay-click class="toc-drawer" id="toc-drawer" placement="left" open>
</mdui-navigation-drawer>
{{/unless}}
{{#if is_print }}
{{#toc}}{{/toc}}
{{/if}}
{{#unless is_print }}
<!-- Render toc -->
<div style="display:none;" id="helperframe">
{{#toc}}{{/toc}}
@ -94,20 +97,24 @@
<script src="{{ ../path_to_root }}theme/js/tocrender.js"></script>
<!-- Render toc finish -->
{{/unless}}
{{#unless is_print }}
<script>
const navigationDrawer = document.querySelector(".toc-drawer");
const openButton = document.getElementById("open-drawer");
openButton.addEventListener("click", () => navigationDrawer.open = !navigationDrawer.open);
</script>
{{/unless}}
<mdui-layout-main class="example-layout-main" style="min-height: 100%">
<div class="mdui-prose">
{{{ content }}}
</div>
{{#unless is_print }}
<mdui-dialog headline="Study Env" close-on-esc close-on-overlay-click id="study-env-dialog">
<iframe src="about:blank" style="height:80%;width:99%" id="study-env-iframe"></iframe>
</mdui-dialog>
@ -118,6 +125,7 @@
document.getElementById("study-env-iframe").src = "http://jslinux.cxykevin.top"
});
</script>
{{/unless}}
<div style="height:10em;display:flex;max-width: 78%;margin: auto;margin-top:2em;">
{{#previous}}