alist 自定义内容  备份-网站源码论坛-源码-烟火飘飘的小窝

alist 自定义内容 备份

包含AIGC,经测试无明显问题,介意勿用
自定义头部
<link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css2?family=Baloo+Paaji+2">
<link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css2?family=Noto+Sans+SC">
<style type="text/css">
    div{font-family: 'Baloo Paaji 2','Noto Sans SC';}
    span{font-family: 'Baloo Paaji 2','Noto Sans SC';}
    a{font-family: 'Baloo Paaji 2','Noto Sans SC';}
</style>
<style>
/*白天背景图*/
 .hope-ui-light {
    background-image: url("https://img.yonrd.com/i/2024/11/01/sdrf1l.jpg") !important;
    background-repeat:no-repeat;
    background-size:cover;
    background-attachment:fixed;
    background-position-x:center;
}
/*夜间背景图*/
 .hope-ui-dark {
    background-image: url("https://img.yonrd.com/i/2024/11/01/sdrf1l.jpg") !important;
    background-repeat:no-repeat;
    background-size:cover;
    background-attachment:fixed;
    background-position-x:center;
}
/*主列表白天模式透明*/
 .obj-box.hope-stack.hope-c-dhzjXW.hope-c-PJLV.hope-c-PJLV-igScBhH-css {
    background-color: rgba(255, 255, 255, 0.7) !important;
}
/*主列表夜间模式透明*/
 .obj-box.hope-stack.hope-c-dhzjXW.hope-c-PJLV.hope-c-PJLV-iigjoxS-css {
    background-color:rgba(0, 0, 0, 0.7) !important;
}
/*readme白天模式透明*/
 .hope-c-PJLV.hope-c-PJLV-ikSuVsl-css {
    background-color:rgba(255, 255, 255, 0.7) !important;
}
/*readme夜间模式透明*/
 .hope-c-PJLV.hope-c-PJLV-iiuDLME-css {
    background-color:rgba(0, 0, 0, 0.7) !important;
}

/*顶部右上角切换按钮透明*/
 .hope-ui-light .hope-c-ivMHWx-hZistB-cv.hope-icon-button {
    background-color: rgba(255, 255, 255, 0.7) !important;
}
.hope-ui-dark .hope-c-ivMHWx-hZistB-cv.hope-icon-button {
    background-color:rgba(0, 0, 0, 0.7) !important;
}
/*右下角侧边栏按钮透明 第一个是白天 第二个是夜间*/
 .hope-ui-light .hope-c-PJLV-ijgzmFG-css {
    background-color: rgba(255, 255, 255, 0.7) !important;
}
.hope-ui-dark .hope-c-PJLV-ijgzmFG-css {
    background-color:rgba(0, 0, 0, 0.7) !important;
}

/*白天模式代码块透明*/
 .hope-ui-light pre {
    background-color: rgba(255, 255, 255, 0.1)!important;
}
/*夜间模式代码块透明*/
 .hope-ui-dark pre {
    background-color: rgba(255, 255, 255, 0.1)!important;
}

/*左侧侧边栏目录*/
/*白天模式*/
 .hope-ui-light .hope-c-PJLV-ieGWMbI-css {
    background: rgba(255, 255, 255, 0.7) !important;
}
/*夜间模式*/
 .hope-ui-dark .hope-c-PJLV-ieGWMbI-css {
    background-color:rgba(0, 0, 0, 0.7) !important;
}

/* 返回顶部 */
 .hope-c-PJLV-ihVEsOa-css {
    background: rgba(255, 255, 255, 0.7) !important;
}
.hope-ui-dark .hope-c-PJLV-ihVEsOa-css {
    background-color:rgba(0, 0, 0, 0.7) !important;
}

/*正常情况未使用吸附功能*/
/*顶部*/
 .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.7) !important;
    border-radius: var(--hope-radii-xl) !important;
}
/*夜间模式*/
 .hope-ui-dark .hope-c-PJLV-idaeksS-css {
    background-color:rgba(0, 0, 0, 0.7) !important;
    border-radius: var(--hope-radii-xl) !important;
}
/* 吸附到页面顶部 */
/*顶部*/
 .hope-c-PJLV-icWrYmg-css {
    background: rgba(255, 255, 255, 0) !important;
}
/*导航条*/
 .hope-c-PJLV-icKsjdm-css::after {
    background: rgba(255, 255, 255, 0.7) !important;
}
/*白天模式*/
 .hope-ui-light .hope-c-PJLV-icKsjdm-css {
    background-color: rgba(255, 255, 255, 0.7) !important;
    border-radius: var(--hope-radii-xl) !important;
}
/*夜间模式*/
 .hope-ui-dark .hope-c-PJLV-icKsjdm-css {
    background-color:rgba(0, 0, 0, 0.7) !important;
    border-radius: var(--hope-radii-xl) !important;
}
}
/*仅吸附导航栏*/
/*导航条*/
 .hope-c-PJLV-ifdXShc-css::after {
    background: rgba(255, 255, 255, 0.7) !important;
}
/*白天模式*/
 .hope-ui-light .hope-c-hrsMRY {
    background-color: rgba(255, 255, 255, 0.7) !important;
    border-radius: var(--hope-radii-xl) !important;
}
/*夜间模式*/
 .hope-ui-dark .hope-c-hrsMRY {
    background-color:rgba(0, 0, 0, 0.7) !important;
    border-radius: var(--hope-radii-xl) !important;
}
/*路径栏透明*/
.hope-ui-dark .hope-c-PJLV-idaeksS-css {
    background-color:rgba(0, 0, 0, 0.7) !important;
}
.hope-ui-light .hope-c-PJLV-idaeksS-css {
    background-color:rgba(255, 255, 255, 0.7) !important;
}
/*markdown大纲透明*/
.hope-c-PJLV-igmvEDM-css {
    background-color:rgba(255, 255, 255, 0.7) !important;
}
/*搜索栏*/
/*白天模式 搜索主体*/
.hope-ui-light .hope-c-PJLV-iiBaxsN-css{
   background-color: rgba(255, 255, 255, 0.9)!important;
}

/*白天模式 搜索栏输入框*/
.hope-ui-light .hope-c-kvTTWD-hYRNAb-variant-filled{
   background-color: rgba(255, 255, 255, 0.9)!important;
}

/*白天模式 搜索按钮*/
.hope-ui-light .hope-c-PJLV-ijMezfq-css{
   background-color: rgba(255, 255, 255, 0.7)!important;
   padding: var(--hope-space-1)!important;
}

/*夜间模式搜索主体*/
.hope-ui-dark .hope-c-PJLV-iiBaxsN-css{
    background-color: rgba(0, 0, 0, 0.9)!important;
}

/*夜间模式搜索栏*/
.hope-ui-dark .hope-c-kvTTWD-hYRNAb-variant-filled{
    background-color: rgba(0, 0, 0, 0.9)!important;
}

/*夜间模式 搜索按钮*/
.hope-ui-dark hope-c-PJLV-ijMezfq-css{
    background-color: rgba(0, 0, 0, 0.7)!important;
    padding: var(--hope-space-1)!important;
}
</style>




自定义内容
<!--延迟加载-->
<div id="customize" style="display: none; text-align: center;">
    <div class="custom-footer" style="display: inline-block; text-align: center; background-color: rgba(255, 255, 255, 0.7); padding: 10px; border-radius: 8px;">
        <p style="margin: 5px 0;">
            &copy; Powered by alist
            <span>|</span>
            <a target="_blank" href="/@manage">管理</a>
        </p>
        <p style="margin: 5px 0;">开放、平等、协作、共享 ——互联网精神</p>
    </div>
    <!-- 自定义样式 -->
    <style>
        /* 白天模式背景颜色 */
        #customize .custom-footer {
            background-color: rgba(255, 255, 255, 0.7);
        }

        /* 夜间模式背景颜色 */
        .hope-ui-dark #customize .custom-footer {
            background-color: rgba(0, 0, 0, 0.7);
        }
    </style>

    <!-- 隐藏原始页脚元素的样式 -->
    <style>
        /*隐藏版权*/
        .footer span,
        .footer a:nth-of-type(1) {
            display: none;
        }
        
        /*隐藏管理字眼*/
        .footer span,
        .footer a:nth-of-type(2) {
            display: none;
        }
    </style>
</div>

<!--延迟加载配套使用JS-->
<script>
    let interval = setInterval(() => {
        if (document.querySelector(".footer")) {
            document.querySelector("#customize").style.display = "";
            clearInterval(interval);
        }
    }, 200);
</script>

 

请登录后发表评论

    没有回复内容