kuanpan/rd.rdlevel.cn
1
1
Fork 0
forked from RDCNWebs/rd.rdlevel.cn
Code Pull Requests Activity

更改了页面右侧功能区的样式

Browse Source
This commit is contained in:
OLDREDSTONE 2025-11-29 16:45:51 +08:00
parent 547181bff1
commit 9becdf3f88
5 changed files with 39 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
script/switchLightDarkMode.js
View File

@ -19,16 +19,17 @@ const themeModes = ['light', 'dark', 'auto',]
var switchSpan = document.createElement('span')
switchSpan.id = 'switchLightDarkModeDivBeforeArticle'
switchSpan.classList.add('controlSpan')
switchSpan.style.position = 'fixed'
switchSpan.style.right = switchLightDarkModeOptions.right.toString() + 'px'
switchSpan.style.top = switchLightDarkModeOptions.top.toString() + 'px'
const lightModeIconXml = '<?xml version="1.0" encoding="UTF-8"?><svg width="24px" height="24px" stroke-width="1.5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" color="' + switchLightDarkModeOptions.svgColor + '"><path d="M12 18a6 6 0 100-12 6 6 0 000 12zM22 12h1M12 2V1M12 23v-1M20 20l-1-1M20 4l-1 1M4 20l1-1M4 4l1 1M1 12h1" stroke="' + switchLightDarkModeOptions.svgColor + '" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg>'
const darkModeIconXml = '<?xml version="1.0" encoding="UTF-8"?><svg width="24px" height="24px" stroke-width="1.5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" color="' + switchLightDarkModeOptions.svgColor + '"><path d="M3 11.507a9.493 9.493 0 0018 4.219c-8.507 0-12.726-4.22-12.726-12.726A9.494 9.494 0 003 11.507z" stroke="' + switchLightDarkModeOptions.svgColor + '" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg>'
const autoModeIconXml = '<?xml version="1.0" encoding="UTF-8"?><svg width="24px" height="24px" stroke-width="1.5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" color="' + switchLightDarkModeOptions.svgColor + '"><path d="M3 15c2.483 0 4.345-3 4.345-3s1.862 3 4.345 3c2.482 0 4.965-3 4.965-3s2.483 3 4.345 3M3 20c2.483 0 4.345-3 4.345-3s1.862 3 4.345 3c2.482 0 4.965-3 4.965-3s2.483 3 4.345 3M19 10a7 7 0 10-14 0" stroke="' + switchLightDarkModeOptions.svgColor + '" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg>'
const zoomInIconXml = '<?xml version="1.0" encoding="UTF-8"?><svg width="24px" height="24px" viewBox="0 0 24 24" stroke-width="1.5" fill="none" xmlns="http://www.w3.org/2000/svg" color="' + switchLightDarkModeOptions.svgColor + '"><path d="M8 11h3m3 0h-3m0 0V8m0 3v3M17 17l4 4M3 11a8 8 0 1016 0 8 8 0 00-16 0z" stroke="' + switchLightDarkModeOptions.svgColor + '" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg>'
const zoomOutIconXml = '<?xml version="1.0" encoding="UTF-8"?><svg width="24px" height="24px" viewBox="0 0 24 24" stroke-width="1.5" fill="none" xmlns="http://www.w3.org/2000/svg" color="' + switchLightDarkModeOptions.svgColor + '"><path d="M17 17l4 4M3 11a8 8 0 1016 0 8 8 0 00-16 0zM8 11h6" stroke="' + switchLightDarkModeOptions.svgColor + '" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg>'
const zoomDefaultIconXml = '<?xml version="1.0" encoding="UTF-8"?><svg width="24px" height="24px" stroke-width="1.5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" color="' + switchLightDarkModeOptions.svgColor + '"><path d="M12 19a7 7 0 100-14 7 7 0 000 14zM12 19v2M5 12H3M12 5V3M19 12h2" stroke="' + switchLightDarkModeOptions.svgColor + '" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg>'
const lightModeIconXml = '<?xml version="1.0" encoding="UTF-8"?><svg width="24px" height="24px" stroke-width="1.5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" color="' + switchLightDarkModeOptions.svgColor + '"><path d="M12 18a6 6 0 100-12 6 6 0 000 12zM22 12h1M12 2V1M12 23v-1M20 20l-1-1M20 4l-1 1M4 20l1-1M4 4l1 1M1 12h1" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg>'
const darkModeIconXml = '<?xml version="1.0" encoding="UTF-8"?><svg width="24px" height="24px" stroke-width="1.5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" color="' + switchLightDarkModeOptions.svgColor + '"><path d="M3 11.507a9.493 9.493 0 0018 4.219c-8.507 0-12.726-4.22-12.726-12.726A9.494 9.494 0 003 11.507z" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg>'
const autoModeIconXml = '<?xml version="1.0" encoding="UTF-8"?><svg width="24px" height="24px" stroke-width="1.5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" color="' + switchLightDarkModeOptions.svgColor + '"><path d="M3 15c2.483 0 4.345-3 4.345-3s1.862 3 4.345 3c2.482 0 4.965-3 4.965-3s2.483 3 4.345 3M3 20c2.483 0 4.345-3 4.345-3s1.862 3 4.345 3c2.482 0 4.965-3 4.965-3s2.483 3 4.345 3M19 10a7 7 0 10-14 0" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg>'
const zoomInIconXml = '<?xml version="1.0" encoding="UTF-8"?><svg width="24px" height="24px" viewBox="0 0 24 24" stroke-width="1.5" fill="none" xmlns="http://www.w3.org/2000/svg" color="' + switchLightDarkModeOptions.svgColor + '"><path d="M8 11h3m3 0h-3m0 0V8m0 3v3M17 17l4 4M3 11a8 8 0 1016 0 8 8 0 00-16 0z" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg>'
const zoomOutIconXml = '<?xml version="1.0" encoding="UTF-8"?><svg width="24px" height="24px" viewBox="0 0 24 24" stroke-width="1.5" fill="none" xmlns="http://www.w3.org/2000/svg" color="' + switchLightDarkModeOptions.svgColor + '"><path d="M17 17l4 4M3 11a8 8 0 1016 0 8 8 0 00-16 0zM8 11h6" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg>'
const zoomDefaultIconXml = '<?xml version="1.0" encoding="UTF-8"?><svg width="24px" height="24px" stroke-width="1.5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" color="' + switchLightDarkModeOptions.svgColor + '"><path d="M12 19a7 7 0 100-14 7 7 0 000 14zM12 19v2M5 12H3M12 5V3M19 12h2" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg>'
const ottoIconXml = `
<?xml version="1.0" encoding="UTF-8"?>
<svg width="26px" height="30px" stroke-width="1.5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 24 24" color="` + switchLightDarkModeOptions.svgColor + `" stroke="` + switchLightDarkModeOptions.svgColor + `" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
@ -125,6 +126,7 @@ function plugin(hook, vm) {
var zoomInSpan = document.createElement('span')
zoomInSpan.id = 'zoomInSpan'
zoomInSpan.classList.add('controlSpan')
zoomInSpan.style.position = 'fixed'
zoomInSpan.style.right = switchLightDarkModeOptions.right.toString() + 'px'
zoomInSpan.style.top = (switchLightDarkModeOptions.top + 35).toString() + 'px'
@ -132,6 +134,7 @@ function plugin(hook, vm) {
var zoomOutSpan = document.createElement('span')
zoomOutSpan.id = 'zoomOutSpan'
zoomOutSpan.classList.add('controlSpan')
zoomOutSpan.style.position = 'fixed'
zoomOutSpan.style.right = switchLightDarkModeOptions.right.toString() + 'px'
zoomOutSpan.style.top = (switchLightDarkModeOptions.top + 70).toString() + 'px'
@ -139,6 +142,7 @@ function plugin(hook, vm) {
var zoomDefaultSpan = document.createElement('span')
zoomDefaultSpan.id = 'zoomDefaultSpan'
zoomDefaultSpan.classList.add('controlSpan')
zoomDefaultSpan.style.position = 'fixed'
zoomDefaultSpan.style.right = switchLightDarkModeOptions.right.toString() + 'px'
zoomDefaultSpan.style.top = (switchLightDarkModeOptions.top + 105).toString() + 'px'
@ -146,6 +150,7 @@ function plugin(hook, vm) {
var ottoSpan = document.createElement('span')
ottoSpan.id = 'ottoSpan'
ottoSpan.classList.add('controlSpan')
ottoSpan.style.position = 'fixed'
ottoSpan.style.right = switchLightDarkModeOptions.right.toString() + 'px'
ottoSpan.style.top = (switchLightDarkModeOptions.top + 140).toString() + 'px'

15
style/base.css
View File

@ -1291,4 +1291,19 @@ del {
margin: 0;
border-radius: 5px;
font: 300 12px 'd9c', 'd9';
}
.controlSpan {
border-radius: 8px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
font-family: 'd9', sans-serif;
font-size: 16px;
height: 30px;
width: 30px;
transition: background-color 0.3s, transform 0.2s;
z-index: 20;
}

7
style/color.css
View File

@ -223,4 +223,11 @@ div.medium-zoom-overlay{
&>p{
background-color: var(--background-color);
}
}
.controlSpan{
background-color: var(--span-color);
&>svg{
stroke: var(--span-fill-color);
}
}

3
style/dark.css
View File

@ -20,6 +20,9 @@ body.dark {
-webkit-tap-highlight-color: rgb(0, 0, 0);
--special-theme-position-backgound-color: #177500;
--span-color: #2020203a;
--span-fill-color: #3c7e7e;
}
body.dark .sidebar li>a:has(>img) {

3
style/light.css
View File

@ -20,6 +20,9 @@ body.light {
-webkit-tap-highlight-color: rgb(255, 255, 255);
--special-theme-position-backgound-color: #05a000;
--span-color: #e0e0e03a;
--span-fill-color: #008585;
}
body.light .sidebar li>a:has(>img) {