SACP2: 完成大部分美化 #14
13
book.toml
13
book.toml
|
|
@ -4,3 +4,16 @@ language = "zh-cn"
|
||||||
multilingual = false
|
multilingual = false
|
||||||
src = "src"
|
src = "src"
|
||||||
title = "Study Area CN"
|
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 -->
|
<!-- MDUI CSS&JS -->
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, shrink-to-fit=no"/>
|
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, shrink-to-fit=no" />
|
||||||
<meta name="renderer" content="webkit"/>
|
<meta name="renderer" content="webkit" />
|
||||||
|
<link rel="stylesheet" href="{{ ../path_to_root }}theme/css/mdui.css">
|
||||||
<link rel="stylesheet" href="https://unpkg.com/mdui@2/mdui.css">
|
<script src="{{ ../path_to_root }}theme/js/mdui.global.js"></script>
|
||||||
<script src="https://unpkg.com/mdui@2/mdui.global.js"></script>
|
<link href="{{ ../path_to_root }}theme/css/icons.css" rel="stylesheet">
|
||||||
|
|
||||||
|
|
||||||
<!-- Material Icons Font (Filled) -->
|
|
||||||
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
|
|
||||||
|
|
||||||
<meta name="description" content="Study Area CN {{ description }}">
|
<meta name="description" content="Study Area CN {{ description }}">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
<meta name="theme-color" content="#ffffff">
|
<meta name="theme-color" content="#ffffff">
|
||||||
<meta name="keywords"
|
<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}}
|
{{#if favicon_svg}}
|
||||||
<link rel="icon" href="{{ path_to_root }}favicon.svg">
|
<link rel="icon" href="{{ path_to_root }}favicon.png">
|
||||||
{{/if}}
|
{{/if}}
|
||||||
{{#if favicon_png}}
|
{{#if favicon_png}}
|
||||||
<link rel="shortcut icon" href="{{ path_to_root }}favicon.png">
|
<link rel="shortcut icon" href="{{ path_to_root }}favicon.png">
|
||||||
|
|
@ -47,73 +43,71 @@
|
||||||
{{/if}}
|
{{/if}}
|
||||||
|
|
||||||
<!-- Highlight.js Stylesheets -->
|
<!-- Highlight.js Stylesheets -->
|
||||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/default.min.css">
|
<link rel="stylesheet" href="{{ ../path_to_root }}theme/css/highlight.min.css">
|
||||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/highlight.min.js"></script>
|
<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}}
|
{{#if mathjax_support}}
|
||||||
<!-- MathJax -->
|
<!-- MathJax -->
|
||||||
<script async
|
<script async src="{{ ../path_to_root }}theme/js/mathjax.js"></script>
|
||||||
src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
|
|
||||||
{{/if}}
|
{{/if}}
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
ol,li{
|
ol,
|
||||||
list-style:none;
|
li {
|
||||||
font-size:1em;
|
list-style: none;
|
||||||
}
|
font-size: 1em;
|
||||||
|
}
|
||||||
|
|
||||||
.part-title{
|
.part-title {
|
||||||
font-weight:bold;
|
font-weight: bold;
|
||||||
font-size:1.2em;
|
font-size: 1.2em;
|
||||||
}
|
}
|
||||||
|
|
||||||
a {
|
a {
|
||||||
position: relative;
|
position: relative;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
color: rgb(var(--mdui-color-primary));
|
color: rgb(var(--mdui-color-primary));
|
||||||
}
|
}
|
||||||
|
|
||||||
a:after {
|
a:after {
|
||||||
content: "";
|
content: "";
|
||||||
position: absolute;
|
position: absolute;
|
||||||
bottom: -2px;
|
bottom: -2px;
|
||||||
left: 50%;
|
left: 50%;
|
||||||
width: 0;
|
width: 0;
|
||||||
height: 2px;
|
height: 2px;
|
||||||
transition: width 0.3s ease-in-out, left 0.3s ease-in-out;
|
transition: width 0.3s ease-in-out, left 0.3s ease-in-out;
|
||||||
background-color: rgb(var(--mdui-color-primary))
|
background-color: rgb(var(--mdui-color-primary))
|
||||||
}
|
}
|
||||||
|
|
||||||
a:hover:after {
|
a:hover:after {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
left: 0;
|
left: 0;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</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-layout style="height:100%">
|
||||||
<mdui-top-app-bar>
|
<mdui-top-app-bar>
|
||||||
<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>
|
||||||
{{#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}}
|
||||||
{{#if print_enable}}
|
{{#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>
|
</mdui-button-icon>
|
||||||
{{/if}}
|
{{/if}}
|
||||||
</mdui-top-app-bar>
|
</mdui-top-app-bar>
|
||||||
|
|
||||||
<mdui-navigation-drawer close-on-overlay-click class="toc-drawer">
|
<mdui-navigation-drawer close-on-overlay-click class="toc-drawer">
|
||||||
{{#toc}}{{/toc}}
|
{{#toc}}{{/toc}}
|
||||||
</mdui-navigation-drawer>
|
</mdui-navigation-drawer>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
|
@ -124,52 +118,49 @@
|
||||||
</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:20px;margin-right:20px;">
|
<div class="mdui-prose" style="margin-left:20px;margin-right:20px;">
|
||||||
{{{ content }}}
|
{{{ content }}}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<mdui-dialog
|
<mdui-dialog headline="Study Env" close-on-esc id="study-env-dialog">
|
||||||
headline="Study Env"
|
<iframe src="about:blank" style="height:80%;width:99%" id="study-env-iframe"></iframe>
|
||||||
close-on-esc
|
</mdui-dialog>
|
||||||
id="study-env-dialog"
|
|
||||||
>
|
|
||||||
<iframe src="about:blank" style="height:80%;width:99%" id="study-env-iframe"></iframe>
|
|
||||||
</mdui-dialog>
|
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
document.getElementById("open-study-env").addEventListener("click", () => {
|
document.getElementById("open-study-env").addEventListener("click", () => {
|
||||||
document.getElementById("study-env-dialog").open = true
|
document.getElementById("study-env-dialog").open = true
|
||||||
document.getElementById("study-env-iframe").src = "http://jslinux.cxykevin.top"
|
document.getElementById("study-env-iframe").src = "http://jslinux.cxykevin.top"
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<div style="height:10em;margin-top:2em;margin-left:2em;margin-right:2em;display:flex">
|
<div style="height:10em;margin-top:2em;margin-left:2em;margin-right:2em;display:flex">
|
||||||
{{#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.5em">
|
||||||
<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:2em">
|
||||||
{{title}}
|
{{title}}
|
||||||
</div>
|
</div>
|
||||||
</mdui-card>
|
</mdui-card>
|
||||||
{{/previous}}
|
{{/previous}}
|
||||||
|
|
||||||
<div style="flex-grow:1"></div>
|
<div style="flex-grow:1"></div>
|
||||||
|
|
||||||
{{#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.5em">
|
||||||
<div style="flex-grow:1"></div>下一章<mdui-icon name="navigate_next" style="font-size:1.5em"></mdui-icon>
|
<div style="flex-grow:1"></div>下一章<mdui-icon name="navigate_next"
|
||||||
</div>
|
style="font-size:1.5em"></mdui-icon>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div style="text-align:center;font-size:2em">
|
<div style="text-align:center;font-size:2em">
|
||||||
{{title}}
|
{{title}}
|
||||||
</div>
|
</div>
|
||||||
</mdui-card>
|
</mdui-card>
|
||||||
{{/next}}
|
{{/next}}
|
||||||
</div>
|
</div>
|
||||||
</mdui-layout-main>
|
</mdui-layout-main>
|
||||||
|
|
||||||
{{#if live_reload_endpoint}}
|
{{#if live_reload_endpoint}}
|
||||||
|
|
@ -217,4 +208,4 @@
|
||||||
<script>hljs.highlightAll();</script>
|
<script>hljs.highlightAll();</script>
|
||||||
</body>
|
</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