（由 @ 猫尾草 于 2018-8-7 发布于旧版论坛，感谢ta的文章分享！）

GitHub 项目地址：https://github.com/yu2n/kod-theme

KOD 主题 DIY - 简雅风格，加载迅速

Diy theme for KOD Explorer v4.32

kod4.32_theme_diy, yu2n, 2018.08.05

成品快速安装步骤

  • 下载成品主题

    • 从 releases 下载 kod4.32_theme20180806.zip 。

  • 安装成品主题

    • 将 kod4.32_theme20180806.zip 上传至 KOD Explorer 的安装目录。
      例如：/var/www/html/kod/kod4.32_theme20180806.zip
    • 解压 kod4.32_theme20180806.zip 到当前目录即可。

手动修改步骤

一、修改登陆样式 (index.php?user/login)

1. 修改登陆窗口图标顏色

1.1 打开 /static/style/login.css，作以下修改：
  • 查找所有 #aaddff 替換為 #f0f0f0
  • 查找所有 #14A1FF 替換為 #F0F0F0 
    * Line 79, .title .logo{
    * text-shadow: 2px 2px 2px rgba(200,200,200,0.5);
* Line 80, .title .logo{
    * -webkit-box-reflect: below -20px linear-gradient(transparent, rgba(200,200,200,0.1),  rgba(200,200,200,0.7));
* Line 81, .title .logo{
    * background-image: -webkit-linear-gradient(92deg,#FFFFFF,#F0F0F0);
* Line 86, .title .logo i{
    * color: #f0f0f0;
    * -webkit-text-fill-color:#f0f0f0;
* Line 87, .title .info{
    * color: #f0f0f0;
* Line 523, .dialog-copyright .dialog-copyright-content .title .logo i{
    * color: #f0f0f0
* Line 527, .dialog-copyright .dialog-copyright-content .title .info{
    * color: #f0f0f0;

2. 修改登陆窗口標題背景

2.1 打开 /static/style/login.css ，作以下修改：
* Line 74, .title{
    * background:rgba(200,200,200,0.7) url(./../../static/images/wall_page/bg-fixed.png);background-repeat:repeat;background-size:auto;

3. 修改登陆窗口图标顏色(移动端)：

3.1 打开 /static/style/wap/login.css ，作以下修改：
  • 查找所有 #aaddff 替換為 #f0f0f0 
    * Line 24, .title .logo{
    * color: #f0f0f0;
* Line 25, .title .logo i{
    * color: #f0f0f0;

4. 修改登陆窗口背景图片动态数字雨效果

4.1 打开 /app/template/user/login.html ，作以下修改：
  • 在第 13 行与 14 行之间插入以下代码： 
    <canvas id="q" style="position: absolute;z-index: -1;"></canvas>
<script>
var width = q.width = q.parentNode.clientWidth;
var height = q.height = q.parentNode.clientHeight;
var letters = Array(Math.floor(width/10) + 2).join(1).split('');
var draw = function () {
    q.getContext('2d').fillStyle = 'rgba(128,128,128,.05)';
    q.getContext('2d').fillRect(0, 0, width, height);
    q.getContext('2d').fillStyle = '#fff';
    letters.map(function (y_pos, index) {
        text = String.fromCharCode(/*3e4*/ 48 + Math.random() * 2);
        x_pos = index * 10;
        q.getContext('2d').fillText(text, x_pos, y_pos);
        letters[index] = (y_pos > (Math.random() * 4 + 1) * height) ? 0 : y_pos + 10;
    });
};
for (var i=0;i<=(height*2.5)/10;i++){draw()};
setInterval(draw, 100);
</script>

5. 修改登陆界面背景图片为固定纯色背景

5.1 打开 /app/template/common/header.html ，作以下修改：
  • 在第 34 行与 35 行之间插入以下代码： 
    $background = 'linear-gradient(180deg, #f0f0f0, #c0c0c0)';
    或者平铺的格子图片背景 
    $background = 'linear-gradient(180deg, #c0f0f0, #404040);background:rgba(240,240,240,0.5) url(./static/images/wall_page/bg.png);background-repeat:repeat;background-size:auto;';

二、修改桌面样式 (index.php?desktop)

1. 修改桌面背景)图片为固定纯色背景

1.1 打开 /app/template/desktop/index.html ，作以下修改：
  • 修改第 8 行代码为如下： 
    <!-- #### <?php echo '<style >.aero:before,.aero:after,.full-background-wall{background-image:url('.$wall.')}</style>';?> #### -->
<?php echo '<style >.aero:before,.aero:after,.full-background-wall{background-image:linear-gradient(160deg, #c0e0f0, #4060a0);}</style>';?>

2.隱藏桌面风车图标(随机桌面壁纸)

2.1 打开 /static/style/skin/base/app_desktop.css ，作以下修改：
  • 查找 #random-wallpaper 添加 display:none; 屬性 
    #random-wallpaper{position:absolute;width:40px;height:60px;bottom:30px;right:25px;z-index:10;display:none;}

<完>

演示DEMO失效了，自己修改后不知道是操作问题还是肿么了，效果感觉怪怪的
要是KOD支持第三方主题包一键安装就好了

1 个月 后