新增 个性化设置

This commit is contained in:
底层用户 2022-04-12 22:42:42 +08:00
parent 1ac1c05022
commit dbdf84c352
5 changed files with 189 additions and 27 deletions

View File

@ -177,7 +177,7 @@
span.link-name { span.link-name {
display: block !important; display: block !important;
font-size: 0.95rem; font-size: 0.85rem;
} }
span.line-text, span.line-text,

View File

@ -546,13 +546,13 @@ i.iconfont.icon-z_shangpinheji {
margin: 1rem 0rem 0.5rem 0rem; margin: 1rem 0rem 0.5rem 0rem;
} }
/*更多页面链接*/ /*其他链接*/
.mores .link-card { .mores .link-card {
height: 48px !important; height: 48px !important;
} }
/*box*/ /*更多页面*/
.box-left { .box-left {
flex: 0 44%; flex: 0 44%;
min-width: 400px; min-width: 400px;
@ -589,17 +589,55 @@ i.iconfont.icon-z_shangpinheji {
justify-content: space-between; justify-content: space-between;
} }
.upnote { #accordion {
margin-top: 1rem; min-width: 360px;
margin-left: 2rem; margin-right: 40px;
display: flex; margin-top: 20px;
flex-direction: column; margin-left: 14px;
line-height: 40px; border-radius: 8px;
font-size: 1.10rem; box-shadow: 0 2px 2px 0 rgb(0 0 0 / 7%), 0 1px 5px 0 rgb(0 0 0 / 10%);
} }
.uptext i { .accordion-item {
font-size: 1.25rem; background-color: transparent !important;
border: none !important;
}
.accordion-item:first-of-type .accordion-button {
border-radius: 8px;
}
.accordion-button {
color: white !important;
background-color: transparent;
transition: 0.3s;
}
.accordion-button:focus {
border-color: #ffffff26 !important;
outline: none !important;
box-shadow: none !important;
border-radius: 8px;
transition: 0.3s;
}
.accordion-button:not(.collapsed) {
background-color: #ffffff26;
border-bottom-left-radius: 0px !important;
border-bottom-right-radius: 0px !important;
font-weight: bold;
transition: 0.3s;
}
.accordion-button::after {
border-radius: 8px;
background-image: none !important;
}
.accordion-body {
padding: 1rem 0rem !important;
background-color: #ffffff10;
} }
.closebox { .closebox {
@ -617,6 +655,58 @@ i.iconfont.icon-github1 {
font-size: 1.45rem; font-size: 1.45rem;
} }
/*个性设置*/
.set {
display: flex;
flex-direction: column;
padding: 0rem 1.5rem;
}
.set-text {
text-align: center;
}
.btn-group,
.btn-group-vertical {
margin-top: 10px;
}
.btn-outline-primary {
color: #eeeeee !important;
border-color: #ffffff26 !important;
}
.btn-outline-primary:hover {
background-color: #ffffff26 !important;
border-color: #eeeeee !important;
}
.btn-check:focus+.btn, .btn:focus {
box-shadow: none !important;
}
.btn-check:active+.btn-outline-primary,
.btn-check:checked+.btn-outline-primary,
.btn-outline-primary.active,
.btn-outline-primary.dropdown-toggle.show,
.btn-outline-primary:active {
background-color: #ffffff26 !important;
border-color: #eeeeee !important;
}
/*更新日志*/
.upnote {
display: flex;
flex-direction: column;
padding: 0rem 1.5rem;
height: 156px;
overflow-y: auto;
}
.uptext {
line-height: 32px;
}
/*Aplayer*/ /*Aplayer*/
.box-right { .box-right {
flex: 0 54%; flex: 0 54%;
@ -652,6 +742,10 @@ i.iconfont.icon-github1 {
} }
/*音乐列表*/ /*音乐列表*/
.aplayer.aplayer-withlist .aplayer-list {
margin-top: 6px;
}
.aplayer .aplayer-list ol li.aplayer-list-light { .aplayer .aplayer-list ol li.aplayer-list-light {
background: #ffffff26 !important; background: #ffffff26 !important;
border-radius: 6px !important; border-radius: 6px !important;
@ -783,4 +877,16 @@ footer {
.iziToast>.iziToast-close { .iziToast>.iziToast-close {
background: url(https://cdn.jsdelivr.net/gh/imsyy/file/pic/close.png) no-repeat 50% 50% !important; background: url(https://cdn.jsdelivr.net/gh/imsyy/file/pic/close.png) no-repeat 50% 50% !important;
background-size: 8px !important; background-size: 8px !important;
}
/*滚动条样式*/
::-webkit-scrollbar {
width: 6px;
height: 6px;
background-color: transparent;
}
::-webkit-scrollbar-thumb {
border-radius: 10px;
background-color: #eeeeee;
} }

View File

@ -343,26 +343,82 @@
<div class="closebox fixed-top" id="closemore"> <div class="closebox fixed-top" id="closemore">
<i class="iconfont icon-close"></i> <i class="iconfont icon-close"></i>
</div> </div>
<!--更新日志--> <!--左侧内容-->
<div class="box-left"> <div class="box-left">
<div class="img-title"> <div class="img-title">
<span class="img-title">imsyy</span> <span class="img-title">imsyy</span>
<span class="img-text">.top</span><br /> <span class="img-text">.top</span><br />
<span class="img-text">&nbsp;&nbsp;v&nbsp;1.6</span> <span class="img-text">&nbsp;&nbsp;v&nbsp;2.2</span>
<a href="https://github.com/imsyy/home" target="_blank"><i <a href="https://github.com/imsyy/home" target="_blank"><i
class="iconfont icon-github1"></i></a> class="iconfont icon-github1"></i></a>
</div> </div>
<div class="upnote"> <!--更多内容-->
<span class="uptext"><i class="iconfont icon-plus"></i>&nbsp;音乐播放器支持音量控制</span> <div class="accordion" id="accordion">
<span class="uptext"><i class="iconfont icon-plus"></i>&nbsp;新增动态跟随鼠标样式</span> <div class="accordion-item">
<span class="uptext"><i class="iconfont icon-wrench-fill"></i>&nbsp;修复 CDN 加载缓慢</span> <h2 class="accordion-header" id="headingOne">
<span class="uptext"><i class="iconfont icon-wrench-fill"></i>&nbsp;时光胶囊显示错误</span> <button class="accordion-button" type="button" data-bs-toggle="collapse"
<span class="uptext"><i class="iconfont icon-wrench-fill"></i>&nbsp;移动端动画及细节</span> data-bs-target="#collapseOne" aria-expanded="true"
<span class="uptext"><i class="iconfont icon-wrench-fill"></i>&nbsp;图标改为 Iconfont</span> aria-controls="collapseOne">
<span class="uptext"><i class="iconfont icon-undo"></i>&nbsp;<a href="./old/" 个性设置 - 尚未实现
style="color:#efefef">点击此处返回旧版站点</a></span> </button>
</h2>
<div id="collapseOne" class="accordion-collapse collapse show"
aria-labelledby="headingOne" data-bs-parent="#accordion">
<div class="accordion-body">
<div class="set">
<div class="set-text">壁纸个性化</div>
<div class="btn-group" role="group"
aria-label="Basic radio toggle button group">
<input type="radio" class="btn-check" name="btnradio" id="btnradio1"
autocomplete="off" checked>
<label class="btn btn-outline-primary" for="btnradio1">默认壁纸</label>
<input type="radio" class="btn-check" name="btnradio" id="btnradio2"
autocomplete="off">
<label class="btn btn-outline-primary" for="btnradio2">每日一图</label>
<input type="radio" class="btn-check" name="btnradio" id="btnradio3"
autocomplete="off">
<label class="btn btn-outline-primary" for="btnradio3">随机动漫</label>
</div>
</div>
</div>
</div>
</div>
<!--更新日志-->
<div class="accordion-item">
<h2 class="accordion-header" id="headingTwo">
<button class="accordion-button collapsed" type="button"
data-bs-toggle="collapse" data-bs-target="#collapseTwo"
aria-expanded="false" aria-controls="collapseTwo">
更新日志
</button>
</h2>
<div id="collapseTwo" class="accordion-collapse collapse"
aria-labelledby="headingTwo" data-bs-parent="#accordion">
<div class="accordion-body">
<div class="upnote">
<span class="uptext"><i
class="iconfont icon-plus"></i>&nbsp;音乐播放器支持音量控制</span>
<span class="uptext"><i
class="iconfont icon-plus"></i>&nbsp;新增动态跟随鼠标样式</span>
<span class="uptext"><i class="iconfont icon-wrench-fill"></i>&nbsp;修复
CDN 加载缓慢</span>
<span class="uptext"><i
class="iconfont icon-wrench-fill"></i>&nbsp;时光胶囊显示错误</span>
<span class="uptext"><i
class="iconfont icon-wrench-fill"></i>&nbsp;移动端动画及细节</span>
<span class="uptext"><i class="iconfont icon-wrench-fill"></i>&nbsp;图标改为
Iconfont</span>
<span class="uptext"><i class="iconfont icon-undo"></i>&nbsp;<a
href="./old/" style="color:#efefef">点击此处返回旧版站点</a></span>
</div>
</div>
</div>
</div>
</div> </div>
</div> </div>
<!--Aplayer-->
<div class="box-right"> <div class="box-right">
<div id="aplayer"></div> <div id="aplayer"></div>
</div> </div>

View File

@ -323,8 +323,8 @@ var title2 = `
|_____|_| |_|_____/ |_| |_| |_____|_| |_|_____/ |_| |_|
` `
var content = ` var content = `
1.6 2.2
更新日期2022-01-30 更新日期2022-04-12
更新说明 更新说明
1. 新增 音乐播放器支持音量控制 1. 新增 音乐播放器支持音量控制

View File

@ -306,9 +306,9 @@ const ap = new APlayer({
{ {
name: "有何不可", name: "有何不可",
artist: "许嵩", artist: "许嵩",
url: "https://drive.imsyy.top/api?path=/%E9%9F%B3%E4%B9%90/%E6%96%87%E4%BB%B6%E5%BC%95%E7%94%A8/%E8%AE%B8%E5%B5%A9-%E6%9C%89%E4%BD%95%E4%B8%8D%E5%8F%AF.mp3&raw=true", url: "https://drive.imsyy.top/api/raw/?path=/音乐/华语音乐/许嵩/许嵩%20-%20有何不可%20-%20独白版.mp3",
cover: "https://y.qq.com/music/photo_new/T002R300x300M000002KSDg90IaScI_1.jpg?max_age=2592000", cover: "https://y.qq.com/music/photo_new/T002R300x300M000002KSDg90IaScI_1.jpg?max_age=2592000",
lrc: "https://s-sh-2127-music.oss.dogecdn.com/lrc%2F%E8%AE%B8%E5%B5%A9-%E6%9C%89%E4%BD%95%E4%B8%8D%E5%8F%AF.lrc", lrc: "https://s-sh-2127-music.oss.dogecdn.com/lrc%2F%E8%AE%B8%E5%B5%A9%20-%20%E6%9C%89%E4%BD%95%E4%B8%8D%E5%8F%AF%20-%20%E7%8B%AC%E7%99%BD%E7%89%88.lrc",
theme: "#edbe76" theme: "#edbe76"
}, },
{ {