调整界面布局
This commit is contained in:
parent
50c3188938
commit
8b30e0fed5
|
@ -32,17 +32,13 @@ a:hover:after {
|
||||||
}
|
}
|
||||||
|
|
||||||
h1 {
|
h1 {
|
||||||
margin-top: 0px;
|
margin-top: 0px !important;
|
||||||
margin-bottom: 20px;
|
margin-bottom: 20px !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
h2 {
|
h2 {
|
||||||
margin-top: 0px;
|
margin-top: 30px !important;
|
||||||
margin-bottom: 15px;
|
margin-bottom: 15px !important;
|
||||||
}
|
|
||||||
|
|
||||||
.preset {
|
|
||||||
min-height: 1rem !important;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.container {
|
.container {
|
||||||
|
@ -65,4 +61,48 @@ h2 {
|
||||||
.menu-link:hover:after {
|
.menu-link:hover:after {
|
||||||
width: calc(100% - 20px);
|
width: calc(100% - 20px);
|
||||||
left: 20px;
|
left: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.topbar {
|
||||||
|
position: fixed !important;
|
||||||
|
top: 0px;
|
||||||
|
right: 0px;
|
||||||
|
left: 0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mdui-prose {
|
||||||
|
margin-left: 50px;
|
||||||
|
margin-right: 50px;
|
||||||
|
max-width: 78%;
|
||||||
|
margin: auto;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.toc-drawer {
|
||||||
|
position: fixed !important;
|
||||||
|
margin-left: 0px !important;
|
||||||
|
margin-right: 0px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bottombar {
|
||||||
|
height: 10em !important;
|
||||||
|
margin-top: 2em !important;
|
||||||
|
margin-left: 2em !important;
|
||||||
|
margin-right: 2em !important;
|
||||||
|
display: flex !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.prevpage {
|
||||||
|
display: flex !important;
|
||||||
|
font-size: 1.2em !important;
|
||||||
|
margin-top: 10px !important;
|
||||||
|
margin-left: 4px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nextpage {
|
||||||
|
display: flex !important;
|
||||||
|
font-size: 1.2em !important;
|
||||||
|
margin-top: 10px !important;
|
||||||
|
margin-right: 4px !important;
|
||||||
}
|
}
|
|
@ -56,13 +56,19 @@
|
||||||
<link rel="stylesheet" href="{{ ../path_to_root }}theme/css/page.css">
|
<link rel="stylesheet" href="{{ ../path_to_root }}theme/css/page.css">
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body style="margin:0;padding:0;min-height:100%;width:100%">
|
<body style="margin:0;padding:0;">
|
||||||
<mdui-layout style="height:100%">
|
<mdui-layout>
|
||||||
<mdui-top-app-bar>
|
<mdui-top-app-bar class="topbar" scroll-behavior="elevate">
|
||||||
<mdui-button-icon icon="menu" id="open-drawer"></mdui-button-icon>
|
<mdui-button-icon icon="menu" id="open-drawer"></mdui-button-icon>
|
||||||
<mdui-button id="open-study-env">实验环境</mdui-button>
|
<mdui-button id="open-study-env">实验环境</mdui-button>
|
||||||
<mdui-top-app-bar-title>{{ book_title }}</mdui-top-app-bar-title>
|
<mdui-top-app-bar-title>{{ book_title }}</mdui-top-app-bar-title>
|
||||||
<div style="flex-grow: 1"></div>
|
<div style="flex-grow: 1"></div>
|
||||||
|
{{#previous}}
|
||||||
|
<mdui-button id="previous—page" href="{{ path_to_root }}{{link}}">上一章</mdui-button>
|
||||||
|
{{/previous}}
|
||||||
|
{{#next}}
|
||||||
|
<mdui-button id="next—page" href="{{ path_to_root }}{{link}}">下一章</mdui-button>
|
||||||
|
{{/next}}
|
||||||
{{#if git_repository_url}}
|
{{#if git_repository_url}}
|
||||||
<mdui-button-icon icon="web" href="{{git_repository_url}}"></mdui-button-icon>
|
<mdui-button-icon icon="web" href="{{git_repository_url}}"></mdui-button-icon>
|
||||||
{{/if}}
|
{{/if}}
|
||||||
|
@ -73,9 +79,14 @@
|
||||||
{{/if}}
|
{{/if}}
|
||||||
</mdui-top-app-bar>
|
</mdui-top-app-bar>
|
||||||
|
|
||||||
<mdui-navigation-drawer close-on-overlay-click class="toc-drawer" id="toc-drawer">
|
<mdui-navigation-drawer close-on-overlay-click class="toc-drawer" id="toc-drawer" placement="left" open>
|
||||||
</mdui-navigation-drawer>
|
</mdui-navigation-drawer>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
{{#if is_print }}
|
||||||
|
{{#toc}}{{/toc}}
|
||||||
|
{{/if}}
|
||||||
<!-- Render toc -->
|
<!-- Render toc -->
|
||||||
<div style="display:none;" id="helperframe">
|
<div style="display:none;" id="helperframe">
|
||||||
{{#toc}}{{/toc}}
|
{{#toc}}{{/toc}}
|
||||||
|
@ -93,7 +104,7 @@
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<mdui-layout-main class="example-layout-main" style="min-height: 100%">
|
<mdui-layout-main class="example-layout-main" style="min-height: 100%">
|
||||||
<div class="mdui-prose" style="margin-left:50px;margin-right:50px;">
|
<div class="mdui-prose">
|
||||||
{{{ content }}}
|
{{{ content }}}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
@ -108,14 +119,14 @@
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<div style="height:10em;margin-top:2em;margin-left:2em;margin-right:2em;display:flex">
|
<div style="height:10em;display:flex;max-width: 78%;margin: auto;margin-top:2em;">
|
||||||
{{#previous}}
|
{{#previous}}
|
||||||
<mdui-card clickable style="width:49%;height: 100%" href="{{ path_to_root }}{{link}}">
|
<mdui-card clickable style="width:49%;height: 100%" href="{{ path_to_root }}{{link}}">
|
||||||
<div style="display:flex;font-size:1.5em">
|
<div style="display:flex;font-size:1.2em;margin-top: 10px;margin-left: 4px;">
|
||||||
<mdui-icon name="navigate_before" style="font-size:1.5em"></mdui-icon> 上一章
|
<mdui-icon name="navigate_before" style="font-size:1.5em;"></mdui-icon> 上一章
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div style="text-align:center;font-size:2em">
|
<div style="text-align:center;font-size:1.8em;margin-top: 12px;">
|
||||||
{{title}}
|
{{title}}
|
||||||
</div>
|
</div>
|
||||||
</mdui-card>
|
</mdui-card>
|
||||||
|
@ -125,12 +136,12 @@
|
||||||
|
|
||||||
{{#next}}
|
{{#next}}
|
||||||
<mdui-card clickable style="width:49%;height: 100%" href="{{ path_to_root }}{{link}}">
|
<mdui-card clickable style="width:49%;height: 100%" href="{{ path_to_root }}{{link}}">
|
||||||
<div style="display:flex;font-size:1.5em">
|
<div style="display:flex;font-size:1.2em;margin-top: 10px;margin-right: 4px;">
|
||||||
<div style="flex-grow:1"></div>下一章<mdui-icon name="navigate_next"
|
<div style="flex-grow:1"></div>下一章<mdui-icon name="navigate_next"
|
||||||
style="font-size:1.5em"></mdui-icon>
|
style="font-size:1.5em"></mdui-icon>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div style="text-align:center;font-size:2em">
|
<div style="text-align:center;font-size:1.8em;margin-top: 12px;">
|
||||||
{{title}}
|
{{title}}
|
||||||
</div>
|
</div>
|
||||||
</mdui-card>
|
</mdui-card>
|
||||||
|
|
Reference in New Issue