NodeSeek 赛博朋克 2077 主题 1

预览

让AI帮我画的，感兴趣可以试试

先右上角切换到黑夜模式。

设置，css粘贴到这里：https://www.nodeseek.comhttp://127.0.0.1:5001/setting

/* ---
NodeSeek 赛博朋克 2077 主题
向夜之城致敬！
--- */

/* --- 1. 全局样式：基础色调与字体 --- */
body, #nsk-frame {
    background-color: #0c0c0c !important; /* 深邃的夜之城背景 */
    color: #e0e0e0 !important; /* 默认文字颜色 */
    font-family: 'Roboto Mono', 'Orbitron', 'JetBrains Mono', sans-serif !important;
}

/* --- 2. 链接与交互：霓虹高亮 --- */
a {
    color: #00e5ff !important; /* 电光蓝色链接 */
    text-decoration: none !important;
    transition: all 0.2s ease-in-out;
}
a:hover {
    color: #ff007f !important; /* 悬停时变为亮粉色 */
    text-shadow: 0 0 8px rgba(255, 0, 127, 0.6) !important; /* 霓虹发光效果 */
}

/* --- 3. 顶部导航栏：高科技HUD感 --- */
header, #nsk-head {
    background: #181818 !important; /* 比背景稍亮的深色 */
    border-bottom: 2px solid #00e5ff !important; /* 标志性的电光蓝下边框 */
    box-shadow: 0 4px 15px rgba(0, 229, 255, 0.2) !important; /* 边缘发光 */
}
.site-title .title-text, .nav-menu li a {
    color: #e0e0e0 !important;
    font-weight: bold;
    text-transform: uppercase; /* 大写增强科技感 */
}
.search-box input[type="text"] { /* 搜索框 */
    background-color: #0c0c0c !important;
    border: 1px solid #00e5ff !important;
    color: #e0e0e0 !important;
    border-radius: 4px;
}


/* --- 4. 左侧菜单栏 & 右侧面板 --- */
#nsk-left-panel-container .nsk-panel, #nsk-right-panel-container .nsk-panel {
    background-color: #181818 !important;
    border: 1px solid #333 !important;
    box-shadow: 0 0 10px rgba(0,0,0,0.5) !important;
}
#nsk-left-panel-container .category-list h4, #nsk-right-panel-container h4 {
    color: #ff007f !important;
    border-bottom: 1px solid #333 !important;
}


/* --- 5. 中间主内容区：信息流 --- */
.post-list-controler, .nsk-pager, .post-list-item {
    background-color: #1a1a1a !important; /* 列表项背景 */
    border: 1px solid #333 !important;
    border-radius: 4px !important;
    margin-bottom: 15px !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.4) !important;
    transition: all 0.2s ease-in-out;
    position: relative;
}
.post-list-item:hover {
    border-color: #00e5ff !important;
    box-shadow: 0 4px 15px rgba(0, 229, 255, 0.3) !important;
    transform: translateY(-2px);
}

/* 模拟赛博朋克边角 */
.post-list-item::before,
.post-list-item::after {
    content: '';
    position: absolute;
    width: 15px;
    height: 15px;
    border: 2px solid transparent;
    transition: all 0.2s ease-in-out;
    pointer-events: none; /* 确保不影响点击 */
}
.post-list-item::before {
    top: -2px; left: -2px;
    border-top-color: #ff007f;
    border-left-color: #ff007f;
}
.post-list-item::after {
    bottom: -2px; right: -2px;
    border-bottom-color: #00e5ff;
    border-right-color: #00e5ff;
}

.post-title a {
    color: #e0e0e0 !important;
}
.post-info, .post-info span, .post-info time {
    color: #a0a0a0 !important;
}
.post-info .info-author a, .post-info .info-last-commenter a {
     color: #00e5ff !important;
}
.post-category {
    background: #2a0a2a !important;
    color: #00e5ff !important;
    border: 1px solid #3a1a3a !important;
    padding: 2px 5px !important;
    border-radius: 4px;
}

/* 置顶帖子轮播 */
.topic-carousel-wrapper {
    background: #1a1a1a !important;
    border: 1px solid #ff007f !important; /* 高亮置顶区 */
}


/* --- 6. 按钮与分页 --- */
.btn, .button-3, .ant-btn-primary {
    background: linear-gradient(45deg, #00e5ff, #ff007f) !important;
    border: none !important;
    color: #0c0c0c !important;
    font-weight: bold !important;
    border-radius: 4px !important;
    box-shadow: 0 0 15px rgba(0, 229, 255, 0.4), 0 0 15px rgba(255, 0, 127, 0.4) !important;
    transition: all 0.3s ease-in-out !important;
}
.btn:hover, .button-3:hover, .ant-btn-primary:hover {
    transform: scale(1.05);
    box-shadow: 0 0 20px rgba(0, 229, 255, 0.6), 0 0 20px rgba(255, 0, 127, 0.6) !important;
}
.nsk-pager .pager-pos {
    background-color: #1a1a1a !important;
    border: 1px solid #333 !important;
}
.nsk-pager .pager-cur {
    background-color: #ff007f !important;
    border-color: #ff007f !important;
    color: #0c0c0c !important;
}

/* --- 7. 页脚 --- */
footer {
    background: #181818 !important;
    border-top: 2px solid #333 !important;
}
footer .group-head-link {
    color: #ff007f !important;
}

更新，椰汁城背景 大卫露西都安排上了

我就纯抛砖引玉，后面就等大佬们优化了。

/* ---
NodeSeek 赛博朋克 2077 主题 V8.0 (最终版)
背景、挂件、UI、弹窗全面定制，欢迎来到夜之城！
--- */

/* --- 核心颜色变量 --- */
:root {
    --cp2077-dark-bg: #0c0c0c;
    --cp2077-medium-bg-rgba: rgba(26, 26, 26, 0.85); /* 85%不透明度的中等背景，实现磨砂玻璃效果 */
    --cp2077-header-bg-rgba: rgba(24, 24, 24, 0.9);  /* 90%不透明度的头部背景 */
    --cp2077-light-text: #e0e0e0;
    --cp2077-grey-text: #a0a0a0;
    --cp2077-blue-neon: #00e5ff;
    --cp2077-pink-neon: #ff007f;
    --cp2077-yellow-accent: #fcee0a;
    --cp2077-border-dark: #333;
}

/* --- 1. 全局样式：夜之城背景！ --- */
body, #nsk-frame {
    background-color: var(--cp2077-dark-bg) !important; /* 图片加载失败时的后备颜色 */
    background-image: url(https://i.111666.best/image/LF4lw2vxVMJ840xfuOJ9GJ.jpeg) !important; /* 夜之城壁纸URL, 可替换 */
    background-size: cover !important; /* 覆盖整个屏幕 */
    background-position: center center !important; /* 居中显示 */
    background-attachment: fixed !important; /* 固定背景，实现视差滚动 */
    background-repeat: no-repeat !important; /* 防止重复 */
    color: var(--cp2077-light-text) !important;
    font-family: 'Roboto Mono', 'Orbitron', 'JetBrains Mono', sans-serif !important;
}

/* --- 2. 链接与交互 --- */
a {
    color: var(--cp2077-blue-neon) !important;
    text-decoration: none !important;
    transition: all 0.2s ease-in-out;
}
a:hover {
    color: var(--cp2077-pink-neon) !important;
    text-shadow: 0 0 8px rgba(255, 0, 127, 0.6) !important;
}

/* --- 3. 顶部导航栏：半透明HUD --- */
header, #nsk-head {
    background: var(--cp2077-header-bg-rgba) !important; /* 半透明头部 */
    border-bottom: 2px solid var(--cp2077-yellow-accent) !important;
    box-shadow: 0 4px 15px rgba(252, 238, 10, 0.2) !important;
    -webkit-backdrop-filter: blur(8px); /* 模糊效果，增加质感 */
    backdrop-filter: blur(8px);
}
.site-title .title-text, .nav-menu li a {
    color: var(--cp2077-light-text) !important;
    font-weight: bold;
    text-transform: uppercase;
}
.search-box input[type="text"] {
    background-color: var(--cp2077-dark-bg) !important;
    border: 1px solid var(--cp2077-blue-neon) !important;
    color: var(--cp2077-light-text) !important;
    border-radius: 4px;
}

/* --- 4. 左右侧边栏：半透明面板 --- */
#nsk-left-panel-container .nsk-panel, #nsk-right-panel-container .nsk-panel {
    background-color: var(--cp2077-medium-bg-rgba) !important;
    border: 1px solid var(--cp2077-border-dark) !important;
    box-shadow: 0 0 10px rgba(0,0,0,0.5) !important;
    border-radius: 8px; /* 圆角增加现代感 */
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
}
#nsk-left-panel-container .category-list h4, #nsk-right-panel-container h4 {
    color: var(--cp2077-yellow-accent) !important;
    border-bottom: 1px solid var(--cp2077-border-dark) !important;
}

/* --- 5. 中间主内容区：半透明信息流 --- */
.post-list-controler, .nsk-pager, .post-list-item {
    background-color: var(--cp2077-medium-bg-rgba) !important; /* 半透明背景 */
    border: 1px solid var(--cp2077-border-dark) !important;
    border-radius: 4px !important;
    margin-bottom: 15px !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.4) !important;
    transition: all 0.2s ease-in-out;
    position: relative;
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
}
.post-list-item:hover {
    border-color: var(--cp2077-blue-neon) !important;
    box-shadow: 0 4px 15px rgba(0, 229, 255, 0.3) !important;
    transform: translateY(-2px);
}
.post-list-item::before, .post-list-item::after {
    content: '';
    position: absolute;
    width: 15px;
    height: 15px;
    border: 2px solid transparent;
    transition: all 0.2s ease-in-out;
    pointer-events: none;
}
.post-list-item::before {
    top: -2px; left: -2px;
    border-top-color: var(--cp2077-yellow-accent);
    border-left-color: var(--cp2077-yellow-accent);
}
.post-list-item::after {
    bottom: -2px; right: -2px;
    border-bottom-color: var(--cp2077-blue-neon);
    border-right-color: var(--cp2077-pink-neon);
}
.post-title a {
    color: var(--cp2077-light-text) !important;
}
.post-info, .post-info span, .post-info time {
    color: var(--cp2077-grey-text) !important;
}
.post-info .info-author a, .post-info .info-last-commenter a {
     color: var(--cp2077-blue-neon) !important;
}
.post-category {
    background: #2a0a2a !important;
    color: var(--cp2077-blue-neon) !important;
    border: 1px solid #3a1a3a !important;
    padding: 2px 5px !important;
    border-radius: 4px;
}
.topic-carousel-wrapper {
    background: var(--cp2077-medium-bg-rgba) !important;
    border: 1px solid var(--cp2077-yellow-accent) !important;
    box-shadow: 0 0 10px rgba(252, 238, 10, 0.4) !important;
}

/* --- 6. 按钮与分页 --- */
.btn, .button-3, .ant-btn-primary {
    background: linear-gradient(45deg, var(--cp2077-blue-neon), var(--cp2077-pink-neon)) !important;
    border: none !important;
    color: var(--cp2077-dark-bg) !important;
    font-weight: bold !important;
    border-radius: 4px !important;
    box-shadow: 0 0 15px rgba(0, 229, 255, 0.4), 0 0 15px rgba(255, 0, 127, 0.4) !important;
    transition: all 0.3s ease-in-out !important;
}
.btn:hover, .button-3:hover, .ant-btn-primary:hover {
    transform: scale(1.05);
    box-shadow: 0 0 20px rgba(0, 229, 255, 0.6), 0 0 20px rgba(255, 0, 127, 0.6), 0 0 25px var(--cp2077-yellow-accent) !important;
}
.nsk-pager .pager-pos {
    background-color: var(--cp2077-medium-bg-rgba) !important;
    border: 1px solid var(--cp2077-border-dark) !important;
}
.nsk-pager .pager-cur {
    background-color: var(--cp2077-yellow-accent) !important;
    border-color: var(--cp2077-yellow-accent) !important;
    color: var(--cp2077-dark-bg) !important;
}

/* --- 7. 页脚 --- */
footer {
    background: var(--cp2077-header-bg-rgba) !important;
    border-top: 2px solid var(--cp2077-border-dark) !important;
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
}
footer .group-head-link {
    color: var(--cp2077-pink-neon) !important;
}

/* --- 8. 赛博朋克: 边缘行者 挂件 --- */
body::before {
    content: '';
    position: fixed;
    bottom: -10px;
    left: 20px;
    width: 250px;  /* 稍微调整尺寸以适应新图 */
    height: 250px;
    z-index: 9999;
    background-image: url(https://www.cyberpunk.net/build/images/edgerunners/characters/[email protected]); /* 大卫图片URL, 可替换 */
    background-size: contain;
    background-repeat: no-repeat;
    background-position: bottom left;
    pointer-events: none;
    animation: david-float 8s ease-in-out infinite;
}
body::after {
    content: '';
    position: fixed;
    bottom: -5px;
    right: 20px;
    width: 250px; /* 稍微调整尺寸以适应新图 */
    height: 250px;
    z-index: 9999;
    background-image: url(https://www.cyberpunk.net/build/images/edgerunners/characters/[email protected]); /* 露西图片URL, 可替换 */
    background-size: contain;
    background-repeat: no-repeat;
    background-position: bottom right;
    pointer-events: none;
    animation: lucy-float 6s ease-in-out infinite;
}
@keyframes david-float {
    0%, 100% { transform: translateY(0px); }
    50% { transform: translateY(-20px); }
}
@keyframes lucy-float {
    0%, 100% { transform: translateY(0px); }
    50% { transform: translateY(-25px); }
}

/* --- 9. 弹窗样式修正 (Modal/Confirm Box) --- */
.msc-overlay {
  display: none;
}
.msc-confirm {
  pointer-events: none;
}
.msc-content {
  pointer-events: auto;
  border-radius: 12px;
  border: 1px solid #e0e0e0;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
  opacity:.9;
}
@media (max-width: 768px) {
    body::before, body::after {
        display: none !important;
    }
}