MediaWiki:Common.css：修订间差异

来自SOKA CAFE
こばと
こばと（留言 | 贡献） （表格CSS重写）
第41行： 第41行：


/* 表格 */
/* 表格 */
/* ==========================================================================
/* MediaWiki Table Beautifier with Non-Wrapping and Color Scheme */
  MediaWiki Wikitable Beautifier CSS (Combined & Float-Compatible)
  Version: 1.1
  Last Updated: 2025-05-12  (Based on current date)
  Purpose: Provides enhanced styling for standard wikitables, improves
            compatibility with floating elements, and offers an optional
            full-width class.
  ========================================================================== */


/* --- General Table Styling --- */
/* Style for the main table container */
/* Base styles for all elements with class="wikitable" */
.wikitable,
.wikitable {
table.infobox { /* Add other table classes if needed */
  background-color: #f8f9fa; /* Light background for the table area */
    background-color: #f8f9fb; /* Light background */
  color: #202122; /* Dark text color for readability */
    border: 1px solid #e5e6fa; /* Border color */
  margin: 1em 0; /* Spacing above/below the table */
    border-collapse: collapse;
  border: 1px solid #a2a9b1; /* Outer border color and style */
    margin: 1em 0;
  border-collapse: collapse; /* Makes cell borders look cleaner (single line) */
    /* Prevent table from wrapping next to floated elements */
  /* width: 100%; */ /* <-- REMOVED as default. This caused tables to wrap excessively when next to right-floating elements (e.g., infoboxes) by forcing the table into the narrowed available space. */
    /* This combination can help control layout with floats */
  max-width: 100%; /* Allows the table to take its natural content width, but prevents it from overflowing the page container. This works better with floats. */
    display: inline-block; /* Allows setting width and prevents wrapping around floats */
  font-size: 95%; /* Slightly smaller font can make dense tables less imposing. Adjust as needed (e.g., 100% or 0.95em). */
    vertical-align: top; /* Align table to the top if used with other inline-block elements */
  clear: both; /* IMPORTANT: Ensures the table starts BELOW any preceding floated elements (left or right), preventing awkward side-by-side wrapping. */
    max-width: 100%; /* Ensure table doesn't exceed container width */
    box-sizing: border-box; /* Include padding and border in element's total width and height */
}
}


/* --- Optional Full Width Class --- */
/* Ensure floated elements next to the table are cleared properly if needed */
/* Use this class *in addition* to .wikitable if you specifically need a table */
/* You might need to apply a clearing class to the content below the table/float */
/* to attempt spanning the full width of its container. */
.clear {
/* Example: {| class="wikitable wikitable-fullwidth" ... |} */
    clear: both;
/* WARNING: This may re-introduce wrapping issues if used on pages with floats! */
/* Use only when you are sure the table won't conflict with floated elements. */
.wikitable-fullwidth {
  width: 100%;
}
}


/* --- Table Caption --- */
/* Styling for table headers */
/* Styles the <caption> element when used directly inside a .wikitable */
.wikitable > caption {
  caption-side: top; /* Standard position for captions */
  font-weight: bold; /* Make caption text bold */
  font-size: 1.1em; /* Make caption slightly larger than table text */
  padding: 0.5em 0; /* Add some spacing below the caption */
  text-align: center; /* Center the caption text */
  color: #202122; /* Ensure caption color matches table text */
}
 
/* --- Table Cells (Headers and Data) --- */
/* Common styles applied to both header (<th>) and data (<td>) cells */
.wikitable th,
.wikitable th,
.wikitable td {
table.infobox th {
  border: 1px solid #a2a9b1; /* Border for all cells */
    background-color: #e5e6fa; /* Header background color */
  padding: 0.5em 0.75em; /* Padding inside cells (top/bottom, left/right) */
    border: 1px solid #e5e6fa;
  vertical-align: top; /* Align cell content to the top (usually preferred over middle) */
    padding: 0.3em 0.4em;
  text-align: left; /* Default text alignment for all cells */
    text-align: center;
}
    font-weight: bold;
 
/* --- Header Cells (<th>) Specific Styles --- */
/* Styles specifically for table header cells */
.wikitable th {
  background-color: #eaecf0; /* Standard light grey background for headers */
  font-weight: bold; /* Make header text bold */
  text-align: center; /* Center-align header text (a common convention) */
  /* If you prefer left-aligned headers, comment out or remove the text-align: center; above */
  color: #202122; /* Ensure header text color provides good contrast */
}
 
/* --- Zebra Striping (Alternating Row Colors) --- */
/* Apply alternating backgrounds to rows within the TABLE BODY (<tbody>) */
/* Using tbody selector prevents styling the header row if it's correctly placed in <thead> */
.wikitable tbody tr:nth-child(even) {
  background-color: #f8f9fa; /* Background color for even-numbered rows (very light grey/off-white) */
}
.wikitable tbody tr:nth-child(odd) {
  background-color: #ffffff; /* Explicit white background for odd-numbered rows for contrast */
}
 
/* Reset background for any header cells (th) that might appear within tbody rows */
/* This handles less common structures where headers are mixed in the body, ensuring consistency. */
.wikitable tbody tr th {
  background-color: #eaecf0; /* Match the main header background */
}
}


 
/* Styling for table data cells */
/* --- Hover Effect (Highlight Row on Mouse Over) --- */
.wikitable td,
/* Add a subtle transition for a smooth background color change on hover */
table.infobox td {
.wikitable tbody tr {
    border: 1px solid #e5e6fa;
  transition: background-color 0.1s ease-in-out;
    padding: 0.3em 0.4em;
}
}


/* Apply hover effect only to rows within the table body (tbody) */
/* Optional: Add subtle alternating row colors */
/* Avoids applying hover to the main header row (thead) if present */
.wikitable tbody tr:nth-child(even),
.wikitable tbody tr:hover {
table.infobox tbody tr:nth-child(even) {
  background-color: #eaf3ff; /* Light blue background highlight on hover */
    background-color: #f8f9fb; /* Alternating row color */
  /* Optional: Change text color on hover if desired for contrast */
  /* color: #000; */
}
}


/* --- Sortable Table Headers --- */
.wikitable tbody tr:nth-child(odd),
/* Enhancements for tables using the 'sortable' class */
table.infobox tbody tr:nth-child(odd) {
/* Style the link within sortable headers */
    background-color: #ffffff; /* Or a slightly different shade if desired */
.wikitable th.sortable a {
  color: inherit; /* Use the header's text color */
  text-decoration: none; /* Remove underline from the link */
  display: block; /* Make the link area fill the entire header cell for easier clicking */
  /* Padding is inherited from the 'th' style */
}
}


/* Position the sorting indicator arrows provided by MediaWiki core CSS */
/* Style for table caption */
.wikitable th.sortable {
.wikitable caption,
  background-repeat: no-repeat; /* Ensure arrow image doesn't tile */
table.infobox caption {
  background-position: right 0.5em center; /* Position arrow icon near the right edge, centered vertically */
    font-weight: bold;
  padding-right: 1.8em; /* Increase right padding in sortable headers to make space for the arrow icon */
    margin-bottom: 0.5em;
    text-align: left;
}
}


/* Optional: Define a slightly different background for the header of the column that is currently sorted */
/* Ensure content within cells doesn't force wrapping if you want truly non-wrapping content */
/* .wikitable th.sortable-active { */
/* Use this with caution as it can lead to horizontal scrolling */
/* background-color: #ddeeff; */ /* Example: A slightly darker blue/grey */
/* } */
 
 
/* --- Optional: Responsive Tables Wrapper --- */
/* For tables with many columns that might not fit on small screens, */
/* you can wrap the wikitable in a div with this class: */
/* <div class="wikitable-responsive-wrapper"> */
/* {| class="wikitable" ... |} */
/* </div> */
/* Then, uncomment the CSS rules below to enable horizontal scrolling for the wrapper. */
/*
/*
.wikitable-responsive-wrapper {
.wikitable td > *,
  display: block;
.wikitable th > *,
  width: 100%;
table.infobox td > *,
  overflow-x: auto;      // Enable horizontal scrolling
table.infobox th > * {
  -webkit-overflow-scrolling: touch; // Use native-like scrolling momentum on iOS
    white-space: nowrap;
  margin: 1em 0;          // Apply margin to the wrapper instead of the table inside
}
.wikitable-responsive-wrapper > .wikitable {
  margin: 0;              // Remove margin from table as wrapper now has it
  // Optionally set a min-width on the table inside the wrapper
  // min-width: 600px;     // Example: ensure table is at least 600px wide
}
}
*/
*/


.wikitable-responsive-wrapper {
/* Adjust for potential responsiveness if needed, though the non-wrapping might conflict */
  display: block;
/* You might need specific media queries for smaller screens if non-wrapping causes issues */
  width: 100%;
@media (max-width: 600px) {
  overflow-x: auto;
    .wikitable,
  -webkit-overflow-scrolling: touch;
    table.infobox {
  margin: 1em 0;
        /* Potentially allow wrapping or adjust behavior on small screens */
}
        /* display: block; */
.wikitable-responsive-wrapper > .wikitable {
        /* width: 100%; */
  margin: 0;
    }
}
}


/* ==========================================================================
/** End **/
  End of MediaWiki Table Beautifier CSS
  ========================================================================== */


/* 展开和折叠时的过渡效果 */
/* 展开和折叠时的过渡效果 */

2025年5月13日 (二) 00:55的版本

/* 这里放置的CSS将应用于所有皮肤 */
/* 版权协定：知识共享 署名-非商业性使用-相同方式共享 3.0

/* 部分代码从https://otomad.wiki/MediaWiki:Common.css中复制粘贴 */

/* 版权协定：知识共享 署名-非商业性使用-相同方式共享 3.0 */

/* 导入 */

/* 字体 */
@font-face {
    font-family: 'Yuesong';
    src: url('https://cdn.jsdelivr.net/gh/channelwey/ZeroFont@main/Yuesong.woff2') format('woff2');
}

@font-face {
    font-family: 'Huiwen';
    src: url('https://cdn.jsdelivr.net/gh/channelwey/ZeroFont@main/汇文明朝体.woff2') format('woff2');
}

@font-face {
    font-family: 'GuZhangHei';
    src: url('https://cdn.jsdelivr.net/gh/channelwey/ZeroFont@main/瀞之故障黑体H2.woff2') format('woff2');
}

@font-face {
    font-family: 'Dianzhensong';
    src: url('https://static.wikia.nocookie.net/backrooms/images/0/0d/%E7%82%B9%E9%98%B5%E5%AE%8B%E5%AD%97.woff2/revision/latest?cb=20230402095639&format=original&path-prefix=zh') format('woff2');
}

/** 需要Debug **/
@font-face {
  font-family: '7397';
  src: url('https://soka.cafe/images/c/cf/7397.ttf') format('truetype');
}

/* 换行 */
p {
  word-break: normal;
}

/* 表格 */
/* MediaWiki Table Beautifier with Non-Wrapping and Color Scheme */

/* Style for the main table container */
.wikitable,
table.infobox { /* Add other table classes if needed */
    background-color: #f8f9fb; /* Light background */
    border: 1px solid #e5e6fa; /* Border color */
    border-collapse: collapse;
    margin: 1em 0;
    /* Prevent table from wrapping next to floated elements */
    /* This combination can help control layout with floats */
    display: inline-block; /* Allows setting width and prevents wrapping around floats */
    vertical-align: top; /* Align table to the top if used with other inline-block elements */
    max-width: 100%; /* Ensure table doesn't exceed container width */
    box-sizing: border-box; /* Include padding and border in element's total width and height */
}

/* Ensure floated elements next to the table are cleared properly if needed */
/* You might need to apply a clearing class to the content below the table/float */
.clear {
    clear: both;
}

/* Styling for table headers */
.wikitable th,
table.infobox th {
    background-color: #e5e6fa; /* Header background color */
    border: 1px solid #e5e6fa;
    padding: 0.3em 0.4em;
    text-align: center;
    font-weight: bold;
}

/* Styling for table data cells */
.wikitable td,
table.infobox td {
    border: 1px solid #e5e6fa;
    padding: 0.3em 0.4em;
}

/* Optional: Add subtle alternating row colors */
.wikitable tbody tr:nth-child(even),
table.infobox tbody tr:nth-child(even) {
    background-color: #f8f9fb; /* Alternating row color */
}

.wikitable tbody tr:nth-child(odd),
table.infobox tbody tr:nth-child(odd) {
    background-color: #ffffff; /* Or a slightly different shade if desired */
}

/* Style for table caption */
.wikitable caption,
table.infobox caption {
    font-weight: bold;
    margin-bottom: 0.5em;
    text-align: left;
}

/* Ensure content within cells doesn't force wrapping if you want truly non-wrapping content */
/* Use this with caution as it can lead to horizontal scrolling */
/*
.wikitable td > *,
.wikitable th > *,
table.infobox td > *,
table.infobox th > * {
    white-space: nowrap;
}
*/

/* Adjust for potential responsiveness if needed, though the non-wrapping might conflict */
/* You might need specific media queries for smaller screens if non-wrapping causes issues */
@media (max-width: 600px) {
    .wikitable,
    table.infobox {
        /* Potentially allow wrapping or adjust behavior on small screens */
        /* display: block; */
        /* width: 100%; */
    }
}

/** End **/

/* 展开和折叠时的过渡效果 */
/*.mw-collapsible
{
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease-out;
}*/

/* 修改展开状态下的最大高度 */
/*.mw-collapsible.mw-collapsed
{
    max-height: none;
}*/

/* 鼠标触碰 */
.custom-link
{
    text-decoration: none;
    color: none;
}

.custom-link:hover
{
    text-decoration: underline;
    color: blue;
}

/* 左右分栏 */
#left-column
{
   float: left;
   width: 49%;
}

#right-column
{
   float: right;
   width: 49%;
}

/* 左右分栏扩展 */
#left-column-full
{
   float: left;
   width: 50%;
}

#right-column-full
{
   float: right;
   width: 50%;
}

#middle-column-full
{
   float: middle;
   width: 50%;
}

#left-column-0.3
{
   float: left;
   width: 29%;
}

#left-column-0.7
{
   float: left;
   width: 69%;
}

#right-column-0.3
{
   float: left;
   width: 29%;
}

#right-column-0.7
{
   float: left;
   width: 69%;
}


/* 以下代码均从https://otomad.wiki/MediaWiki:Common.css复制 */

/* 加载Material icons */
@font-face {
  font-family: 'Material Icons';
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url(https://gstatic.loli.net/s/materialicons/v140/flUhRq6tzZclQEJ-Vdg-IuiaDsNc.woff2) format('woff2');
}

.material-icons, .md, .md-lg, .md-md, .md-sm {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;  /* Preferred icon size */
  display: inline-block;
  line-height: 1;
  text-transform: none;
  letter-spacing: normal;
  word-wrap: normal;
  white-space: nowrap;
  direction: ltr;
  user-select: none;

  /* Support for all WebKit browsers. */
  -webkit-font-smoothing: antialiased;
  /* Support for Safari and Chrome. */
  text-rendering: optimizeLegibility;

  /* Support for Firefox. */
  -moz-osx-font-smoothing: grayscale;

  /* Support for IE. */
  font-feature-settings: 'liga';
}
.md-lg {
    font-size: 60px;
}
.md-md {
    font-size: 30px;
}
.md-sm {
    font-size: 10px;
}

/* 隐藏首页按钮和标题 */
body.page-首页 #firstHeading, body.page-首页 li#ca-talk, body.page-首页 li#ca-watch, body.page-首页 li#ca-unwatch, body.page-首页 li#ca-history, body.page-首页 li#ca-nstab-main, body.page-首页 li#ca-viewsource, body.page-首页 #catlinks-sidebar, body.page-首页 #mw-normal-catlinks, body.page-首页 #ca-view {
	display: none !important;
}

body.page-首页 #siteSub {
    display: none;
}

body.page-讨论版块 #ca-talk, body.page-讨论版块 #ca-watch, body.page-讨论版块 #ca-unwatch, body.page-讨论版块 #ca-history, body.page-讨论版块 #ca-nstab-main, body.page-讨论版块 #ca-viewsource, body.page-讨论版块 #catlinks-sidebar, body.page-讨论版块 #mw-normal-catlinks, body.page-讨论版块 #ca-view {
	display: none !important;
}

.page-留言板 #mw-wrapper #flowthread {
	margin-top: 0;
	display: flex;
	flex-wrap: wrap;
	flex-direction: column-reverse;
	margin: 24px 0 4px;
}

.page-留言板 #mw-wrapper #flowthread .comment-paginator {
	border: 0;
	display: flex;
	justify-content: flex-end;
}

.page-留言板 #mw-wrapper #flowthread .comment-paginator span {
	display: flex;
	border: 0;
	width: 36px;
	height: 36px;
	padding: 0;
	margin: 0;
	text-align: center;
	align-items: center;
	justify-content: center;
	font-size: 14px;
	border-radius: 0;
	background-color: #fafafa;
	box-shadow: inset 0px 10px 4px -4px rgba(0, 0, 0, 0.04);
}

.page-留言板 #mw-wrapper #flowthread .comment-paginator span[current] {
	color: white;
	background-color: #fb7299;
	box-shadow: 0 2px 4px rgba(240, 110, 142, 0.6);
	font-weight: bold;
	border-radius: 4px !important;
}

.page-留言板 #mw-wrapper #flowthread .comment-paginator span:first-child{
	border-radius: 4px 0 0 4px;
}

.page-留言板 #mw-wrapper #flowthread .comment-paginator span:last-child{
	border-radius: 0 4px 4px 0;
}

.res-img img {
	max-width:100%;
	height:auto;
}

/* 链接列表的转载标记 */
.repost-circle{
    display: inline-block;
    margin-left: 5px;
    border: solid 1px;
    border-radius: 100px;
    padding: 3px;
    font-size: 12px;
    line-height: 1;
    color: #e06386;
    border: 1px #e06386 solid;
}
.repost-circle a.external{
    background: none!important;
    padding-right: 0px!important;
    color: #e06386!important;
    box-sizing: border-box!important;
}

/* 本段内容来自萌娘百科 https://zh.moegirl.org.cn/MediaWiki:Gadget-site-styles.css 感谢贡献！*/
/* 版权协定：知识共享 署名-非商业性使用-相同方式共享 3.0 */
/* 黑幕模板配合CSS */
/* 把这几行单独拎出来写，否则会被Firefox合并到“.heimu a”这条规则，然后又被上面的“点过外链不变色”规则override */
.heimu,
.heimu rt {
    background-color: #252525;
}
span.heimu a.external,
span.heimu a.external:visited,
span.heimu a.extiw,
span.heimu a.extiw:visited {
    color: #252525;
}
.heimu,
.heimu a,
a .heimu,
.heimu a.new {
    color: #252525;
    text-shadow: none;
}
body:not(.heimu_toggle_on) .heimu:hover,
body:not(.heimu_toggle_on) .heimu:active,
body:not(.heimu_toggle_on) .heimu.off {
    transition: color .13s linear;
    color: white;
}
body:not(.heimu_toggle_on) .heimu:hover a,
body:not(.heimu_toggle_on) a:hover .heimu,
body:not(.heimu_toggle_on) .heimu.off a,
body:not(.heimu_toggle_on) a:hover .heimu.off {
    transition: color .13s linear;
    color: lightblue;
}
body:not(.heimu_toggle_on) .heimu.off .new,
body:not(.heimu_toggle_on) .heimu.off .new:hover,
body:not(.heimu_toggle_on) .new:hover .heimu.off,
body:not(.heimu_toggle_on) .heimu:hover .new {
    transition: color .13s linear;
    color: #FCC;
}
/* info类模板 */
.infoBox {
    margin: 10px auto;
    width: 80%;
    box-shadow: 0 1px 3px 0px rgb(0 0 0 / 20%);
    border-radius: 4px;
}
@media screen and (max-width: 850px) {
.infoBox {
	float: unset !important;
    width: 100% !important;
    clear: both;
}}
.infoBox a, p{
    word-break: break-all;
}
.infoBoxTitle {
    margin: 3px auto;
    padding: 6px 0 0 0;
    text-align: center;
    font-weight: 700;
}
.infoBoxIcon {
    display: table-cell;
    padding: 2px 0 2px .5em;
    vertical-align: middle;
}
.infoBoxText {
    display: table-cell;
    padding: .25em .5em .25em 1.3em;
    width: 100%;
    vertical-align: middle;
}
.infoBoxContent {
    border: 1px solid #ddd;
    border-left-width: 0;
    background: #fbfbfb;
}
.infoBoxBelow {
    margin: 0 auto;
    padding: 0;
    text-align: center;
}
/* wikitable green */
table.wikitable-green {
    background: #c9f6e1
}
.wikitable-green th {
    background: #13ec93
}
.wikitable-green td {
    background: #f3f3f3
}



/* 教程链接列表 */
/* 目前全部移动到 https://otomad.wiki/Template:链接列表/style.css 下
.tutorial-links {
	width: 100%;
	margin-bottom: 6px;
}
.tutorial-links>tbody>tr>td:first-child {
	text-align: center;
	width: 35px;
}
.tutorial-links>tbody>tr>td:first-child>span {
	border: 1px #e06386 solid;
	border-radius: 4px;
	color: #e06386;
	font-size: 12px;
	height: 14px;
	padding: 2px 4px;
}
.tutorial-links>tbody>tr>td:nth-child(2) {
	padding-left: 6px;
}
.tutorial-links>tbody>tr>td:nth-child(3) {
	font-size: 12px;
	color: grey;
	text-align: right;
}
*/

/*scrollUpButton样式*/
img#scrollUpButton, img#scrollDownButton {
    transition: transform 200ms;
}
img#scrollUpButton:hover {
    transform: scale(1.1);
}
img#scrollUpButton:active {
    transform: scale(.95);
}
img#scrollDownButton:hover {
    transform: rotate(180deg)scale(1.1) !important;
}
img#scrollDownButton:active {
    transform: rotate(180deg)scale(.95) !important;
}

/* 从https://zh.wikipedia.org/wiki/MediaWiki:Common.css引入的样式 */
/* Style for horizontal lists (separator following item) */
.hlist dl,
.hlist ol,
.hlist ul {
    margin: 0;
}
.hlist dd,
.hlist dt,
.hlist li {
    display: inline;
    margin: 0;
}
/* Display nested lists inline */
.hlist.inline,
.hlist.inline dl,
.hlist.inline ol,
.hlist.inline ul,
.hlist dl dl, .hlist dl ol, .hlist dl ul,
.hlist ol dl, .hlist ol ol, .hlist ol ul,
.hlist ul dl, .hlist ul ol, .hlist ul ul {
	display: inline;
}
/* Generate interpuncts */
.hlist dt:after {
    content: " :";
}
.hlist dd:after,
.hlist li:after {
    content: " · ";
    font-weight: bold;
}
.hlist dd:last-child:after,
.hlist dt:last-child:after,
.hlist li:last-child:after {
    content: none;
}
/* for IE 8 */
.hlist dd.nopunct:after,
.hlist dt.nopunct:after,
.hlist li.nopunct:after {
    content: none;
}
/* Add parens around nested lists */
.hlist dl dl:before,
.hlist ol ol:before,
.hlist ul ul:before {
    content: "（";
}
.hlist dl dl:after,
.hlist ol ol:after,
.hlist ul ul:after {
    content: "）";
}
/* Put numbers in ordered lists */
.hlist.hnum ol li {
    counter-increment: level1;
}
.hlist.hnum ol li:before {
    content: counter(level1) " ";
}
.hlist.hnum ol ol li {
    counter-increment: level2;
}
.hlist.hnum ol ol li:before {
    content: counter(level2) " ";
}
/* Default style for navigation boxes */
.navbox {                     /* Navbox container style */
    border: 1px solid #a2a9b1;
    width: 100%; 
    margin: auto;
    clear: both;
    font-size: 88%;
    text-align: center;
    padding: 1px;
}
.navbox-inner,
.navbox-subgroup {
    width: 100%;
}
.navbox th,
.navbox-title,
.navbox-abovebelow {
    text-align: center;       /* Title and above/below styles */
    padding-left: 1em;
    padding-right: 1em;
}
th.navbox-group {             /* Group style */
    white-space: nowrap;
    /* @noflip */
    text-align: right;
}
.navbox,
.navbox-subgroup {
    background: #fdfdfd;      /* Background color */
}
.navbox-list {
    border-color: #fdfdfd;    /* Must match background color */
}
.navbox th,
.navbox-title {
    background: #ccccff;      /* Level 1 color */
}
.navbox-abovebelow,
th.navbox-group,
.navbox-subgroup .navbox-title {
    background: #ddddff;      /* Level 2 color */
}
.navbox-subgroup .navbox-group,
.navbox-subgroup .navbox-abovebelow {
    background: #e6e6ff;      /* Level 3 color */
}
.navbox-even {
    background: #f7f7f7;      /* Even row striping */
}
.navbox-odd {
    background: transparent;  /* Odd row striping */
}
table.navbox + table.navbox {  /* Single pixel border between adjacent navboxes */
    margin-top: -1px;          /* (doesn't work for IE6, but that's okay)       */
}
.navbox .hlist td dl,
.navbox .hlist td ol,
.navbox .hlist td ul,
.navbox td.hlist dl,
.navbox td.hlist ol,
.navbox td.hlist ul {
    padding: 0.125em 0;       /* Adjust hlist padding in navboxes */
}
.navbox .hlist dd,
.navbox .hlist dt,
.navbox .hlist li {
    white-space: nowrap;      /* Nowrap list items in navboxes */
}
.navbox .hlist dd dl,
.navbox .hlist dt dl,
.navbox .hlist li ol,
.navbox .hlist li ul {
    white-space: normal;      /* But allow parent list items to be wrapped */
}
ol + table.navbox,
ul + table.navbox {
    margin-top: 0.5em;        /* Prevent lists from clinging to navboxes */
}

/* Default styling for Navbar template */
.navbar {
    display: inline;
    font-weight: normal;
}
.navbar ul {
    display: inline;
    white-space: nowrap;
}
.navbar li {
    word-spacing: -0.125em;
}
.navbar.mini li abbr[title] {
    font-variant: small-caps;
    border-bottom: none;
    text-decoration: none;
    cursor: inherit;
}
/* Navbar styling when nested in navbox */
.navbox .navbar {
    display: block;
}
.navbox-title .navbar {
    /* @noflip */
    float: left;
    /* @noflip */
    text-align: left;
    /* @noflip */
    margin-right: 0.5em;
    width: 8em;
}

/* 'show'/'hide' buttons created dynamically by the CollapsibleTables javascript
   in [[MediaWiki:Common.js]] are styled here so they can be customised. */
.collapseButton {       
    /* @noflip */
    float: right;
    font-weight: normal;
    /* @noflip */
    margin-left: 0.5em;
    /* @noflip */
    text-align: right;
    width: auto;
}
/* In navboxes, the show/hide button balances the v·d·e links
   from [[Template:Navbar]], so they need to be the same width. */
.navbox .collapseButton {
    width: 8em;
}
/*个人资料设置页*/
.profile-tab{
	background-color: unset;
	padding: 9px 10px 10px;
	font-size: 16px;
}
.profile-tab-on a:visited{
	color: #000 !important;
}
.profile-tab a:visited{
	color: #000 !important;
}
.profile-tab-on a, .profile-tab a{
	color: #000;
}
.profile-tab-on{
	background-color: unset;
	padding: 9px 10px 10px;
	font-size: 16px;
	border-bottom: solid 2px #FB7299;
}
.eye-container .title{
	color: #000;
	font-size: 14px;
}
.eye-container{
	box-shadow: none;
	opacity: 1.0;
}
/*提示框*/
.mw-notification{
	border: none;
	border-radius: 4px;
	box-shadow: 0 0 12px rgb(0 0 0 / 15%);
}
/*修复和修改infobox*/
@media screen and (max-width: 850px){
.infobox{
	width: 100%;
	margin: 0em 0em 2em;
}}
@media screen and (min-width: 851px){
.infobox{
	width: 300px;
	margin: 1em 0 30px 30px;
}}
.infoBoxContent{
	border: 0;
	border-radius: 4px;
}

.fieldset{
	border: 1px solid #c7c7c7;
	border-radius: 4px;
	padding: 0.35em 1.625em 0.75em;
}
textarea {
	border-radius: 4px;
	box-shadow: none;
	background-color: transparent;
	border: 1px solid var(--border-color-base--darker);
    outline: none;
}
textarea:hover {
	border: 1px solid #fb7299;
	background: transparent;
}
textarea:focus-visible {
	box-shadow: inset 0 0 0 1px #fb7299;
    border: 1px solid #fb7299;
    background: transparent;
}
/*导航盒*/
.navbox th, .navbox-title {
	background: #FCA6BF;
}
.navbox-abovebelow, th.navbox-group, .navbox-subgroup .navbox-title {
	background: #FDBFD0;
}
.navbox-subgroup .navbox-group,
.navbox-subgroup .navbox-abovebelow {
	background: #FED7E2;
}
.navbox-even {
	background: #FFF0F4;
}
.navbox{
	border: 0;
}
/* 资料卡 */
#profile-toggle-button{
	background-color: #fb7299;
	border-radius: 2px;
	padding: 5px 10px;
	transition: box-shadow 200ms,transform 200ms;
	box-shadow: 0 4px 4px rgb(251 114 153 / 30%);
}
#profile-toggle-button a {
	font-weight: bold;
}
#profile-toggle-button:hover {
	box-shadow: 0 9px 9px rgb(251 114 153 / 30%);
}
#profile-toggle-button:active {
	box-shadow: 0 0 0 rgb(251 114 153 / 30%);
	transform: scale(.95);
	background-color: #bd5774;
}
#profile-toggle-button:focus, #profile-toggle-button:focus-visible, #profile-toggle-button:focus-within {
	box-shadow: inset 0 0 0 1px #fb7299, inset 0 0 0 2px #fff;
	outline: 1px solid transparent;
}
.profile-on{
	background-color: #fff6c3;
	padding: 5px 10px 5px 10px;
	border-radius: 4px;
	border: none;
}
/*按钮动画*/
.oo-ui-buttonElement.oo-ui-widget-enabled > .oo-ui-buttonElement-button{
	transition: background-color 100ms,color 100ms,border-color 100ms,box-shadow 100ms,transform 200ms
}
/*圆形头像*/
#profile-image img{
    border-radius: 50%;
    padding: 4px;
    border: none;
    width: 75px;
}
.c-avatar img{
	border-radius: 50%;
}
.profile-info img {
    border-radius: 50%;
}
/*解决cite定位内文字显示为斜体的问题*/
cite {
	font-style: normal;
}
/* 首页dpl列表相关样式 */
.mini-block {
    width: 100%;
    min-width: 20%;
    padding: 16px;
    margin-top: 8px;
    box-shadow: 0 3px 6px rgba(0,0,0,0.04);
    border: 1px solid; border-color: rgba(0,0,0,0.05);
    border-radius: 8px;
    word-break: break-all;
    box-sizing: border-box;
}
.mini-block p {
	margin: 0 0 1em 0;
}
.mini-block p:last-child {
	margin: 0;
}
.mini-block-container {
    width: 100%;
    display: flex;
    justify-content: space-between;
    gap: 8px;
    box-sizing: border-box;
}
.mini-block-list a{
	color: #212121;
}
.mini-block-list a.new{
	color: #212121;
}
.mini-block-list a:hover{
	color: #00aeec;
}
.mini-block-list li a:hover {
    color: #212121;
}
.mini-block-container li{
    border-radius: 4px;
    margin: 0;
    list-style: none;
    cursor: pointer;
    transition: background cubic-bezier(0.22,0.58,0.12,0.98) 0.4s;
}
.mini-block-title {
	font-size: 24px;
	font-weight: 500;
}
@media screen and (min-width: 851px) {
	.mini-block-container li:hover {
    	background: #0000000d;
	}
	.mini-block-container li:hover a {
		transform: translateX(5px);
	}
}
.mini-block-container ul {
    margin: 0;
    padding: 0;
}
.mini-block-container li a {
    padding: .5em .4em;
    display: inline-block;
    width: 100%;
    transition: transform cubic-bezier(0.22,0.58,0.12,0.98) 0.4s;
}
@media screen and (max-width: 850px) {
    .mini-block {
        align-self: stretch;
        width: auto;
    }
    .mini-block-container {
    	flex-direction: column;
    }
}


/*针对移动端用户页的竖向排列*/
@media screen and (max-width: 850px){
#user-page-left {
    width: 100%;
    float: none;}
#user-page-right {
    width: 100%;
    float: none;
    }
}

/*移动端导航栏子级标题竖向排列*/
@media screen and (max-width: 850px){
th.navbox-group {
	white-space: normal;
}
th.navbox-group div {
    line-height: 1.3em;
    width: 10px;
    margin: 10px 0;
}
}

/* 留言板FlowThread隐藏热门 */
.page-留言板 .comment-container-top {
	display: none;
}

/* 上传文件InfoBox排版增强修复 */
.mw-special-Upload i.md {
	display: flex;
}
.mw-special-Upload .infoBoxText li {
	margin-top: 6px;
	margin-bottom: 0;
}

/* 设置原生html组件的颜色 */
body {
	accent-color: #ea6b8f;
}

/* 现代化FlowThread主题 */
#flowthread .comment-submit {
	font-family: inherit;
	color: white;
	border: 0;
	background-color: #fb7299;
	background-color: var(--color-primary);
	text-shadow: none;
	top: 0;
	right: 0;
	border-radius: 0 0 var(--border-radius--small) 0;
}

#flowthread .comment-toolbar {
	height: 36px;
	border: 0;
	border-top: 1px solid var(--border-color-base--darker);
	background-color: #f8f9fa;
	background-color: var(--color-surface-2);
	border-radius: 0 0 var(--border-radius--small) var(--border-radius--small);
	margin-bottom: 0;
}

#flowthread .comment-thread {
	border: 0;
	padding: 0;
}

#flowthread .comment-avatar {
	border-radius: 100%;
	overflow: hidden;
}

#flowthread .comment-text {
	font-size: inherit;
}

#flowthread .comment-user, .comment-user a {
	font-size: inherit;
	color: var(--color-base--subtle);
}

#flowthread .comment-footer {
	font-size: 14px;
}

#flowthread .flowthread-btn-wikitext, 
#flowthread .flowthread-btn-preview {
	width: 36px;
	height: 36px;
	margin: 0;
	box-shadow: none;
	background-color: transparent;
	border-radius: 100%;
	border: 0 !important;
}

#flowthread .flowthread-btn-preview {
	transform: translateX(-100%);
}

#flowthread .flowthread-btn-wikitext.on+.flowthread-btn-preview {
	transform: none;
}

#flowthread .flowthread-btn-wikitext:hover, 
#flowthread .flowthread-btn-preview:hover {
	background-color: var(--background-color-quiet--hover);
}

#flowthread .comment-submit {
	height: inherit;
}

#flowthread .comment-replybox > .comment-body {
	border: 1px solid var(--border-color-base--darker);
	border-radius: var(--border-radius--small);
	padding-left: 0;
	margin-left: 60px;
}

#flowthread .comment-replybox > .comment-body:has(textarea:focus-visible) {
	border-color: var(--color-primary);
}

#flowthread .comment-replybox > .comment-body textarea, #flowthread .comment-preview {
	background-color: transparent;
	border: 0;
	box-shadow: none;
}

#flowthread .comment-post,
#flowthread .comment-container > .comment-thread {
	padding: 12px 0;
}

#flowthread .comment-reply::before,
#flowthread .comment-like::before,
#flowthread .comment-report::before,
#flowthread .comment-delete::before {
	display: inline-block;
	background-image: none;
	direction: ltr;
	font-family: 'Material Icons';
	font-feature-settings: 'liga';
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-style: normal;
	font-weight: normal;
	letter-spacing: normal;
	line-height: 1;
	text-align: center;
	text-indent: 0;
	text-rendering: optimizeLegibility;
	text-transform: none;
	user-select: none;
	vertical-align: middle;
	white-space: nowrap;
	word-wrap: normal;
	width: 18px;
	height: 18px;
	color: black;
	font-size: 18px;
	opacity: var(--opacity-icon-base);
	border-radius: 100%;
}

#flowthread .comment-reply::before {
	content: 'reply';
}
#flowthread .comment-like::before {
	content: 'favorite';
}
#flowthread .comment-report::before {
	content: 'flag';
}
#flowthread .comment-delete::before {
	content: 'delete';
}
#flowthread .comment-like[liked],
#flowthread .comment-report[reported] {
	color: var(--color-primary);
}
#flowthread .comment-like[liked]::before,
#flowthread .comment-report[reported]::before {
	opacity: 1;
	color: var(--color-primary);
}
取自“http://soka.cafe/index.php?title=MediaWiki:Common.css&oldid=2299”