linux.do 页面美化，支持菜单配置背景 API
// ==UserScript==
// @name linuxdo-dark
// @namespace https://linux.do/
// @version 1.1.5
// @description linux.do 页面美化，支持菜单配置背景 API
// @author You
// @match https://linux.do/*
// @grant GM_getValue
// @grant GM_setValue
// @grant GM_registerMenuCommand
// @run-at document-start
// @license MIT
// ==/UserScript==
(function() {
'use strict';
const DEFAULT_BG_API = 'https://www.loliapi.com/acg/';
const storedBgApi = (GM_getValue('backgroundApi', DEFAULT_BG_API) || '').trim();
const bgApi = storedBgApi || DEFAULT_BG_API;
const safeBgApi = bgApi.replace(/\\/g, '\\\\').replace(/'/g, "\\'");
GM_registerMenuCommand('设置背景 API', () => {
const currentValue = (GM_getValue('backgroundApi', DEFAULT_BG_API) || '').trim();
const input = prompt('请输入背景 API 地址（留空恢复默认）', currentValue || DEFAULT_BG_API);
if (input === null) return;
const nextValue = input.trim();
GM_setValue('backgroundApi', nextValue || DEFAULT_BG_API);
location.reload();
});
const STYLE_ID = 'meihua-dark-style';
if (document.getElementById(STYLE_ID)) {
return;
}
// 创建一个 style 标签来注入自定义 CSS
const style = document.createElement('style');
style.id = STYLE_ID;
// 使用 linear-gradient 在背景图上方加一层半透明黑色的遮罩，使其变暗
style.innerHTML = `
/* 设置全局背景图片，叠加半透明黑色渐变降低亮度 */
body {
background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('${safeBgApi}') !important;
background-size: cover !important;
background-position: center !important;
background-attachment: fixed !important;
background-repeat: no-repeat !important;
background-color: #111 !important;
}
/* 确保 linux.do 的主视图背景透明，以便透出底图 */
html {
background-color: transparent !important;
}
#main-outlet,
.background-container,
.list-controls,
#header-list-area,
#list-area,
#user-card,
.private_message,
.regular.contents,
.topic-map__private-message-map,
.archetype-private_message .topic-map section,
.archetype-private_message .topic-map .participants .user,
#group-card {
background-color: transparent !important;
background: transparent !important;
}
/* 强制移除导航栏内部包裹层的多余背景色 */
.d-header{
background-color: rgba(0, 0, 0, 0.3) !important;
backdrop-filter: blur(5px) !important;
box-shadow: none !important;
}
.sidebar-wrapper .sidebar-container{
border-right: none !important;
}
/* 侧边栏透明/毛玻璃效果 */
.sidebar-wrapper {
background-color: rgba(0, 0, 0, 0.3) !important;
backdrop-filter: blur(5px) !important;
-webkit-backdrop-filter: blur(10px) !important;
}
/* 侧边栏内部元素背景透明化 */
.sidebar-section-wrapper, .sidebar-section-header, .sidebar-custom-sections
, .archetype-private_message .regular.contents{
background: transparent !important;
border: none !important;
border-bottom: none !important;
}
/* 侧边栏底部面板及按钮透明化 */
.sidebar-footer-wrapper,
.sidebar-wrapper .sidebar__panel-switch-button {
background: transparent !important;
border-color: rgba(255, 255, 255, 0.1) !important;
}
/* 隐藏侧边栏底部的灰色渐变滚动遮罩层 */
.sidebar-footer-container::before {
background: transparent !important;
display: none !important;
}
/* 侧边栏底部的下拉选择框头（如排序、主题切换等） */
.sidebar-wrapper .select-kit-header.single-select-header {
background-color: rgba(255, 255, 255, 0.05) !important;
border: 1px solid rgba(255, 255, 255, 0.1) !important;
color: #ccc !important;
}
/* 修复悬停无效果 - 增加选择器权重并直接作用于包装器 */
.sidebar-wrapper .sidebar-section-link-wrapper:hover .sidebar-section-link,
.sidebar-wrapper .sidebar-section-link-wrapper:hover {
background-color: rgba(255, 255, 255, 0.08) !important;
border-radius: 8px !important;
transition: background-color 0.2s ease !important;
}
/* 侧边栏选中/激活样式优化 - 降低亮度和粗重感 */
.sidebar-wrapper .sidebar-section-link-wrapper .sidebar-section-link.active {
background-color: rgba(255, 255, 255, 0.12) !important; /* 降低了透明度，减少刺眼感 */
border-radius: 8px !important;
color: rgba(255, 255, 255, 0.9) !important; /* 文字改为柔和一些的 90% 白 */
font-weight: 500 !important; /* 减轻文字粗重感 */
}
/* 柔和处理选中项内部的文字、徽章和图标 */
.sidebar-wrapper .sidebar-section-link-wrapper .sidebar-section-link.active .sidebar-section-link-content-text,
.sidebar-wrapper .sidebar-section-link-wrapper .sidebar-section-link.active .sidebar-section-link-prefix svg,
.sidebar-wrapper .sidebar-section-link-wrapper .sidebar-section-link.active .sidebar-section-link-content-badge {
color: rgba(255, 255, 255, 0.9) !important;
fill: rgba(255, 255, 255, 0.9) !important;
}
/* 去除原本默认选中或者 hover 的黑色/暗色背景覆盖 */
.sidebar-wrapper .sidebar-section-link-wrapper .sidebar-section-link:focus {
outline: none !important;
background-color: rgba(255, 255, 255, 0.12) !important;
}
/* 搜索栏美化 */
.search-input.search-input--header {
background-color: rgba(255, 255, 255, 0.05) !important;
backdrop-filter: blur(10px) !important;
border: 1px solid rgba(255, 255, 255, 0.1) !important;
border-radius: 20px !important;
transition: all 0.3s ease !important;
}
.search-input.search-input--header:focus-within {
background-color: rgba(255, 255, 255, 0.1) !important;
border-color: rgba(255, 255, 255, 0.3) !important;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.2) !important;
}
.search-term__input {
background: transparent !important;
color: #eee !important;
border: none !important;
}
.search-term__input:focus {
outline: none !important;
box-shadow: none !important;
}
.search-input--header .show-advanced-search svg {
fill: rgba(255, 255, 255, 0.6) !important;
transition: fill 0.3s ease !important;
}
.search-input--header .show-advanced-search:hover svg {
fill: rgba(255, 255, 255, 1) !important;
}
/* 搜索结果下拉面板美化 */
.search-menu-panel.menu-panel {
background-color: rgba(40, 40, 40, 0.7) !important;
backdrop-filter: blur(20px) !important;
-webkit-backdrop-filter: blur(20px) !important;
border: 1px solid rgba(255, 255, 255, 0.3) !important;
border-radius: 16px !important;
box-shadow: 0 12px 40px rgba(0, 0, 0, 0.6) !important;
overflow: hidden !important;
}
/* 透明化内部嵌套容器背景 */
.search-menu-panel .results,
.search-menu-panel .panel-body,
.search-menu-panel .panel-body-contents,
.search-menu-panel .search-result-tag,
.search-menu-panel .search-result-user {
background-color: transparent !important;
background: transparent !important;
border: none !important;
}
.search-menu-panel li:hover,
.search-menu-panel .search-link:hover,
.search-menu-panel li:focus-within {
background-color: rgba(255, 255, 255, 0.08) !important;
}
/* 搜索结果标题和正文颜色增强 */
.search-menu-panel .topic-title,
.search-menu-panel .search-link .topic-title {
color: #efefef !important;
}
.search-menu-panel .blurb,
.search-menu-panel .search-link .blurb {
color: #cccccc !important;
}
/* 搜索结果中的图标颜色 */
.search-menu-panel svg {
fill: rgba(255, 255, 255, 0.6) !important;
}
/* 全局公告栏美化：宽度缩小，居中显示，超高透明度的毛玻璃效果 */
#global-notice-alert-global-notice {
max-width: 600px !important;
margin: 0 auto 10px auto !important;
text-align: center !important;
background: rgba(0, 0, 0, 0.3) !important;
-webkit-backdrop-filter: blur(5px) !important;
border: 1px solid rgba(255, 255, 255, 0.05) !important;
border-radius: 8px !important;
box-shadow: none !important;
color: rgba(255, 255, 255, 0.9) !important;
transition: all 0.3s ease !important;
}
#global-notice-alert-global-notice:hover {
background: rgba(0, 0, 0, 0.4) !important;
border-color: rgba(255, 255, 255, 0.1) !important;
}
/* ========== 导航容器居中一行 ========== */
.navigation-container {
display: flex !important;
flex-wrap: nowrap !important;
align-items: center !important;
justify-content: center !important;
gap: 12px !important;
padding: 8px 16px !important;
background: rgba(0, 0, 0, 0.3) !important;
border: 1px solid rgba(255, 255, 255, 0.1) !important;
border-radius: 12px !important;
margin: 10px auto !important;
max-width: fit-content !important;
transition: all 0.3s ease !important;
position: relative !important;
z-index: 100 !important;
}
.navigation-container:hover {
background: rgba(0, 0, 0, 0.4) !important;
border-color: rgba(255, 255, 255, 0.15) !important;
}
.navigation-container,
.navigation-container > .category-breadcrumb,
.navigation-container > #navigation-bar,
.navigation-container > .navigation-controls,
.navigation-container .dismiss-container-top {
display: flex !important;
flex-direction: row !important;
align-items: center !important;
flex-wrap: nowrap !important;
}
.navigation-container > * ,
#navigation-bar li,
.navigation-container .navigation-controls > * {
flex: 0 0 auto !important;
margin: 0 !important;
}
#navigation-bar,
.category-breadcrumb,
.navigation-container .navigation-controls,
.navigation-container .dismiss-container-top {
gap: 8px !important;
}
#navigation-bar li a,
.navigation-container #create-topic,
.navigation-container .dismiss-read {
white-space: nowrap !important;
}
/* ========== 类别和标签下拉框 ========== */
.category-breadcrumb {
display: flex !important;
align-items: center !important;
gap: 8px !important;
margin: 0 !important;
padding: 0 !important;
list-style: none !important;
}
.category-breadcrumb > li {
margin: 0 !important;
}
/* 类别/标签下拉框 - 透明背景 */
.category-drop,
.tag-drop,
.category-breadcrumb__category-selector,
.category-drop .select-kit-header,
.tag-drop .select-kit-header,
.category-drop-header,
.tag-drop-header,
.select-kit-header.single-select-header.combo-box-header {
background: transparent !important;
background-color: transparent !important;
backdrop-filter: none !important;
-webkit-backdrop-filter: none !important;
border: none !important;
transition: all 0.3s ease !important;
}
.category-drop:hover,
.tag-drop:hover,
.category-breadcrumb__category-selector:hover {
background: rgba(255, 255, 255, 0.1) !important;
border-radius: 6px !important;
}
/* 最新/热门/书签导航 - 透明背景 */
#navigation-bar {
display: flex !important;
align-items: center !important;
gap: 4px !important;
margin: 0 !important;
background: transparent !important;
backdrop-filter: none !important;
-webkit-backdrop-filter: none !important;
border: none !important;
list-style: none !important;
}
#navigation-bar li {
margin: 0 !important;
}
#navigation-bar li a {
display: block !important;
padding: 6px 12px !important;
border-radius: 6px !important;
transition: all 0.3s ease !important;
color: rgba(255, 255, 255, 0.8) !important;
text-decoration: none !important;
}
#navigation-bar li a:hover {
background: rgba(255, 255, 255, 0.1) !important;
color: #fff !important;
}
/* 新建话题按钮 - 透明背景 */
#create-topic,
.d-combo-button {
background: rgba(30, 30, 30, 0.3) !important;
color: rgba(200, 200, 200, 0.85) !important;
border-radius: 6px !important;
backdrop-filter: none !important;
-webkit-backdrop-filter: none !important;
border: none !important;
transition: all 0.3s ease !important;
}
#create-topic:hover,
.d-combo-button:hover {
background: rgba(30, 30, 30, 0.5) !important;
border-radius: 6px !important;
}
#create-topic svg,
.d-combo-button svg {
color: rgba(200, 200, 200, 0.85) !important;
fill: rgba(200, 200, 200, 0.85) !important;
}
/* 忽略按钮 - 透明背景 */
.dismiss-container-top,
.dismiss-new,
button.dismiss-read {
background: rgba(30, 30, 30, 0.3) !important;
border-radius: 6px !important;
backdrop-filter: none !important;
-webkit-backdrop-filter: none !important;
border: none !important;
transition: all 0.3s ease !important;
}
.dismiss-container-top:hover,
.dismiss-new:hover,
button.dismiss-read:hover {
background: rgba(30, 30, 30, 0.5) !important;
border-radius: 6px !important;
}
/* 下拉菜单展开时的样式 */
.select-kit-body {
background: rgba(0, 0, 0, 0.5) !important;
backdrop-filter: blur(10px) !important;
-webkit-backdrop-filter: blur(10px) !important;
border: 1px solid rgba(255, 255, 255, 0.1) !important;
border-radius: 8px !important;
z-index: 9999 !important;
}
/* 确保下拉框展开时在最上层 */
.category-drop[open],
.tag-drop[open],
.select-kit.is-expanded {
z-index: 9999 !important;
}
/* ========== 话题列表美化 ========== */
.topic-list {
border-collapse: separate !important;
border-spacing: 0 8px !important;
}
/* 表头行 - 毛玻璃效果 */
.topic-list thead tr {
background: rgba(0, 0, 0, 0.3) !important;
backdrop-filter: blur(5px) !important;
-webkit-backdrop-filter: blur(5px) !important;
}
.topic-list thead th {
background: transparent !important;
border: none !important;
}
.topic-list thead th:first-child {
border-radius: 8px 0 0 8px !important;
}
.topic-list thead th:last-child {
border-radius: 0 8px 8px 0 !important;
}
/* 话题行 - 毛玻璃效果 */
.topic-list-item {
background: rgba(0, 0, 0, 0.4) !important;
backdrop-filter: blur(10px) !important;
-webkit-backdrop-filter: blur(5px) !important;
transition: all 0.3s ease !important;
}
.topic-list-item:hover {
background: rgba(75, 75, 75, 0.4) !important;
}
/* 单元格统一样式 - 去除边框 */
.topic-list-item td {
background: transparent !important;
border: none !important;
border-top: none !important;
border-bottom: none !important;
}
/* 第一个和最后一个单元格圆角 */
.topic-list-item td:first-child {
border-radius: 8px 0 0 8px !important;
}
.topic-list-item td:last-child {
border-radius: 0 8px 8px 0 !important;
}
/* 去除表格默认边框线 */
.topic-list tbody,
.topic-list tr,
.topic-list td,
.topic-list th {
border: none !important;
}
/* ========== 分类标签美化（福利羊毛、开发调优等） ========== */
.badge-category__wrapper {
position: relative !important;
border-radius: 12px !important;
padding: 3px 8px !important;
transition: all 0.3s ease !important;
overflow: hidden !important;
}
/* 用伪元素实现带颜色的半透明背景 */
.badge-category__wrapper::before {
content: "" !important;
position: absolute !important;
inset: 0 !important;
background: var(--category-badge-color, #666) !important;
opacity: 0.2 !important;
border-radius: 12px !important;
transition: opacity 0.3s ease !important;
z-index: -1 !important;
}
.badge-category__wrapper:hover::before {
opacity: 0.4 !important;
}
.badge-category {
background: transparent !important;
}
/* ========== 话题标签美化（右边的标签） ========== */
.discourse-tag {
background: rgba(255, 255, 255, 0.15) !important;
border-radius: 12px !important;
padding: 2px 8px !important;
transition: all 0.3s ease !important;
border: none !important;
}
.discourse-tag:hover {
background: rgba(255, 255, 255, 0.3) !important;
}
/* 带颜色的标签保留颜色但加透明 */
.discourse-tag.box {
background: rgba(100, 100, 100, 0.4) !important;
}
.discourse-tag.box:hover {
background: rgba(130, 130, 130, 0.55) !important;
}
/* ========== 分类页面美化 ========== */
.category-list {
border-collapse: separate !important;
border-spacing: 0 8px !important;
}
.category-list tr {
background: rgba(0, 0, 0, 0.3) !important;
backdrop-filter: blur(5px) !important;
-webkit-backdrop-filter: blur(5px) !important;
border: none !important;
transition: all 0.3s ease !important;
}
.category-list tr:hover {
background: rgba(0, 0, 0, 0.4) !important;
}
.category-list tr td,
.category-list tr th {
background: transparent !important;
border: none !important;
border-top: none !important;
border-bottom: none !important;
}
.category-list tr td:first-child,
.category-list tr th:first-child {
border-radius: 8px 0 0 8px !important;
}
.category-list tr td:last-child,
.category-list tr th:last-child {
border-radius: 0 8px 8px 0 !important;
}
/* 去除分类列表边框线 */
.category-list tbody,
.category-list thead {
border: none !important;
}
/* ========== 右侧话题列表美化 ========== */
.latest-topic-list {
display: flex !important;
flex-direction: column !important;
gap: 8px !important;
}
.latest-topic-list-item {
background: rgba(0, 0, 0, 0.3) !important;
backdrop-filter: blur(5px) !important;
-webkit-backdrop-filter: blur(5px) !important;
border: none !important;
border-bottom: none !important;
border-radius: 8px !important;
padding: 8px !important;
transition: all 0.3s ease !important;
}
.latest-topic-list-item:hover {
background: rgba(0, 0, 0, 0.4) !important;
}
/* ========== 侧边栏更多菜单美化 ========== */
.fk-d-menu__inner-content {
background: rgba(0, 0, 0, 0.8) !important;
}
/* ========== 分类页面级别板块美化 ========== */
.category-heading {
background: rgba(0, 0, 0, 0.4) !important;
border-radius: 8px !important;
padding: 12px !important;
transition: all 0.3s ease !important;
}
.category-heading:hover {
background: rgba(0, 0, 0, 0.5) !important;
}
.category-box {
background: rgba(0, 0, 0, 0.3) !important;
border-radius: 8px !important;
transition: all 0.3s ease !important;
}
.category-box:hover {
background: rgba(0, 0, 0, 0.45) !important;
}
/* ========== 通知级别按钮美化 ========== */
.notifications-tracking-trigger {
background: rgba(255, 255, 255, 0.1) !important;
border-radius: 6px !important;
transition: all 0.3s ease !important;
}
.notifications-tracking-trigger:hover {
background: rgba(255, 255, 255, 0.25) !important;
border-color: rgba(255, 255, 255, 0.2) !important;
}
/* ========== 用户菜单面板（右上角通知/消息下拉） ========== */
.user-menu.menu-panel {
background: rgba(30, 30, 30, 0.85) !important;
backdrop-filter: blur(20px) !important;
-webkit-backdrop-filter: blur(20px) !important;
border: 1px solid rgba(255, 255, 255, 0.1) !important;
border-radius: 12px !important;
box-shadow: 0 12px 40px rgba(0, 0, 0, 0.6) !important;
overflow: hidden !important;
}
/* 面板内部容器背景透明 */
.user-menu .panel-body,
.user-menu .panel-body-contents,
.user-menu .quick-access-panel {
background: transparent !important;
}
/* 标签栏容器 */
.user-menu .menu-tabs-container {
background: rgba(255, 255, 255, 0.05) !important;
border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}
/* 标签按钮 */
.user-menu .user-menu-tab {
background: transparent !important;
border: none !important;
border-radius: 6px !important;
transition: all 0.2s ease !important;
}
.user-menu .user-menu-tab:hover {
background: rgba(255, 255, 255, 0.1) !important;
}
.user-menu .user-menu-tab.active {
background: rgba(255, 255, 255, 0.12) !important;
}
/* 已读通知条目 */
.user-menu .notification {
background: transparent !important;
border-radius: 0 !important;
transition: background-color 0.2s ease !important;
opacity: 0.85 !important;
}
.user-menu .notification:hover {
background: rgba(255, 255, 255, 0.2) !important;
opacity: 1 !important;
}
/* 未读通知 - 左侧高亮条 + 明显背景 */
.user-menu .notification.unread {
background: rgba(100, 180, 255, 0.2) !important;
border-left: 3px solid #4da6ff !important;
border-radius: 6px !important;
opacity: 1 !important;
}
.user-menu .notification.unread:hover {
background: rgba(100, 180, 255, 0.5) !important;
opacity: 1 !important;
}
/* 通知内链接去除默认背景 */
.user-menu .notification a {
background: transparent !important;
}
/* 底部按钮区域 */
.user-menu .panel-body-bottom {
background: rgba(255, 255, 255, 0.03) !important;
border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
}
.user-menu .panel-body-bottom .btn {
background: transparent !important;
border: none !important;
transition: background-color 0.2s ease !important;
}
.user-menu .panel-body-bottom .btn:hover {
background: rgba(255, 255, 255, 0.1) !important;
}
/* 未读徽章数字 */
.user-menu .badge-notification {
background: rgba(200, 50, 50, 1) !important;
border-radius: 10px !important;
}
/* ========== 个人消息列表美化 ========== */
/* 消息列表容器 */
.user-menu ul.user-menu-button-messages {
background: transparent !important;
}
/* 已读消息条目 */
.user-menu .message {
background: transparent !important;
border-radius: 0 !important;
transition: background-color 0.2s ease !important;
opacity: 0.6 !important;
}
.user-menu .message:hover {
background: rgba(255, 255, 255, 0.08) !important;
opacity: 0.85 !important;
}
/* 未读消息 - 左侧高亮条 + 明显背景 */
.user-menu .message.unread {
background: rgba(100, 180, 255, 0.1) !important;
border-left: 3px solid rgba(100, 180, 255, 0.7) !important;
opacity: 1 !important;
}
.user-menu .message.unread:hover {
background: rgba(100, 180, 255, 0.2) !important;
opacity: 1 !important;
}
/* 消息内链接去除默认背景 */
.user-menu .message a {
background: transparent !important;
}
/* 消息头像区域 */
.user-menu .icon-avatar {
background: transparent !important;
}
.user-menu .icon-avatar .avatar {
border-radius: 50% !important;
opacity: 0.9 !important;
}
.user-menu .icon-avatar__icon-wrapper {
background: rgba(0, 0, 0, 0.5) !important;
border-radius: 50% !important;
}
.user-menu .icon-avatar__icon-wrapper svg {
fill: rgba(255, 255, 255, 0.8) !important;
}
/* 消息发送者名称 */
.user-menu .item-label {
color: rgba(255, 255, 255, 0.9) !important;
font-weight: 500 !important;
}
/* 消息描述内容 */
.user-menu .item-description {
color: rgba(255, 255, 255, 0.65) !important;
}
.user-menu .message:hover .item-description {
color: rgba(255, 255, 255, 0.8) !important;
}
/* ========== 查看新话题提示按钮 ========== */
.show-more .alert.alert-info {
background: rgba(0, 0, 0, 0.4) !important;
backdrop-filter: blur(10px) !important;
-webkit-backdrop-filter: blur(10px) !important;
border: 1px solid rgba(255, 255, 255, 0.15) !important;
border-radius: 8px !important;
color: rgba(255, 255, 255, 0.9) !important;
transition: all 0.3s ease !important;
}
.show-more .alert.alert-info:hover {
background: rgba(0, 0, 0, 0.5) !important;
border-color: rgba(255, 255, 255, 0.25) !important;
color: #fff !important;
}
/* ========== 新建话题编辑器美化 ========== */
/* 编辑器主容器 */
#reply-control {
background: rgba(30, 30, 30, 0.85) !important;
backdrop-filter: blur(20px) !important;
-webkit-backdrop-filter: blur(20px) !important;
border: 1px solid rgba(255, 255, 255, 0.1) !important;
border-radius: 12px 12px 0 0 !important;
}
/* 顶部拖动条 */
#reply-control .grippie {
background: rgba(255, 255, 255, 0.1) !important;
border-radius: 12px 12px 0 0 !important;
}
/* 回复区域 */
#reply-control .reply-area {
background: transparent !important;
}
/* 标题输入框 */
#reply-control .title-input input {
background: rgba(255, 255, 255, 0.05) !important;
border: 1px solid rgba(255, 255, 255, 0.15) !important;
border-radius: 8px !important;
color: #eee !important;
}
#reply-control .title-input input:focus {
background: rgba(255, 255, 255, 0.08) !important;
border-color: rgba(100, 180, 255, 0.5) !important;
}
/* 版块选择框边框 */
#reply-control .category-chooser .select-kit-header,
#reply-control .tag-chooser .select-kit-header {
background: rgba(255, 255, 255, 0.05) !important;
border: 1px solid rgba(255, 255, 255, 0.15) !important;
border-radius: 8px !important;
}
#reply-control .category-chooser .select-kit-header:hover,
#reply-control .tag-chooser .select-kit-header:hover {
border-color: rgba(255, 255, 255, 0.25) !important;
}
/* 编辑器文本区域 */
#reply-control .d-editor-textarea-wrapper {
background: rgba(255, 255, 255, 0.03) !important;
border: 1px solid rgba(255, 255, 255, 0.1) !important;
border-radius: 8px !important;
}
#reply-control .d-editor-input {
background: transparent !important;
color: #eee !important;
}
/* 预览区域 */
#reply-control .d-editor-preview-wrapper {
background: rgba(255, 255, 255, 0.02) !important;
border-radius: 8px !important;
}
/* 警告提示 */
#reply-control .alert-composer-notice {
background: rgba(0, 0, 0, 0.3) !important;
border: 1px solid rgba(255, 255, 255, 0.1) !important;
border-radius: 8px !important;
}
/* 底部按钮区域 */
#reply-control .composer-controls .btn {
background: rgba(255, 255, 255, 0.08) !important;
border: none !important;
border-radius: 6px !important;
}
#reply-control .composer-controls .btn:hover {
background: rgba(255, 255, 255, 0.15) !important;
}
/* 下拉选择面板 */
.select-kit-body {
background: rgba(30, 30, 30, 0.95) !important;
backdrop-filter: blur(20px) !important;
-webkit-backdrop-filter: blur(20px) !important;
border: 1px solid rgba(255, 255, 255, 0.15) !important;
border-radius: 8px !important;
}
.select-kit-collection {
background: transparent !important;
}
.select-kit-row {
background: transparent !important;
}
/* ========== 上次访问分隔行 ========== */
.topic-list-item-separator {
background: rgba(100, 180, 255, 0.15) !important;
}
.topic-list-item-separator td {
background: transparent !important;
border-radius: 8px !important;
text-align: center !important;
}
.topic-list-item-separator span {
color: rgba(100, 180, 255, 0.9) !important;
font-weight: 500 !important;
padding: 4px 16px !important;
background: rgba(0, 0, 0, 0.0) !important;
border-radius: 12px !important;
}
/* ========== 显示标签信息按钮 ========== */
#show-tag-info {
background: rgba(255, 255, 255, 0.1) !important;
border: none !important;
border-radius: 6px !important;
transition: all 0.3s ease !important;
}
#show-tag-info:hover {
background: rgba(255, 255, 255, 0.2) !important;
}
#show-tag-info svg {
fill: rgba(255, 255, 255, 0.7) !important;
transition: fill 0.3s ease !important;
}
#show-tag-info:hover svg {
fill: rgba(255, 255, 255, 1) !important;
}
/* ========== 帖子页面美化 ========== */
/* 主话题标题区域 */
#topic-title {
background: transparent !important;
backdrop-filter: none !important;
-webkit-backdrop-filter: none !important;
padding: 0 !important;
margin: 10px auto !important;
max-width: 100% !important;
}
#topic-title .title-wrapper {
display: flex !important;
flex-direction: column !important;
align-items: center !important;
justify-content: center !important;
}
#topic-title h1 {
background: rgba(0, 0, 0, 0.3) !important;
backdrop-filter: blur(5px) !important;
-webkit-backdrop-filter: blur(5px) !important;
border-radius: 12px !important;
padding: 16px !important;
text-align: center !important;
display: inline-block !important;
width: auto !important;
max-width: 100% !important;
margin-bottom: 6px !important;
transition: all 0.3s ease !important;
}
/* 分类和标签居中 */
#topic-title .topic-category {
background: transparent !important;
display: flex !important;
justify-content: center !important;
flex-wrap: wrap !important;
gap: 8px !important;
margin-top: 0 !important;
}
#topic-title .discourse-tags {
background: transparent !important;
display: flex !important;
justify-content: center !important;
flex-wrap: wrap !important;
gap: 8px !important;
margin-top: 2px !important;
}
/* 单个分类标签样式 */
#topic-title .badge-category__wrapper {
background: rgba(0, 0, 0, 0.4) !important;
border-radius: 8px !important;
padding: 4px 8px !important;
transition: all 0.2s ease !important;
}
#topic-title .badge-category__wrapper:hover {
background: rgba(0, 0, 0, 0.6) !important;
transform: scale(1.05) !important;
}
#topic-title .badge-category__wrapper .badge-category__name {
color: var(--category-badge-color) !important;
}
#topic-title .badge-category__wrapper svg {
fill: var(--category-badge-color) !important;
}
/* 单个话题标签样式 */
#topic-title .discourse-tag {
background: rgba(0, 0, 0, 0.4) !important;
border-radius: 8px !important;
padding: 4px 8px !important;
color: var(--color1) !important;
transition: all 0.2s ease !important;
}
#topic-title .discourse-tag:hover {
background: rgba(0, 0, 0, 0.6) !important;
transform: scale(1.05) !important;
}
#topic-title .discourse-tag svg {
fill: var(--color1) !important;
}
/* 帖子详情页外层容器 - 去掉灰色背景 */
div.regular.ember-view,
section.user-main,
section.search-container {
background: transparent !important;
}
/* 帖子内容区域 */
.topic-post {
background: rgba(0, 0, 0, 0.25) !important;
backdrop-filter: blur(5px) !important;
-webkit-backdrop-filter: blur(5px) !important;
border-radius: 12px !important;
margin-bottom: 10px !important;
}
.topic-post article.boxed {
background: transparent !important;
}
.topic-body {
background: transparent !important;
border: none !important;
}
/* 引用内容 */
aside.quote {
background: rgba(0, 0, 0, 0.2) !important;
backdrop-filter: blur(5px) !important;
-webkit-backdrop-filter: blur(5px) !important;
border: 1px solid rgba(255, 255, 255, 0.1) !important;
border-left: 3px solid rgba(100, 180, 255, 0.5) !important;
border-radius: 8px !important;
padding: 10px !important;
margin: 10px 0 !important;
}
aside.quote .title {
background: transparent !important;
border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
border-left: 4px solid rgba(100, 180, 255, 0.5) !important;
border-radius: 4px 0 0 4px !important;
}
aside.quote blockquote,
aside.quote .quote-contents {
background: transparent !important;
}
/* 链接卡片（onebox） */
aside.onebox {
background: rgba(0, 0, 0, 0.2) !important;
backdrop-filter: blur(5px) !important;
-webkit-backdrop-filter: blur(5px) !important;
border: 1px solid rgba(255, 255, 255, 0.1) !important;
border-radius: 8px !important;
}
aside.onebox header.source {
background: transparent !important;
border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
}
aside.onebox .onebox-body {
background: transparent !important;
}
/* 普通链接透明 */
.cooked a {
background: transparent !important;
}
/* 引用块（blockquote）透明 */
.cooked blockquote {
background: rgba(0, 0, 0, 0.25) !important;
border-left: 3px solid rgba(100, 180, 255, 0.5) !important;
border-radius: 8px !important;
padding: 10px 15px !important;
}
/* ========== 去掉帖子页面黑色边框 ========== */
.topic-map {
border: none !important;
}
.post-links {
border: none !important;
}
.topic-avatar {
border: none !important;
}
/* ========== 导出按钮和相关按钮美化 ========== */
/* 去掉 topic-timer-info 和 topic-status-info 的边框线 */
.topic-timer-info,
.topic-status-info {
border: none !important;
}
/* topic-map --bottom 扩展到父容器宽度，加淡淡透明和模糊 */
.topic-map.--bottom {
width: 100% !important;
max-width: 100% !important;
background: rgba(0, 0, 0, 0.25) !important;
backdrop-filter: blur(5px) !important;
-webkit-backdrop-filter: blur(5px) !important;
border-radius: 12px !important;
padding: 10px !important;
}
/* topic-map 扩展到 topic-body 宽度 */
.post__topic-map.topic-map {
width: 100% !important;
max-width: 100% !important;
}
/* 导出按钮容器扩充到父容器宽度，按钮靠右 */
.linuxdoscripts-btn {
width: 100% !important;
justify-content: flex-end !important;
}
/* 美化导出按钮 */
.linuxdoscripts-export-md {
background: rgba(100, 180, 255, 0.2) !important;
border: none !important;
border-radius: 8px !important;
color: rgba(100, 180, 255, 0.9) !important;
transition: all 0.2s ease !important;
backdrop-filter: blur(5px) !important;
}
.linuxdoscripts-export-md:hover {
background: rgba(100, 180, 255, 0.35) !important;
color: #fff !important;
transform: translateY(-2px) !important;
box-shadow: 0 4px 12px rgba(100, 180, 255, 0.3) !important;
}
/* 美化回复按钮 */
.post-action-menu__reply.reply {
background: rgba(100, 180, 255, 0.2) !important;
border: none !important;
border-radius: 8px !important;
color: rgba(100, 180, 255, 0.9) !important;
transition: all 0.2s ease !important;
margin-right: 8px !important;
}
.post-action-menu__reply.reply:hover {
background: rgba(100, 180, 255, 0.35) !important;
color: rgba(100, 180, 255, 1) !important;
transform: translateY(-2px) !important;
box-shadow: 0 4px 12px rgba(100, 180, 255, 0.3) !important;
}
/* 美化热门回复和总结按钮 */
.topic-map .btn-default {
background: rgba(255, 255, 255, 0.12) !important;
border: none !important;
border-radius: 8px !important;
color: rgba(255, 255, 255, 0.8) !important;
transition: all 0.2s ease !important;
}
.topic-map .btn-default:hover {
background: rgba(255, 255, 255, 0.25) !important;
color: #fff !important;
transform: translateY(-2px) !important;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important;
}
/* 按钮 svg 图标继承颜色 */
.linuxdoscripts-export-md svg,
.post-action-menu__reply svg,
.topic-map .btn-default svg {
color: inherit !important;
}
/* ========== 底部按钮区域美化（分享、书签、举报、指定、回复、常规） ========== */
/* 父容器 flex 横向居中，和评论 div 对齐 */
#topic-footer-buttons {
display: flex !important;
flex-direction: row !important;
flex-wrap: wrap !important;
align-items: center !important;
gap: 8px !important;
}
/* 主按钮容器 */
.topic-footer-main-buttons {
display: flex !important;
flex-direction: row !important;
align-items: center !important;
gap: 8px !important;
}
/* 按钮组一行显示 */
.topic-footer-main-buttons__actions {
display: flex !important;
flex-wrap: nowrap !important;
gap: 8px !important;
}
/* 美化分享、书签、举报、指定按钮 */
.topic-footer-button.share-and-invite,
.topic-footer-button.bookmark-menu-trigger,
.topic-footer-button.flag-topic,
.topic-footer-button.assign {
background: rgba(0, 0, 0, 0.3) !important;
border: none !important;
border-radius: 8px !important;
color: rgba(200, 200, 200, 0.85) !important;
transition: all 0.2s ease !important;
backdrop-filter: blur(5px) !important;
-webkit-backdrop-filter: blur(5px) !important;
}
.topic-footer-button.share-and-invite:hover,
.topic-footer-button.bookmark-menu-trigger:hover,
.topic-footer-button.flag-topic:hover,
.topic-footer-button.assign:hover {
background: rgba(0, 0, 0, 0.45) !important;
color: rgba(255, 255, 255, 0.95) !important;
transform: translateY(-2px) !important;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important;
}
/* 底部回复按钮 */
.topic-footer-button.create {
background: rgba(100, 180, 255, 0.2) !important;
border: none !important;
border-radius: 8px !important;
color: rgba(100, 180, 255, 0.85) !important;
transition: all 0.2s ease !important;
backdrop-filter: blur(5px) !important;
-webkit-backdrop-filter: blur(5px) !important;
}
.topic-footer-button.create:hover {
background: rgba(100, 180, 255, 0.35) !important;
color: rgba(100, 180, 255, 1) !important;
transform: translateY(-2px) !important;
box-shadow: 0 4px 12px rgba(100, 180, 255, 0.3) !important;
}
/* 按钮 svg 继承颜色 */
.topic-footer-button svg {
color: inherit !important;
}
/* 通知级别按钮（常规）放到同一行 */
.notifications-button-footer {
display: flex !important;
align-items: center !important;
}
.notifications-button-footer .reason {
display: flex !important;
}
/* 隐藏旁边的文字 */
.notifications-button-footer .reason .text {
display: none !important;
}
/* 美化常规按钮 */
.notifications-button-footer .notifications-tracking-trigger {
background: rgba(0, 0, 0, 0.3) !important;
border: none !important;
border-radius: 8px !important;
color: rgba(200, 200, 200, 0.85) !important;
transition: all 0.2s ease !important;
backdrop-filter: blur(5px) !important;
-webkit-backdrop-filter: blur(5px) !important;
}
.notifications-button-footer .notifications-tracking-trigger:hover {
background: rgba(0, 0, 0, 0.5) !important;
color: rgba(255, 255, 255, 0.95) !important;
transform: translateY(-2px) !important;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important;
}
/* ========== 右侧时间线按钮美化 ========== */
.topic-timeline .btn-default {
background: rgba(0, 0, 0, 0.3) !important;
border: none !important;
border-radius: 8px !important;
color: rgba(200, 200, 200, 0.85) !important;
transition: all 0.2s ease !important;
backdrop-filter: blur(5px) !important;
-webkit-backdrop-filter: blur(5px) !important;
}
.topic-timeline .btn-default:hover {
background: rgba(0, 0, 0, 0.5) !important;
color: rgba(255, 255, 255, 0.95) !important;
transform: translateY(-2px) !important;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important;
}
.topic-timeline .btn.create {
background: rgba(100, 180, 255, 0.25) !important;
border: none !important;
border-radius: 8px !important;
color: rgba(100, 180, 255, 0.9) !important;
transition: all 0.2s ease !important;
backdrop-filter: blur(5px) !important;
-webkit-backdrop-filter: blur(5px) !important;
}
.topic-timeline .btn.create:hover {
background: rgba(100, 180, 255, 0.4) !important;
color: rgba(100, 180, 255, 1) !important;
transform: translateY(-2px) !important;
box-shadow: 0 4px 12px rgba(100, 180, 255, 0.3) !important;
}
.topic-timeline .btn-default svg,
.topic-timeline .btn.create svg {
color: inherit !important;
}
/* ========== 底部推荐/相关话题区域 ========== */
/* 让 topic-list-header 相对定位 */
.more-topics__container .topic-list-header {
position: relative !important;
}
/* 将按钮容器定位到 default 列头 */
.more-topics__container > .row {
position: absolute !important;
top: 0 !important;
left: 0 !important;
margin: 0 !important;
padding: 0 !important;
z-index: 10 !important;
}
/* 隐藏 "话题" 文字 */
.more-topics__container .topic-list-header .default > span {
display: none !important;
}
/* 给推荐/相关按钮加背景 */
.more-topics__container .nav-pills {
background: rgba(0, 0, 0, 0.3) !important;
padding: 0 8px !important;
border-radius: 6px !important;
position: relative !important;
z-index: 10 !important;
}
/* 去掉 thead tr 的 backdrop-filter */
.topic-list thead tr {
backdrop-filter: none !important;
-webkit-backdrop-filter: none !important;
}
/* ========== 提高浏览量面板层级 ========== */
.topic-post:has(.fk-d-menu.-expanded) {
z-index: 100 !important;
}
.topic-map__views-content {
z-index: 1000 !important;
}
/* ========== 美化表情选择器 ========== */
.discourse-reactions-picker-container {
background: rgba(0, 0, 0, 0.3) !important;
backdrop-filter: blur(10px) !important;
-webkit-backdrop-filter: blur(10px) !important;
border: 1px solid rgba(255, 255, 255, 0.1) !important;
border-radius: 12px !important;
}
/* 表情按钮悬浮效果 */
.discourse-reactions-picker-container .pickable-reaction:hover {
background: rgba(255, 255, 255, 0.1) !important;
border-radius: 8px !important;
}
/* ========== 美化折叠块 ========== */
/* 外层透明度弱 */
.cooked details {
background: rgba(0, 0, 0, 0.15) !important;
border: 1px solid rgba(255, 255, 255, 0.1) !important;
border-radius: 8px !important;
padding: 10px !important;
margin: 10px 0 !important;
}
/* 折叠块标题 */
.cooked details summary {
cursor: pointer !important;
color: rgba(100, 180, 255, 0.9) !important;
padding: 5px !important;
}
.cooked details summary:hover {
color: rgba(100, 180, 255, 1) !important;
}
/* 中间层 pre */
.cooked details pre {
background: rgba(0, 0, 0, 0.25) !important;
border-radius: 6px !important;
margin-top: 8px !important;
}
/* 内层 code - 最深 */
.cooked details pre code {
background: rgba(0, 0, 0, 0.3) !important;
border-radius: 4px !important;
}
/* ========== 美化时间线切换按钮 ========== */
.timeline-toggle {
background: rgba(0, 0, 0, 0.3) !important;
border: none !important;
border-radius: 8px !important;
color: rgba(200, 200, 200, 0.85) !important;
transition: all 0.2s ease !important;
backdrop-filter: blur(5px) !important;
-webkit-backdrop-filter: blur(5px) !important;
}
.timeline-toggle:hover {
background: rgba(0, 0, 0, 0.5) !important;
color: rgba(255, 255, 255, 0.95) !important;
transform: translateY(-2px) !important;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important;
}
.timeline-toggle svg {
color: inherit !important;
}
/* ========== 美化 MathJax bbox 容器 ========== */
mjx-mstyle[style*="background-color"] {
background: rgba(0, 0, 0, 0.25) !important;
backdrop-filter: blur(5px) !important;
-webkit-backdrop-filter: blur(5px) !important;
border: 1px solid rgba(255, 255, 255, 0.1) !important;
border-radius: 12px !important;
}
/* ========== 搜索页面美化 ========== */
/* 美化搜索结果项 */
.fps-result {
background: rgba(0, 0, 0, 0.25) !important;
backdrop-filter: blur(5px) !important;
-webkit-backdrop-filter: blur(5px) !important;
border: 1px solid rgba(255, 255, 255, 0.1) !important;
border-radius: 12px !important;
padding: 15px !important;
margin-bottom: 10px !important;
transition: all 0.2s ease !important;
position: relative !important;
z-index: 1 !important;
}
.fps-result:hover {
background: rgba(0, 0, 0, 0.35) !important;
transform: translateY(-2px) !important;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important;
}
/* 搜索框美化 */
.search-header .search-bar input {
background: rgba(0, 0, 0, 0.3) !important;
border: 1px solid rgba(255, 255, 255, 0.15) !important;
border-radius: 8px !important;
color: #eee !important;
}
.search-header .search-bar input:focus {
border-color: rgba(100, 180, 255, 0.5) !important;
}
/* 高级筛选器按钮 */
.advanced-filters__toggle {
background: rgba(0, 0, 0, 0.3) !important;
border: none !important;
border-radius: 8px !important;
color: rgba(200, 200, 200, 0.85) !important;
}
.advanced-filters__toggle:hover {
background: rgba(0, 0, 0, 0.5) !important;
color: rgba(255, 255, 255, 0.95) !important;
}
/* 美化搜索信息栏（排序依据区域） */
.search-info {
background: rgba(0, 0, 0, 0.25) !important;
backdrop-filter: blur(5px) !important;
-webkit-backdrop-filter: blur(5px) !important;
border: 1px solid rgba(255, 255, 255, 0.1) !important;
border-radius: 8px !important;
padding: 10px !important;
position: relative !important;
z-index: 100 !important;
}
/* 美化搜索页面的下拉框 */
.search-container .select-kit .select-kit-header {
background: rgba(0, 0, 0, 0.3) !important;
border: 1px solid rgba(255, 255, 255, 0.15) !important;
border-radius: 8px !important;
color: rgba(200, 200, 200, 0.85) !important;
}
.search-container .select-kit .select-kit-header:hover {
background: rgba(0, 0, 0, 0.4) !important;
border-color: rgba(255, 255, 255, 0.25) !important;
}
/* 美化展开的下拉列表 */
.select-kit-body {
background: rgba(0, 0, 0, 0.3) !important;
backdrop-filter: blur(10px) !important;
-webkit-backdrop-filter: blur(10px) !important;
border: 1px solid rgba(255, 255, 255, 0.1) !important;
border-radius: 8px !important;
}
/* 下拉列表选项悬浮效果 */
.select-kit-row:hover {
background: rgba(255, 255, 255, 0.1) !important;
}
.select-kit-row.is-selected,
.select-kit-row.is-highlighted {
background: rgba(100, 180, 255, 0.2) !important;
}
/* 提高搜索信息栏的 z-index */
.search-info .select-kit {
z-index: 10000 !important;
}
.search-info .select-kit-body {
z-index: 10001 !important;
}
/* 美化高级筛选器容器 */
.search-advanced-filters {
background: rgba(0, 0, 0, 0.25) !important;
backdrop-filter: blur(5px) !important;
-webkit-backdrop-filter: blur(5px) !important;
border: 1px solid rgba(255, 255, 255, 0.1) !important;
border-radius: 12px !important;
padding: 15px !important;
position: relative !important;
z-index: 1000 !important;
}
/* 美化高级筛选器内的输入框 */
.search-advanced-filters input,
.search-advanced-filters .date-picker,
.search-advanced-filters .input-small {
background: rgba(0, 0, 0, 0.3) !important;
border: 1px solid rgba(255, 255, 255, 0.15) !important;
border-radius: 8px !important;
color: #eee !important;
}
.search-advanced-filters input:focus {
border-color: rgba(100, 180, 255, 0.5) !important;
}
/* 美化高级筛选器内的下拉框 */
.search-advanced-filters .select-kit-header {
background: rgba(0, 0, 0, 0.3) !important;
border: 1px solid rgba(255, 255, 255, 0.15) !important;
border-radius: 8px !important;
}
.search-advanced-filters .select-kit-header:hover {
border-color: rgba(255, 255, 255, 0.25) !important;
}
/* 去掉选择框的灰色背景 */
.search-advanced-filters .select-kit.multi-select,
.search-advanced-filters .select-kit.tag-chooser,
.search-advanced-filters .select-kit.user-chooser,
.search-advanced-filters .select-kit.email-group-user-chooser {
background: transparent !important;
}
/* 提高高级筛选器容器的层级 */
/* 确保选择列表在最上层 */
.search-advanced-filters .select-kit.is-expanded {
z-index: 10000 !important;
}
.search-advanced-filters .select-kit-body {
z-index: 10001 !important;
background: rgba(0, 0, 0, 0.6) !important;
}
/* 降低搜索结果的层级 */
.search-results {
position: relative !important;
z-index: 1 !important;
}
/* ========== 用户个人资料页美化 ========== */
/* 用户详情区域 */
.user-main .details {
background: rgba(0, 0, 0, 0.3) !important;
backdrop-filter: blur(10px) !important;
-webkit-backdrop-filter: blur(10px) !important;
border: 1px solid rgba(255, 255, 255, 0.1) !important;
border-radius: 12px !important;
}
/* 用户内容区域 */
.user-content {
background: transparent !important;
}
/* 统计区域 */
.stats-section {
background: rgba(0, 0, 0, 0.25) !important;
backdrop-filter: blur(5px) !important;
-webkit-backdrop-filter: blur(5px) !important;
border: 1px solid rgba(255, 255, 255, 0.1) !important;
border-radius: 12px !important;
padding: 15px !important;
}
/* 徽章卡片 */
.badge-card {
background: rgba(0, 0, 0, 0.3) !important;
backdrop-filter: blur(5px) !important;
-webkit-backdrop-filter: blur(5px) !important;
border: 1px solid rgba(255, 255, 255, 0.1) !important;
border-radius: 8px !important;
transition: all 0.2s ease !important;
}
.badge-card:hover {
background: rgba(0, 0, 0, 0.4) !important;
transform: translateY(-2px) !important;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important;
}
/* 热门回复/话题列表 */
.top-section {
background: rgba(0, 0, 0, 0.25) !important;
backdrop-filter: blur(5px) !important;
-webkit-backdrop-filter: blur(5px) !important;
border: 1px solid rgba(255, 255, 255, 0.1) !important;
border-radius: 12px !important;
padding: 15px !important;
margin-bottom: 15px !important;
}
/* 美化热门回复、热门话题、热门链接列表项的左边框 */
.replies-section li,
.topics-section li,
.links-section li {
border-left: 2px solid rgba(100, 180, 255, 0.5) !important;
padding-left: 10px !important;
transition: all 0.2s ease !important;
}
.replies-section li:hover,
.topics-section li:hover,
.links-section li:hover {
border-left-color: rgba(100, 180, 255, 0.8) !important;
background: rgba(100, 180, 255, 0.05) !important;
}
/* 被谁赞得最多、赞最多、最多回复至 */
.liked-by-section li,
.liked-section li,
.replied-section li {
border-left: 2px solid rgba(100, 180, 255, 0.5) !important;
padding-left: 10px !important;
transition: all 0.2s ease !important;
}
.liked-by-section li:hover,
.liked-section li:hover,
.replied-section li:hover {
border-left-color: rgba(100, 180, 255, 0.8) !important;
background: rgba(100, 180, 255, 0.05) !important;
}
/* 美化用户资料展开按钮 */
.user-profile-toggle-btn {
background: rgba(100, 180, 255, 0.2) !important;
backdrop-filter: blur(5px) !important;
-webkit-backdrop-filter: blur(5px) !important;
border: 1px solid rgba(255, 255, 255, 0.1) !important;
border-radius: 8px !important;
color: rgba(100, 180, 255, 0.9) !important;
transition: all 0.2s ease !important;
position: relative !important;
right: 30px !important;
}
.user-profile-toggle-btn:hover {
background: rgba(100, 180, 255, 0.35) !important;
color: rgba(100, 180, 255, 1) !important;
transform: translateY(-2px) !important;
box-shadow: 0 4px 12px rgba(100, 180, 255, 0.3) !important;
}
.user-profile-toggle-btn svg {
color: inherit !important;
}
/* 导航区域和用户区分开 */
.user-navigation {
margin-top: 15px !important;
background: rgba(0, 0, 0, 0.25) !important;
backdrop-filter: blur(5px) !important;
-webkit-backdrop-filter: blur(5px) !important;
border: 1px solid rgba(255, 255, 255, 0.1) !important;
border-radius: 12px !important;
padding: 8px 15px !important;
}
/* 导航链接美化 */
.user-nav a {
color: rgba(200, 200, 200, 0.85) !important;
transition: all 0.2s ease !important;
border-radius: 8px !important;
padding: 6px 12px !important;
}
.user-nav a:hover {
background: rgba(255, 255, 255, 0.1) !important;
color: rgba(255, 255, 255, 0.95) !important;
}
.user-nav a.active {
background: rgba(100, 180, 255, 0.2) !important;
color: rgba(100, 180, 255, 0.9) !important;
}
/* ========== 用户活动页面美化 ========== */
/* 活动列表项 */
.user-stream-item {
background: rgba(0, 0, 0, 0.25) !important;
backdrop-filter: blur(5px) !important;
-webkit-backdrop-filter: blur(5px) !important;
border: 1px solid rgba(255, 255, 255, 0.1) !important;
border-radius: 12px !important;
margin-bottom: 10px !important;
transition: all 0.2s ease !important;
}
.user-stream-item:hover {
background: rgba(0, 0, 0, 0.35) !important;
transform: translateY(-2px) !important;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important;
}
/* 子导航（全部、回复、话题等） */
.user-navigation-secondary {
background: rgba(0, 0, 0, 0.25) !important;
backdrop-filter: blur(5px) !important;
-webkit-backdrop-filter: blur(5px) !important;
border: 1px solid rgba(255, 255, 255, 0.1) !important;
border-radius: 12px !important;
padding: 8px 15px !important;
margin-bottom: 15px !important;
}
.user-navigation-secondary a {
color: rgba(200, 200, 200, 0.85) !important;
transition: all 0.2s ease !important;
border-radius: 8px !important;
padding: 6px 12px !important;
}
.user-navigation-secondary a:hover {
background: rgba(255, 255, 255, 0.1) !important;
color: rgba(255, 255, 255, 0.95) !important;
}
.user-navigation-secondary a.active {
background: rgba(100, 180, 255, 0.2) !important;
color: rgba(100, 180, 255, 0.9) !important;
}
/* 书签搜索框美化 */
.bookmark-search-form input {
background: rgba(0, 0, 0, 0.3) !important;
backdrop-filter: blur(5px) !important;
-webkit-backdrop-filter: blur(5px) !important;
border: 1px solid rgba(255, 255, 255, 0.15) !important;
border-radius: 8px !important;
color: #eee !important;
transition: all 0.2s ease !important;
}
.bookmark-search-form input:focus {
border-color: rgba(100, 180, 255, 0.5) !important;
box-shadow: 0 0 0 2px rgba(100, 180, 255, 0.1) !important;
}
.bookmark-search-form input::placeholder {
color: rgba(200, 200, 200, 0.5) !important;
}
/* ========== 通知页面美化 ========== */
/* 通知列表项 */
.notification {
background: rgba(0, 0, 0, 0.25) !important;
backdrop-filter: blur(5px) !important;
-webkit-backdrop-filter: blur(5px) !important;
border: 1px solid rgba(255, 255, 255, 0.1) !important;
border-radius: 10px !important;
margin-bottom: 8px !important;
transition: all 0.2s ease !important;
}
/* 未读通知 */
.notification.unread {
background: rgba(100, 180, 255, 0.25) !important;
border-left: 3px solid rgba(100, 180, 255, 0.7) !important;
}
.notification:hover {
background: rgba(0, 0, 0, 0.35) !important;
transform: translateX(5px) !important;
}
.notification.unread:hover {
background: rgba(100, 180, 255, 0.35) !important;
}
/* ========== 用户菜单面板美化 ========== */
.user-menu.menu-panel {
background: rgba(30, 30, 30, 0.92) !important;
backdrop-filter: blur(20px) !important;
-webkit-backdrop-filter: blur(20px) !important;
border: 1px solid rgba(255, 255, 255, 0.15) !important;
border-radius: 12px !important;
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5) !important;
}
/* 未读通知在面板中 */
.quick-access-panel .notification.unread {
background: rgba(100, 180, 255, 0.2) !important;
border-left: 3px solid rgba(100, 180, 255, 0.7) !important;
}
.quick-access-panel .notification.unread:hover {
background: rgba(100, 180, 255, 0.3) !important;
}
/* 标签切换美化 */
.user-menu .tabs-list {
border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
}
.user-menu .tabs-list .btn {
background: transparent !important;
color: rgba(200, 200, 200, 0.85) !important;
border-radius: 8px 8px 0 0 !important;
transition: all 0.2s ease !important;
}
.user-menu .tabs-list .btn:hover {
background: rgba(255, 255, 255, 0.1) !important;
color: rgba(255, 255, 255, 0.95) !important;
}
.user-menu .tabs-list .btn.active {
background: rgba(100, 180, 255, 0.2) !important;
color: rgba(100, 180, 255, 0.9) !important;
}
/* 已读私信优化 */
li.message.read {
background: rgba(255, 255, 255, 0.08) !important;
}
li.message.read:hover {
background: rgba(255, 255, 255, 0.15) !important;
}
/* 个人收藏列表项美化 */
.quick-access-panel li.bookmark {
background: rgba(0, 0, 0, 0.3) !important;
transition: all 0.2s ease !important;
}
.quick-access-panel li.bookmark:hover {
background: rgba(255, 255, 255, 0.1) !important;
}
/* ========== 弹出层/模态框美化 ========== */
.d-modal__container {
background: rgba(0, 0, 0, 0.25) !important;
backdrop-filter: blur(20px) !important;
-webkit-backdrop-filter: blur(20px) !important;
border: 1px solid rgba(255, 255, 255, 0.15) !important;
border-radius: 16px !important;
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5) !important;
}
.d-modal__header {
border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
}
.d-modal__title {
color: #fff !important;
}
/* 模态框内的输入框 */
.d-modal input,
.d-modal textarea {
background: rgba(0, 0, 0, 0.3) !important;
border: 1px solid rgba(255, 255, 255, 0.15) !important;
border-radius: 8px !important;
color: #eee !important;
}
.d-modal input:focus,
.d-modal textarea:focus {
border-color: rgba(100, 180, 255, 0.5) !important;
}
/* 模态框内的按钮 */
.d-modal .btn-primary {
background: rgba(100, 180, 255, 0.3) !important;
border: none !important;
color: rgba(100, 180, 255, 1) !important;
border-radius: 8px !important;
}
.d-modal .btn-primary:hover {
background: rgba(100, 180, 255, 0.5) !important;
}
/* ========== 表格美化 ========== */
.d-table {
background: rgba(0, 0, 0, 0.25) !important;
backdrop-filter: blur(5px) !important;
-webkit-backdrop-filter: blur(5px) !important;
border: 1px solid rgba(255, 255, 255, 0.1) !important;
border-radius: 12px !important;
overflow: hidden !important;
}
.d-table__header {
background: rgba(0, 0, 0, 0.2) !important;
}
.d-table__body {
border-top: none !important;
}
.d-table__row {
transition: all 0.2s ease !important;
border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
}
.d-table__row:hover {
background: rgba(255, 255, 255, 0.05) !important;
}
.d-table__cell {
border: none !important;
}
/* ========== 邀请页面美化 ========== */
/* 邀请按钮 */
.invite-button {
background: rgba(100, 180, 255, 0.9) !important;
border: none !important;
border-radius: 8px !important;
color: rgba(100, 180, 255, 1) !important;
transition: all 0.2s ease !important;
}
.invite-button:hover {
background: rgba(100, 180, 255, 0.75) !important;
transform: translateY(-2px) !important;
box-shadow: 0 4px 12px rgba(100, 180, 255, 0.3) !important;
}
/* 编辑和其他小按钮 */
.edit-invite,
.invites-menu-trigger {
background: rgba(100, 180, 255, 0.2) !important;
border: none !important;
border-radius: 6px !important;
color: rgba(100, 180, 255, 0.9) !important;
transition: all 0.2s ease !important;
}
.edit-invite:hover,
.invites-menu-trigger:hover {
background: rgba(100, 180, 255, 0.35) !important;
color: rgba(100, 180, 255, 1) !important;
}
/* 通用用户内容区按钮 */
.user-content .btn-default {
background: rgba(100, 180, 255, 0.2) !important;
border: none !important;
border-radius: 8px !important;
color: rgba(100, 180, 255, 0.9) !important;
transition: all 0.2s ease !important;
}
.user-content .btn-default:hover {
background: rgba(100, 180, 255, 0.35) !important;
color: rgba(100, 180, 255, 1) !important;
transform: translateY(-2px) !important;
}
.user-content .btn-default svg {
color: inherit !important;
}
/* ========== 关注动态页面美化 ========== */
.follow-stream-item {
background: rgba(0, 0, 0, 0.25) !important;
backdrop-filter: blur(5px) !important;
-webkit-backdrop-filter: blur(5px) !important;
border: 1px solid rgba(255, 255, 255, 0.1) !important;
border-radius: 12px !important;
margin-bottom: 10px !important;
transition: all 0.2s ease !important;
}
.follow-stream-item:hover {
background: rgba(0, 0, 0, 0.35) !important;
transform: translateY(-2px) !important;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important;
}
/* ========== 偏好设置页面美化 ========== */
/* 编辑器文本区域 */
.d-editor-textarea-wrapper {
background: rgba(0, 0, 0, 0.3) !important;
border: 1px solid rgba(255, 255, 255, 0.15) !important;
border-radius: 8px !important;
}
/* 编辑器预览区域 */
.d-editor-preview {
background: rgba(0, 0, 0, 0.25) !important;
border: 1px solid rgba(255, 255, 255, 0.1) !important;
border-radius: 8px !important;
}
/* 偏好设置表单输入框 */
.user-preferences input,
.user-preferences textarea,
.user-preferences select {
background: rgba(0, 0, 0, 0.3) !important;
border: 1px solid rgba(255, 255, 255, 0.15) !important;
border-radius: 8px !important;
color: #eee !important;
}
.user-preferences input:focus,
.user-preferences textarea:focus,
.user-preferences select:focus {
border-color: rgba(100, 180, 255, 0.5) !important;
}
/* 偏好设置选择器美化 */
.user-preferences .select-kit.multi-select,
.user-preferences .select-kit.category-selector,
.user-preferences .select-kit.tag-chooser {
background: rgba(0, 0, 0, 0.3) !important;
border: 1px solid rgba(255, 255, 255, 0.15) !important;
border-radius: 8px !important;
}
.user-preferences .select-kit-header {
background: transparent !important;
border: none !important;
}
.user-preferences .select-kit-header:hover {
background: rgba(255, 255, 255, 0.05) !important;
}
/* 偏好设置整个容器加淡淡透明 */
.user-content.user-preferences {
background: rgba(0, 0, 0, 0.15) !important;
backdrop-filter: blur(5px) !important;
-webkit-backdrop-filter: blur(5px) !important;
border: 1px solid rgba(255, 255, 255, 0.1) !important;
border-radius: 12px !important;
padding: 15px !important;
}
/* 屏蔽用户列表美化 */
.ignored-list {
background: rgba(0, 0, 0, 0.25) !important;
backdrop-filter: blur(5px) !important;
-webkit-backdrop-filter: blur(5px) !important;
border: 1px solid rgba(255, 255, 255, 0.1) !important;
border-radius: 8px !important;
}
/* 添加保存搜索按钮美化 */
.add-saved-search {
background: rgba(100, 180, 255, 0.2) !important;
border: none !important;
border-radius: 8px !important;
color: rgba(100, 180, 255, 0.9) !important;
transition: all 0.2s ease !important;
}
.add-saved-search:hover {
background: rgba(100, 180, 255, 0.35) !important;
color: rgba(100, 180, 255, 1) !important;
transform: translateY(-2px) !important;
}
/* ========== 聊天窗口美化 ========== */
.chat-drawer-container {
background: rgba(0, 0, 0, 0.5) !important;
backdrop-filter: blur(15px) !important;
-webkit-backdrop-filter: blur(15px) !important;
border: 1px solid rgba(255, 255, 255, 0.1) !important;
border-radius: 12px 12px 0 0 !important;
}
/* 聊天频道列表项 */
.chat-channel-row {
transition: all 0.2s ease !important;
border-radius: 8px !important;
margin: 2px 8px !important;
}
.chat-channel-row:hover {
background: rgba(255, 255, 255, 0.1) !important;
}
.chat-channel-row.active {
background: rgba(100, 180, 255, 0.2) !important;
}
/* 聊天窗口头部 */
.chat-drawer-header {
border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
}
/* 聊天导航栏 */
.c-navbar-container {
background: rgba(0, 0, 0, 0.3) !important;
border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
}
/* 聊天消息容器 */
.chat-message-container {
background: transparent !important;
}
.chat-message-container:hover {
background: rgba(255, 255, 255, 0.05) !important;
}
/* 消息分隔符 */
.chat-message-separator__text {
background: rgba(0, 0, 0, 0.5) !important;
border-radius: 4px !important;
padding: 2px 8px !important;
}
/* 全屏聊天页面加淡淡透明 */
.full-page-chat {
background: rgba(0, 0, 0, 0.15) !important;
backdrop-filter: blur(5px) !important;
-webkit-backdrop-filter: blur(5px) !important;
}
/* 小动作容器去掉灰色线 */
.small-action-desc {
border-top: none !important;
}
/* 首次发帖和回归用户提示保持透明 */
.post-notice.new-user,
.post-notice.returning-user {
background: transparent !important;
}
/* 所有用户标题添加炫彩渐变效果 */
.user-title {
background: linear-gradient(135deg, rgb(255, 0, 255) 0%, rgb(0, 255, 255) 25%, rgb(255, 255, 0) 50%, rgb(255, 0, 255) 75%, rgb(0, 255, 255) 100%) !important;
background-size: 400% 400% !important;
-webkit-background-clip: text !important;
background-clip: text !important;
-webkit-text-fill-color: transparent !important;
animation: rainbow-shift 8s ease infinite !important;
}
@keyframes rainbow-shift {
0% { background-position: 0% 50%; }
50% { background-position: 100% 50%; }
100% { background-position: 0% 50%; }
}
/* @提及用户样式 */
a.mention {
background-color: rgba(255, 255, 255, 0.1) !important;
padding: 2px 8px !important;
border-radius: 6px !important;
display: inline-block !important;
transition: all 0.2s ease !important;
}
a.mention:hover {
background-color: rgba(255, 255, 255, 0.25) !important;
transform: translateY(-1px) !important;
box-shadow: 0 2px 8px rgba(255, 255, 255, 0.15) !important;
}
/* ========== 用户信息卡片美化 ========== */
/* 默认按钮样式 */
#user-card .btn-default,
#user-card .btn.addusertag {
background: rgba(255, 255, 255, 0.12) !important;
border: none !important;
border-radius: 8px !important;
color: rgba(255, 255, 255, 0.8) !important;
transition: all 0.2s ease !important;
}
#user-card .btn-default:hover,
#user-card .btn.addusertag:hover {
background: rgba(255, 255, 255, 0.25) !important;
color: #fff !important;
transform: translateY(-2px) !important;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important;
}
/* 主要按钮（私信）样式 */
#user-card .btn-primary {
background: rgb(9, 157, 215) !important;
border: none !important;
border-radius: 8px !important;
color: #fff !important;
transition: all 0.2s ease !important;
}
#user-card .btn-primary:hover {
background: rgb(30, 175, 230) !important;
transform: translateY(-2px) !important;
box-shadow: 0 4px 12px rgba(9, 157, 215, 0.4) !important;
}
/* 用户徽章透明化 */
#user-card .user-badge {
background: rgba(255, 255, 255, 0.1) !important;
}
/* 主话题标题hover效果 - 参考公告栏 */
#topic-title h1:hover {
background: rgba(0, 0, 0, 0.4) !important;
border-color: rgba(255, 255, 255, 0.1) !important;
}
`;
// 将样式挂载到页面头部
document.head.appendChild(style);
})();