SACP2: 完成大部分美化 #14
13
book.toml
13
book.toml
|
|
@ -4,3 +4,16 @@ language = "zh-cn"
|
|||
multilingual = false
|
||||
src = "src"
|
||||
title = "Study Area CN"
|
||||
|
||||
[output.html]
|
||||
additional-css = [
|
||||
"theme/css/icons.css",
|
||||
"theme/css/mdui.css",
|
||||
"theme/css/highlight.min.css",
|
||||
"theme/font/icons.woff2",
|
||||
]
|
||||
additional-js = [
|
||||
"theme/js/mdui.global.js",
|
||||
"theme/js/highlight.min.js",
|
||||
"theme/js/mathjax.js",
|
||||
]
|
||||
|
|
|
|||
|
|
@ -0,0 +1,9 @@
|
|||
/*!
|
||||
Theme: Default
|
||||
Description: Original highlight.js style
|
||||
Author: (c) Ivan Sagalaev <maniac@softwaremaniacs.org>
|
||||
Maintainer: @highlightjs/core-team
|
||||
Website: https://highlightjs.org/
|
||||
License: see project LICENSE
|
||||
Touched: 2021
|
||||
*/pre code.hljs{display:block;overflow-x:auto;padding:1em}code.hljs{padding:3px 5px}.hljs{background:#f3f3f3;color:#444}.hljs-comment{color:#697070}.hljs-punctuation,.hljs-tag{color:#444a}.hljs-tag .hljs-attr,.hljs-tag .hljs-name{color:#444}.hljs-attribute,.hljs-doctag,.hljs-keyword,.hljs-meta .hljs-keyword,.hljs-name,.hljs-selector-tag{font-weight:700}.hljs-deletion,.hljs-number,.hljs-quote,.hljs-selector-class,.hljs-selector-id,.hljs-string,.hljs-template-tag,.hljs-type{color:#800}.hljs-section,.hljs-title{color:#800;font-weight:700}.hljs-link,.hljs-operator,.hljs-regexp,.hljs-selector-attr,.hljs-selector-pseudo,.hljs-symbol,.hljs-template-variable,.hljs-variable{color:#ab5656}.hljs-literal{color:#695}.hljs-addition,.hljs-built_in,.hljs-bullet,.hljs-code{color:#397300}.hljs-meta{color:#1f7199}.hljs-meta .hljs-string{color:#38a}.hljs-emphasis{font-style:italic}.hljs-strong{font-weight:700}
|
||||
|
|
@ -0,0 +1,22 @@
|
|||
/* fallback */
|
||||
@font-face {
|
||||
font-family: 'Material Icons';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: url(../font/icons.woff2) format('woff2');
|
||||
}
|
||||
|
||||
.material-icons {
|
||||
font-family: 'Material Icons';
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
font-size: 24px;
|
||||
line-height: 1;
|
||||
letter-spacing: normal;
|
||||
text-transform: none;
|
||||
display: inline-block;
|
||||
white-space: nowrap;
|
||||
word-wrap: normal;
|
||||
direction: ltr;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 5.5 KiB After Width: | Height: | Size: 2.0 KiB |
Binary file not shown.
171
theme/index.hbs
171
theme/index.hbs
|
|
@ -19,24 +19,20 @@
|
|||
|
||||
<!-- MDUI CSS&JS -->
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, shrink-to-fit=no"/>
|
||||
<meta name="renderer" content="webkit"/>
|
||||
|
||||
<link rel="stylesheet" href="https://unpkg.com/mdui@2/mdui.css">
|
||||
<script src="https://unpkg.com/mdui@2/mdui.global.js"></script>
|
||||
|
||||
|
||||
<!-- Material Icons Font (Filled) -->
|
||||
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, shrink-to-fit=no" />
|
||||
<meta name="renderer" content="webkit" />
|
||||
<link rel="stylesheet" href="{{ ../path_to_root }}theme/css/mdui.css">
|
||||
<script src="{{ ../path_to_root }}theme/js/mdui.global.js"></script>
|
||||
<link href="{{ ../path_to_root }}theme/css/icons.css" rel="stylesheet">
|
||||
|
||||
<meta name="description" content="Study Area CN {{ description }}">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta name="theme-color" content="#ffffff">
|
||||
<meta name="keywords"
|
||||
content="Study-area, study-area, study-area-cn Study Area CN, study area cn, 酷学园, 酷学园 CN , 酷！学园, netman, linux, mdbook">
|
||||
content="Study-area, study-area, study-area-cn Study Area CN, study area cn, 酷学园, 酷学园 CN , 酷！学园, netman, linux, mdbook, rockylinux">
|
||||
|
||||
{{#if favicon_svg}}
|
||||
<link rel="icon" href="{{ path_to_root }}favicon.svg">
|
||||
<link rel="icon" href="{{ path_to_root }}favicon.png">
|
||||
{{/if}}
|
||||
{{#if favicon_png}}
|
||||
<link rel="shortcut icon" href="{{ path_to_root }}favicon.png">
|
||||
|
|
@ -47,73 +43,71 @@
|
|||
{{/if}}
|
||||
|
||||
<!-- Highlight.js Stylesheets -->
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/default.min.css">
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/highlight.min.js"></script>
|
||||
<link rel="stylesheet" href="{{ ../path_to_root }}theme/css/highlight.min.css">
|
||||
<script src="{{ ../path_to_root }}theme/js/highlight.min.js"></script>
|
||||
|
||||
|
||||
<!-- Custom theme stylesheets -->
|
||||
{{#each additional_css}}
|
||||
<link rel="stylesheet" href="{{ ../path_to_root }}{{ this }}">
|
||||
{{/each}}
|
||||
|
||||
{{#if mathjax_support}}
|
||||
<!-- MathJax -->
|
||||
<script async
|
||||
src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
|
||||
<script async src="{{ ../path_to_root }}theme/js/mathjax.js"></script>
|
||||
{{/if}}
|
||||
|
||||
<style>
|
||||
ol,li{
|
||||
list-style:none;
|
||||
font-size:1em;
|
||||
}
|
||||
ol,
|
||||
li {
|
||||
list-style: none;
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
.part-title{
|
||||
font-weight:bold;
|
||||
font-size:1.2em;
|
||||
}
|
||||
.part-title {
|
||||
font-weight: bold;
|
||||
font-size: 1.2em;
|
||||
}
|
||||
|
||||
a {
|
||||
position: relative;
|
||||
text-decoration: none;
|
||||
color: rgb(var(--mdui-color-primary));
|
||||
}
|
||||
a {
|
||||
position: relative;
|
||||
text-decoration: none;
|
||||
color: rgb(var(--mdui-color-primary));
|
||||
}
|
||||
|
||||
a:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
bottom: -2px;
|
||||
left: 50%;
|
||||
width: 0;
|
||||
height: 2px;
|
||||
transition: width 0.3s ease-in-out, left 0.3s ease-in-out;
|
||||
background-color: rgb(var(--mdui-color-primary))
|
||||
}
|
||||
a:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
bottom: -2px;
|
||||
left: 50%;
|
||||
width: 0;
|
||||
height: 2px;
|
||||
transition: width 0.3s ease-in-out, left 0.3s ease-in-out;
|
||||
background-color: rgb(var(--mdui-color-primary))
|
||||
}
|
||||
|
||||
a:hover:after {
|
||||
width: 100%;
|
||||
left: 0;
|
||||
}
|
||||
a:hover:after {
|
||||
width: 100%;
|
||||
left: 0;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body style="margin:0;padding:0;min-height:100%;width:100%">
|
||||
<body style="margin:0;padding:0;min-height:100%;width:100%">
|
||||
<mdui-layout style="height:100%">
|
||||
<mdui-top-app-bar>
|
||||
<mdui-button-icon icon="menu" id="open-drawer"></mdui-button-icon>
|
||||
<mdui-button id="open-study-env">实验环境</mdui-button>
|
||||
<mdui-top-app-bar-title>{{ book_title }}</mdui-top-app-bar-title>
|
||||
<div style="flex-grow: 1"></div>
|
||||
<div style="flex-grow: 1"></div>
|
||||
{{#if git_repository_url}}
|
||||
<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 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">
|
||||
{{#toc}}{{/toc}}
|
||||
{{#toc}}{{/toc}}
|
||||
</mdui-navigation-drawer>
|
||||
|
||||
<script>
|
||||
|
|
@ -124,52 +118,49 @@
|
|||
</script>
|
||||
|
||||
<mdui-layout-main class="example-layout-main" style="min-height: 100%">
|
||||
<div class="mdui-prose" style="margin-left:20px;margin-right:20px;">
|
||||
{{{ content }}}
|
||||
</div>
|
||||
<div class="mdui-prose" style="margin-left:20px;margin-right:20px;">
|
||||
{{{ content }}}
|
||||
</div>
|
||||
|
||||
<mdui-dialog
|
||||
headline="Study Env"
|
||||
close-on-esc
|
||||
id="study-env-dialog"
|
||||
>
|
||||
<iframe src="about:blank" style="height:80%;width:99%" id="study-env-iframe"></iframe>
|
||||
</mdui-dialog>
|
||||
<mdui-dialog headline="Study Env" close-on-esc id="study-env-dialog">
|
||||
<iframe src="about:blank" style="height:80%;width:99%" id="study-env-iframe"></iframe>
|
||||
</mdui-dialog>
|
||||
|
||||
<script>
|
||||
document.getElementById("open-study-env").addEventListener("click", () => {
|
||||
document.getElementById("study-env-dialog").open = true
|
||||
document.getElementById("study-env-iframe").src = "http://jslinux.cxykevin.top"
|
||||
});
|
||||
</script>
|
||||
<script>
|
||||
document.getElementById("open-study-env").addEventListener("click", () => {
|
||||
document.getElementById("study-env-dialog").open = true
|
||||
document.getElementById("study-env-iframe").src = "http://jslinux.cxykevin.top"
|
||||
});
|
||||
</script>
|
||||
|
||||
<div style="height:10em;margin-top:2em;margin-left:2em;margin-right:2em;display:flex">
|
||||
{{#previous}}
|
||||
<mdui-card clickable style="width:49%;height: 100%" href="{{ path_to_root }}{{link}}">
|
||||
<div style="display:flex;font-size:1.5em">
|
||||
<mdui-icon name="navigate_before" style="font-size:1.5em"></mdui-icon> 上一章
|
||||
</div>
|
||||
<div style="height:10em;margin-top:2em;margin-left:2em;margin-right:2em;display:flex">
|
||||
{{#previous}}
|
||||
<mdui-card clickable style="width:49%;height: 100%" href="{{ path_to_root }}{{link}}">
|
||||
<div style="display:flex;font-size:1.5em">
|
||||
<mdui-icon name="navigate_before" style="font-size:1.5em"></mdui-icon> 上一章
|
||||
</div>
|
||||
|
||||
<div style="text-align:center;font-size:2em">
|
||||
{{title}}
|
||||
</div>
|
||||
</mdui-card>
|
||||
{{/previous}}
|
||||
<div style="text-align:center;font-size:2em">
|
||||
{{title}}
|
||||
</div>
|
||||
</mdui-card>
|
||||
{{/previous}}
|
||||
|
||||
<div style="flex-grow:1"></div>
|
||||
<div style="flex-grow:1"></div>
|
||||
|
||||
{{#next}}
|
||||
<mdui-card clickable style="width:49%;height: 100%" href="{{ path_to_root }}{{link}}">
|
||||
<div style="display:flex;font-size:1.5em">
|
||||
<div style="flex-grow:1"></div>下一章<mdui-icon name="navigate_next" style="font-size:1.5em"></mdui-icon>
|
||||
</div>
|
||||
{{#next}}
|
||||
<mdui-card clickable style="width:49%;height: 100%" href="{{ path_to_root }}{{link}}">
|
||||
<div style="display:flex;font-size:1.5em">
|
||||
<div style="flex-grow:1"></div>下一章<mdui-icon name="navigate_next"
|
||||
style="font-size:1.5em"></mdui-icon>
|
||||
</div>
|
||||
|
||||
<div style="text-align:center;font-size:2em">
|
||||
{{title}}
|
||||
</div>
|
||||
</mdui-card>
|
||||
{{/next}}
|
||||
</div>
|
||||
<div style="text-align:center;font-size:2em">
|
||||
{{title}}
|
||||
</div>
|
||||
</mdui-card>
|
||||
{{/next}}
|
||||
</div>
|
||||
</mdui-layout-main>
|
||||
|
||||
{{#if live_reload_endpoint}}
|
||||
|
|
@ -217,4 +208,4 @@
|
|||
<script>hljs.highlightAll();</script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
</html>
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Reference in New Issue