XiaomiROM (CSS)

将页面调整为适合白天显示的桔白风格

You will need to install an extension such as Tampermonkey, Greasemonkey or Violentmonkey to install this script.

You will need to install an extension such as Tampermonkey or Violentmonkey to install this script.

You will need to install an extension such as Tampermonkey or Violentmonkey to install this script.

You will need to install an extension such as Tampermonkey or Userscripts to install this script.

You will need to install an extension such as Tampermonkey to install this script.

You will need to install a user script manager extension to install this script.

(I already have a user script manager, let me install it!)

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

You will need to install a user style manager extension to install this style.

You will need to install a user style manager extension to install this style.

You will need to install a user style manager extension to install this style.

(I already have a user style manager, let me install it!)

/* ==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;
}

    
}