将页面调整为适合白天显示的桔白风格
/* ==UserStyle==
@name XiaomiROM (CSS)
@description 将页面调整为适合白天显示的桔白风格
@version 2026.8.10.2
@namespace AN drew
==/UserStyle== */
@-moz-document domain("xiaomirom.com") {
/*==通用规则==*/
/*主体*/
body{
background:white;
color:black;
}
/*段落*/
p, .paragraph{
color:black;
}
/*日期*/
.text-muted{
color:gray !important;
}
/*按钮*/
.btn-outline-primary{
background: #df691a !important;
border-color: #df691a !important;
color: white;
}
.btn-outline-primary:hover{
background: #ffb000 !important;
border-color: #ffb000 !important;
color: white;
}
/*标题*/
h1, h2, h3, h4, h5, h6{
color:black;
}
/*小标题*/
.text-dark{
color:black !important;
}
.text-white{
color:black !important;
}
/*具体型号*/
.content code {
border: 1px solid #9e9e9e00;
}
/*关于-标题变色*/
.widget-title{
color:#df691a;
}
/*页码*/
.page-link {
background: #f8f9fa;
color: #333;
border: 1px solid #dee2e6;
}
/*页码-已禁用*/
.page-item.disabled .page-link {
background: #e9ecef;
color: #6c757d;
border-color: #dee2e6;
}
/*页码-hover*/
.page-link:hover, .page-link:focus {
background: #df691a;
color: white;
border-color: #df691a;
}
}
@-moz-document url("https://xiaomirom.com/") {
/*==首页==*/
/*标题"下载小米ROM",不占用纵向空间*/
.col-lg-4{
flex: auto !important;
max-width: none !important;
}
.offset-lg-2{
margin-left: 0% !important;
}
/* ===== 将“选择型号”伪装成按钮 ===== */
.form-control[readonly] {
/* 基础样式:模仿网站已有的按钮 */
display: inline-block !important; /* 不再撑满整行 */
width: auto !important; /* 宽度由内容撑开 */
min-width: 140px; /* 最小宽度,更协调 */
padding: 0.6rem 1.2rem !important; /* 内边距,更像按钮 */
margin-top: 5rem; /* 上边距*/
background: #df691a !important; /* 主色 */
color: #fff !important; /* 文字白色 */
border: 1px solid #c05e15 !important; /* 深色边框增加立体感 */
border-radius: 10rem !important; /* 大圆角(胶囊) */
font-weight: 700 !important; /* 粗体 */
text-align: center !important; /* 居中 */
/* 增加立体阴影 */
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2) !important;
/* 移除输入框默认外观 */
-webkit-appearance: none !important;
appearance: none !important;
/* 过渡动画 */
transition: all 0.25s ease !important;
/* 光标改为手指 */
cursor: pointer !important;
}
/* ----- 占位符(placeholder)颜色改为白色 ----- */
.form-control[readonly]::placeholder {
color: #fff !important;
opacity: 1 !important; /* 确保不透明 */
}
/* 兼容各浏览器 */
.form-control[readonly]::-webkit-input-placeholder {
color: #fff !important;
opacity: 1 !important;
}
.form-control[readonly]:-moz-placeholder {
color: #fff !important;
opacity: 1 !important;
}
.form-control[readonly]::-moz-placeholder {
color: #fff !important;
opacity: 1 !important;
}
.form-control[readonly]:-ms-input-placeholder {
color: #fff !important;
opacity: 1 !important;
}
/* ----- 悬停效果(亮色 + 上浮)----- */
.form-control[readonly]:hover {
background: #ffb000 !important;
border-color: #ffb000 !important;
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3) !important;
transform: translateY(-2px) !important;
}
/* ----- 点击效果(按下)----- */
.form-control[readonly]:active {
transform: scale(0.95) !important;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2) !important;
}
/*内容横向占满*/
.row{
display:block;
}
/*调整内容宽度*/
.col-lg-8{
flex: 0 0 100% !important;
max-width: 100% !important;
}
/*各国系统列表-横向占满*/
.col-md-6{
flex: 0 0 50% !important;
max-width:100% !important;
border-bottom: 1px solid #df691a;
}
/*各国系统列表-标题*/
.col-md-6 a.h5{
font-weight:bold;
color:#df691a;
}
.col-md-6 a.h5:hover{
color:#ffb000;
}
/*查看所有ROM*/
.see-all > a{
display: inline-block;
text-align: center;
vertical-align: middle;
user-select: none;
padding: .375rem .75rem;
line-height: 1.5;
font-size: 1rem;
font-weight: 500;
font-family: -apple-system,BlinkMacSystemFont,segoe ui,Roboto,helvetica neue,Arial,noto sans,sans-serif;
text-transform: capitalize;
border-radius: 0;
border: 1px solid;
position: relative;
z-index: 1;
transition: .2s ease;
background: #df691a !important;
border-color: #df691a !important;
color: white;
}
.see-all > a:hover{
background: #ffb000 !important;
border-color: #ffb000 !important;
color: white;
}
}
@-moz-document url-prefix("https://xiaomirom.com/series/") {
/*==机型列表==*/
/*内容横向占满*/
.row{
display:block;
}
/*搜索提示: "下载ROM,从所有小米型号中开始"*/
.col-lg-8{
flex: 0 0 100% !important;
max-width:100% !important;
}
/* ===== 搜索框整体容器 ===== */
.form-group {
margin: 1.5rem auto 2rem auto !important; /* 适当垂直间距,水平居中 */
max-width: 600px !important; /* 限制最大宽度,避免过于宽 */
padding: 0 15px; /* 两侧留白 */
}
/* ===== 网格列:让它占满宽度 ===== */
.col-md-3 {
flex: 0 0 100% !important;
max-width: 100% !important;
}
/* ===== 输入框本身 ===== */
#seriesSearch {
/* 尺寸与内边距 */
width: 100%;
height: 44px; /* 舒适高度 */
padding: 0 20px; /* 左右内边距,文本不贴边 */
font-size: 1rem;
/* 颜色与背景 */
color: #333 !important; /* 深色文字,可读性高 */
background: #f8f9fa !important; /* 浅灰背景,柔和 */
border: 2px solid #e9ecef !important; /* 默认浅灰边框 */
border-radius: 22px !important; /* 大圆角,现代感 */
/* 阴影与过渡 */
box-shadow: 0 1px 3px rgba(0,0,0,0.06) !important;
transition: all 0.25s ease !important;
/* 清除默认轮廓 */
outline: none !important;
-webkit-appearance: none !important;
}
/* ===== 聚焦状态(用户点击输入时) ===== */
#seriesSearch:focus {
border-color: #df691a !important; /* 橙色边框 */
background: #ffffff !important; /* 纯白背景 */
box-shadow: 0 0 0 4px rgba(223, 105, 26, 0.15) !important; /* 橙色光晕 */
}
/* ===== 占位符颜色(柔和灰色) ===== */
#seriesSearch::placeholder {
color: #adb5bd !important;
opacity: 1 !important;
font-weight: 300;
}
/* 兼容各浏览器 */
#seriesSearch::-webkit-input-placeholder { color: #adb5bd !important; opacity: 1 !important; }
#seriesSearch:-moz-placeholder { color: #adb5bd !important; opacity: 1 !important; }
#seriesSearch::-moz-placeholder { color: #adb5bd !important; opacity: 1 !important; }
#seriesSearch:-ms-input-placeholder { color: #adb5bd !important; opacity: 1 !important; }
/* ===== 如果还想加一个搜索图标(非必需) ===== */
#seriesSearch {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23adb5bd' viewBox='0 0 16 16'%3E%3Cpath d='M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z'/%3E%3C/svg%3E") !important;
background-repeat: no-repeat !important;
background-position: right 16px center !important;
background-size: 18px 18px !important;
padding-right: 45px !important; /* 为图标留出空间 */
}
/* ===== 缩短过渡时间,并固定图标位置 ===== */
#seriesSearch {
transition: all 0.12s ease !important; /* 原来 0.25s → 0.12s,缩短一半 */
}
#seriesSearch:focus {
/* 强制固定背景图标位置,防止因 padding 变化而移动 */
background-position: right 16px center !important;
padding-right: 45px !important; /* 确保内边距不变,图标不位移 */
}
/*手机型号列表*/
.row.series__dl{
display:flex;
}
/*手机型号列表-行间边框*/
.row.series__dl .col-sm-6{
border-top:1px solid #df691a;
padding-top:0.5rem;
margin-bottom: 0.5rem;
}
/*手机型号列表-手机型号*/
.row.series__dl .col-sm-6 a{
color: #df691a;
}
.row.series__dl .col-sm-6 a:hover{
color: #ffb000;
}
/*手机型号列表-各国系统列表*/
.row.series__dl dd.col-sm-6:not([data-id]){
color:white;
}
.row.series__dl dd.col-sm-6:not([data-id]) a{
color: white;
background: #df691a;
border-radius: 10rem;
display: inline-block;
padding: .4em .6em;
margin: 3px 5px;
font-size: 88%;
font-weight: 700;
line-height: 1;
text-align: center;
white-space: nowrap;
vertical-align: baseline;
transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
box-sizing: border-box;
}
.row.series__dl dd.col-sm-6:not([data-id]) a:hover{
background:#ffb000;
}
/*各国系统列表-横向占满*/
.col-md-6{
flex: 0 0 50% !important;
max-width:100% !important;
border-bottom: 1px solid #df691a;
}
/*各国系统列表-标题*/
.col-md-6 a.h5{
font-weight:bold;
color:#df691a;
}
.col-md-6 a.h5:hover{
color:#ffb000;
}
/*关于-横向占满*/
.col-lg-4{
flex: 0 0 100% !important;
max-width:100% !important;
}
}
@-moz-document regexp("https://xiaomirom\\.com/rom/[^/]+/(?:#.*)?$") {
/*==刷机包ROM详情==*/
/*调整内容宽度*/
.col-lg-8 {
flex: 0 0 80% !important;
max-width: 80% !important;
}
.card-body h1,
.card-body h2,
.card-body h3,
.card-body h4,
.card-body h5,
.card-body h6{
color:white;
}
/*刷机包-线刷包/卡刷包*/
.content.rom-body h2{
padding-top:3rem;
border-top: 7px solid #ffb000;
}
/*刷机包-具体版本号*/
.content.rom-body h3{
padding-top:2rem;
border-top: 3px solid #df691a;
}
/* ===== 表格样式优化 ===== */
/* 表格文字颜色 */
.table{
color:black;
}
/* 整体表格背景透明,但实际背景由单元格决定 */
.table-secondary,
.table-secondary > th,
.table-secondary > td {
background-color: transparent !important; /* 让单元格自己控制背景 */
}
/* 表头行背景(纵向间隔第一色) */
.table-secondary thead th {
background: #fde8d0 !important; /* 浅橙色 */
color: black !important;
border-color: #d4c5b0 !important;
font-weight: 600;
}
/* 数据行背景(纵向间隔第二色) */
.table-secondary tbody tr {
background: #fffaf5 !important; /* 白色,也可以换为 #fffaf5 */
}
/* 如果你希望数据行也有淡淡的橙色,可改为 #fff5ec,但白色更清晰 */
/* 单元格边框颜色(保持与整体一致) */
.table-secondary th,
.table-secondary td {
border-color: #d4c5b0 !important; /* 比原来的 a3abb3 更暖一些,与橙色协调 */
}
/* 可选:悬停效果(让数据行悬停时变色) */
.table-secondary tbody tr:hover {
color:black;
background: rgba(223, 105, 26, 0.08) !important;
}
/*下载按钮父元素背景*/
.table-responsive + p + p {
background: #ffdbb5; /* 橙色,与主题色呼应 */
border-radius: 8px; /* 可选:增加圆角,更现代 */
padding: 10px; /* 增加内边距,让按钮区域更透气 */
border: 1px solid rgba(223, 105, 26, 0.15); /* 可选:加浅边框增加层次 */
}
/*下载按钮*/
.content.rom-body p a[href*="/download/"]{
color: white;
background-color: #df691a;
border-radius: 10rem;
display: inline-block;
padding: .4em .6em;
margin: 3px 5px;
font-size: 85%;
font-weight: 700;
line-height: 1;
text-align: center;
white-space: nowrap;
vertical-align: baseline;
transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
box-sizing: border-box;
}
}
@-moz-document url("https://xiaomirom.com/rom/"), url-prefix("https://xiaomirom.com/rom/page/") {
/*==所有ROM列表==*/
/*标题"最新小米ROM",不占用纵向空间*/
.col-lg-4 {
flex: auto !important;
max-width: none !important;
}
/*内容横向占满*/
.row{
display:block;
}
/*调整内容宽度*/
.col-lg-8 {
flex: 0 0 100% !important;
max-width: 100% !important;
}
/*各国系统列表-横向占满*/
.col-md-6{
flex: 0 0 100% !important;
max-width:100% !important;
border-bottom: 1px solid #df691a;
}
/*各国系统列表-标题*/
.col-md-6 a.h5{
font-weight:bold;
color:#df691a;
}
.col-md-6 a.h5:hover{
color:#ffb000;
}
}
@-moz-document url-prefix("https://xiaomirom.com/download/") {
/*==下载ROM==*/
/*调整内容宽度*/
.col-lg-8 {
flex: 0 0 80% !important;
max-width: 80% !important;
}
/*未修改声明*/
.alert-secondary{
background:white;
}
/*下载卡片*/
.card{
background:white;
border: 1px solid #df691a;
}
}
@-moz-document url("https://xiaomirom.com/download-xiaomi-flash-tool-miflash/") {
/*==下载刷机工具==*/
/*调整内容宽度*/
.col-lg-8 {
flex: 0 0 80% !important;
max-width: 80% !important;
}
}
@-moz-document url-prefix("https://xiaomirom.com/miui-") {
/*==MIUI==*/
/*MIUI更新卡片*/
.card{
background:white;
border: 1px solid #df691a;
}
/*具体版本卡片*/
.col.bg-light.border-bottom{
color:#df691a;
background: #ffdbb5!important;
border-bottom: 1px solid #ffdbb5!important;
}
.col.bg-light.border-bottom .text-secondary{
color:black!important
}
}
@-moz-document url("https://xiaomirom.com/about/") {
/*==关于==*/
/*调整内容宽度*/
.col-lg-8 {
flex: 0 0 80% !important;
max-width: 80% !important;
}
}