小 |
标签:移动网页编辑 移动版编辑 |
||
(未显示3个用户的290个中间版本) | |||
第1行: | 第1行: | ||
− | @import url( | + | @import url("https://fonts.googleapis.com/css?family=Exo 2"); /* 因使用顺序优先加载 */ |
− | @import url( | + | @import url("https://fonts.googleapis.com/css?family=Jura"); /*科技感包含希腊字母*/ |
− | @import url( | + | @import url("https://fonts.googleapis.com/css?family=Tajawal"); /*阿拉伯字母字体*/ |
− | @import url( | + | @import url("https://fonts.googleapis.com/css?family=Google Sans"); /*谷歌的字体*/ |
− | @import url( | + | @import url("https://fonts.googleapis.com/css?family=Noto Sans SC"); /*思源黑体*/ |
+ | @import url("https://fonts.googleapis.com/css?family=Fira Code"); /*等宽字体常规*/ | ||
+ | @import url("https://fonts.googleapis.com/css?family=Kalam"); /*较窄的字体*/ | ||
+ | @import url("https://fonts.googleapis.com/css?family=JetBrains Mono"); /*等宽字体用作目录*/ | ||
+ | @import url("https://voicewiki.cn/w/extrafiles/fontawesome-free-5.15.4/css/all.min.css"); /* FA 字体图标 */ | ||
+ | @import url("https://voicewiki.cn/w/extrafiles/font-awesome-animation.min.css"); /* FA 字体动画 */ | ||
+ | |||
+ | @font-face { | ||
+ | font-family: "Pricedown"; | ||
+ | src: url("https://voicewiki.cn/w/extrafiles/Pricedown.ttf") format("truetype"); | ||
+ | font-style: normal; | ||
+ | font-stretch: normal; | ||
+ | font-weight: normal; | ||
+ | } | ||
+ | |||
+ | @font-face { | ||
+ | font-family: "Big Noodle Too"; | ||
+ | src: url("https://voicewiki.cn/w/extrafiles/big-noodle-too-oblique.woff") format("woff"); | ||
+ | font-style: oblique; | ||
+ | font-stretch: normal; | ||
+ | font-weight: normal; | ||
+ | } | ||
+ | |||
+ | @font-face { | ||
+ | font-family: "YSGoodBody"; | ||
+ | src: url("https://voicewiki.cn/w/extrafiles/YSGoodBody.ttf") format("truetype"); | ||
+ | font-style: normal; | ||
+ | font-stretch: normal; | ||
+ | font-weight: normal; | ||
+ | } | ||
+ | |||
+ | /* 暂时隐藏需要处理但还未处理的 DOM 节点,JavaScript 会在之后移除这个 class */ | ||
+ | .template-render-cloak { | ||
+ | display: none !important; | ||
+ | visibility: hidden !important; | ||
+ | } | ||
+ | |||
+ | /* 使用占位图代替受损图像 */ | ||
+ | .unresolved-image { | ||
+ | display: inline-block !important; | ||
+ | position: relative; | ||
+ | box-sizing: border-box; | ||
+ | color: transparent !important; | ||
+ | border: 8px solid #242d38; | ||
+ | background-color: #1a1f25; | ||
+ | } | ||
+ | |||
+ | .unresolved-image::after { | ||
+ | content: "?"; | ||
+ | position: absolute; | ||
+ | left: 50%; | ||
+ | top: 50%; | ||
+ | transform: translate(-50%, -50%); | ||
+ | color: #fff !important; | ||
+ | font-size: 1.5em; | ||
+ | font-weight: 700; | ||
+ | } | ||
/* | /* | ||
根据目测覆盖范围重新安排 font-family 使用顺序: | 根据目测覆盖范围重新安排 font-family 使用顺序: | ||
− | + | "Exo 2" -> Latin | |
Tajawal -> Latin + Arabic | Tajawal -> Latin + Arabic | ||
Jura -> 经测试 Jura 并不包含希腊字母字形 | Jura -> 经测试 Jura 并不包含希腊字母字形 | ||
*/ | */ | ||
body * { | body * { | ||
− | font-family: | + | font-family: "Exo 2", Tajawal, "Google Sans", "Noto Sans SC", "Helvetica Neue", Helvetica, Arial, "Hiragino Sans GB", "Microsoft YaHei", "Heiti SC", sans-serif; |
}/*全站字体*/ | }/*全站字体*/ | ||
+ | |||
+ | /**************************/ | ||
+ | /* 样式统一修复与重置 */ | ||
+ | /**************************/ | ||
+ | body pre, | ||
+ | body code { | ||
+ | font-family: "Cascadia Code", "Ubuntu Mono", "Menlo", "Consolas", "Monaco", "Noto Mono", "Nimbus Mono L", monospace; | ||
+ | } | ||
+ | |||
+ | .color-display { | ||
+ | display: inline-block; | ||
+ | width: 1em; | ||
+ | height: 1em; | ||
+ | border-radius: 2px; | ||
+ | vertical-align: middle; | ||
+ | } | ||
+ | |||
+ | .color-display.wide { | ||
+ | width: 2.5em; | ||
+ | } | ||
/**************************/ | /**************************/ | ||
第20行: | 第96行: | ||
body > #mw-content-container { | body > #mw-content-container { | ||
− | margin-top: | + | margin-top: 4%; |
} | } | ||
第48行: | 第124行: | ||
/* 图标颜色hover */ | /* 图标颜色hover */ | ||
.cosmos-bannerOption:hover .cosmos-bannerOption-icon { | .cosmos-bannerOption:hover .cosmos-bannerOption-icon { | ||
− | stroke: | + | stroke: #ffffff !important; |
} | } | ||
第77行: | 第153行: | ||
#cosmos-search-buttonContainer:hover #cosmos-search-buttonIcon | #cosmos-search-buttonContainer:hover #cosmos-search-buttonIcon | ||
{ | { | ||
− | stroke: | + | stroke: #ffffff !important; |
}/*搜索框放大镜hover颜色*/ | }/*搜索框放大镜hover颜色*/ | ||
第86行: | 第162行: | ||
.cosmos-userOptions-personalTools:hover .cosmos-userButton-label { | .cosmos-userOptions-personalTools:hover .cosmos-userButton-label { | ||
− | color: | + | color: #ffffff; |
}/*用户名颜色hover*/ | }/*用户名颜色hover*/ | ||
#cosmos-actionsList-list a:hover { | #cosmos-actionsList-list a:hover { | ||
第96行: | 第172行: | ||
overflow: hidden; /*去除滚动条*/ | overflow: hidden; /*去除滚动条*/ | ||
} | } | ||
− | + | /* 表格展开和折叠文字 */ | |
+ | .mw-collapsible-text { | ||
+ | text-shadow: 1px 1px #000000bd; | ||
+ | } | ||
/**************************/ | /**************************/ | ||
/* 主页面 */ | /* 主页面 */ | ||
第109行: | 第188行: | ||
body pre { | body pre { | ||
background-color: rgba(17,17,17,0.91); | background-color: rgba(17,17,17,0.91); | ||
− | color: | + | color: #ffffff; |
border: 1px solid #cccccc; | border: 1px solid #cccccc; | ||
overflow: auto; | overflow: auto; | ||
第116行: | 第195行: | ||
line-height: normal; | line-height: normal; | ||
font-family: monospace; | font-family: monospace; | ||
+ | font-size: 16px; | ||
} | } | ||
第131行: | 第211行: | ||
.cosmos-header__sitename a:-webkit-any-link { | .cosmos-header__sitename a:-webkit-any-link { | ||
− | color: | + | color: #ffffff; |
− | font-size: | + | font-size: 1.1em; |
}/*VoiceWiki的字体属性*/ | }/*VoiceWiki的字体属性*/ | ||
.cosmos-header .wds-tabs .wds-tabs__tab-label a { | .cosmos-header .wds-tabs .wds-tabs__tab-label a { | ||
− | color: | + | color: #ffffff; |
} | } | ||
.cosmos-header .wds-tabs .wds-tabs__tab:hover .wds-tabs__tab-label a { | .cosmos-header .wds-tabs .wds-tabs__tab:hover .wds-tabs__tab-label a { | ||
− | color: | + | color: #ffffff; |
} | } | ||
.cosmos-header::before{ | .cosmos-header::before{ | ||
− | background: | + | background: #1d1d1f; |
− | background-image: | + | background-image: #1d1d1f; |
} | } | ||
.cosmos-header .cosmos-header__counter { | .cosmos-header .cosmos-header__counter { | ||
− | color: | + | color: #ffffff; |
} | } | ||
.cosmos-header .wds-dropdown__content .wds-list.wds-is-linked li:hover > a:not(.wds-button) { | .cosmos-header .wds-dropdown__content .wds-list.wds-is-linked li:hover > a:not(.wds-button) { | ||
background-color: rgba(0,108,176,0.1); | background-color: rgba(0,108,176,0.1); | ||
− | color: | + | color: #1d1d1f; |
} | } | ||
/**************************/ | /**************************/ | ||
+ | |||
.mw-body h1.firstHeading{ | .mw-body h1.firstHeading{ | ||
border-bottom: none !important; | border-bottom: none !important; | ||
− | color: | + | color:#ffffff; |
} | } | ||
第163行: | 第244行: | ||
color:#27d1f4; | color:#27d1f4; | ||
} | } | ||
− | + | ||
− | + | #mw-content-text h2 { | |
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
color: #27d1f4; | color: #27d1f4; | ||
+ | padding-bottom: 2px !important; | ||
+ | border: 0em; | ||
+ | margin-top: 0em; | ||
+ | margin-bottom: 0.5em; | ||
+ | } | ||
+ | |||
+ | #mw-content-text h2::after { | ||
+ | content: " "; | ||
+ | width: 100%; | ||
+ | height: 6px; | ||
+ | display: block; | ||
+ | background-color: #ffef00; | ||
+ | clip-path: polygon(0 0, 0 100%, 12% 100%, calc(12% + 8px) 1px, 100% 1px, 100% 0); | ||
+ | margin-top: 0.2em; | ||
} | } | ||
− | + | ||
+ | #mw-content-text h3 { | ||
+ | border: 0em; | ||
+ | margin-top: 0em; | ||
+ | margin-bottom: 0.5em; | ||
border-bottom: none !important; | border-bottom: none !important; | ||
color:#27d1f4; | color:#27d1f4; | ||
} | } | ||
+ | |||
+ | /* 目录标题 */ | ||
+ | #mw-toc-heading { | ||
+ | border-bottom: 0px !important; | ||
+ | } | ||
+ | #mw-toc-heading::after { | ||
+ | display:none !important; | ||
+ | } | ||
+ | |||
.mw-body h4 { | .mw-body h4 { | ||
color: #27d1f4 ; | color: #27d1f4 ; | ||
第201行: | 第303行: | ||
#mw-content .toggleSymbol, .toctogglelabel { | #mw-content .toggleSymbol, .toctogglelabel { | ||
− | color: # | + | color: #FFF039; |
}/*目录编辑*/ | }/*目录编辑*/ | ||
.tocnumber { | .tocnumber { | ||
− | color: #27d1f4;} | + | color: #27d1f4; |
+ | font-family: "JetBrains Mono", monospace; | ||
+ | } | ||
body #mw-content-text { | body #mw-content-text { | ||
− | color: | + | color: #ffffff !important; |
}/*普通文本*/ | }/*普通文本*/ | ||
第217行: | 第321行: | ||
#mw-content a:not(.new){ | #mw-content a:not(.new){ | ||
− | color: # | + | color: #FFF039; |
}/*普通超链接*/ | }/*普通超链接*/ | ||
.mw-warning { | .mw-warning { | ||
− | background-color: | + | background-color: #1d1d1f;} |
#filetoc { | #filetoc { | ||
− | background-color: | + | background-color: #1d1d1f;} |
.cosmos-button-primary { | .cosmos-button-primary { | ||
第231行: | 第335行: | ||
} | } | ||
.cosmos-button.cosmos-button-secondary { | .cosmos-button.cosmos-button-secondary { | ||
− | color: | + | color: #ffffff; |
− | stroke: | + | stroke: #ffffff; |
stroke-width: 2px; | stroke-width: 2px; | ||
} | } | ||
第238行: | 第342行: | ||
background-color: rgba(17,17,17,0.91);} | background-color: rgba(17,17,17,0.91);} | ||
.cosmos-footerLinks-list { | .cosmos-footerLinks-list { | ||
− | color: | + | color: #ffffff;} |
.cosmos-footerLinks-list li a { | .cosmos-footerLinks-list li a { | ||
− | color: # | + | color: #FFF039; |
} | } | ||
.cosmos-articleContainer{ | .cosmos-articleContainer{ | ||
− | color: | + | color: #ffffff; |
} | } | ||
第253行: | 第357行: | ||
background-color: darkgray;}/*监视列表*/ | background-color: darkgray;}/*监视列表*/ | ||
table.mw-datatable{ | table.mw-datatable{ | ||
− | color: | + | color:#ffffff;} |
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button { | .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button { | ||
background-color: transparent; | background-color: transparent; | ||
第280行: | 第384行: | ||
border-radius: 2px; | border-radius: 2px; | ||
} | } | ||
+ | |||
+ | li.gallerybox div.thumb { | ||
+ | border: 1px solid #c8ccd1; | ||
+ | background-color: #202122; | ||
+ | } /* 上传文件图片格子的背景 */ | ||
/**************************/ | /**************************/ | ||
第286行: | 第395行: | ||
a.sm2_button, a.sm2_button.sm2_paused:hover { | a.sm2_button, a.sm2_button.sm2_paused:hover { | ||
− | background-image: | + | position: relative; |
− | + | display: inline-block; | |
+ | background-color: #ffef00; | ||
+ | background-image: url(data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMTAyNCAxMDI0IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjFlbSIgaGVpZ2h0PSIxZW0iPjxwYXRoIGQ9Ik05MTIuNzI0ODg0IDQyOS4zNTU2ODFMMjA4Ljc5NzU0NSAxMy4xOTg2MzhDMTUxLjYwMzQ0OS0yMC41OTc4NzQgNjQuMDEyNDkgMTIuMTk4NzQxIDY0LjAxMjQ5IDk1Ljc5MDExMlY5MjcuOTA0MjE5YzAgNzQuOTkyMjU5IDgxLjM5MTU5OSAxMjAuMTg3NTk0IDE0NC43ODUwNTUgODIuNTkxNDc1bDcwMy45MjczMzktNDE1Ljk1NzA2NGM2Mi43OTM1MTgtMzYuOTk2MTgxIDYyLjk5MzQ5OC0xMjguMTg2NzY4IDAtMTY1LjE4Mjk0OXoiIHAtaWQ9IjEzODQiPjwvcGF0aD48L3N2Zz4=); | ||
background-repeat: no-repeat; | background-repeat: no-repeat; | ||
− | background-position: | + | background-size: 40% 40%; |
− | + | background-position: 55% 50%; | |
− | + | height: 3rem; | |
− | border-radius: | + | width: 3rem; |
+ | border-radius: 50%; | ||
+ | margin: 2px 4px 2px 0px; | ||
+ | } | ||
+ | |||
+ | a.sm2_button:hover, a.sm2_button.sm2_playing, a.sm2_button.sm2_playing:hover { | ||
+ | background-color: #d9cb00; | ||
} | } | ||
+ | a.sm2_button.sm2_paused, a.sm2_button.sm2_paused:hover { | ||
+ | background-color: #aca753; | ||
+ | } | ||
/**************************/ | /**************************/ | ||
/* 编辑界面 */ | /* 编辑界面 */ | ||
第300行: | 第420行: | ||
.mw-editform #wpTextbox1 { | .mw-editform #wpTextbox1 { | ||
− | background-color: | + | background-color: #1d1d1f; |
− | color: | + | color: #ffffff; |
+ | overflow: auto; | ||
} | } | ||
div.editOptions { | div.editOptions { | ||
padding: 1.25em 1.75em; | padding: 1.25em 1.75em; | ||
− | border: solid | + | border: solid #ffffff; |
border-width: 0 1px 0.2em; | border-width: 0 1px 0.2em; | ||
− | background: | + | background: #1d1d1f; |
− | color: | + | color: #ffffff; |
} | } | ||
.editOptions p { | .editOptions p { | ||
− | color: | + | color: #ffffff; |
} | } | ||
.editOptions .oo-ui-fieldLayout-body .oo-ui-labelElement-label { | .editOptions .oo-ui-fieldLayout-body .oo-ui-labelElement-label { | ||
第319行: | 第440行: | ||
} | } | ||
#catlinks{ | #catlinks{ | ||
− | background-color: | + | background-color:#1d1d1f; |
} | } | ||
第325行: | 第446行: | ||
table.mw-enhanced-rc th, table.mw-enhanced-rc td { | table.mw-enhanced-rc th, table.mw-enhanced-rc td { | ||
− | color: | + | color: #ffffff; |
}/*监视列表*/ | }/*监视列表*/ | ||
#pagehistory li.selected { | #pagehistory li.selected { | ||
background-color: transparent;} | background-color: transparent;} | ||
.oo-ui-fieldLayout-header { | .oo-ui-fieldLayout-header { | ||
− | color: | + | color: #ffffff;} |
.oo-ui-panelLayout-padded.oo-ui-panelLayout-framed { | .oo-ui-panelLayout-padded.oo-ui-panelLayout-framed { | ||
background-color: transparent;} | background-color: transparent;} | ||
.diff-context { | .diff-context { | ||
− | color: | + | color: #ffffff;} |
html .thumbcaption { | html .thumbcaption { | ||
− | color: | + | color: #1d1d1f;} |
/***********/ | /***********/ | ||
第343行: | 第464行: | ||
.mw-datatable td { | .mw-datatable td { | ||
− | background-color: | + | background-color: #1d1d1f; |
color: deepskyblue; | color: deepskyblue; | ||
}/*数据库表格*/ | }/*数据库表格*/ | ||
第362行: | 第483行: | ||
.heimu, | .heimu, | ||
.heimu rt { | .heimu rt { | ||
− | background-color: # | + | background-color: #FFF039; |
} | } | ||
span.heimu a.external, | span.heimu a.external, | ||
第368行: | 第489行: | ||
span.heimu a.extiw, | span.heimu a.extiw, | ||
span.heimu a.extiw:visited { | span.heimu a.extiw:visited { | ||
− | color: # | + | color: #FFF039; |
} | } | ||
.heimu, | .heimu, | ||
第374行: | 第495行: | ||
a .heimu, | a .heimu, | ||
.heimu a.new { | .heimu a.new { | ||
− | color: # | + | color: #FFF039; |
text-shadow: none; | text-shadow: none; | ||
} | } | ||
第381行: | 第502行: | ||
body:not(.heimu_toggle_on) .heimu.off { | body:not(.heimu_toggle_on) .heimu.off { | ||
transition: color .13s linear; | transition: color .13s linear; | ||
− | color: | + | color: #1d1d1f; |
} | } | ||
body:not(.heimu_toggle_on) .heimu:hover a, | body:not(.heimu_toggle_on) .heimu:hover a, | ||
第426行: | 第547行: | ||
.profile-on { | .profile-on { | ||
− | color: | + | color: #1d1d1f; |
} | } | ||
.profile-tab { | .profile-tab { | ||
第453行: | 第574行: | ||
} | } | ||
#msupload-list .file { | #msupload-list .file { | ||
− | background: | + | background: #1d1d1f; |
} | } | ||
#msupload-bottom { | #msupload-bottom { | ||
第474行: | 第595行: | ||
color: #41A5EE !important;} | color: #41A5EE !important;} | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
/**************************/ | /**************************/ | ||
/* 哔哩哔哩视频插入 */ | /* 哔哩哔哩视频插入 */ | ||
第552行: | 第648行: | ||
padding: 10px 15px; | padding: 10px 15px; | ||
background: #3A3A3A; | background: #3A3A3A; | ||
− | + | #ffffff-space: nowrap; | |
font-weight: bold; | font-weight: bold; | ||
} | } | ||
第584行: | 第680行: | ||
} | } | ||
+ | |||
+ | /**************************/ | ||
+ | /* info类模板 */ | ||
+ | /**************************/ | ||
+ | .infoBox { | ||
+ | margin: 0 auto; | ||
+ | width: 100%; | ||
+ | } | ||
+ | .infoBoxTitle { | ||
+ | margin: 3px auto; | ||
+ | padding: 0; | ||
+ | text-align: center; | ||
+ | font-weight: 700; | ||
+ | } | ||
+ | .infoBoxIcon { | ||
+ | display: table-cell; | ||
+ | padding: 5px 0 5px 1.2em; | ||
+ | vertical-align: middle; | ||
+ | color:#14a0d3; | ||
+ | font-size: 1.3em; | ||
+ | } | ||
+ | .infoBoxText { | ||
+ | display: table-cell; | ||
+ | padding: 0.8em 2.5em 0.8em 1em; | ||
+ | width: 100%; | ||
+ | text-align: center; | ||
+ | vertical-align: middle; | ||
+ | } | ||
+ | .infoBoxContent { | ||
+ | background: rgb(59 59 59 / 65%); | ||
+ | border-radius: 7px; | ||
+ | } | ||
+ | .infoBoxBelow { | ||
+ | margin: 0 auto; | ||
+ | padding: 0; | ||
+ | text-align: center; | ||
+ | } | ||
第589行: | 第722行: | ||
/* 评论区 */ | /* 评论区 */ | ||
/**************************/ | /**************************/ | ||
+ | |||
+ | .comment-body { | ||
+ | padding-top: 2rem; | ||
+ | } | ||
+ | |||
+ | .c-form-title { | ||
+ | color: #fff; | ||
+ | font-size: 1.75rem; | ||
+ | margin-bottom: .5em; | ||
+ | } | ||
+ | |||
+ | .comments-body .c-form-button .site-button { | ||
+ | margin: 0; | ||
+ | padding: .25em .5em; | ||
+ | line-height: 1.5; | ||
+ | color: #f8ef00; | ||
+ | border: 1px solid #f8ef00; | ||
+ | background-color: transparent; | ||
+ | transition: all 140ms ease-in-out; | ||
+ | } | ||
+ | |||
+ | .comments-body .c-form-button .site-button:focus, | ||
+ | .comments-body .c-form-button .site-button:hover { | ||
+ | background-color: #f8ef00; | ||
+ | color: #000; | ||
+ | } | ||
+ | |||
+ | .comments-body .c-form-button .site-button + .site-button { | ||
+ | margin-left: .25rem; | ||
+ | } | ||
+ | |||
+ | #comment { | ||
+ | width: 100% !important; | ||
+ | min-height: 100px; | ||
+ | padding: .25rem .5rem; | ||
+ | overflow: auto; | ||
+ | |||
+ | color: #fff; | ||
+ | background-color: transparent; | ||
+ | #ffffff-space: pre; | ||
+ | border: 1px solid #fff; | ||
+ | outline: 0 !important; | ||
+ | transition: border-color 140ms ease-in-out; | ||
+ | } | ||
+ | |||
+ | #comment:focus { | ||
+ | border-color: #f8ef00; | ||
+ | } | ||
+ | |||
.c-avatar img { | .c-avatar img { | ||
− | border-radius: 50px;} | + | border-radius: 50px; |
+ | } | ||
− | . | + | .c-item { |
− | + | padding: 0; | |
− | + | border-bottom: 1px solid #fff; | |
} | } | ||
− | . | + | |
− | + | /* | |
+ | .c-item.c-layout { | ||
+ | display: flex; | ||
+ | flex-flow: row nowrap; | ||
} | } | ||
− | . | + | |
− | + | .c-item.c-layout .c-score, | |
+ | .c-item.c-layout .c-avatar { | ||
+ | flex: 0 0 auto; | ||
+ | position: static !important; | ||
} | } | ||
− | .c- | + | |
− | + | .c-item.c-layout .c-container { | |
+ | flex: 1 1 0; | ||
+ | width: 0; | ||
} | } | ||
− | + | ||
− | + | .c-item.c-layout .visualClear { | |
+ | display: none; | ||
+ | } | ||
+ | */ | ||
+ | |||
+ | .c-item.reply { | ||
+ | width: 90%; | ||
+ | margin-left: 10% !important; | ||
} | } | ||
− | .c-item{ | + | |
− | + | .c-item.full { | |
− | + | width: 100%; | |
} | } | ||
− | . | + | |
− | + | .r-message { | |
+ | width: 100%; | ||
} | } | ||
+ | |||
.f-message { | .f-message { | ||
− | + | width: 100%; | |
+ | } | ||
.fillet{ | .fillet{ | ||
− | border-radius: 30px; | + | border-radius: 30px; |
− | display: inline-block; | + | display: inline-block; |
− | height: 30px; | + | height: 30px; |
− | font-size: 17px; | + | font-size: 17px; |
− | line-height: 30px; | + | line-height: 30px; |
− | text-align: center; | + | text-align: center; |
− | color: | + | color: #1d1d1f !important; |
− | } | + | } |
+ | |||
+ | /***********************************/ | ||
+ | /* 标签 */ | ||
+ | /***********************************/ | ||
+ | /* 类似于 Fillet,但是拥有自适应宽高和略微缩小的文字大小 */ | ||
+ | |||
+ | /* 默认标签样式 */ | ||
+ | .tag { | ||
+ | margin-left: .5rem; | ||
+ | display: inline-block; | ||
+ | padding: .125em 1em; | ||
+ | border-radius: 2em; | ||
+ | color: #fff; | ||
+ | font-size: .9em; | ||
+ | font-weight: 700; /* Bold */ | ||
+ | line-height: 1.414; | ||
+ | background-color: #777; | ||
+ | } | ||
+ | |||
+ | /* | ||
+ | * 各语言彩色标签,需要的话自己加。目前已有: | ||
+ | * | ||
+ | * fr - 法语 | ||
+ | * es - 西班牙语 | ||
+ | * ru - 俄语 | ||
+ | * ko - 韩语 | ||
+ | * ja - 日语 | ||
+ | * de - 德语 | ||
+ | * ar - 阿拉伯语 | ||
+ | * it - 意大利语 | ||
+ | */ | ||
+ | :lang(fr) + .tag { background-color: rgb(202, 47, 143); } | ||
+ | :lang(es) + .tag { background-color: rgb(35, 151, 37); } | ||
+ | :lang(ru) + .tag { background-color: rgb(33, 150, 243); } | ||
+ | :lang(ko) + .tag { background-color: rgb(5, 147, 186); } | ||
+ | :lang(ja) + .tag { background-color: rgb(255, 0, 0); } | ||
+ | :lang(de) + .tag { background-color: rgb(129, 99, 192); } | ||
+ | :lang(ar) + .tag { background-color: rgb(188, 105, 83); } | ||
+ | :lang(it) + .tag { background-color: rgb(123, 148, 8); } | ||
/**************************/ | /**************************/ | ||
− | /* | + | /* 播放按钮和下载按钮 */ |
/**************************/ | /**************************/ | ||
+ | |||
+ | .audio-player { | ||
+ | margin-right: .5rem; | ||
+ | } | ||
+ | |||
+ | .audio-player .audio-player-button { | ||
+ | height: 3rem; | ||
+ | width: 3rem; | ||
+ | text-align: center; | ||
+ | border: 1px solid rgb(0 0 0 / 15%); | ||
+ | background-color: #f8ef00; | ||
+ | border-radius: 50%; | ||
+ | transition: all 140ms ease-in-out; | ||
+ | outline: 0; | ||
+ | |||
+ | background-size: 40% 40%; | ||
+ | background-position: 56% 50%; | ||
+ | background-repeat: no-repeat; | ||
+ | background-image: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMTAyNCAxMDI0IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjFlbSIgaGVpZ2h0PSIxZW0iPjxwYXRoIGQ9Ik05MTIuNzI0ODg0IDQyOS4zNTU2ODFMMjA4Ljc5NzU0NSAxMy4xOTg2MzhDMTUxLjYwMzQ0OS0yMC41OTc4NzQgNjQuMDEyNDkgMTIuMTk4NzQxIDY0LjAxMjQ5IDk1Ljc5MDExMlY5MjcuOTA0MjE5YzAgNzQuOTkyMjU5IDgxLjM5MTU5OSAxMjAuMTg3NTk0IDE0NC43ODUwNTUgODIuNTkxNDc1bDcwMy45MjczMzktNDE1Ljk1NzA2NGM2Mi43OTM1MTgtMzYuOTk2MTgxIDYyLjk5MzQ5OC0xMjguMTg2NzY4IDAtMTY1LjE4Mjk0OXoiIHAtaWQ9IjEzODQiPjwvcGF0aD48L3N2Zz4="); | ||
+ | } | ||
+ | |||
+ | .audio-player .audio-player-button:hover, | ||
+ | .audio-player .audio-player-button:focus { | ||
+ | background-color: #c1ba00; | ||
+ | } | ||
+ | |||
+ | .audio-player .audio-player-button.audio-player-playing { | ||
+ | /* 暂停图标好像有点往左歪了,微调一下 */ | ||
+ | background-position: 51% 50%; | ||
+ | background-image: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMTAyNCAxMDI0IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjFlbSIgaGVpZ2h0PSIxZW0iPjxwYXRoIGQ9Ik0yMDIuNjA4IDBoMC41OTRxMTI5LjM4MyAwIDEyOS4zODMgMTI5LjM4MnY3NjUuMjM2cTAgMTI5LjM4Mi0xMjkuMzgzIDEyOS4zODJoLTAuNTk0cS0xMjkuMzgyIDAtMTI5LjM4Mi0xMjkuMzgyVjEyOS4zODJRNzMuMjI2IDAgMjAyLjYwOCAwek03ODQuNjI0IDBoMC41OTRROTE0LjYgMCA5MTQuNiAxMjkuMzgydjc2NS4yMzZROTE0LjYgMTAyNCA3ODUuMjE4IDEwMjRoLTAuNTk0cS0xMjkuMzgzIDAtMTI5LjM4My0xMjkuMzgyVjEyOS4zODJRNjU1LjI0MSAwIDc4NC42MjQgMHoiIHAtaWQ9IjIxMjEiPjwvcGF0aD48L3N2Zz4="); | ||
+ | } | ||
+ | |||
.downloadable-audio { | .downloadable-audio { | ||
+ | margin-right: .5rem; | ||
position: relative; | position: relative; | ||
− | display: inline- | + | display: inline-flex; |
} | } | ||
第640行: | 第913行: | ||
z-index: 1; | z-index: 1; | ||
position: relative; | position: relative; | ||
− | display: | + | margin-right: 0; |
+ | display: block; | ||
+ | border-radius: 50%; | ||
+ | box-shadow: 0 3px 8px rgb(0 0 0 / 15%); | ||
+ | } | ||
+ | |||
+ | .downloadable-audio .audio-player::after { | ||
+ | content: "<>" | ||
+ | display: block; | ||
+ | color: #000; | ||
+ | background-color: #e8e000; | ||
+ | } | ||
+ | |||
+ | :lang(en) .downloadable-audio .audio-player::after { content: "<DropdownMenu>"; } | ||
+ | :lang(zh) .downloadable-audio .audio-player::after { content: "<下拉菜单>"; } | ||
+ | |||
+ | .downloadable-audio .audio-player button { | ||
+ | display: block; | ||
+ | } | ||
+ | |||
+ | .downloadable-audio .audio-player.has-audio-element::after { | ||
+ | content: none; | ||
+ | } | ||
+ | |||
+ | .downloadable-audio .audio-player.has-audio-element + .downloadable-audio-dropdown { | ||
+ | display: flex; | ||
} | } | ||
.downloadable-audio .downloadable-audio-dropdown { | .downloadable-audio .downloadable-audio-dropdown { | ||
+ | box-sizing: border-box; | ||
+ | display: none; | ||
+ | flex-flow: column nowrap; | ||
+ | justify-content: flex-start; | ||
+ | align-items: center; | ||
position: absolute; | position: absolute; | ||
left: 0; | left: 0; | ||
top: 0; | top: 0; | ||
width: 100%; | width: 100%; | ||
− | padding-top: | + | min-height: 100%; |
+ | padding: 6px; | ||
+ | padding-top: 0%; | ||
+ | |||
+ | background-color: #e8e000; /* 与 #f8ef00 播放按钮颜色区分开一点 */ | ||
− | |||
/* 设定一个非百分比的大数值 */ | /* 设定一个非百分比的大数值 */ | ||
border-radius: 16rem; | border-radius: 16rem; | ||
+ | |||
+ | box-shadow: 0 6px 12px rgb(0 0 0 / 33%); | ||
+ | |||
+ | transition: padding-top 140ms ease-out; | ||
} | } | ||
.downloadable-audio .download-button { | .downloadable-audio .download-button { | ||
+ | box-sizing: border-box; | ||
position: relative; | position: relative; | ||
+ | margin-top: 4px; | ||
padding-top: 100%; | padding-top: 100%; | ||
width: 100%; | width: 100%; | ||
height: 0; | height: 0; | ||
+ | border: 1px solid rgb(0 0 0 / 15%); | ||
+ | border-radius: 50%; | ||
+ | cursor: pointer; | ||
+ | transition: background-color 140ms ease-in-out; | ||
+ | } | ||
+ | |||
+ | .downloadable-audio .download-button:focus-within, | ||
+ | .downloadable-audio .download-button:hover { | ||
+ | background-color: rgb(0 0 0 / 10%); | ||
} | } | ||
第672行: | 第993行: | ||
} | } | ||
− | .downloadable-audio .download-link { | + | .downloadable-audio .download-icon { |
− | + | background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9Ii0xIC0xIDE4IDE4Ij48cGF0aCBkPSJNOCAxdjEwTTIgNWw2IDYgNi02TTIgMTJ2M2gxMnYtMyIgc3Ryb2tlPSJjdXJyZW50Q29sb3IiIHN0cm9rZS13aWR0aD0iMiIgZmlsbD0ibm9uZSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+PC9zdmc+"); | |
+ | background-repeat: no-repeat; | ||
+ | background-size: 50%; | ||
+ | background-position: center; | ||
+ | } | ||
+ | |||
+ | .downloadable-audio .download-link > a { | ||
+ | display: block; | ||
+ | color: transparent !important; | ||
+ | width: 100%; | ||
+ | height: 100%; | ||
+ | outline: 0; | ||
+ | overflow: hidden; | ||
+ | user-select: none !important; | ||
+ | } | ||
+ | |||
+ | .downloadable-audio:focus-within, | ||
+ | .downloadable-audio:hover { | ||
+ | z-index: 5; | ||
+ | } | ||
+ | |||
+ | /* 在下载按钮被聚焦时保持下拉菜单张开状态? */ | ||
+ | .downloadable-audio-dropdown:focus-within, | ||
+ | .downloadable-audio:hover .downloadable-audio-dropdown { | ||
+ | padding-top: 100%; | ||
+ | } | ||
+ | |||
+ | /* OverWatch Portrait */ | ||
+ | .owportrait { | ||
+ | position: relative; | ||
+ | display: inline-block; | ||
+ | } | ||
+ | |||
+ | .owportrait > a { | ||
overflow: hidden; | overflow: hidden; | ||
+ | |||
+ | display: block; | ||
+ | border: 3px solid #fff; | ||
+ | border-left: 0; | ||
+ | border-right: 0; | ||
+ | |||
+ | border-radius: 10px; | ||
+ | background-color: #777; | ||
+ | |||
+ | transform: scale(0.92) skewX(-7.5deg); | ||
+ | transition: all .14s cubic-bezier(0.33, 1, 0.68, 1); | ||
} | } | ||
− | . | + | .owportrait > a::before, |
+ | .owportrait > a::after { | ||
+ | content: " "; | ||
+ | position: absolute; | ||
+ | left: 0; | ||
+ | top: 0; | ||
+ | width: 100%; | ||
+ | height: 100%; | ||
+ | } | ||
+ | |||
+ | .owportrait > a:hover, | ||
+ | .owportrait > a:focus { | ||
+ | background-color: rgb(238,120,74); | ||
+ | transform: scale(1) skewX(-7.5deg); | ||
+ | } | ||
+ | |||
+ | .owportrait img { | ||
+ | margin: 0 -14px; | ||
+ | transform: skewX(7.5deg); | ||
+ | } | ||
+ | |||
+ | .owportrait-name { | ||
+ | display: none; /* Not useful for now */ | ||
+ | position: absolute; | ||
+ | left: 0; | ||
+ | bottom: 0; | ||
+ | } | ||
+ | |||
+ | /* Kingdom Rush Chart */ | ||
+ | .kr-table { | ||
+ | border:2px solid #FFF039; | ||
+ | border-collapse: collapse; | ||
+ | margin: 10px; | ||
+ | } | ||
+ | .kr-table th { | ||
+ | border:1px solid #FFF039; | ||
+ | padding: 6px 12px; | ||
+ | background-color: rgba(0,0,0,0.5); | ||
+ | } | ||
+ | |||
+ | .kr-table td { | ||
+ | border:1px solid #FFF039; | ||
+ | padding: 6px 12px; | ||
+ | } | ||
+ | /* 守望先锋职业 */ | ||
+ | .ow-role { | ||
+ | display: inline-block; | ||
+ | background-color: #f0edf2; | ||
+ | width: auto; | ||
+ | padding: 0px 17px; | ||
+ | border-radius: 3px; | ||
+ | transform: skewX(-15deg); | ||
+ | color:black; | ||
+ | height:30px; | ||
+ | line-height: 30px; | ||
+ | font-size:17px; | ||
+ | margin-left: 8px; | ||
+ | } | ||
+ | /* Quote模板 */ | ||
+ | td.Quote_Left { | ||
+ | line-height: 0.7em; | ||
+ | vertical-align: top; | ||
+ | text-align: right; | ||
+ | } | ||
+ | td.Quote_Right { | ||
+ | line-height: 0.1em; | ||
+ | vertical-align: bottom; | ||
+ | text-align: left; | ||
+ | } | ||
+ | td.Quote_Left, td.Quote_Right { | ||
+ | color: #0D9BE3; | ||
+ | font-size: 40px; | ||
+ | font-family: "Arial Black","Times New Roman",serif; | ||
+ | font-weight: bold; | ||
+ | width: 0px; | ||
+ | } | ||
+ | |||
+ | /* OW2 ICON */ | ||
+ | .ow2-portrait { | ||
+ | position: relative; | ||
+ | display: inline-block; | ||
+ | } | ||
+ | |||
+ | .ow2-portrait img { | ||
+ | margin: 0 -10px; | ||
+ | } | ||
+ | |||
+ | .ow2-portrait > a::before, | ||
+ | .ow2-portrait > a::after { | ||
+ | content: " "; | ||
+ | position: absolute; | ||
+ | left: 0; | ||
+ | top: 0; | ||
+ | width: 100%; | ||
+ | height: 100%; | ||
+ | } | ||
+ | |||
+ | .ow2-portrait > a { | ||
+ | overflow: hidden; | ||
+ | display: block; | ||
+ | border-radius: 0.3em; | ||
+ | border: 2px solid #b3b3b3; | ||
+ | background: #f3f7fc; | ||
+ | transform: scale(0.95); | ||
+ | transition: all .14s cubic-bezier(0.33, 1, 0.68, 1); | ||
+ | } | ||
+ | |||
+ | .ow2-portrait > a:hover, | ||
+ | .ow2-portrait > a:focus { | ||
+ | border-radius: 0.3em; | ||
+ | border: 2px solid #fff; | ||
+ | background: #f3f7fc; | ||
+ | transform: scale(1); | ||
+ | } | ||
+ | /* HOI FLAG ICON */ | ||
+ | .hoi-flag { | ||
+ | position: relative; | ||
+ | display: inline-block; | ||
+ | } | ||
+ | |||
+ | .hoi-flag > a::before, | ||
+ | .hoi-flag > a::after { | ||
+ | content: " "; | ||
+ | position: absolute; | ||
+ | left: 0; | ||
+ | top: 0; | ||
+ | width: 100%; | ||
+ | height: 100%; | ||
+ | } | ||
+ | |||
+ | .hoi-flag > a { | ||
+ | overflow: hidden; | ||
+ | display: block; | ||
+ | border-radius: 0.3em; | ||
+ | border: 2px solid transparent; | ||
+ | transform: scale(0.90); | ||
+ | transition: all .14s cubic-bezier(0.33, 1, 0.68, 1); | ||
+ | } | ||
+ | |||
+ | .hoi-flag > a:hover, | ||
+ | .hoi-flag > a:focus { | ||
+ | border-radius: 0.3em; | ||
+ | border: 2px solid transparent; | ||
+ | transform: scale(1); | ||
+ | } | ||
+ | /* 投票Style */ | ||
+ | |||
+ | .ajaxpoll-id-info { | ||
+ | display: none; | ||
+ | } | ||
+ | |||
+ | .ajaxpoll { | ||
+ | width: 100%; | ||
+ | background: rgb(59 59 59 / 65%); | ||
+ | border-radius: 10px; | ||
+ | border: 1px solid #FFF039; | ||
+ | } | ||
+ | |||
+ | .ajaxpoll .ajaxpoll-our-vote div { | ||
+ | border: 2px solid #121215; | ||
+ | top: -2px; | ||
+ | left: -2px; | ||
+ | } | ||
+ | |||
+ | .ajaxpoll .ajaxpoll-answer-vote div { | ||
+ | background: #0075ff; | ||
+ | position: absolute; | ||
+ | top: 0; | ||
+ | left: 0; | ||
+ | height: 15px; | ||
+ | font-size: 1px; | ||
+ | line-height: 12px; | ||
+ | z-index: 2; | ||
+ | border-radius: 10px; | ||
+ | box-shadow: 0px 0px 0px 1px inset #ffffff; | ||
+ | top: -2px; | ||
+ | left: -2px; | ||
+ | } | ||
+ | |||
+ | .ajaxpoll .ajaxpoll-answer-vote span { | ||
+ | position: absolute; | ||
+ | top: 0px; | ||
+ | left: 3%; | ||
+ | z-index: 4; | ||
+ | } | ||
+ | |||
+ | .ajaxpoll .ajaxpoll-answer-vote { | ||
+ | border: 2px solid #121215; | ||
+ | width: 100%; | ||
+ | margin-left: 0; | ||
+ | height: 15px; | ||
+ | font-size: 10px; | ||
+ | position: relative; | ||
+ | border-radius: 10px; | ||
+ | margin: 1em 0px; | ||
+ | box-shadow: 1px 1px 4px 0px inset #080808; | ||
+ | background: #121215; | ||
+ | } | ||
+ | |||
+ | .ajaxpoll .ajaxpoll-ajax { | ||
+ | background: #0075ff; | ||
+ | padding: 4px 11px; | ||
+ | border-radius: 0.5em; | ||
+ | margin-bottom: 1em; | ||
+ | } | ||
+ | |||
+ | .krhero img { | ||
+ | border: 3px solid #ffef00; | ||
+ | border-radius: 0.4em; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | /* GTA Vice City */ | ||
+ | |||
+ | .gtavcp { | ||
+ | font-family: pricedown; | ||
+ | color: #f8a5e3; | ||
+ | font-size: 1.3em; | ||
+ | } | ||
+ | |||
+ | .gtavcp-image img { | ||
+ | border: 5px solid #f8a5e3; | ||
+ | border-radius: 0.5em; | ||
+ | margin: 0 0.5em; | ||
+ | } | ||
+ | .gtavcr-image img { | ||
+ | filter: drop-shadow(1px 1px white); | ||
+ | margin: 1em 0.5em; | ||
+ | } | ||
+ | |||
+ | .gtavcr a { | ||
+ | font-family: pricedown; | ||
+ | color: #5ac0ef !important; | ||
+ | font-size: 1.3em; | ||
+ | } | ||
+ | |||
+ | /*悬浮文本*/ | ||
+ | .hover-text { | ||
+ | text-align: center; | ||
+ | color: #000; | ||
+ | font-size: 0.85em; | ||
+ | background-color: #f8ef00; | ||
+ | padding: 2px 5px; | ||
+ | margin: 0px 3px; | ||
+ | border-radius: 2px; | ||
+ | display: none; | ||
+ | white-space: nowrap; | ||
+ | } | ||
+ | |||
+ | .pic-hover-text:hover .hover-text{ | ||
+ | display: initial; | ||
+ | } | ||
+ | |||
+ | .ow2-small-icon img{ | ||
+ | border:1px solid white; | ||
+ | display: inline-block; | ||
+ | padding: 2px; | ||
+ | margin:0px 3px; | ||
+ | border-radius: 2px; | ||
+ | } | ||
+ | |||
+ | |||
+ | /* BS ICON */ | ||
+ | .bs-portrait { | ||
+ | position: relative; | ||
+ | display: inline-block; | ||
+ | } | ||
+ | |||
+ | .bs-portrait img { | ||
+ | margin: 0 -6px; | ||
+ | } | ||
+ | |||
+ | .bs-portrait > a::before, | ||
+ | .bs-portrait > a::after { | ||
+ | content: " "; | ||
+ | position: absolute; | ||
+ | left: 0; | ||
+ | top: 0; | ||
+ | width: 100%; | ||
+ | height: 100%; | ||
+ | } | ||
+ | |||
+ | .bs-portrait > a { | ||
+ | overflow: hidden; | ||
display: block; | display: block; | ||
+ | border-radius: 0.3em; | ||
+ | border: 2px solid #b3b3b3; | ||
+ | background: #f3f7fc; | ||
+ | transform: scale(0.9); | ||
+ | transition: all .14s cubic-bezier(0.33, 1, 0.68, 1); | ||
+ | } | ||
+ | |||
+ | .bs-portrait > a:hover, | ||
+ | .bs-portrait > a:focus { | ||
+ | border-radius: 0.3em; | ||
+ | border: 2px solid #fff; | ||
+ | background: #f3f7fc; | ||
+ | transform: scale(1); | ||
+ | } | ||
+ | .bs-quality-bar { | ||
+ | text-align: center; | ||
+ | border-radius: 3px; | ||
+ | padding: 0.5em 0; | ||
+ | box-shadow: inset 0px -5px 0 rgb(0 0 0 / 15%), inset 0px 5px 0 rgb(255 255 255 / 15%); | ||
+ | font-size: 1.2em; | ||
+ | color: black; | ||
+ | width: 100%; | ||
+ | margin: 1em 0px; | ||
+ | } | ||
+ | |||
+ | .bs-pin-header { | ||
+ | height: 40px; | ||
+ | font-size: 17px; | ||
+ | font-weight: 900; | ||
+ | line-height: 40px; | ||
+ | border: 0 none #87a4bf; | ||
+ | color: black; | ||
+ | box-shadow: inset 0 -6px 0 rgba(0,0,0,0.15), inset 0 6px 0 rgba(255,255,255,0.05); | ||
+ | border-collapse: collapse; | ||
+ | } | ||
+ | |||
+ | /* 王者荣耀ICON */ | ||
+ | .hok-hero-icon { | ||
+ | position: relative; | ||
+ | display: inline-block; | ||
+ | } | ||
+ | |||
+ | .hok-hero-icon > a::before, | ||
+ | .hok-hero-icon > a::after { | ||
+ | content: " "; | ||
+ | position: absolute; | ||
+ | left: 0; | ||
+ | top: 0; | ||
width: 100%; | width: 100%; | ||
height: 100%; | height: 100%; | ||
+ | } | ||
+ | |||
+ | .hok-hero-icon > a { | ||
+ | overflow: hidden; | ||
+ | display: block; | ||
+ | border: 2px solid #e4c289; | ||
+ | border-radius: 10px 0 10px 0; | ||
+ | transform: scale(0.90); | ||
+ | transition: all .14s cubic-bezier(0.33, 1, 0.68, 1); | ||
+ | } | ||
+ | |||
+ | .hok-hero-icon > a:hover, | ||
+ | .hok-hero-icon > a:focus { | ||
+ | transform: scale(1); | ||
+ | } | ||
+ | |||
+ | |||
+ | /*小型可变色按钮*/ | ||
+ | |||
+ | .audio-player-s { | ||
+ | margin-right: .5rem; | ||
+ | } | ||
+ | |||
+ | .audio-player-s .audio-player-button-s { | ||
+ | height: 1rem; | ||
+ | width: 1rem; | ||
+ | text-align: center; | ||
+ | border: 1px solid rgb(0 0 0 / 15%); | ||
+ | background-color: #f8ef00; | ||
+ | border-radius: 2px; | ||
+ | transition: all 140ms ease-in-out; | ||
+ | outline: 0; | ||
+ | |||
+ | background-size: 40% 40%; | ||
+ | background-position: 56% 50%; | ||
+ | background-repeat: no-repeat; | ||
+ | background-image: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMTAyNCAxMDI0IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjFlbSIgaGVpZ2h0PSIxZW0iPjxwYXRoIGQ9Ik05MTIuNzI0ODg0IDQyOS4zNTU2ODFMMjA4Ljc5NzU0NSAxMy4xOTg2MzhDMTUxLjYwMzQ0OS0yMC41OTc4NzQgNjQuMDEyNDkgMTIuMTk4NzQxIDY0LjAxMjQ5IDk1Ljc5MDExMlY5MjcuOTA0MjE5YzAgNzQuOTkyMjU5IDgxLjM5MTU5OSAxMjAuMTg3NTk0IDE0NC43ODUwNTUgODIuNTkxNDc1bDcwMy45MjczMzktNDE1Ljk1NzA2NGM2Mi43OTM1MTgtMzYuOTk2MTgxIDYyLjk5MzQ5OC0xMjguMTg2NzY4IDAtMTY1LjE4Mjk0OXoiIHAtaWQ9IjEzODQiPjwvcGF0aD48L3N2Zz4="); | ||
+ | } | ||
+ | |||
+ | .audio-player-s .audio-player-button-s:hover, | ||
+ | .audio-player-s .audio-player-button-s:focus { | ||
+ | background-color: #c1ba00; | ||
+ | } | ||
+ | |||
+ | .audio-player-s .audio-player-button-s.audio-player-playing-s { | ||
+ | /* 暂停图标好像有点往左歪了,微调一下 */ | ||
+ | background-position: 51% 50%; | ||
+ | background-image: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMTAyNCAxMDI0IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjFlbSIgaGVpZ2h0PSIxZW0iPjxwYXRoIGQ9Ik0yMDIuNjA4IDBoMC41OTRxMTI5LjM4MyAwIDEyOS4zODMgMTI5LjM4MnY3NjUuMjM2cTAgMTI5LjM4Mi0xMjkuMzgzIDEyOS4zODJoLTAuNTk0cS0xMjkuMzgyIDAtMTI5LjM4Mi0xMjkuMzgyVjEyOS4zODJRNzMuMjI2IDAgMjAyLjYwOCAwek03ODQuNjI0IDBoMC41OTRROTE0LjYgMCA5MTQuNiAxMjkuMzgydjc2NS4yMzZROTE0LjYgMTAyNCA3ODUuMjE4IDEwMjRoLTAuNTk0cS0xMjkuMzgzIDAtMTI5LjM4My0xMjkuMzgyVjEyOS4zODJRNjU1LjI0MSAwIDc4NC42MjQgMHoiIHAtaWQ9IjIxMjEiPjwvcGF0aD48L3N2Zz4="); | ||
+ | } | ||
+ | |||
+ | .bs-hyperCharge-nofade img { | ||
+ | position: absolute; | ||
+ | top: 0; | ||
+ | left: 0; | ||
+ | opacity: 1; | ||
+ | } | ||
+ | |||
+ | .bs-hyperCharge-fade img { | ||
+ | position: absolute; | ||
+ | top: 0; | ||
+ | left: 0; | ||
+ | opacity: 1; | ||
+ | animation: hyperChargeFadeInOut 6s infinite; | ||
+ | } | ||
+ | |||
+ | @keyframes hyperChargeFadeInOut { | ||
+ | 0%, 100% { | ||
+ | opacity: 1; | ||
+ | } | ||
+ | 50% { | ||
+ | opacity: 0; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .btd6-corvus-spell { | ||
+ | filter: brightness(10); | ||
+ | } | ||
+ | |||
+ | .homepage-gamecard { | ||
+ | border:2px solid rgb(255 255 255 / 18%); | ||
+ | background: #1d1d1f; | ||
+ | display: inline-block; | ||
+ | margin: 0px 15px 15px 15px; | ||
+ | width: 280px; | ||
+ | text-align: center; | ||
+ | position: relative; | ||
+ | height: 400px; | ||
+ | border-radius: 4px; | ||
+ | transition: 0.2s cubic-bezier(0, 1.1, 0.45, 0.94); | ||
+ | } | ||
+ | .homepage-gamecard:hover { | ||
+ | background-color: #4262c9; | ||
+ | box-shadow: 1px 0px 20px 0px #6ea8ff; | ||
+ | transform: scale(1.06); | ||
+ | } | ||
+ | .ra2m-vo { | ||
+ | padding: 2px 3px; | ||
+ | background: red; | ||
+ | border-radius: 2px; | ||
+ | font-size: small; | ||
+ | margin-right: 3px; | ||
+ | color: black; | ||
+ | } | ||
+ | .vw-fame img { | ||
+ | border-radius: 50%; | ||
+ | border: 2px solid #393939; | ||
+ | } | ||
+ | .bs-trio img { | ||
+ | border-radius: 50%; | ||
+ | margin: 0px 4px; | ||
+ | border: 2px solid #616161; | ||
+ | } | ||
+ | .bs-trio1 img { | ||
+ | border-radius: 50%; | ||
+ | margin: 0px 4px; | ||
+ | border: 2px solid #ffef00; | ||
} | } |
2024年9月5日 (四) 03:05的最新版本
@import url("https://fonts.googleapis.com/css?family=Exo 2"); /* 因使用顺序优先加载 */ @import url("https://fonts.googleapis.com/css?family=Jura"); /*科技感包含希腊字母*/ @import url("https://fonts.googleapis.com/css?family=Tajawal"); /*阿拉伯字母字体*/ @import url("https://fonts.googleapis.com/css?family=Google Sans"); /*谷歌的字体*/ @import url("https://fonts.googleapis.com/css?family=Noto Sans SC"); /*思源黑体*/ @import url("https://fonts.googleapis.com/css?family=Fira Code"); /*等宽字体常规*/ @import url("https://fonts.googleapis.com/css?family=Kalam"); /*较窄的字体*/ @import url("https://fonts.googleapis.com/css?family=JetBrains Mono"); /*等宽字体用作目录*/ @import url("https://voicewiki.cn/w/extrafiles/fontawesome-free-5.15.4/css/all.min.css"); /* FA 字体图标 */ @import url("https://voicewiki.cn/w/extrafiles/font-awesome-animation.min.css"); /* FA 字体动画 */ @font-face { font-family: "Pricedown"; src: url("https://voicewiki.cn/w/extrafiles/Pricedown.ttf") format("truetype"); font-style: normal; font-stretch: normal; font-weight: normal; } @font-face { font-family: "Big Noodle Too"; src: url("https://voicewiki.cn/w/extrafiles/big-noodle-too-oblique.woff") format("woff"); font-style: oblique; font-stretch: normal; font-weight: normal; } @font-face { font-family: "YSGoodBody"; src: url("https://voicewiki.cn/w/extrafiles/YSGoodBody.ttf") format("truetype"); font-style: normal; font-stretch: normal; font-weight: normal; } /* 暂时隐藏需要处理但还未处理的 DOM 节点,JavaScript 会在之后移除这个 class */ .template-render-cloak { display: none !important; visibility: hidden !important; } /* 使用占位图代替受损图像 */ .unresolved-image { display: inline-block !important; position: relative; box-sizing: border-box; color: transparent !important; border: 8px solid #242d38; background-color: #1a1f25; } .unresolved-image::after { content: "?"; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); color: #fff !important; font-size: 1.5em; font-weight: 700; } /* 根据目测覆盖范围重新安排 font-family 使用顺序: "Exo 2" -> Latin Tajawal -> Latin + Arabic Jura -> 经测试 Jura 并不包含希腊字母字形 */ body * { font-family: "Exo 2", Tajawal, "Google Sans", "Noto Sans SC", "Helvetica Neue", Helvetica, Arial, "Hiragino Sans GB", "Microsoft YaHei", "Heiti SC", sans-serif; }/*全站字体*/ /**************************/ /* 样式统一修复与重置 */ /**************************/ body pre, body code { font-family: "Cascadia Code", "Ubuntu Mono", "Menlo", "Consolas", "Monaco", "Noto Mono", "Nimbus Mono L", monospace; } .color-display { display: inline-block; width: 1em; height: 1em; border-radius: 2px; vertical-align: middle; } .color-display.wide { width: 2.5em; } /**************************/ /* 顶部导航栏 */ /**************************/ body > #mw-content-container { margin-top: 4%; } /* 导航栏背景颜色 */ #cosmos-banner { background-color: #111032; } /* 图标颜色:无填充,只改描边 */ .cosmos-bannerOption-icon { fill: none; stroke: #41A5EE; } /* 旁边小箭头颜色 */ .cosmos-bannerOption-dropdownIcon { stroke: #39B54A; fill: #39B54A; } /* 旁边小箭头颜色 hover */ .cosmos-bannerOption:hover .cosmos-bannerOption-dropdownIcon { fill: #39B54A; stroke: #39B54A; } /* 图标颜色hover */ .cosmos-bannerOption:hover .cosmos-bannerOption-icon { stroke: #ffffff !important; } /* 搜索框文本和下划线颜色 */ #searchInput { color: #41A5EE !important; border-bottom: 2px solid #41A5EE; } /* 搜索框下划线颜色 */ #searchInput:enabled { border-bottom: 2px solid #41A5EE; } input[type="search"]::-webkit-input-placeholder { /* WebKit browsers */ color: #41A5EE !important; } input[type="search"]:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ color: #41A5EE !important; } input[type="search"]::-moz-placeholder { /* Mozilla Firefox 19+ */ color: #41A5EE !important; } input[type="search"]:-ms-input-placeholder { /* Internet Explorer 10+ */ color: #41A5EE !important; }/*搜索框文本颜色*/ #cosmos-search-buttonContainer:hover #cosmos-search-buttonIcon { stroke: #ffffff !important; }/*搜索框放大镜hover颜色*/ .cosmos-userButton-label { color: #41A5EE; }/*用户名颜色*/ .cosmos-userOptions-personalTools:hover .cosmos-userButton-label { color: #ffffff; }/*用户名颜色hover*/ #cosmos-actionsList-list a:hover { background-color: transparent; } /* Echo */ .oo-ui-popupWidget-head { overflow: hidden; /*去除滚动条*/ } /* 表格展开和折叠文字 */ .mw-collapsible-text { text-shadow: 1px 1px #000000bd; } /**************************/ /* 主页面 */ /**************************/ body { background-image: url(/w/images/0/0e/BackgroundImage.jpg); background-repeat: no-repeat; background-size: cover; background-attachment: fixed; }/*网站背景*/ body pre { background-color: rgba(17,17,17,0.91); color: #ffffff; border: 1px solid #cccccc; overflow: auto; padding: 12px; word-break: break-all; line-height: normal; font-family: monospace; font-size: 16px; } #cosmos-actionsList-list { background-color: #292929; border-color: #888888; color: #e6e6e6; border-bottom: none !important; } .cosmos-header { background-color: #111111; } .cosmos-header__sitename a:-webkit-any-link { color: #ffffff; font-size: 1.1em; }/*VoiceWiki的字体属性*/ .cosmos-header .wds-tabs .wds-tabs__tab-label a { color: #ffffff; } .cosmos-header .wds-tabs .wds-tabs__tab:hover .wds-tabs__tab-label a { color: #ffffff; } .cosmos-header::before{ background: #1d1d1f; background-image: #1d1d1f; } .cosmos-header .cosmos-header__counter { color: #ffffff; } .cosmos-header .wds-dropdown__content .wds-list.wds-is-linked li:hover > a:not(.wds-button) { background-color: rgba(0,108,176,0.1); color: #1d1d1f; } /**************************/ .mw-body h1.firstHeading{ border-bottom: none !important; color:#ffffff; } body h1 { border-bottom: none !important; color:#27d1f4; } #mw-content-text h2 { color: #27d1f4; padding-bottom: 2px !important; border: 0em; margin-top: 0em; margin-bottom: 0.5em; } #mw-content-text h2::after { content: " "; width: 100%; height: 6px; display: block; background-color: #ffef00; clip-path: polygon(0 0, 0 100%, 12% 100%, calc(12% + 8px) 1px, 100% 1px, 100% 0); margin-top: 0.2em; } #mw-content-text h3 { border: 0em; margin-top: 0em; margin-bottom: 0.5em; border-bottom: none !important; color:#27d1f4; } /* 目录标题 */ #mw-toc-heading { border-bottom: 0px !important; } #mw-toc-heading::after { display:none !important; } .mw-body h4 { color: #27d1f4 ; } .mw-body h5 { color: #27d1f4 ; } /**************************/ #mw-content .toctitle h2 { font-size: 20px; background-image: none !important; font-weight: 900; }/*目录的目录二字*/ .toc { background-color: transparent; border: 1px solid yellow; display: table; margin: 1em 0; max-width: 300px; padding: 10px; border-radius: 10px; }/*目录*/ #mw-content .toggleSymbol, .toctogglelabel { color: #FFF039; }/*目录编辑*/ .tocnumber { color: #27d1f4; font-family: "JetBrains Mono", monospace; } body #mw-content-text { color: #ffffff !important; }/*普通文本*/ #mw-content { background-color: rgba(17,17,17,0.91); border: 0 !important; } #mw-content a:not(.new){ color: #FFF039; }/*普通超链接*/ .mw-warning { background-color: #1d1d1f;} #filetoc { background-color: #1d1d1f;} .cosmos-button-primary { color: #000000; background-color: #27d1f4; stroke: #000000; stroke-width: 2px; } .cosmos-button.cosmos-button-secondary { color: #ffffff; stroke: #ffffff; stroke-width: 2px; } #cosmos-footer { background-color: rgba(17,17,17,0.91);} .cosmos-footerLinks-list { color: #ffffff;} .cosmos-footerLinks-list li a { color: #FFF039; } .cosmos-articleContainer{ color: #ffffff; } }/*监视列表*/ } .mw-rcfilters-ui-changesListWrapperWidget .mw-changeslist-legend { background-color: darkgray;}/*监视列表*/ table.mw-datatable{ color:#ffffff;} .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button { background-color: transparent; border-color: #447ff5;} #pagehistory li.selected { color: #27d1f4;} .mw-plusminus-pos { color: #00c100; } .mw-plusminus-neg { color: #e10000; } /* 注释 */ ol.references li:target, sup.reference:target { background-color: #eaf3ff69; } /* 搜索页面 */ .mw-search-profile-tabs { background-color: #444; margin-top: 1em; border: 1px solid #666; border-radius: 2px; } li.gallerybox div.thumb { border: 1px solid #c8ccd1; background-color: #202122; } /* 上传文件图片格子的背景 */ /**************************/ /* SM2的播放按钮 */ /**************************/ a.sm2_button, a.sm2_button.sm2_paused:hover { position: relative; display: inline-block; background-color: #ffef00; background-image: url(data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMTAyNCAxMDI0IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjFlbSIgaGVpZ2h0PSIxZW0iPjxwYXRoIGQ9Ik05MTIuNzI0ODg0IDQyOS4zNTU2ODFMMjA4Ljc5NzU0NSAxMy4xOTg2MzhDMTUxLjYwMzQ0OS0yMC41OTc4NzQgNjQuMDEyNDkgMTIuMTk4NzQxIDY0LjAxMjQ5IDk1Ljc5MDExMlY5MjcuOTA0MjE5YzAgNzQuOTkyMjU5IDgxLjM5MTU5OSAxMjAuMTg3NTk0IDE0NC43ODUwNTUgODIuNTkxNDc1bDcwMy45MjczMzktNDE1Ljk1NzA2NGM2Mi43OTM1MTgtMzYuOTk2MTgxIDYyLjk5MzQ5OC0xMjguMTg2NzY4IDAtMTY1LjE4Mjk0OXoiIHAtaWQ9IjEzODQiPjwvcGF0aD48L3N2Zz4=); background-repeat: no-repeat; background-size: 40% 40%; background-position: 55% 50%; height: 3rem; width: 3rem; border-radius: 50%; margin: 2px 4px 2px 0px; } a.sm2_button:hover, a.sm2_button.sm2_playing, a.sm2_button.sm2_playing:hover { background-color: #d9cb00; } a.sm2_button.sm2_paused, a.sm2_button.sm2_paused:hover { background-color: #aca753; } /**************************/ /* 编辑界面 */ /**************************/ .mw-editform #wpTextbox1 { background-color: #1d1d1f; color: #ffffff; overflow: auto; } div.editOptions { padding: 1.25em 1.75em; border: solid #ffffff; border-width: 0 1px 0.2em; background: #1d1d1f; color: #ffffff; } .editOptions p { color: #ffffff; } .editOptions .oo-ui-fieldLayout-body .oo-ui-labelElement-label { color: #27d1f4; } #catlinks{ background-color:#1d1d1f; } /*其他*/ table.mw-enhanced-rc th, table.mw-enhanced-rc td { color: #ffffff; }/*监视列表*/ #pagehistory li.selected { background-color: transparent;} .oo-ui-fieldLayout-header { color: #ffffff;} .oo-ui-panelLayout-padded.oo-ui-panelLayout-framed { background-color: transparent;} .diff-context { color: #ffffff;} html .thumbcaption { color: #1d1d1f;} /***********/ /*datatable*/ /***********/ .mw-datatable td { background-color: #1d1d1f; color: deepskyblue; }/*数据库表格*/ .mw-datatable th { background-color: transparent; }/*数据库表头*/ .mw-datatable tr:hover td { background-color: transparent; }/*文件hover*/ .oo-ui-labelElement { color: rgb(57,181,74) !important; } .oo-ui-labelElement .oo-ui-labelElement-label{ color: dodgerblue;} /* 黑幕模板配合CSS */ /* 把这几行单独拎出来写,否则会被Firefox合并到“.heimu a”这条规则,然后又被上面的“点过外链不变色”规则override */ .heimu, .heimu rt { background-color: #FFF039; } span.heimu a.external, span.heimu a.external:visited, span.heimu a.extiw, span.heimu a.extiw:visited { color: #FFF039; } .heimu, .heimu a, a .heimu, .heimu a.new { color: #FFF039; 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: #1d1d1f; } 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; } /* 流彩英雄渐变文本 (Webkit only!) */ .text-chromatic { background-image: -webkit-gradient(linear,left top,right top,color-stop(0,#b116ec),color-stop(0.5,#ff0021),color-stop(1,#fff11e)); background-image: -webkit-linear-gradient(left,#b116ec 0%,#ff0021 50%,#fff11e 100%); background-size: 1000% 1000%; -webkit-background-clip: text; -webkit-text-fill-color: transparent; -webkit-animation: Text-Chromatic 6s linear infinite; color: #f88f25; /* Fallback color for non-webkit browsers */ white-space: nowrap; } @keyframes Text-Chromatic { 0% {background-position: 0% 50%} 50% {background-position: 100% 50%} 100% {background-position: 0% 50%} }/**/ /* 编辑器 */ .wikiEditor-ui-text .ace_scroller * { font-family: monospace; /* 修复光标错位 */ } /**************************/ /* 用户页面 */ /**************************/ .profile-on { color: #1d1d1f; } .profile-tab { font-size: smaller; } .profile-update-title { color: #27d1f4;} .wikitable{ background: dimgray; } .user-board-message-from { background-color: transparent; } .board-blast-message-form h2 { color: #27d1f4;} .blast-nav h2{ color: #27d1f4;} /**************************/ /* 全是关于MsUpload */ /**************************/ #msupload-list .green { background: silver; } #msupload-list .file { background: #1d1d1f; } #msupload-bottom { background-color: slategrey; } } ul#filetoc { text-align: center; border: 0px; background-color: transparent; } .wikitable:not([style*="background-color"]) > * > tr > td { background: content-box; } .mw-warning-with-logexcerpt { background-color: steelblue; border: none;} .wikiEditor-ui-toolbar .tabs span.tab a { color: #41A5EE !important;} /**************************/ /* 哔哩哔哩视频插入 */ /**************************/ .bilibili{ border: 0; padding: 0; width: 100%; height: 50vh; } .bilibili iframe{ border: 0; padding: 0; width: 100%; height: 100%; } /**************************/ /* 大家族模板 */ /**************************/ .sr-navbox { width: 100%; background: #111; border: 1px solid #444; } .sr-navbox-title { background: #444; padding: 10px 5px; text-align: left; } .sr-navbox-before, .sr-navbox-after { background: #333; padding: 5px; } .sr-navbox-content { width: 100%; border-collapse: separate; border-spacing: 3px; } .sr-navbox-subgroup-content { background: #111; margin: -13px; width: calc(100% + 26px); } .sr-navbox-group { padding: 10px 15px; background: #3A3A3A; #ffffff-space: nowrap; font-weight: bold; } .sr-navbox-subgroup-group { background: #2A2A2A; font-weight: bold; } .sr-navbox-list { padding: 10px; width: 100%; } .sr-navbox-list-even { background: #222; } .sr-navbox-collapsible .sr-navbox-list { padding: 0; } .sr-navbox-collapsible-content { width: 100%; background: #111; } .sr-navbox-collapsible-group { background: #3A3A3A; padding: 5px; } /**************************/ /* info类模板 */ /**************************/ .infoBox { margin: 0 auto; width: 100%; } .infoBoxTitle { margin: 3px auto; padding: 0; text-align: center; font-weight: 700; } .infoBoxIcon { display: table-cell; padding: 5px 0 5px 1.2em; vertical-align: middle; color:#14a0d3; font-size: 1.3em; } .infoBoxText { display: table-cell; padding: 0.8em 2.5em 0.8em 1em; width: 100%; text-align: center; vertical-align: middle; } .infoBoxContent { background: rgb(59 59 59 / 65%); border-radius: 7px; } .infoBoxBelow { margin: 0 auto; padding: 0; text-align: center; } /**************************/ /* 评论区 */ /**************************/ .comment-body { padding-top: 2rem; } .c-form-title { color: #fff; font-size: 1.75rem; margin-bottom: .5em; } .comments-body .c-form-button .site-button { margin: 0; padding: .25em .5em; line-height: 1.5; color: #f8ef00; border: 1px solid #f8ef00; background-color: transparent; transition: all 140ms ease-in-out; } .comments-body .c-form-button .site-button:focus, .comments-body .c-form-button .site-button:hover { background-color: #f8ef00; color: #000; } .comments-body .c-form-button .site-button + .site-button { margin-left: .25rem; } #comment { width: 100% !important; min-height: 100px; padding: .25rem .5rem; overflow: auto; color: #fff; background-color: transparent; #ffffff-space: pre; border: 1px solid #fff; outline: 0 !important; transition: border-color 140ms ease-in-out; } #comment:focus { border-color: #f8ef00; } .c-avatar img { border-radius: 50px; } .c-item { padding: 0; border-bottom: 1px solid #fff; } /* .c-item.c-layout { display: flex; flex-flow: row nowrap; } .c-item.c-layout .c-score, .c-item.c-layout .c-avatar { flex: 0 0 auto; position: static !important; } .c-item.c-layout .c-container { flex: 1 1 0; width: 0; } .c-item.c-layout .visualClear { display: none; } */ .c-item.reply { width: 90%; margin-left: 10% !important; } .c-item.full { width: 100%; } .r-message { width: 100%; } .f-message { width: 100%; } .fillet{ border-radius: 30px; display: inline-block; height: 30px; font-size: 17px; line-height: 30px; text-align: center; color: #1d1d1f !important; } /***********************************/ /* 标签 */ /***********************************/ /* 类似于 Fillet,但是拥有自适应宽高和略微缩小的文字大小 */ /* 默认标签样式 */ .tag { margin-left: .5rem; display: inline-block; padding: .125em 1em; border-radius: 2em; color: #fff; font-size: .9em; font-weight: 700; /* Bold */ line-height: 1.414; background-color: #777; } /* * 各语言彩色标签,需要的话自己加。目前已有: * * fr - 法语 * es - 西班牙语 * ru - 俄语 * ko - 韩语 * ja - 日语 * de - 德语 * ar - 阿拉伯语 * it - 意大利语 */ :lang(fr) + .tag { background-color: rgb(202, 47, 143); } :lang(es) + .tag { background-color: rgb(35, 151, 37); } :lang(ru) + .tag { background-color: rgb(33, 150, 243); } :lang(ko) + .tag { background-color: rgb(5, 147, 186); } :lang(ja) + .tag { background-color: rgb(255, 0, 0); } :lang(de) + .tag { background-color: rgb(129, 99, 192); } :lang(ar) + .tag { background-color: rgb(188, 105, 83); } :lang(it) + .tag { background-color: rgb(123, 148, 8); } /**************************/ /* 播放按钮和下载按钮 */ /**************************/ .audio-player { margin-right: .5rem; } .audio-player .audio-player-button { height: 3rem; width: 3rem; text-align: center; border: 1px solid rgb(0 0 0 / 15%); background-color: #f8ef00; border-radius: 50%; transition: all 140ms ease-in-out; outline: 0; background-size: 40% 40%; background-position: 56% 50%; background-repeat: no-repeat; background-image: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMTAyNCAxMDI0IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjFlbSIgaGVpZ2h0PSIxZW0iPjxwYXRoIGQ9Ik05MTIuNzI0ODg0IDQyOS4zNTU2ODFMMjA4Ljc5NzU0NSAxMy4xOTg2MzhDMTUxLjYwMzQ0OS0yMC41OTc4NzQgNjQuMDEyNDkgMTIuMTk4NzQxIDY0LjAxMjQ5IDk1Ljc5MDExMlY5MjcuOTA0MjE5YzAgNzQuOTkyMjU5IDgxLjM5MTU5OSAxMjAuMTg3NTk0IDE0NC43ODUwNTUgODIuNTkxNDc1bDcwMy45MjczMzktNDE1Ljk1NzA2NGM2Mi43OTM1MTgtMzYuOTk2MTgxIDYyLjk5MzQ5OC0xMjguMTg2NzY4IDAtMTY1LjE4Mjk0OXoiIHAtaWQ9IjEzODQiPjwvcGF0aD48L3N2Zz4="); } .audio-player .audio-player-button:hover, .audio-player .audio-player-button:focus { background-color: #c1ba00; } .audio-player .audio-player-button.audio-player-playing { /* 暂停图标好像有点往左歪了,微调一下 */ background-position: 51% 50%; background-image: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMTAyNCAxMDI0IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjFlbSIgaGVpZ2h0PSIxZW0iPjxwYXRoIGQ9Ik0yMDIuNjA4IDBoMC41OTRxMTI5LjM4MyAwIDEyOS4zODMgMTI5LjM4MnY3NjUuMjM2cTAgMTI5LjM4Mi0xMjkuMzgzIDEyOS4zODJoLTAuNTk0cS0xMjkuMzgyIDAtMTI5LjM4Mi0xMjkuMzgyVjEyOS4zODJRNzMuMjI2IDAgMjAyLjYwOCAwek03ODQuNjI0IDBoMC41OTRROTE0LjYgMCA5MTQuNiAxMjkuMzgydjc2NS4yMzZROTE0LjYgMTAyNCA3ODUuMjE4IDEwMjRoLTAuNTk0cS0xMjkuMzgzIDAtMTI5LjM4My0xMjkuMzgyVjEyOS4zODJRNjU1LjI0MSAwIDc4NC42MjQgMHoiIHAtaWQ9IjIxMjEiPjwvcGF0aD48L3N2Zz4="); } .downloadable-audio { margin-right: .5rem; position: relative; display: inline-flex; } .downloadable-audio .audio-player { z-index: 1; position: relative; margin-right: 0; display: block; border-radius: 50%; box-shadow: 0 3px 8px rgb(0 0 0 / 15%); } .downloadable-audio .audio-player::after { content: "<>" display: block; color: #000; background-color: #e8e000; } :lang(en) .downloadable-audio .audio-player::after { content: "<DropdownMenu>"; } :lang(zh) .downloadable-audio .audio-player::after { content: "<下拉菜单>"; } .downloadable-audio .audio-player button { display: block; } .downloadable-audio .audio-player.has-audio-element::after { content: none; } .downloadable-audio .audio-player.has-audio-element + .downloadable-audio-dropdown { display: flex; } .downloadable-audio .downloadable-audio-dropdown { box-sizing: border-box; display: none; flex-flow: column nowrap; justify-content: flex-start; align-items: center; position: absolute; left: 0; top: 0; width: 100%; min-height: 100%; padding: 6px; padding-top: 0%; background-color: #e8e000; /* 与 #f8ef00 播放按钮颜色区分开一点 */ /* 设定一个非百分比的大数值 */ border-radius: 16rem; box-shadow: 0 6px 12px rgb(0 0 0 / 33%); transition: padding-top 140ms ease-out; } .downloadable-audio .download-button { box-sizing: border-box; position: relative; margin-top: 4px; padding-top: 100%; width: 100%; height: 0; border: 1px solid rgb(0 0 0 / 15%); border-radius: 50%; cursor: pointer; transition: background-color 140ms ease-in-out; } .downloadable-audio .download-button:focus-within, .downloadable-audio .download-button:hover { background-color: rgb(0 0 0 / 10%); } .downloadable-audio .download-link, .downloadable-audio .download-icon { position: absolute; display: block; top: 0; left: 0; width: 100%; height: 100%; } .downloadable-audio .download-icon { background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9Ii0xIC0xIDE4IDE4Ij48cGF0aCBkPSJNOCAxdjEwTTIgNWw2IDYgNi02TTIgMTJ2M2gxMnYtMyIgc3Ryb2tlPSJjdXJyZW50Q29sb3IiIHN0cm9rZS13aWR0aD0iMiIgZmlsbD0ibm9uZSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+PC9zdmc+"); background-repeat: no-repeat; background-size: 50%; background-position: center; } .downloadable-audio .download-link > a { display: block; color: transparent !important; width: 100%; height: 100%; outline: 0; overflow: hidden; user-select: none !important; } .downloadable-audio:focus-within, .downloadable-audio:hover { z-index: 5; } /* 在下载按钮被聚焦时保持下拉菜单张开状态? */ .downloadable-audio-dropdown:focus-within, .downloadable-audio:hover .downloadable-audio-dropdown { padding-top: 100%; } /* OverWatch Portrait */ .owportrait { position: relative; display: inline-block; } .owportrait > a { overflow: hidden; display: block; border: 3px solid #fff; border-left: 0; border-right: 0; border-radius: 10px; background-color: #777; transform: scale(0.92) skewX(-7.5deg); transition: all .14s cubic-bezier(0.33, 1, 0.68, 1); } .owportrait > a::before, .owportrait > a::after { content: " "; position: absolute; left: 0; top: 0; width: 100%; height: 100%; } .owportrait > a:hover, .owportrait > a:focus { background-color: rgb(238,120,74); transform: scale(1) skewX(-7.5deg); } .owportrait img { margin: 0 -14px; transform: skewX(7.5deg); } .owportrait-name { display: none; /* Not useful for now */ position: absolute; left: 0; bottom: 0; } /* Kingdom Rush Chart */ .kr-table { border:2px solid #FFF039; border-collapse: collapse; margin: 10px; } .kr-table th { border:1px solid #FFF039; padding: 6px 12px; background-color: rgba(0,0,0,0.5); } .kr-table td { border:1px solid #FFF039; padding: 6px 12px; } /* 守望先锋职业 */ .ow-role { display: inline-block; background-color: #f0edf2; width: auto; padding: 0px 17px; border-radius: 3px; transform: skewX(-15deg); color:black; height:30px; line-height: 30px; font-size:17px; margin-left: 8px; } /* Quote模板 */ td.Quote_Left { line-height: 0.7em; vertical-align: top; text-align: right; } td.Quote_Right { line-height: 0.1em; vertical-align: bottom; text-align: left; } td.Quote_Left, td.Quote_Right { color: #0D9BE3; font-size: 40px; font-family: "Arial Black","Times New Roman",serif; font-weight: bold; width: 0px; } /* OW2 ICON */ .ow2-portrait { position: relative; display: inline-block; } .ow2-portrait img { margin: 0 -10px; } .ow2-portrait > a::before, .ow2-portrait > a::after { content: " "; position: absolute; left: 0; top: 0; width: 100%; height: 100%; } .ow2-portrait > a { overflow: hidden; display: block; border-radius: 0.3em; border: 2px solid #b3b3b3; background: #f3f7fc; transform: scale(0.95); transition: all .14s cubic-bezier(0.33, 1, 0.68, 1); } .ow2-portrait > a:hover, .ow2-portrait > a:focus { border-radius: 0.3em; border: 2px solid #fff; background: #f3f7fc; transform: scale(1); } /* HOI FLAG ICON */ .hoi-flag { position: relative; display: inline-block; } .hoi-flag > a::before, .hoi-flag > a::after { content: " "; position: absolute; left: 0; top: 0; width: 100%; height: 100%; } .hoi-flag > a { overflow: hidden; display: block; border-radius: 0.3em; border: 2px solid transparent; transform: scale(0.90); transition: all .14s cubic-bezier(0.33, 1, 0.68, 1); } .hoi-flag > a:hover, .hoi-flag > a:focus { border-radius: 0.3em; border: 2px solid transparent; transform: scale(1); } /* 投票Style */ .ajaxpoll-id-info { display: none; } .ajaxpoll { width: 100%; background: rgb(59 59 59 / 65%); border-radius: 10px; border: 1px solid #FFF039; } .ajaxpoll .ajaxpoll-our-vote div { border: 2px solid #121215; top: -2px; left: -2px; } .ajaxpoll .ajaxpoll-answer-vote div { background: #0075ff; position: absolute; top: 0; left: 0; height: 15px; font-size: 1px; line-height: 12px; z-index: 2; border-radius: 10px; box-shadow: 0px 0px 0px 1px inset #ffffff; top: -2px; left: -2px; } .ajaxpoll .ajaxpoll-answer-vote span { position: absolute; top: 0px; left: 3%; z-index: 4; } .ajaxpoll .ajaxpoll-answer-vote { border: 2px solid #121215; width: 100%; margin-left: 0; height: 15px; font-size: 10px; position: relative; border-radius: 10px; margin: 1em 0px; box-shadow: 1px 1px 4px 0px inset #080808; background: #121215; } .ajaxpoll .ajaxpoll-ajax { background: #0075ff; padding: 4px 11px; border-radius: 0.5em; margin-bottom: 1em; } .krhero img { border: 3px solid #ffef00; border-radius: 0.4em; } /* GTA Vice City */ .gtavcp { font-family: pricedown; color: #f8a5e3; font-size: 1.3em; } .gtavcp-image img { border: 5px solid #f8a5e3; border-radius: 0.5em; margin: 0 0.5em; } .gtavcr-image img { filter: drop-shadow(1px 1px white); margin: 1em 0.5em; } .gtavcr a { font-family: pricedown; color: #5ac0ef !important; font-size: 1.3em; } /*悬浮文本*/ .hover-text { text-align: center; color: #000; font-size: 0.85em; background-color: #f8ef00; padding: 2px 5px; margin: 0px 3px; border-radius: 2px; display: none; white-space: nowrap; } .pic-hover-text:hover .hover-text{ display: initial; } .ow2-small-icon img{ border:1px solid white; display: inline-block; padding: 2px; margin:0px 3px; border-radius: 2px; } /* BS ICON */ .bs-portrait { position: relative; display: inline-block; } .bs-portrait img { margin: 0 -6px; } .bs-portrait > a::before, .bs-portrait > a::after { content: " "; position: absolute; left: 0; top: 0; width: 100%; height: 100%; } .bs-portrait > a { overflow: hidden; display: block; border-radius: 0.3em; border: 2px solid #b3b3b3; background: #f3f7fc; transform: scale(0.9); transition: all .14s cubic-bezier(0.33, 1, 0.68, 1); } .bs-portrait > a:hover, .bs-portrait > a:focus { border-radius: 0.3em; border: 2px solid #fff; background: #f3f7fc; transform: scale(1); } .bs-quality-bar { text-align: center; border-radius: 3px; padding: 0.5em 0; box-shadow: inset 0px -5px 0 rgb(0 0 0 / 15%), inset 0px 5px 0 rgb(255 255 255 / 15%); font-size: 1.2em; color: black; width: 100%; margin: 1em 0px; } .bs-pin-header { height: 40px; font-size: 17px; font-weight: 900; line-height: 40px; border: 0 none #87a4bf; color: black; box-shadow: inset 0 -6px 0 rgba(0,0,0,0.15), inset 0 6px 0 rgba(255,255,255,0.05); border-collapse: collapse; } /* 王者荣耀ICON */ .hok-hero-icon { position: relative; display: inline-block; } .hok-hero-icon > a::before, .hok-hero-icon > a::after { content: " "; position: absolute; left: 0; top: 0; width: 100%; height: 100%; } .hok-hero-icon > a { overflow: hidden; display: block; border: 2px solid #e4c289; border-radius: 10px 0 10px 0; transform: scale(0.90); transition: all .14s cubic-bezier(0.33, 1, 0.68, 1); } .hok-hero-icon > a:hover, .hok-hero-icon > a:focus { transform: scale(1); } /*小型可变色按钮*/ .audio-player-s { margin-right: .5rem; } .audio-player-s .audio-player-button-s { height: 1rem; width: 1rem; text-align: center; border: 1px solid rgb(0 0 0 / 15%); background-color: #f8ef00; border-radius: 2px; transition: all 140ms ease-in-out; outline: 0; background-size: 40% 40%; background-position: 56% 50%; background-repeat: no-repeat; background-image: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMTAyNCAxMDI0IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjFlbSIgaGVpZ2h0PSIxZW0iPjxwYXRoIGQ9Ik05MTIuNzI0ODg0IDQyOS4zNTU2ODFMMjA4Ljc5NzU0NSAxMy4xOTg2MzhDMTUxLjYwMzQ0OS0yMC41OTc4NzQgNjQuMDEyNDkgMTIuMTk4NzQxIDY0LjAxMjQ5IDk1Ljc5MDExMlY5MjcuOTA0MjE5YzAgNzQuOTkyMjU5IDgxLjM5MTU5OSAxMjAuMTg3NTk0IDE0NC43ODUwNTUgODIuNTkxNDc1bDcwMy45MjczMzktNDE1Ljk1NzA2NGM2Mi43OTM1MTgtMzYuOTk2MTgxIDYyLjk5MzQ5OC0xMjguMTg2NzY4IDAtMTY1LjE4Mjk0OXoiIHAtaWQ9IjEzODQiPjwvcGF0aD48L3N2Zz4="); } .audio-player-s .audio-player-button-s:hover, .audio-player-s .audio-player-button-s:focus { background-color: #c1ba00; } .audio-player-s .audio-player-button-s.audio-player-playing-s { /* 暂停图标好像有点往左歪了,微调一下 */ background-position: 51% 50%; background-image: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMTAyNCAxMDI0IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjFlbSIgaGVpZ2h0PSIxZW0iPjxwYXRoIGQ9Ik0yMDIuNjA4IDBoMC41OTRxMTI5LjM4MyAwIDEyOS4zODMgMTI5LjM4MnY3NjUuMjM2cTAgMTI5LjM4Mi0xMjkuMzgzIDEyOS4zODJoLTAuNTk0cS0xMjkuMzgyIDAtMTI5LjM4Mi0xMjkuMzgyVjEyOS4zODJRNzMuMjI2IDAgMjAyLjYwOCAwek03ODQuNjI0IDBoMC41OTRROTE0LjYgMCA5MTQuNiAxMjkuMzgydjc2NS4yMzZROTE0LjYgMTAyNCA3ODUuMjE4IDEwMjRoLTAuNTk0cS0xMjkuMzgzIDAtMTI5LjM4My0xMjkuMzgyVjEyOS4zODJRNjU1LjI0MSAwIDc4NC42MjQgMHoiIHAtaWQ9IjIxMjEiPjwvcGF0aD48L3N2Zz4="); } .bs-hyperCharge-nofade img { position: absolute; top: 0; left: 0; opacity: 1; } .bs-hyperCharge-fade img { position: absolute; top: 0; left: 0; opacity: 1; animation: hyperChargeFadeInOut 6s infinite; } @keyframes hyperChargeFadeInOut { 0%, 100% { opacity: 1; } 50% { opacity: 0; } } .btd6-corvus-spell { filter: brightness(10); } .homepage-gamecard { border:2px solid rgb(255 255 255 / 18%); background: #1d1d1f; display: inline-block; margin: 0px 15px 15px 15px; width: 280px; text-align: center; position: relative; height: 400px; border-radius: 4px; transition: 0.2s cubic-bezier(0, 1.1, 0.45, 0.94); } .homepage-gamecard:hover { background-color: #4262c9; box-shadow: 1px 0px 20px 0px #6ea8ff; transform: scale(1.06); } .ra2m-vo { padding: 2px 3px; background: red; border-radius: 2px; font-size: small; margin-right: 3px; color: black; } .vw-fame img { border-radius: 50%; border: 2px solid #393939; } .bs-trio img { border-radius: 50%; margin: 0px 4px; border: 2px solid #616161; } .bs-trio1 img { border-radius: 50%; margin: 0px 4px; border: 2px solid #ffef00; }