add _extensions
This commit is contained in:
@@ -0,0 +1,3 @@
|
||||
*_files
|
||||
*.html
|
||||
/*.png
|
||||
@@ -0,0 +1,21 @@
|
||||
title: revealjs format for drwater
|
||||
author: Ming Su
|
||||
version: 1.0.0
|
||||
quarto-required: ">=1.3.0"
|
||||
contributes:
|
||||
formats:
|
||||
revealjs:
|
||||
theme: [default, _extensions/drwater/dwsd/inst/dwsd.scss]
|
||||
css: _extensions/drwater/dwsd/inst/dwsd.css
|
||||
slide-number: true
|
||||
logo: _extensions/drwater/dwsd/inst/rceeslogo.svg
|
||||
include-after-body: _extensions/drwater/dwsd/inst/autoscale.js
|
||||
chalkboard:
|
||||
buttons: true
|
||||
preview-links: auto
|
||||
toc: true
|
||||
toc-depth: 1
|
||||
pointer:
|
||||
key: "p"
|
||||
color: "#FF0000"
|
||||
pointerSize: 32
|
||||
@@ -0,0 +1,17 @@
|
||||
<script>
|
||||
document.addEventListener("DOMContentLoaded", function () {
|
||||
const title = document.querySelector("section#title-slide h1.title");
|
||||
if (!title) return;
|
||||
|
||||
const lineHeight = parseFloat(getComputedStyle(title).lineHeight);
|
||||
const maxHeight = lineHeight * 1.5; // 限制为两行
|
||||
|
||||
let fontSize = parseFloat(getComputedStyle(title).fontSize);
|
||||
|
||||
// 循环缩小字体直到标题高度 <= 两行
|
||||
while (title.scrollHeight > maxHeight && fontSize > 10) {
|
||||
fontSize -= 1;
|
||||
title.style.fontSize = fontSize + "px";
|
||||
}
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,13 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="84.75pt" height="84.75pt" viewBox="0 0 84.75 84.75">
|
||||
<defs>
|
||||
<clipPath id="clip-0">
|
||||
<path clip-rule="nonzero" d="M 13.617188 5.371094 L 71 5.371094 L 71 47.886719 L 13.617188 47.886719 Z M 13.617188 5.371094 "/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
<g clip-path="url(#clip-0)">
|
||||
<path fill-rule="nonzero" fill="rgb(16.078186%, 43.528748%, 20.391846%)" fill-opacity="1" d="M 69.984375 17.222656 L 42.835938 5.476562 C 42.503906 5.335938 42.125 5.335938 41.792969 5.476562 L 14.644531 17.222656 C 13.777344 17.675781 13.4375 18.746094 13.886719 19.621094 C 14.054688 19.949219 14.320312 20.214844 14.644531 20.386719 L 41.792969 32.132812 C 42.121094 32.277344 42.496094 32.277344 42.824219 32.132812 L 63.9375 22.984375 L 63.9375 32.335938 C 62.050781 33.488281 61.449219 35.960938 62.59375 37.863281 C 62.925781 38.414062 63.386719 38.878906 63.9375 39.214844 L 63.9375 42.480469 L 66.714844 42.480469 L 66.714844 39.214844 C 68.601562 38.0625 69.203125 35.589844 68.058594 33.691406 C 67.722656 33.136719 67.261719 32.671875 66.714844 32.335938 L 66.714844 21.792969 L 69.984375 20.371094 C 70.847656 19.914062 71.179688 18.839844 70.726562 17.96875 C 70.558594 17.648438 70.300781 17.390625 69.984375 17.222656 Z M 42.316406 34.488281 C 41.898438 34.488281 41.488281 34.402344 41.105469 34.234375 L 24.179688 26.90625 L 24.179688 37.023438 C 24.179688 45.3125 36.523438 47.796875 40.378906 47.796875 L 44.199219 47.796875 C 47.085938 47.796875 60.402344 45.3125 60.402344 37.023438 L 60.402344 26.90625 L 43.472656 34.246094 C 43.070312 34.417969 42.636719 34.5 42.199219 34.488281 Z M 42.316406 34.488281 "/>
|
||||
</g>
|
||||
<path fill-rule="evenodd" fill="rgb(16.078186%, 43.528748%, 20.391846%)" fill-opacity="1" d="M 31.371094 50.25 L 46.289062 50.25 C 48.054688 50.25 49.804688 50.445312 51.511719 50.828125 L 53.25 51.425781 L 44.996094 65.046875 C 42.972656 68.386719 42.972656 72.570312 44.996094 75.910156 L 45.066406 76.003906 L 45.632812 78.78125 C 40.878906 78.78125 36.125 81 31.371094 81 C 18.601562 81 8.25 78.78125 8.25 73.789062 L 8.25 72.359375 C 8.25 60.148438 18.601562 50.25 31.371094 50.25 Z M 31.371094 50.25 "/>
|
||||
<path fill-rule="evenodd" fill="rgb(16.078186%, 43.528748%, 20.391846%)" fill-opacity="1" d="M 62.039062 50.550781 L 70.492188 64.464844 C 73.484375 69.390625 71.882812 75.789062 66.917969 78.753906 C 61.949219 81.722656 55.496094 80.136719 52.507812 75.210938 C 50.496094 71.902344 50.496094 67.769531 52.507812 64.464844 L 60.957031 50.554688 C 61.136719 50.257812 61.527344 50.160156 61.824219 50.339844 C 61.914062 50.394531 61.988281 50.464844 62.039062 50.554688 Z M 62.039062 50.550781 "/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.7 KiB |
Executable
+109
@@ -0,0 +1,109 @@
|
||||
.udot {
|
||||
text-decoration-line: underline;
|
||||
text-decoration-color: rgb(50, 50, 50);
|
||||
text-decoration-style: dashed;
|
||||
text-decoration-thickness: 1px;
|
||||
}
|
||||
|
||||
.good {
|
||||
background-color: forestgreen;
|
||||
color: lightyellow;
|
||||
}
|
||||
|
||||
.bad {
|
||||
background-color: orangered;
|
||||
color: lightyellow;
|
||||
}
|
||||
|
||||
.del {
|
||||
text-decoration-line: line-through;
|
||||
text-decoration-color: rgb(222 13 13);
|
||||
text-decoration-style: initial;
|
||||
text-decoration-thickness: 1.5px;
|
||||
}
|
||||
|
||||
|
||||
.todo {
|
||||
background-color: darkorange;
|
||||
color: lightyellow;
|
||||
}
|
||||
|
||||
.com {
|
||||
background-color: #0025ff;
|
||||
font-weight: bold;
|
||||
color: lightyellow;
|
||||
}
|
||||
|
||||
.add {
|
||||
text-decoration-line: underline;
|
||||
text-decoration-color: rgb(222 13 13);
|
||||
background-color: violet;
|
||||
text-decoration-style: initial;
|
||||
text-decoration-thickness: 2px;
|
||||
}
|
||||
|
||||
|
||||
del {
|
||||
text-decoration-line: line-through;
|
||||
text-decoration-color: rgb(222 13 13);
|
||||
text-decoration-style: initial;
|
||||
text-decoration-thickness: 1.0px;
|
||||
}
|
||||
|
||||
|
||||
ins {
|
||||
text-decoration-color: rgb(222 93 93);
|
||||
background-color: violet;
|
||||
text-decoration-style: initial;
|
||||
text-decoration-thickness: 2px;
|
||||
}
|
||||
|
||||
.clab {
|
||||
background-color: rgb(255, 245, 240);
|
||||
}
|
||||
|
||||
.rem {
|
||||
background-color: darkorange;
|
||||
color: lightyellow;
|
||||
text-decoration-thickness: 2px;
|
||||
}
|
||||
|
||||
|
||||
#criticnav {
|
||||
position: fixed;
|
||||
z-index: 1100;
|
||||
top: 0;
|
||||
right: 0;
|
||||
width: 120px;
|
||||
border-bottom: solid 1px #ffffff;
|
||||
margin: 0;
|
||||
padding: 10;
|
||||
background-color: rgb(143 38 38 / 95%);
|
||||
color: #ffffff;
|
||||
font-size: 12px;
|
||||
font-family: "Helvetica Neue", helvetica, arial, sans-serif !important
|
||||
}
|
||||
|
||||
#criticnav ul {
|
||||
list-style-type: none;
|
||||
width: 90%;
|
||||
margin: 0 auto;
|
||||
padding: 0
|
||||
}
|
||||
|
||||
#criticnav ul li {
|
||||
display: block;
|
||||
width: 100px;
|
||||
min-width: 80px;
|
||||
text-align: center;
|
||||
padding: 5px 0 3px !important;
|
||||
margin: 5px 2px !important;
|
||||
line-height: 1em;
|
||||
float: center;
|
||||
text-transform: uppercase;
|
||||
cursor: pointer;
|
||||
border-radius: 20px;
|
||||
border: 3px solid rgba(255,255,255,0);
|
||||
color: #fff !important
|
||||
}
|
||||
|
||||
@@ -0,0 +1,415 @@
|
||||
/*-- scss:defaults --*/
|
||||
|
||||
$theme: "drwater" !default;
|
||||
|
||||
//
|
||||
// Color system
|
||||
//
|
||||
|
||||
$white: #ffffff !default;
|
||||
$gray-100: #f8f9fa !default;
|
||||
$gray-200: #e9ecef !default;
|
||||
$gray-300: #dee2e6 !default;
|
||||
$gray-400: #ced4da !default;
|
||||
$gray-500: #adb5bd !default;
|
||||
$gray-600: #868e96 !default;
|
||||
$gray-700: #495057 !default;
|
||||
$gray-800: #373a3c !default;
|
||||
$gray-900: #212529 !default;
|
||||
$black: #000000 !default;
|
||||
|
||||
$blue: #2780e3 !default;
|
||||
$indigo: #6610f2 !default;
|
||||
$purple: #170c3a !default;
|
||||
$pink: #a52c60 !default;
|
||||
$red: #cf4446 !default;
|
||||
$orange: #ee6a24 !default;
|
||||
$light-orange: #fb9e07 !default;
|
||||
$yellow: #f6d645 !default;
|
||||
$green: #118230 !default;
|
||||
$teal: #20c997 !default;
|
||||
$cyan: #3093cf !default;
|
||||
|
||||
$primary: $pink !default;
|
||||
$secondary: $gray-700 !default;
|
||||
$success: $green !default;
|
||||
$info: $cyan !default;
|
||||
$warning: $orange !default;
|
||||
$danger: $red !default;
|
||||
$light: $gray-400 !default;
|
||||
$dark: $black !default;
|
||||
|
||||
// Fonts
|
||||
|
||||
$font-family-sans-serif: "Libre Franklin" !default;
|
||||
|
||||
$headings-font-family: "Jost" !default;
|
||||
$headings-font-weight: 600 !default;
|
||||
|
||||
$navbar-font-family: "Jost" !default;
|
||||
$toc-font-family: "Jost" !default;
|
||||
$footer-font-family: "Jost" !default;
|
||||
|
||||
// Body
|
||||
$body-color: $gray-900 !default;
|
||||
|
||||
// Links
|
||||
$link-color: $orange !default;
|
||||
$link-decoration: none !default;
|
||||
$link-hover-color: $red !default;
|
||||
$link-hover-decoration: underline !default;
|
||||
|
||||
// Inline code
|
||||
$code-bg: $gray-200 !default;
|
||||
$code-color: $gray-900 !default;
|
||||
|
||||
// Code copy
|
||||
$btn-code-copy-color-active: $orange !default;
|
||||
|
||||
// TOC
|
||||
$toc-color: $orange;
|
||||
$toc-font-size: 1em;
|
||||
|
||||
// Navbar
|
||||
$navbar-bg: $purple !default;
|
||||
$navbar-fg: $white !default;
|
||||
$navbar-hl: $light-orange !default;
|
||||
|
||||
// Footer
|
||||
$footer-bg: $gray-900 !default;
|
||||
$footer-fg: $gray-300 !default;
|
||||
|
||||
/*-- scss:rules --*/
|
||||
|
||||
$web-font-path: "https://fonts.googleapis.com/css2?family=Jost:ital,wght@0,100..900;1,100..900&family=Libre+Franklin:ital,wght@0,100..900;1,100..900&display=swap" !default;
|
||||
|
||||
@if $web-font-path {
|
||||
@import url($web-font-path);
|
||||
}
|
||||
|
||||
body {
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
|
||||
/* Logo 悬停效果 */
|
||||
.navbar-brand img {
|
||||
transition: all 0.3s ease;
|
||||
filter: brightness(0) invert(1);
|
||||
|
||||
&:hover {
|
||||
filter: brightness(0) invert(0.55) sepia(1) saturate(2000%) hue-rotate(-8deg) brightness(1.05) contrast(1.2);
|
||||
transform: scale(1.05);
|
||||
}
|
||||
}
|
||||
|
||||
// =============================================
|
||||
// 桌面端样式 - 使用悬停展开下拉菜单
|
||||
// =============================================
|
||||
@media (min-width: 992px) {
|
||||
/* 导航栏主菜单项样式 */
|
||||
.navbar-nav .nav-item {
|
||||
position: relative;
|
||||
margin: 0 0.2rem;
|
||||
|
||||
.nav-link {
|
||||
position: relative;
|
||||
color: $navbar-fg !important;
|
||||
font-weight: 500;
|
||||
padding: 0.75rem 1rem !important;
|
||||
border-radius: 8px;
|
||||
transition: all 0.3s ease;
|
||||
z-index: 1;
|
||||
|
||||
/* 玻璃效果背景 */
|
||||
&::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background: rgba($white, 0.1);
|
||||
backdrop-filter: blur(10px);
|
||||
border-radius: 8px;
|
||||
opacity: 0;
|
||||
transition: all 0.3s ease;
|
||||
z-index: -1;
|
||||
border: 1px solid rgba($white, 0.2);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
color: $light-orange !important;
|
||||
transform: translateY(-2px);
|
||||
|
||||
&::before {
|
||||
opacity: 1;
|
||||
background: rgba($white, 0.15);
|
||||
backdrop-filter: blur(15px);
|
||||
box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
|
||||
}
|
||||
}
|
||||
|
||||
/* 激活状态 */
|
||||
&.active {
|
||||
color: $light-orange !important;
|
||||
font-weight: 600;
|
||||
|
||||
&::before {
|
||||
opacity: 1;
|
||||
background: rgba($light-orange, 0.2);
|
||||
backdrop-filter: blur(15px);
|
||||
border: 1px solid rgba($light-orange, 0.3);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* 有下拉菜单的主菜单项特殊样式 */
|
||||
.navbar-nav .nav-item.dropdown {
|
||||
.nav-link {
|
||||
padding-right: 2rem !important;
|
||||
|
||||
&::after {
|
||||
position: absolute;
|
||||
right: 1rem;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
}
|
||||
|
||||
&:hover .nav-link::before {
|
||||
opacity: 1;
|
||||
background: rgba($white, 0.2);
|
||||
backdrop-filter: blur(20px);
|
||||
border-bottom-left-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
}
|
||||
|
||||
&:hover .nav-link::after {
|
||||
transform: translateY(-50%) rotate(-180deg);
|
||||
border-top-color: $light-orange;
|
||||
}
|
||||
}
|
||||
|
||||
/* 桌面端下拉菜单悬停效果 */
|
||||
.navbar-nav .nav-item.dropdown:hover .dropdown-menu {
|
||||
display: block !important;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
transform: translateY(0) !important;
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
display: block;
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
transform: translateY(-10px);
|
||||
transition: all 0.3s ease;
|
||||
background: rgba($purple, 0.98) !important;
|
||||
backdrop-filter: blur(20px);
|
||||
border: 1px solid rgba($white, 0.1);
|
||||
border-top: none;
|
||||
border-radius: 0 0 8px 8px;
|
||||
box-shadow: 0 8px 30px rgba(0, 0, 0, 0.2);
|
||||
margin-top: -1px;
|
||||
padding: 0.5rem 0;
|
||||
|
||||
&.show {
|
||||
display: block;
|
||||
opacity: 1;
|
||||
visibility: visible;
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
|
||||
.dropdown-item {
|
||||
color: $white !important;
|
||||
font-family: $navbar-font-family;
|
||||
padding: 0.75rem 1.5rem;
|
||||
transition: all 0.2s ease;
|
||||
position: relative;
|
||||
|
||||
/* 下拉菜单项的玻璃效果 */
|
||||
&::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background: rgba($white, 0.05);
|
||||
border-radius: 4px;
|
||||
opacity: 0;
|
||||
transition: all 0.2s ease;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
&:hover, &:focus {
|
||||
color: $light-orange !important;
|
||||
transform: translateX(5px);
|
||||
background: transparent !important;
|
||||
|
||||
&::before {
|
||||
opacity: 1;
|
||||
background: rgba($white, 0.1);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* 确保下拉菜单与主菜单视觉上连接 */
|
||||
.navbar-nav .nav-item.dropdown:hover .nav-link {
|
||||
border-bottom-left-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
}
|
||||
}
|
||||
|
||||
// =============================================
|
||||
// 移动端样式 - 使用点击展开下拉菜单
|
||||
// =============================================
|
||||
@media (max-width: 991.98px) {
|
||||
/* 完全重置移动端导航样式，使用 Bootstrap 默认行为 */
|
||||
.navbar-collapse {
|
||||
background: rgba($purple, 0.98);
|
||||
backdrop-filter: blur(10px);
|
||||
border-top: 1px solid rgba($white, 0.1);
|
||||
margin-top: 0.5rem;
|
||||
padding: 0.5rem 0;
|
||||
|
||||
.navbar-nav {
|
||||
.nav-item {
|
||||
margin: 0;
|
||||
|
||||
.nav-link {
|
||||
color: $navbar-fg !important;
|
||||
padding: 1rem 1.5rem !important;
|
||||
border-radius: 0;
|
||||
transition: all 0.2s ease;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
&:hover {
|
||||
color: $light-orange !important;
|
||||
background: rgba($white, 0.1);
|
||||
}
|
||||
|
||||
&.active {
|
||||
color: $light-orange !important;
|
||||
background: rgba($light-orange, 0.1);
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
|
||||
/* 下拉菜单项样式 */
|
||||
&.dropdown {
|
||||
.dropdown-toggle::after {
|
||||
transition: transform 0.3s ease;
|
||||
}
|
||||
|
||||
&.show {
|
||||
.dropdown-toggle {
|
||||
color: $light-orange !important;
|
||||
background: rgba($white, 0.15);
|
||||
|
||||
&::after {
|
||||
transform: rotate(-180deg);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
background: rgba(darken($purple, 5%), 0.95) !important;
|
||||
border: none;
|
||||
border-radius: 0;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
position: static;
|
||||
float: none;
|
||||
display: none;
|
||||
|
||||
&.show {
|
||||
display: block !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端下拉菜单项 */
|
||||
.dropdown-item {
|
||||
color: $navbar-fg !important;
|
||||
padding: 0.875rem 1.5rem 0.875rem 2.5rem !important;
|
||||
border-radius: 0;
|
||||
transition: all 0.2s ease;
|
||||
|
||||
&:hover, &:focus {
|
||||
color: $light-orange !important;
|
||||
background: rgba($white, 0.1) !important;
|
||||
transform: none;
|
||||
}
|
||||
|
||||
&.active {
|
||||
color: $light-orange !important;
|
||||
background: rgba($light-orange, 0.1) !important;
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端导航栏折叠按钮 */
|
||||
.navbar-toggler {
|
||||
border: 1px solid rgba($white, 0.2);
|
||||
padding: 0.5rem 0.75rem;
|
||||
|
||||
&:focus {
|
||||
box-shadow: 0 0 0 0.2rem rgba($light-orange, 0.25);
|
||||
}
|
||||
|
||||
.navbar-toggler-icon {
|
||||
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.8%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
|
||||
}
|
||||
}
|
||||
|
||||
/* 禁用桌面端的悬停效果 */
|
||||
.navbar-nav .nav-item .nav-link::before {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.navbar-nav .nav-item.dropdown:hover .dropdown-menu {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
// =============================================
|
||||
// 通用样式
|
||||
// =============================================
|
||||
|
||||
/* 导航栏整体样式 */
|
||||
.navbar {
|
||||
backdrop-filter: blur(10px);
|
||||
background: rgba($purple, 0.95) !important;
|
||||
border-bottom: 1px solid rgba($white, 0.1);
|
||||
}
|
||||
|
||||
/* 为有下拉菜单的导航项添加视觉指示 */
|
||||
.navbar-nav .nav-item.dropdown > .nav-link::after {
|
||||
display: inline-block;
|
||||
margin-left: 0.255em;
|
||||
vertical-align: 0.255em;
|
||||
content: "";
|
||||
border-top: 0.3em solid;
|
||||
border-right: 0.3em solid transparent;
|
||||
border-bottom: 0;
|
||||
border-left: 0.3em solid transparent;
|
||||
}
|
||||
|
||||
/* 确保 Bootstrap 的 JavaScript 交互正常工作 */
|
||||
.navbar-nav .dropdown-toggle::after {
|
||||
display: inline-block !important;
|
||||
}
|
||||
|
||||
/* 修复移动端点击事件 */
|
||||
.navbar-nav .nav-item.dropdown .nav-link {
|
||||
cursor: pointer;
|
||||
}
|
||||
@@ -0,0 +1,478 @@
|
||||
|
||||
|
||||
.quarto-title-author-name {
|
||||
font-size: var(--r-heading3-size);
|
||||
/* color: var(--r-heading-color); */
|
||||
}
|
||||
|
||||
.quarto-title-affiliation {
|
||||
font-size: 1.2em;
|
||||
/* color: var(--r-heading-color); */
|
||||
}
|
||||
|
||||
.reveal .quarto-title-block .quarto-title-authors .quarto-title-author .quarto-title-affiliation {
|
||||
font-size: 1.2em;
|
||||
/* color: var(--r-heading-color); */
|
||||
margin-top: 0px;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
|
||||
section#title-slide p.date {
|
||||
font-size: 1.2em;
|
||||
/* font-size: var(--r-heading3-size); */
|
||||
}
|
||||
|
||||
section#title-slide h1.title {
|
||||
position: relative;
|
||||
padding-bottom: 30px; /* 留空间（可调整） */
|
||||
}
|
||||
|
||||
/* 长细线 —— 在上 */
|
||||
section#title-slide h1.title::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
bottom: 0px; /* 粗线的高度，让两条底对齐 */
|
||||
width: 360px;
|
||||
height: 1px;
|
||||
background-color: var(--r-heading-color);
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
/* 短粗线 —— 在下 */
|
||||
section#title-slide h1.title::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
bottom: 0; /* 底边紧贴标题的“底部参考线” */
|
||||
width: 60px;
|
||||
height: 3px;
|
||||
background-color: var(--r-heading-color);
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
|
||||
section#title-slide p.subtitle {
|
||||
font-size: var(--r-heading2-size);
|
||||
/* text-decoration: underline; */
|
||||
color: var(--r-heading-color);
|
||||
}
|
||||
|
||||
section#title-slide a {
|
||||
color: var(--r-link-color);
|
||||
}
|
||||
|
||||
.reveal .slide-number a {
|
||||
color: #bbbbbb;
|
||||
font-size: 10pt;
|
||||
}
|
||||
|
||||
section#title-slide a:hover {
|
||||
color: var(--r-link-color-hover);
|
||||
}
|
||||
|
||||
.reveal[data-navigation-mode="linear"] .title-slide h1 {
|
||||
font-size: var(--r-heading2-size);
|
||||
}
|
||||
|
||||
/* 最后的TOC不显示 */
|
||||
#TOC ul li:last-child {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
|
||||
/* 1) 让 TOC section 成为一个居中列容器（垂直方向可调） */
|
||||
section#TOC {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center; /* 水平居中子内容（h2 与 ul 的容器） */
|
||||
justify-content: flex-start;/* 若想垂直居中用 'center' */
|
||||
padding-top: 6vh; /* 页面顶部留白，可按需调整 */
|
||||
box-sizing: border-box;
|
||||
height: 100%; /* 保证填满 slide 区域，方便垂直定位 */
|
||||
text-align: center; /* 默认居中（标题） */
|
||||
}
|
||||
|
||||
/* 2) 标题样式 - 宽度随内容自适应并居中 */
|
||||
section#TOC h2 {
|
||||
display: inline-block; /* 宽度随文本 */
|
||||
margin: 0 0 18px 0; /* 标题与下面线/正文的距离（可调） */
|
||||
position: relative;
|
||||
padding-bottom: 0; /* 不要多余的内边距 */
|
||||
line-height: 1.1;
|
||||
}
|
||||
|
||||
section#TOC h2:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 100%;
|
||||
margin-top: 8px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
width: 360px;
|
||||
height: 1px;
|
||||
background-color: var(--r-heading-color);
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
/* 粗短线 */
|
||||
section#TOC h2:before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 100%;
|
||||
margin-top: 5px; /* 调整这两个 margin 差值可控制细/粗线相对位置 */
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
width: 60px;
|
||||
height: 3px;
|
||||
background-color: var(--r-heading-color);
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* 3) 将 nav 内部内容限制到中间 60% 宽度区域并水平居中 */
|
||||
section#TOC nav {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center; /* 把 ul 的容器居中 */
|
||||
}
|
||||
|
||||
/* 4) 列表限制为中间 60% 区域，内容左对齐 */
|
||||
|
||||
/* 默认/英文样式 */
|
||||
section#TOC ul,
|
||||
section#TOC ol {
|
||||
width: 50%;
|
||||
max-width: 760px;
|
||||
min-width: 280px;
|
||||
margin: 0;
|
||||
padding-left: 1.0em;
|
||||
text-align: left;
|
||||
list-style-position: inside;
|
||||
list-style-type: decimal; /* 英文默认使用数字 */
|
||||
box-sizing: border-box;
|
||||
line-height: 2.6em;
|
||||
}
|
||||
|
||||
/* 中文样式 */
|
||||
section#TOC[lang|="zh"] ul,
|
||||
section#TOC[lang|="zh"] ol,
|
||||
html[lang|="zh"] section#TOC ul,
|
||||
html[lang|="zh"] section#TOC ol {
|
||||
list-style-type: cjk-ideographic;
|
||||
padding-left: 1.2em; /* 中文可能需要稍大缩进 */
|
||||
}
|
||||
|
||||
|
||||
/* 5) 单项样式（覆盖你之前重复的规则，确保优先级） */
|
||||
section#TOC ul li,
|
||||
section#TOC ol li {
|
||||
font-size: var(--r-heading3-size);
|
||||
color: var(--r-heading-color);
|
||||
font-weight: bold;
|
||||
margin: .35em 0;
|
||||
word-break: break-word;
|
||||
}
|
||||
|
||||
|
||||
/* 链接配色 */
|
||||
section#TOC a {
|
||||
color: var(--r-heading-color);
|
||||
text-decoration: none;
|
||||
}
|
||||
section#TOC a:hover {
|
||||
color: var(--r-link-color-hover);
|
||||
text-decoration: underline;
|
||||
/* font-size: var(--r-heading3-size); */
|
||||
}
|
||||
|
||||
/* 6) 响应式微调（小屏幕时让列表宽度更宽占比） */
|
||||
@media (max-width: 900px) {
|
||||
section#TOC ul,
|
||||
section#TOC ol {
|
||||
width: 80%;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.reveal .title-slide h1 {
|
||||
text-align: center;
|
||||
line-height: var(--r-heading-line-height);
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
/* 细长线 */
|
||||
.reveal .title-slide h1:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 100%;
|
||||
margin-top: 8px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
width: 360px;
|
||||
height: 1px;
|
||||
background-color: var(--r-heading-color);
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
/* 粗短线 */
|
||||
.reveal .title-slide h1:before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 100%;
|
||||
margin-top: 5px; /* 调整这两个 margin 差值可控制细/粗线相对位置 */
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
width: 60px;
|
||||
height: 3px;
|
||||
background-color: var(--r-heading-color);
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.reveal h2 {
|
||||
text-align: left;
|
||||
margin-top: 0px;
|
||||
line-height: var(--r-heading-line-height);
|
||||
width: auto;
|
||||
position: relative; /* 关键：建立相对定位容器 */
|
||||
display: inline-block; /* 让h2宽度自适应内容 */
|
||||
}
|
||||
|
||||
.reveal h2:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 0; /* 跟随h2的左对齐 */
|
||||
top: 100%;
|
||||
margin-top: 8px;
|
||||
width: 360px;
|
||||
height: 1px;
|
||||
background-color: var(--r-heading-color);
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
.reveal h2:before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 0; /* 跟随h2的左对齐 */
|
||||
top: 100%;
|
||||
margin-top: 5px;
|
||||
width: 60px;
|
||||
height: 3px;
|
||||
background-color: var(--r-heading-color);
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
|
||||
.reveal ul {
|
||||
list-style-type: circle;
|
||||
}
|
||||
|
||||
li:hover {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.reveal p:hover {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.reveal ul li {
|
||||
line-height: 1.2em;
|
||||
}
|
||||
|
||||
.reveal .thank h2 {
|
||||
font-size: var(--r-heading1-size);
|
||||
line-height: var(--r-heading-line-height);
|
||||
}
|
||||
|
||||
.reveal .thank {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.reveal .thank h2:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
bottom: 0px; /* 粗线的高度，让两条底对齐 */
|
||||
width: 360px;
|
||||
height: 1px;
|
||||
background-color: var(--r-heading-color);
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
/* 短粗线 —— 在下 */
|
||||
.reveal .thank h2:before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
bottom: 0; /* 底边紧贴标题的“底部参考线” */
|
||||
width: 60px;
|
||||
height: 3px;
|
||||
background-color: var(--r-heading-color);
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.panel-tabset [role="tab"] {
|
||||
border-bottom: 1px solid red;
|
||||
}
|
||||
|
||||
.panel-tabset [role="tab"][aria-selected="true"] {
|
||||
background-color: #ffdddd;
|
||||
border-bottom: 1px solid red;
|
||||
}
|
||||
|
||||
.white {
|
||||
color: #ffffff;
|
||||
}
|
||||
.orange {
|
||||
color: #e09a25;
|
||||
}
|
||||
.green {
|
||||
color: #006e51;
|
||||
}
|
||||
.pink {
|
||||
color: #d13076;
|
||||
}
|
||||
|
||||
.dusty {
|
||||
color: #ad5d5d;
|
||||
}
|
||||
|
||||
.flame {
|
||||
color: #ef562d;
|
||||
}
|
||||
.kale {
|
||||
color: #5c7148;
|
||||
}
|
||||
.blue {
|
||||
color: #0c4c8a;
|
||||
}
|
||||
.red {
|
||||
color: #b93a32;
|
||||
}
|
||||
.clay {
|
||||
color: #9e4624;
|
||||
}
|
||||
.bodacious {
|
||||
color: #b76ba3;
|
||||
}
|
||||
.serenity {
|
||||
color: #91a8d0;
|
||||
}
|
||||
|
||||
.cognac {
|
||||
color: #60413c;
|
||||
}
|
||||
.sangria {
|
||||
color: #760030;
|
||||
}
|
||||
|
||||
.alumium {
|
||||
color: #75796a;
|
||||
}
|
||||
|
||||
.marsala {
|
||||
color: #964f4c;
|
||||
}
|
||||
.purple {
|
||||
color: #702fa8;
|
||||
}
|
||||
|
||||
.blank {
|
||||
background-color: "Yellow";
|
||||
width: 100%;
|
||||
color: red;
|
||||
}
|
||||
|
||||
.reveal .slide aside {
|
||||
position: absolute;
|
||||
margin: 0 auto;
|
||||
left: 2%;
|
||||
font-size: 0.7em;
|
||||
text-align: end;
|
||||
max-width: 90%;
|
||||
width: fit-content;
|
||||
color: gray;
|
||||
bottom: -6%;
|
||||
}
|
||||
|
||||
.ref {
|
||||
position: absolute;
|
||||
margin: 0 auto;
|
||||
right: 2%;
|
||||
font-size: 1em;
|
||||
text-align: end;
|
||||
max-width: 90%;
|
||||
width: fit-content;
|
||||
color: gray;
|
||||
bottom: -6%;
|
||||
}
|
||||
|
||||
.con {
|
||||
position: absolute;
|
||||
margin: 0 auto;
|
||||
font-size: 1.4em;
|
||||
text-align: center;
|
||||
font-family: inherit;
|
||||
max-width: 100%;
|
||||
width: fit-content;
|
||||
color: #023047;
|
||||
bottom: -2%;
|
||||
}
|
||||
|
||||
.center {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.tiny {
|
||||
font-size: 60%;
|
||||
}
|
||||
|
||||
figure > figcaption {
|
||||
margin-top: -0.5em;
|
||||
}
|
||||
|
||||
.reveal .slide figure > figcaption,
|
||||
.reveal .slide img.stretch + p.caption,
|
||||
.reveal .slide img.r-stretch + p.caption {
|
||||
font-size: 0.9em;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.reveal strong, .reveal b {
|
||||
font-weight: bold;
|
||||
color: crimson;
|
||||
}
|
||||
|
||||
.reveal pre code {
|
||||
background-color: #554433;
|
||||
line-height: 1.2em;
|
||||
color: #fff;
|
||||
/* font-size: x-large; */
|
||||
}
|
||||
|
||||
.reveal pre code:hover{
|
||||
font-size: x-large;
|
||||
line-height: 120%;
|
||||
}
|
||||
|
||||
.reveal div.sourceCode pre code {
|
||||
background-color: #002233;
|
||||
min-height: 100%;
|
||||
/* font-size: x-large; */
|
||||
}
|
||||
|
||||
.reveal div.sourceCode pre code:hover {
|
||||
font-size: x-large;
|
||||
}
|
||||
@@ -0,0 +1,76 @@
|
||||
/*-- scss:defaults --*/
|
||||
|
||||
/* Modified version of the metropolis theme ported into Quarto by Patrick Schwartz */
|
||||
|
||||
// fonts
|
||||
@import url("https://fonts.googleapis.com/css?family=Fira+Sans:300,300i,400,400i,500,500i,700,700i");
|
||||
@import url("https://fonts.googleapis.com/css?family=Fira+Code:300,300i,400,400i,500,500i,700,700i");
|
||||
@import url("https://fonts.googleapis.com/css?family=Roboto+Mono|JetBrains+Mono&display=swap");
|
||||
@import url("https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap");
|
||||
|
||||
$font-family-sans-serif: "Fira Sans", "Roboto", "Droid Serif", serif !default;
|
||||
$font-family-monospace: "Fira Code", "JetBrains Mono", monospace;
|
||||
$presentation-font-size-root: 32px;
|
||||
$presentation-line-height: 1.5em;
|
||||
$presentation-heading-font-weight: 400;
|
||||
|
||||
// colors
|
||||
$body-bg: #fafafa !default;
|
||||
$body-color: #fff !default;
|
||||
// $link-color: #EB811B !default;
|
||||
$selection-bg: #26351c;
|
||||
|
||||
/* #2A6465 */
|
||||
|
||||
// headings
|
||||
// $presentation-heading-font: "Palatino Linotype", "Book Antiqua", Palatino,
|
||||
// FreeSerif, serif !default;
|
||||
// $presentation-heading-color: #383d3d !default;
|
||||
|
||||
/*-- scss:rules --*/
|
||||
|
||||
:root {
|
||||
--r-background-color: #fff;
|
||||
--r-main-font: Source Sans Pro, simhei, microsoft yahei;
|
||||
--r-main-font-size: 32px;
|
||||
--r-main-color: #434343; // 正文颜色，松烟墨：#434343 乌墨：#1A1A1A
|
||||
--r-block-margin: 12px;
|
||||
--r-heading-margin: 0 0 12px 0;
|
||||
--r-heading-font: Source Sans Pro, simhei, microsoft yahei;
|
||||
--r-heading-color: #0c4c8a; //标题颜色：深青蓝色：296364；海军蓝或藏青色：0c4c8a；深青色：006D6D；钻蓝色：0F52BA；酒红：800020
|
||||
--r-heading-line-height: 1.2em;
|
||||
--r-heading-letter-spacing: normal;
|
||||
--r-heading-text-transform: none;
|
||||
--r-heading-text-shadow: none;
|
||||
--r-heading-font-weight: 900;
|
||||
--r-heading1-text-shadow: none;
|
||||
--r-heading1-size: 2.5em;
|
||||
--r-heading2-size: 1.6em;
|
||||
--r-heading3-size: 1.3em;
|
||||
--r-heading4-size: 1em;
|
||||
--r-code-font: SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono,
|
||||
Courier New, monospace;
|
||||
--r-link-color: #ef562d;
|
||||
--r-link-color-dark: #ef562d;
|
||||
--r-link-color-hover: #d13076;
|
||||
--r-selection-background-color: #98bdef;
|
||||
--r-selection-color: #fff;
|
||||
--quarto-hl-fu-color: #c53800;
|
||||
}
|
||||
|
||||
// 设置背景图片
|
||||
$background-image: url('');
|
||||
$background-position: center center;
|
||||
$background-size: 40%;
|
||||
$background-repeat: no-repeat;
|
||||
$background-opacity: 0.04;
|
||||
|
||||
// 应用到 reveal.js
|
||||
.reveal .backgrounds {
|
||||
background-image: $background-image;
|
||||
background-position: $background-position;
|
||||
background-size: $background-size;
|
||||
background-repeat: $background-repeat;
|
||||
opacity: $background-opacity;
|
||||
}
|
||||
|
||||
Binary file not shown.
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 9.7 KiB |
Binary file not shown.
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 85 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 229 KiB |
@@ -0,0 +1,35 @@
|
||||
---
|
||||
title: "〇、R语言实践前篇"
|
||||
subtitle: 《区域水环境污染数据分析实践》<br>Data analysis practice of regional water environment pollution
|
||||
author: 苏命、王为东<br>中国科学院大学资源与环境学院<br>中国科学院生态环境研究中心
|
||||
date: today
|
||||
lang: zh
|
||||
format:
|
||||
dwsd-revealjs: default
|
||||
---
|
||||
|
||||
```{r}
|
||||
#| include: false
|
||||
#| cache: false
|
||||
lang <- "cn"
|
||||
require(tidyverse)
|
||||
knitr::opts_chunk$set(echo = TRUE)
|
||||
```
|
||||
|
||||
## R语言实践部分课程简介
|
||||
|
||||
**接下来的课程由我来带着大家一起学习、实践基于R语言的数据分析。**
|
||||
|
||||
### 自我介绍
|
||||
|
||||
- 苏命：来自中国科学院生态环境研究中心
|
||||
- 主要从事**水源水质水生态**方面的研究
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
## 欢迎讨论！{.center}
|
||||
|
||||
|
||||
`r rmdify::slideend(wechat = FALSE, type = "public", tel = FALSE, thislink = "../")`
|
||||
Reference in New Issue
Block a user