第1行: |
第1行: |
− | #重定向 [[MediaWiki:Common.css]] | + | @import url('https://fonts.googleapis.com/css?family=Montserrat'); /* 因使用顺序优先加载 */ |
| + | @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://cdn.bootcdn.net/ajax/libs/font-awesome/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; |
| + | } |
| + | |
| + | /* 暂时隐藏需要处理但还未处理的 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 使用顺序: |
| + | Montserrat -> Latin |
| + | Tajawal -> Latin + Arabic |
| + | Jura -> 经测试 Jura 并不包含希腊字母字形 |
| + | */ |
| + | body * { |
| + | font-family: Montserrat, Tajawal, "Google Sans", "Noto Sans SC", "PingFang 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: 5.5rem; |
| + | } |
| + | |
| + | /* 导航栏背景颜色 */ |
| + | #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; /*去除滚动条*/ |
| + | } |
| + | |
| + | /**************************/ |
| + | /* 主页面 */ |
| + | /**************************/ |
| + | 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: 25pt; |
| + | }/*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; |
| + | } |
| + | body h2 { |
| + | color: #27d1f4; |
| + | padding-bottom: 2px !important; |
| + | border-bottom: 1px solid #ffef00 !important; |
| + | /*background-image: url(/w/images/b/bd/Underline_yellow.svg); |
| + | background-repeat: no-repeat; |
| + | background-position: 0 105%; |
| + | background-size: 100% 10px; |
| + | -webkit-background-size:100% 10px;*/ |
| + | margin-top: 0.5em; |
| + | margin-bottom: 0.7em; |
| + | } |
| + | #mw-toc-heading { |
| + | border-bottom: 0px !important; |
| + | } |
| + | body h3 { |
| + | border-bottom: none !important; |
| + | color:#27d1f4; |
| + | } |
| + | .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 { |
| + | background-image: none,url(/w/images/a/ad/AudioPlay.svg); |
| + | background-size: 40px; |
| + | background-repeat: no-repeat; |
| + | background-position: center; |
| + | width: 40px; |
| + | height: 40px; |
| + | border-radius: 40px; |
| + | } |
| + | |
| + | /**************************/ |
| + | /* 编辑界面 */ |
| + | /**************************/ |
| + | |
| + | .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 - 阿拉伯语 |
| + | */ |
| + | :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); } |
| + | |
| + | /**************************/ |
| + | /* 播放按钮和下载按钮 */ |
| + | /**************************/ |
| + | |
| + | .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; |
| + | } |