alist美化
, It's sunny
给大部分地方添加了透明和高斯模糊，参考了Alist简易美化（一）
将下面的代码放在全局，头部
<style>
/*背景图*/
.hope-ui-light, .hope-ui-dark {
background-image: url("https://r2.ilol.top/picimpact/preview/IMG_001.jpg") !important;
background-repeat:no-repeat;
background-size:cover;
background-attachment:fixed;
background-position-x:center;
}
/*夜间加层黑色*/
.hope-ui-dark #root {
background-color: rgba(0, 0, 0, 35%);
}
/*主列表白天模式透明*/
.obj-box.hope-stack.hope-c-dhzjXW.hope-c-PJLV.hope-c-PJLV-igScBhH-css {
background-color: rgba(255, 255, 255, 25%) !important;
backdrop-filter: blur(15px);
}
/*主列表夜间模式透明*/
.obj-box.hope-stack.hope-c-dhzjXW.hope-c-PJLV.hope-c-PJLV-iigjoxS-css {
background-color:rgb(0 0 0 / 20%) !important;
backdrop-filter: blur(15px);
}
/*readme白天模式透明*/
.hope-c-PJLV.hope-c-PJLV-ikSuVsl-css {
background-color: rgba(255, 255, 255, 0.25) !important;
backdrop-filter: blur(15px);
}
/*readme夜间模式透明*/
.hope-c-PJLV.hope-c-PJLV-iiuDLME-css {
background-color:rgb(0 0 0 / 20%) !important;
backdrop-filter: blur(15px);
}
/*顶部右上角切换按钮透明*/
.hope-ui-light .hope-c-ivMHWx-hZistB-cv.hope-icon-button {
background-color: rgba(255, 255, 255, 25%) !important;
backdrop-filter: blur(15px);
}
.hope-ui-dark .hope-c-ivMHWx-hZistB-cv.hope-icon-button {
background-color:rgb(0 0 0 / 25%) !important;
backdrop-filter: blur(15px);
}
/*右下角侧边栏按钮透明 第一个是白天 第二个是夜间*/
.hope-ui-light .hope-c-PJLV-ijgzmFG-css {
background-color: rgba(255, 255, 255, 25%) !important;
backdrop-filter: blur(15px);
}
.hope-ui-dark .hope-c-PJLV-ijgzmFG-css {
background-color:rgb(0 0 0 / 25%) !important;
backdrop-filter: blur(15px);
}
/*白天模式代码块透明*/
.hope-ui-light pre {
background-color: rgba(255, 255, 255, 0.25)!important;
backdrop-filter: blur(15px);
}
/*夜间模式代码块透明*/
.hope-ui-dark pre {
background-color: rgba(255, 255, 255, 0.25)!important;
backdrop-filter: blur(15px);
}
/*左侧侧边栏目录*/
/*白天模式*/
.hope-ui-light .hope-c-PJLV-ieGWMbI-css {
background: rgba(255, 255, 255, 25%) !important;
backdrop-filter: blur(15px);
}
/*夜间模式*/
.hope-ui-dark .hope-c-PJLV-ieGWMbI-css {
background-color:rgb(0 0 0 / 25%) !important;
backdrop-filter: blur(15px);
}
/* 返回顶部 */
.hope-c-PJLV-ihVEsOa-css {
background: rgba(255, 255, 255, 0.25) !important;
backdrop-filter: blur(15px);
}
.hope-ui-dark .hope-c-PJLV-ihVEsOa-css {
background-color:rgb(0 0 0 / 25%) !important;
backdrop-filter: blur(15px);
}
/*正常情况未使用吸附功能*/
/*顶部*/
.hope-c-PJLV-ikaMhsQ-css {
background: rgba(255, 255, 255, 0) !important;
}
/*导航条*/
/*白天模式*/
.hope-ui-light .hope-c-PJLV-idaeksS-css {
background-color: rgba(255, 255, 255, 0) !important;
border-radius: var(--hope-radii-xl) !important;
backdrop-filter: blur(5px);
}
/*夜间模式*/
.hope-ui-dark .hope-c-PJLV-idaeksS-css {
background-color:rgb(0 0 0 / 0) !important;
border-radius: var(--hope-radii-xl) !important;
backdrop-filter: blur(5px);
}
/* 吸附到页面顶部 */
/*顶部*/
.hope-c-PJLV-icWrYmg-css {
background: rgba(255, 255, 255, 25%) !important;
backdrop-filter: blur(15px);
}
/*导航条*/
.hope-c-PJLV-icKsjdm-css::after {
background: rgba(255, 255, 255, 0%) !important;
backdrop-filter: blur(15px);
}
/*白天模式*/
.hope-ui-light .hope-c-PJLV-icKsjdm-css {
background-color: rgba(255, 255, 255, 25%) !important;
border-radius: var(--hope-radii-xl) !important;
backdrop-filter: blur(15px);
}
/*夜间模式*/
.hope-ui-dark .hope-c-PJLV-icKsjdm-css {
background-color:rgb(0 0 0 / 25%) !important;
border-radius: var(--hope-radii-xl) !important;
backdrop-filter: blur(15px);
}
/*仅吸附导航栏*/
/*导航条*/
.hope-c-PJLV-ifdXShc-css::after {
background: rgba(255, 255, 255, 0) !important;
}
/*白天模式*/
.hope-ui-light .hope-c-hrsMRY {
background-color: rgba(255, 255, 255, 0.25) !important;
border-radius: var(--hope-radii-xl) !important;
backdrop-filter: blur(15px);
}
/*夜间模式*/
.hope-ui-dark .hope-c-hrsMRY {
background-color:rgb(0 0 0 / 25%) !important;
border-radius: var(--hope-radii-xl) !important;
backdrop-filter: blur(15px);
}
/*路径栏透明*/
.hope-ui-dark .hope-c-PJLV-idaeksS-css {
background-color:rgb(0 0 0 / 25%) !important;
backdrop-filter: blur(15px);
}
.hope-ui-light .hope-c-PJLV-idaeksS-css {
background-color:rgb(0 0 0 / 25%) !important;
backdrop-filter: blur(15px);
}
/*markdown大纲透明*/
.hope-c-PJLV-igmvEDM-css {
background-color:rgb(0 0 0 / 25%) !important;
backdrop-filter: blur(15px);
}
/*高斯模糊*/
.hope-c-PJLV-igmvEDM-css {
backdrop-filter: blur(15px);
}
/*视图列表透明和高斯模糊*/
.hope-c-PJLV-iSMXDf-css {
background-color: rgba(255, 255, 255, 0.25) !important;
backdrop-filter: blur(15px);
}
/*列表透明和高斯模糊*/
.hope-c-huZphZ-cIGthf-cv, .hope-c-PJLV-ijpihTg-css{
background-color: rgba(255, 255, 255, 0.25) !important;
backdrop-filter: blur(15px);
}
/*选中后弹出的列表透明和高斯模糊*/
.hope-c-PJLV-igOZEoG-css {
background-color: rgba(255, 255, 255, 0.25) !important;
backdrop-filter: blur(15px);
}
/*搜索透明和高斯模糊*/
.hope-c-PJLV-iiBaxsN-css,.hope-c-PJLV-ifnAIcD-css,.hope-c-PJLV-ibtHApG-css {
background-color: rgba(255, 255, 255, 25%) !important;
backdrop-filter: blur(15px);
}
</style>
Responses