course/su2026rwep
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add _extensions

Browse Source
This commit is contained in:
Ming Su
2026-05-21 13:37:53 +08:00
parent 6a9a5fc90e
commit 61bd0bea2f
252 changed files with 33972 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files
_extensions/drwater/dwms/inst/drwater.scss
+415
View File
@@ -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;
}