神奇宝贝百科:层叠样式表
这是神奇宝贝百科的 CSS 源代码,使用 SASS 语法并兼容标准 CSS。
使用方法见Help:层叠样式表。
修改建议请在讨论页提出。代码修改后,会自动更新到 Common.css。
文本内容
// 颜色列表设置 // 配置方法: // 每行用逗号分割,每列用空格分割 // 各列分别表示 颜色名 正常颜色值 浅色值 深色值 // 简繁不同的颜色名需要复制一行 $colorList: 红 #F11 #FF6464 #A60B0B, 紅 #F11 #FF6464 #A60B0B, 绿 #1B1 #64D364 #0B7A0B, 綠 #1B1 #64D364 #0B7A0B, 蓝 #11F #6464FF #0B0BA6, 藍 #11F #6464FF #0B0BA6, 黄 #FFD733 #FFE57A #A68C21, 皮卡丘 #FFD733 #FFE57A #A68C21, 金 #DAA520 #E7C46E #8E6B15, 银 #C0C0C0 #D6D6D6 #7D7D7D, 銀 #C0C0C0 #D6D6D6 #7D7D7D, 水晶 #4FD9FF #8CE6FF #338DA6, 红宝石 #BF0109 #B37577 #A9070E, 紅寶石 #BF0109 #B37577 #A9070E, 蓝宝石 #3862AE #779FE8 #103D8F, 藍寶石 #3862AE #779FE8 #103D8F, 绿宝石 #00A000 #59C159 #006800, 綠寶石 #00A000 #59C159 #006800, 火红 #FF7327 #FFA472 #A64B19, 火紅 #FF7327 #FFA472 #A64B19, 叶绿 #98CF12 #DAF598 #81B00F, 葉綠 #98CF12 #DAF598 #81B00F, 钻石 #7BB1F9 #B2D1FB #678BD5, 鑽石 #7BB1F9 #C8C8FB #678BD5, 珍珠 #E068A0 #f0A0D0 #D84890, 白金 #B69E00 #CFC059 #766700, 心金 #F8C838 #F8E8A8 #C87010, 魂银 #A0C0E8 #C8D8F0 #506090, 魂銀 #A0C0E8 #C8D8F0 #506090, 黑 #444 #858585 #2C2C2C, 白 #C3C3C3 #D8D8D8 #7F7F7F, 黑2 #181818 #636161 #1892CB, 白2 #CBCBCB #EEEDED #DB2818, X #025DA6 #5A96C5 #013D6C, Y #EA1A3E #F16A81 #981128, OR #AB2813 #C87365 #6F1A0C, 欧米伽红宝石 #AB2813 #C87365 #6F1A0C, 歐米加紅寶石 #AB2813 #C87365 #6F1A0C, AS #26649C #729ABF #194166, 阿尔法蓝宝石 #26649C #729ABF #194166, 阿爾法藍寶石 #26649C #729ABF #194166, 太阳 #EE993C #F5BE84 #CA7111, 太陽 #EE993C #F5BE84 #CA7111, 月亮 #7DC3E3 #B3DCEF #2C9BCE, US #FA8E00 #FBA81C #110B0D, 究极之日 #FA8E00 #FBA81C #110B0D, 究極之日 #FA8E00 #FBA81C #110B0D, UM #008CD9 #12A6DF #110B0D, 究极之月 #008CD9 #12A6DF #110B0D, 究極之月 #008CD9 #12A6DF #110B0D, LP #F5DA26 #F8E772 #9F8E19, LG皮卡丘 #F5DA26 #F8E772 #9F8E19, LE #D4924B #E3B88A #8A5F31, LG伊布 #D4924B #E3B88A #8A5F31, Sw #00A1E9 #59C2F1 #006998, SW #00A1E9 #59C2F1 #006998, 剑 #00A1E9 #59C2F1 #006998, 劍 #00A1E9 #59C2F1 #006998, Sh #BF004F #D5598C #7C0033, SH #BF004F #D5598C #7C0033, 盾 #BF004F #D5598C #7C0033, 冠之雪原 #01948A #44BB87 #004C64, 鎧之孤島 #F5D623 #FEE65E #FBB102, 铠之孤岛 #F5D623 #FEE65E #FBB102, BD #44BAE5 #85D2EE #2C7995, 晶燦鑽石 #44BAE5 #85D2EE #2C7995, 晶灿钻石 #44BAE5 #85D2EE #2C7995, SP #DA7D99 #E7ABBD #8E5163, 明亮珍珠 #DA7D99 #E7ABBD #8E5163, LA #36597B #7C93A9 #233A50, 传说阿尔宙斯 #36597B #7C93A9 #233A50, 傳說阿爾宙斯 #36597B #7C93A9 #233A50, 朱 #F8463E #FF933C #9E2A22, 紫 #9C4595 #BB45B0 #552277, 碧之假面 #299a9b #77bfbc #317448, 蓝之圆盘 #11668f #266ab4 #064261, 藍之圓盤 #11668f #266ab4 #064261, LZ #34B574 #FAD6DD #1F7A6D, 传说ZA #34B574 #FAD6DD #1F7A6D, 傳說ZA #34B574 #FAD6DD #1F7A6D, 赤救 #C50C50 #D85C8A #840836, 青救 #095baf #5a91c9 #063d75, XD #604e82 #978cae #3e3355, COLO #b6cae4 #cfdced #768394, 时探 #2190c7 #6ab5d9 #166185, 時探 #2190c7 #6ab5d9 #166185, 暗探 #c3141b #d76166 #830d12, 空探 #7bb54f #a6cd89 #527935, 极大之门 #0872F9 #7EE0FD #003D94, 極大之門 #0872F9 #7EE0FD #003D94, 巡护员 #F7681A #FA9D6A #A14411, 巡護員 #F7681A #FA9D6A #A14411, DeP #F7D909 #FBE972 #66370A, 一般 #BBBBAA #E7E7D8 #8A8A7B, 火 #FF4422 #FF927D #BA1F00, 水 #3399FF #77BBFF #0D6AC8, 草 #77CC55 #BDFFA3 #40C60A, 电 #FFCC33 #FAE078 #BD8E00, 電 #FFCC33 #FAE078 #BD8E00, 格斗 #BB5544 #DD9988 #912E1E, 格鬥 #BB5544 #DD9988 #912E1E, 飞行 #6699FF #99BBFF #3678FF, 飛行 #6699FF #99BBFF #3678FF, 毒 #AA5599 #C689BA #792F6A, 虫 #AABB22 #DAEC44 #849400, 蟲 #AABB22 #DAEC44 #849400, 岩石 #BBAA66 #E1D08C #88762C, 地面 #DDBB55 #F1DDA0 #B59226, 超能力 #FF5599 #FF9CC4 #D00053, 冰 #77DDFF #DBF6FF #13A8D9, 龙 #7766EE #A194FF #31229D, 龍 #7766EE #A194FF #31229D, 幽灵 #6666BB #9F9FEC #42428E, 幽靈 #6666BB #9F9FEC #42428E, 恶 #775544 #BDA396 #442C21, 惡 #775544 #BDA396 #442C21, 钢 #AAAABB #DFDFE1 #74747B, 鋼 #AAAABB #DFDFE1 #74747B, 妖精 #FFAAFF #FBCBFB #EC67EA, 未知 #68A090 #9DC1B7 #44685E, 暗影 #604E82 #978CAE #3E3355, 无色C #E5D6D0 #EEE4E0 #958B87, 無色C #E5D6D0 #EEE4E0 #958B87, 火C #E24242 #EC8484 #932B2B, 水C #5BC7E5 #94DBEE #3B8295, 草C #7DB808 #AAD15E #517805, 雷C #FAB536 #FCCE7C #A37523, 斗C #CA7121 #E09048 #A4550E, 鬥C #CA7121 #E09048 #A4550E, 超C #A65E9A #C596BD #6C3D64, 恶C #064240 #337774 #002B29, 惡C #064240 #337774 #002B29, 钢C #BCC7C3 #E7E9E9 #90A69E, 鋼C #BCC7C3 #E7E9E9 #90A69E, 龙C #D9CD57 #E4E7A2 #747343, 龍C #D9CD57 #E4E7A2 #747343, 妖C #E03A83 #EA7EAE #912555, 宝可体质C #146837 #5A9572 #0E4926, 寶可體質C #146837 #5A9572 #0E4926, 宝可力量C #850921 #A95263 #5D0617, 寶可力量C #850921 #A95263 #5D0617, 训练家卡C #FFE995 #FFFCE4 #B3A33B, 訓練家卡C #FFE995 #FFFCE4 #B3A33B, 支援者卡C #F68B00 #F5C267 #EA601F, 竞技场卡C #90E183 #B7EBAE #5E9255, 競技場卡C #90E183 #B7EBAE #5E9255, 物品卡C #1F91D8 #6BB3ED #0063C5, 道具卡C #AB74AB #D1A8C8 #6F559F, 宝可梦道具C #AB74AB #D1A8C8 #6F559F, 寶可夢道具C #AB74AB #D1A8C8 #6F559F, 彩虹C #5BC7E5 #60DCFF #37B4D6, 极光C #5BC7E5 #60DCFF #37B4D6, 極光C #5BC7E5 #60DCFF #37B4D6, 特性C #C84923 #D87F64 #8C3318, 未知C #58A090 #EEE4E0 #958B87, 怪兽E #d25064 #df8492 #933846, 怪獸E #d25064 #df8492 #933846, 人型E #d29682 #dfb5a7 #93695b, 水中1E #97b5fd #b5cbfd #697fb1, 水中3E #5876be #899ed1 #3d5285, 虫E #aac22a #c3d469 #77881d, 蟲E #aac22a #c3d469 #77881d, 矿物E #7a6252 #a19085 #554439, 礦物E #7a6252 #a19085 #554439, 飞行E #b29afa #c8b8fb #7c6caf, 飛行E #b29afa #c8b8fb #7c6caf, 不定形E #8a8a8a #acacac #606060, 陆上E #d0c068 #d9d295 #9d8649, 陸上E #d0c068 #d9d295 #9d8649, 水中2E #729afa #9cb8fb #506caf, 妖精E #ffc8f0 #ffd8f4 #b38ca8, 百变怪E #a664bf #c092d2 #744686, 百變怪E #a664bf #c092d2 #744686, 植物E #82d25a #a7df8b #5b933f, 龙E #7a42ff #a17aff #552eb3, 龍E #7a42ff #a17aff #552eb3, 未发现E #333333 #6f6f6f #232323, 未發現E #333333 #6f6f6f #232323, 性别不明E #0080c0 #4ca5d2 #005986, 性別不明E #0080c0 #4ca5d2 #005986, 物理 #FF4400 #EE7700 #CC2200, 特殊 #2266CC #7799DD #0033AA, 变化 #999999 #ACACAC #666655, 變化 #999999 #ACACAC #666655, 睡眠 #549CDF #FBF5DA #5D6DC0, 濒死 #DBDBDB #FBF5DB #707070, 瀕死 #DBDBDB #FBF5DB #707070, 昏厥 #DBDBDB #FBF5DB #707070, 华丽大赛 #e090a8 #EBB7C6 #925E6D, 華麗大賽 #e090a8 #EBB7C6 #925E6D, 聪明 #9BCE13 #B8C964 #83A51D, 聰明 #9BCE13 #B8C964 #83A51D, 美丽 #51B3DC #95EAEA #1A7FA1, 美麗 #51B3DC #95EAEA #1A7FA1, 强壮 #E7B43D #F5CC61 #B27F09, 強壯 #E7B43D #F5CC61 #B27F09, 帅气 #BD3A29 #EF755D #9E2918, 帥氣 #BD3A29 #EF755D #9E2918, 可爱 #E67091 #EDA9A9 #A4737B, 可愛 #E67091 #EDA9A9 #A4737B, HP #8AC654 #97C87A #558936, 攻击 #F8CB3C #FAE192 #CCBC33, 攻擊 #F8CB3C #FAE192 #CCBC33, 防御 #D98837 #FBB977 #B4673D, 防禦 #D98837 #FBB977 #B4673D, 特攻 #59C3D0 #A2D4DA #1A7E8D, 特防 #5890CD #89A9CD #004689, 速度 #A456D0 #C39CD8 #3C2957, 辣 #F08030 #F5AC78 #9C531F, 酸 #FFCC33 #FAE078 #A1871F, 涩 #6890F0 #9DB7F5 #445E9C, 澀 #6890F0 #9DB7F5 #445E9C, 苦 #78C850 #A7DB8D #4E8234, 甜 #FF5599 #FA92B2 #A13959, 回避 #AE58F8 #D099FF #542B77, 迴避 #AE58F8 #D099FF #542B77, 命中 #58F8F6 #AEFFFE #2A6F6E, 关都 #CF4376 #EA89AD #B3255A, 關都 #CF4376 #EA89AD #B3255A, 城都 #E5C94A #FAE340 #C5A20E, 丰缘 #0EBE2D #18DD39 #0B831F, 豐緣 #0EBE2D #18DD39 #0B831F, 神奥 #2995CF #52A6D3 #0A79B3, 神奧 #2995CF #52A6D3 #0A79B3, 合众 #F0A39B #F4C0BB #D6847B, 合眾 #F0A39B #F4C0BB #D6847B, 卡洛斯 #D6D8D8 #E1E6E6 #8E9193, 阿罗拉 #5AC8FA #8AD8FB #21A4E1, 阿羅拉 #5AC8FA #8AD8FB #21A4E1, 伽勒尔 #AC379E #C97DC0 #702467, 伽勒爾 #AC379E #C97DC0 #702467, 洗翠 #007E66 #38B48B #013224, 帕底亚 #D45455 #E39091 #8A3737, 帕底亞 #D45455 #E39091 #8A3737, 七之岛 #52cc91 #8debbc #2b915e, 七之島 #52cc91 #8debbc #2b915e, 橘子 #FF7F00 #FFAC59 #A65300, 杰可罗拉 #2292E7 #5CBFEA #105CAF, 杰可羅拉 #2292E7 #5CBFEA #105CAF, 菲蕾 #F7681A #FA9D6A #A14411, 菲雷 #F7681A #FA9D6A #A14411, 欧雷 #817548 #ada588 #544c2f, 歐雷 #817548 #ada588 #544c2f, 阿尔米亚 #2D4B98 #768ABC #1D3163, 阿爾米亞 #2D4B98 #768ABC #1D3163, 奥卜利比亚 #2CB8E9 #76D1F1 #1D7898, 奧卜利比亞 #2CB8E9 #76D1F1 #1D7898, 乱世 #F0AF40 #F8DE7E #E08A1E, 亂世 #F0AF40 #F8DE7E #E08A1E, 宝可梦卡牌岛 #FFE955 #FFFCE4 #b3a33b, 寶可夢卡牌島 #FFE955 #FFFCE4 #b3a33b, 坚铁 #9B9B9B #CDCDCD #6B6B6B, 堅鐵 #9B9B9B #CDCDCD #6B6B6B, 陆地 #75C977 #A2E0A3 #4AA14D, 陸地 #75C977 #A2E0A3 #4AA14D, 森林 #3A822D #71AD64 #34612D, 雾 #B5ADC7 #CAC1DE #9E98AD, 霧 #B5ADC7 #CAC1DE #9E98AD, 湿地 #7792BD #BDA595 #3D6633, 溼地 #7792BD #BDA595 #3D6633, 濕地 #7792BD #BDA595 #3D6633, 灰尘 #9C8583 #B8A09E #856765, 灰塵 #9C8583 #B8A09E #856765, 遗迹 #BFB895 #EBE5CA #9E9773, 遺跡 #BFB895 #EBE5CA #9E9773, 沙地 #D6BD7C #DBCFA0 #B59B59, 湖泊 #66BDCC #85D4DE #538FBD, 海洋 #485CC2 #5A98F5 #1E3F94, 水下 #6053AD #737AC7 #553894, 洞窟 #CC8F66 #E0B192 #A66A42, 山峰 #B8907D #D4B5A7 #7A5443, 火山 #D20000 #D23434 #A30000, 雪地 #DCEBEF #E1EFF2 #BBCDD1, 空间 #222 #555 #000, 空間 #222 #555 #000, 破格 #5A65DB #CC8562 #2622A8, 破碎 #5A65DB #CC8562 #2622A8, 阴影 #472E63 #604E82 #1A0A2C, 陰影 #472E63 #604E82 #1A0A2C, 建筑 #A8B9BD #C3D8DE #8A9CA1, 建築 #A8B9BD #C3D8DE #8A9CA1, 道路 #ABA9A4 #CFCDC7 #949391, 天空 #7CE9FD #B6F3FE #04C8EC, 宇宙 #511843 #3C488D #331139, 对战开拓区 #3FA9D0 #82C7E0 #296E87, 對戰開拓區 #3FA9D0 #82C7E0 #296E87, 开拓区 #3FA9D0 #82C7E0 #296E87, 開拓區 #3FA9D0 #82C7E0 #296E87, 塔 #D6553C #E49080 #8B3727, 工厂 #296E87 #7AB7D7 #215E7E, 工廠 #296E87 #7AB7D7 #215E7E, 轮盘 #ffc115 #FFD767 #A67E0E, 輪盤 #ffc115 #FFD767 #A67E0E, 城堡 #40ad72 #83CAA3 #2A714A, 舞台 #F87A97 #FAA8BB #A14F62, 清晨 #FFA #FFFFC8 #b3b377, 白天 #5ED0FF #96E0FF #4192b3, 黄昏 #E85800 #FFA900 #881000, 黃昏 #E85800 #FFA900 #881000, 夜晚 #003366 #597A9B #002347, 春 #B0F858 #c7fa89 #7bae3d, 夏 #78D0F8 #a0defa #5492ae, 秋 #F89058 #fab189 #ae653d, 冬 #F0D8F8 #f4e3fa #a897ae, 道具 #009ACD #6DE0FF #005069, 回复 #00D1B2 #ADF9D6 #008E9A, 回復 #00D1B2 #ADF9D6 #008E9A, 精灵球 #C88820 #E0A038 #925906, 精靈球 #C88820 #E0A038 #925906, 招式学习器 #8A48DC #D4ABFD #551C97, 招式學習器 #8A48DC #D4ABFD #551C97, 树果 #6161FD #B5B5FD #2B2BD0, 樹果 #6161FD #B5B5FD #2B2BD0, 战斗道具 #3070E0 #4880F0 #163B86, 戰鬥道具 #3070E0 #4880F0 #163B86, 战斗 #3070E0 #4880F0 #163B86, 戰鬥 #3070E0 #4880F0 #163B86, 邮件 #1890B0 #18A8D0 #1B5D68, 郵件 #1890B0 #18A8D0 #1B5D68, 重要物品 #FC3636 #FFA7A7 #AF0A0A, 球果 #F0A018 #F8C038 #A05840, Z纯晶 #A76502 #FFB744 #583700, Z純晶 #A76502 #FFB744 #583700, 洛托姆之力 #FE624B #FE9488 #D33E26, 食材 #F7E881 #FDF7CD #FBC521, 野餐 #F7E881 #FDF7CD #FBC521, 掉落物 #E77B89 #F2F2F2 #A39DAE, 宝物 #FDD052 #F6E061 #987824, 寶物 #FDD052 #F6E061 #987824, 神奇宝贝百科 #F1907B #FFE0C4 #e34234, 神奇寶貝百科 #F1907B #FFE0C4 #e34234 ; // 圆角边框 @mixin roundy($radius, $suffix) { .roundy#{$suffix} { border-radius: $radius; } .roundytl#{$suffix} { border-top-left-radius: $radius; } .roundytr#{$suffix} { border-top-right-radius: $radius; } .roundybl#{$suffix} { border-bottom-left-radius: $radius; } .roundybr#{$suffix} { border-bottom-right-radius: $radius; } .roundytop#{$suffix} { border-top-left-radius: $radius; border-top-right-radius: $radius; } .roundyright#{$suffix} { border-bottom-right-radius: $radius; border-top-right-radius: $radius; } .roundybottom#{$suffix} { border-bottom-left-radius: $radius; border-bottom-right-radius: $radius; } .roundyleft#{$suffix} { border-top-left-radius: $radius; border-bottom-left-radius: $radius; } .roundyhead#{$suffix} th:first-child { border-top-left-radius: $radius; } .roundyhead#{$suffix} th:last-child { border-top-right-radius: $radius; } } .hide { display: none; } .textblack, .textblack a { color: #000 !important; } .textwhite, .textwhite a { color: #FFF !important; } .textblack2, .textblack2 a { color: #000; } .textwhite2, .textwhite2 a { color: #FFF; } .bgwhite { background: #FFF; } // 栅格化系统 // Bootstrap v4.0.0 (https://getbootstrap.com) // Copyright 2011-2018 The Bootstrap Authors // Copyright 2011-2018 Twitter, Inc. // Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) $grid-breakpoints: ( xs: 0, sm: 540px, md: 720px, lg: 1000px, xl: 1200px ); $grid-columns: 12; $grid-gutter-width: 8px; @function breakpoint-min($name, $breakpoints: $grid-breakpoints) { $min: map-get($breakpoints, $name); @return if($min != 0, $min, null); } @function breakpoint-infix($name, $breakpoints: $grid-breakpoints) { @return if(breakpoint-min($name, $breakpoints) == null, "", "-#{$name}"); } @mixin media-breakpoint-up($name, $breakpoints: $grid-breakpoints) { $min: breakpoint-min($name, $breakpoints); @if $min { @media (min-width: $min) { @content; } } @else { @content; } } @mixin make-grid-columns($columns: $grid-columns, $gutter: $grid-gutter-width, $breakpoints: $grid-breakpoints) { %grid-column { position: relative; width: 100%; min-height: 1px; padding-right: ($gutter / 2); padding-left: ($gutter / 2); } @each $breakpoint in map-keys($breakpoints) { $infix: breakpoint-infix($breakpoint, $breakpoints); @for $i from 1 through $columns { .col#{$infix}-#{$i} { @extend %grid-column; } } .col#{$infix}, .col#{$infix}-auto { @extend %grid-column; } @include media-breakpoint-up($breakpoint, $breakpoints) { .col#{$infix} { flex-basis: 0; flex-grow: 1; max-width: 100%; } .col#{$infix}-auto { flex: 0 0 auto; width: auto; max-width: none; } @for $i from 1 through $columns { .col#{$infix}-#{$i} { @include make-col($i, $columns); } } .order#{$infix}-first { order: -1; } .order#{$infix}-last { order: $columns + 1; } @for $i from 0 through $columns { .order#{$infix}-#{$i} { order: $i; } } @for $i from 0 through ($columns - 1) { @if not ($infix == "" and $i == 0) { .offset#{$infix}-#{$i} { @include make-col-offset($i, $columns); } } } } } } @mixin make-container() { width: 100%; margin-right: auto; margin-left: auto; } @mixin make-row() { display: flex; flex-wrap: wrap; margin-right: ($grid-gutter-width / -2); margin-left: ($grid-gutter-width / -2); } @mixin make-col($size, $columns: $grid-columns) { flex: 0 0 percentage($size / $columns); max-width: percentage($size / $columns); } @mixin make-col-offset($size, $columns: $grid-columns) { $num: $size / $columns; margin-left: if($num == 0, 0, percentage($num)); } .container { @include make-container(); } .row { @include make-row(); } @include make-grid-columns(); // 响应式表格采用 flex 布局 table.container { display: flex; flex-direction: column; margin-bottom: 0 !important; flex: 1; .content & { margin: 0; } > tbody, > thead { flex: 1; display: flex; flex-direction: column; > tr { @include make-row(); > td { display: block; } } } } .container { box-sizing: border-box; *, *::before, *::after { box-sizing: inherit; } } // 细节 .bl-公, .bl-雄 { border: 3px solid #3355FF; } .bl-母, .bl-雌 { border: 3px solid #FF77DD; } // 颜色 CSS // 使用方法: // .bg-颜色名,将元素的背景设置为该颜色 // .b-颜色名,将元素的边框设置为该颜色,边框宽度默认为3像素 // .t-颜色名,将元素中文字内容(包括链接)设置为该颜色 // .bgl-颜色名 和 .bgd-颜色名 分别为该颜色的浅色和深色 // .bl-颜色名,.bd-颜色名,.tl-颜色名,.td-颜色名 同理 @each $i in $colorList { .bg-#{nth($i, 1)} { background-color: nth($i, 2) !important; } .bgl-#{nth($i, 1)} { background-color: nth($i, 3) !important; } .bgd-#{nth($i, 1)} { background-color: nth($i, 4) !important; } .b-#{nth($i, 1)} { border-color: nth($i, 2); } .bl-#{nth($i, 1)} { border-color: nth($i, 3); } .bd-#{nth($i, 1)} { border-color: nth($i, 4); } .t-#{nth($i, 1)} { &, & a { color: nth($i, 2) !important; } } .tl-#{nth($i, 1)} { &, & a { color: nth($i, 3) !important; } } .td-#{nth($i, 1)} { &, & a { color: nth($i, 4) !important; } } } // 特殊文字颜色 .ts-物理 { &, & a { color: #FFCC00 !important; } } .ts-特殊 { &, & a { color: #BBEEFF !important; } } .ts-变化, .ts-變化 { &, & a { color: #EEEEEE !important; } } .ts-夜晚 { &, & a { color: #FF9; } } .ts-湿地, .ts-濕地, .ts-溼地 { &, & a { color: #573118 !important; } } .ts-火山 { &, & a { color: #FFBC00 !important; } } .ts-破碎 { &, & a { color: #E0FAFF !important; } } .ts-宇宙 { &, & a { color: #AEE7BC !important; } } .ts-特殊, .ts-空间, .ts-空間, .ts-阴影, .ts-陰影 { @extend .textwhite; } .s-关都, .s-關都 { background: #FAA; border-color: #AFA; border-style: solid; } .s-橘子 { background: #FDA; border-color: #FB5; border-style: solid; } .s-城都 { background: #FFCB49; border-color: #DDD; border-style: solid; } .s-丰缘, .s-豐緣 { background: #F77; border-color: #99F; border-style: solid; } .s-火叶, .s-火葉 { background: #FF9359; border-color: #32FA32; border-style: solid; } .s-开拓区, .s-開拓區 { background: #7F7; border-color: #5D5; border-style: solid; } .s-神奥, .s-神奧 { background: #AAF; border-color: #FCC; border-style: solid; } .s-心魂 { background: #CEB654; border-color: #EBEBEB; border-style: solid; } .s-合众, .s-合眾 { background: #C3C3C3; border-color: #2C2C2C; border-style: solid; } .s-卡洛斯 { background: #F16A81; border-color: #5A96C5; border-style: solid; } .s-Z { background: #A1D175; border-color: #6FB82B; border-style: solid; } .s-阿羅拉, .s-阿罗拉 {background: #8AD8FB; border-color: #5AC8FA; border-style: solid; } .s-伽勒爾, .s-伽勒尔 {background: #C97DC0; border-color: #AC379E; border-style: solid; } .s-SS, .s-旅途 {background: #0090CA; border-color: #005CA7; border-style: solid; } .s-洗翠 {background: #38B48B; border-color: #013224; border-style: solid; } .s-帕底亞, .s-帕底亚 { background: #E39091; border-color: #D45455; border-style: solid; } .s-地平线, .s-地平線 { background: #58A0D8; border-color: #E37277; border-style: solid; } // 字体 body, div#content h1, div#content h2, div#content #firstHeading { font-family: -apple-system, "Helvetica Neue", "Luxi Sans", "DejaVu Sans", "Hiragino Sans GB", 微软雅黑, "Microsoft YaHei", 微軟正黑體, "Microsoft JhengHei", AppleGothic, "WenQuanYi Micro Hei", STHeiti, Meiryo, Arial, sans-serif; } // 主页不显示标题 body.page-主页 { h1.firstHeading, #contentSub, #catlinks { @extend .hide; } } // 隐藏目录层级 .toclimit-1 .toclevel-1 ul, .toclimit-2 .toclevel-2 ul, .toclimit-3 .toclevel-3 ul, .toclimit-4 .toclevel-4 ul { @extend .hide; } // 顶部滚动公告,代码来自萌娘百科 http://zh.moegirl.org.cn/MediaWiki:Common.css #scrollDiv { width: 100%; height: 25px; line-height: 25px; overflow: hidden; } #scrollDiv ul { margin-left: 0 !important; margin-top: 0; } #scrollDiv li { height: 25px; padding-left: 0px; list-style: none; } // 代码样式 pre { white-space: pre-wrap; word-wrap: break-word; } code { border: 1px solid #ddd; padding: 1px 4px; border-radius: 2px; background-color: #f9f9f9; } // 表格hover选择器 table.hover tr:hover { background: #f5f5dc; color: #000; } // 展开按钮 .collapseButton { @extend .a-r; @extend .at-r; font-weight: normal; width: auto; font-size: 85%; margin-left: 8px; } // 旧式表格样式,不建议使用 .bluetable .bg1, .blueinfobox .bg1, .lightbluebg { background: #f8f8ff; } .graytable .bg1, .grayinfobox .bg1, .lightgraybg { background: #f8f8f8; } .blueborder { border: 1px solid #88a; } .grayborder { border: 1px solid #999; } .bluetable .bg2, .blueinfobox .bg2 { background: #eef; } .bluetable .bg3, .blueinfobox .bg3 { background: #ddf; } .bluetable .bg4, .blueinfobox .bg4 { background: #ccf; } .graytable .bg2, .grayinfobox .bg2 { background: #f0f0f0; } .graytable .bg3, .grayinfobox .bg3 { background: #e1e1e1; } .graytable .bg4, .grayinfobox .bg4 { background: #d2d2d2; } .bluetable, .graytable, .blueinfobox, .grayinfobox { border-collapse: collapse; } .blueinfobox { background: #f8f8ff; } .grayinfobox { background: #f8f8f8; } .bluetable, .blueinfobox { border: 1px solid #88a; } .graytable, .grayinfobox { border: 1px solid #999; } .bluetable td, .bluetable th, .blueinfobox td, .blueinfobox th { border: 1px solid #88a; } .graytable td, .graytable th, .graytable td, .graytable th { border: 1px solid #999; } .bluetable td, .bluetable th, .graytable td, .graytable th, .blueinfobox td, .blueinfobox th, .graytable td, .graytable th { padding: 2px; } .bluetable td, .bluetable th, .blueinfobox td, .blueinfobox th { border: 1px solid #88a; } .graytable td, .graytable th, .grayinfobox td, .grayinfobox th { border: 1px solid #999; } .bluetable th { background: #ccf; } .graytable th { background: #d2d2d2; } .bluetable th:first-child, .graytable th:first-child, .blueinfobox th, .grayinfobox th { text-align: right; } .bluetable .divider, .blueinfobox .divider, .bluetable .header, .blueinfobox .header, .graytable .divider, .grayinfobox .divider, .graytable .header, .grayinfobox .header { text-align: center !important; } .bluetable .header, .bluetable .divider, .blueinfobox .header { background: #ccf; } .graytable .header, .graytable .divider, .grayinfobox .header { background: #d2d2d2; } .blueinfobox .divider { background: #eef; } .grayinfobox .divider { background: #f0f0f0; } abbr[original-title], .explain[original-title] { border-bottom: 1px dotted; cursor: help; } .hvbwenlarge:hover { border-width: 4px; } .eplist { @extend .at-c; th { @extend .textblack2; } td { @extend .bgwhite; } } .hvlist { @extend .at-c; @extend .hover; tr { @extend .bgwhite; } th { @extend .textblack2; } } .rdlist { @extend .at-c; } .table-separate { &, & table { border-collapse: separate; border-spacing: 1px; } } bdi { display: inline-block; } ul.gallery.mw-gallery-slideshow { margin: 0; } // 表格样式 .s-关都, .s-關都, .s-橘子, .s-城都, .s-丰缘, .s-豐緣, .s-火叶, .s-火葉, .s-开拓区, .s-開拓區,.s-神奥, .s-神奧, .s-心魂, .s-合众, .s-合眾, .s-卡洛斯, .s-Z, .s-阿羅拉, .s-阿罗拉, .s-伽勒爾, .s-伽勒尔, .s-旅途, .s-SS, .s-洗翠, .s-帕底亞, .s-帕底亚 { @extend .table-separate; } @each $i in $colorList { table.bg-#{nth($i, 1)}, table.bgl-#{nth($i, 1)}, table.bgd-#{nth($i, 1)} { @extend .table-separate; } } table.roundy { @extend .table-separate; } @each $radius in 10,8,15,20,24,25,30,32,48,50,60,80,96,100 { table.roundy-#{$radius} { @extend .table-separate; } } @each $i in $colorList { .b-#{nth($i, 1)}, .bl-#{nth($i, 1)}, .bd-#{nth($i, 1)} { border-width: 1px; border-style: solid; } } .s-关都, .s-關都, .s-橘子, .s-城都, .s-丰缘, .s-豐緣, .s-火叶, .s-火葉, .s-开拓区, .s-開拓區,.s-神奥, .s-神奧, .s-心魂, .s-合众, .s-合眾, .s-卡洛斯, .s-Z, .s-阿羅拉, .s-阿罗拉, .s-伽勒爾, .s-伽勒尔, .s-旅途, .s-SS, .s-洗翠, .s-帕底亞, .s-帕底亚 { border-width: 1px; } @include roundy(4px, ""); @each $radius in 10,8,15,20,24,25,30 { @include roundy(4px, "-"+$radius); } @each $radius in 4,5,6 { @include roundy(2px, "-"+$radius); } @each $radius in 32,48,50,60,80,96,100 { @include roundy(#{$radius}px, "-"+$radius); } .rdlist { tr:first-child td:first-child { border-top-left-radius: 2px; } tr:first-child td:last-child { border-top-right-radius: 2px; } } .eplist, .rdlist, .hvlist { tr:last-child td:first-child { border-bottom-left-radius: 8px; } tr:last-child td:last-child { border-bottom-right-radius: 8px; } } body.skin-vector-2022 { #siteNotice { margin: 0; div > table { background-color: transparent !important; border-color: transparent; border-radius: 0; } } .mw-sidebar { background-image: url(//media.52poke.com/wiki/e/ee/SideBarBg.png); border-radius: 5px; } } @media screen and (min-width: 721px) { // Desktop 专用样式 @include roundy(10px, ""); @each $radius in 10,4,5,6,8,15,20,24,25,30 { @include roundy(#{$radius}px, "-"+$radius); } body:not(.skin-vector-2022) { // 表格样式 .s-关都, .s-關都, .s-橘子, .s-城都, .s-丰缘, .s-豐緣, .s-火叶, .s-火葉, .s-开拓区, .s-開拓區,.s-神奥, .s-神奧, .s-心魂, .s-合众, .s-合眾, .s-卡洛斯, .s-Z, .s-阿羅拉, .s-阿罗拉, .s-伽勒爾, .s-伽勒尔, .s-旅途, .s-SS, .s-洗翠, .s-帕底亞, .s-帕底亚 { border-width: 3px; } @each $i in $colorList { .b-#{nth($i, 1)}, .bl-#{nth($i, 1)}, .bd-#{nth($i, 1)} { border-width: 3px; } } .rdlist { tr:first-child td:first-child { border-top-left-radius: 6px; } tr:first-child td:last-child { border-top-right-radius: 6px; } } .eplist, .rdlist, .hvlist { tr:last-child td:first-child { border-bottom-left-radius: 6px; } tr:last-child td:last-child { border-bottom-right-radius: 6px; } } // 表格边框 .bw-1 { border-width: 1px; } .bw-2 { border-width: 2px; } .bw-3 { border-width: 3px; } } // 用户框 .userbox, .babelbox { float: right; border: 1px solid #999; background: #F8F8F8; width: 25%; padding: 0.25em 0.5em; margin-left: 1em; margin-bottom: 0.5em; } .userboxitem, .babelboxitem { border-radius: 60px; width: 100%; margin: 0.25em 0; th { border-radius: 60px; width: 60px; height: 60px; font-size: 18px; } td { font-size: 11px; line-height: 1.25em; padding: 4px; text-align: left; } } // 圆角表格样式 .eplist { margin: 0 auto; } .blueinfobox, .grayinfobox { float: right; clear: right; margin: 0 0 0.5em 0.5em; } } @media screen and (max-width: 720px) { #content .mw-parser-output > table:not(.container), #content .tabbertab > table:not(.container), #content .toggle-content > table:not(.container) { overflow-y: hidden; overflow-x: auto; width: 100% !important; box-sizing: border-box; display: block; > thead, > tbody, > tfoot { display: table; min-width: 100%; } > tbody { td > a:only-child, th > a:only-child { white-space: nowrap; } } } #content .mw-parser-output table.a-r { float: none; width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; } #content #bodyContent .row table:not(.hide), table table:not(.hide) { display: table; margin-top: 0; margin-bottom: 0; } #content #bodyContent table.hide { display: none; } hr { height: 1px; color: #a2a9b1; background-color: #a2a9b1; border: 0; margin: 0.2em 0; } table.hover tr:hover { background: #f5f5dc; color: #000; } #content table small { font-size: smaller; } .thumb .thumbinner { display: flex; flex-direction: column; margin: auto; max-width: fill-available; max-width: -webkit-fill-available; min-width: auto; overflow: auto; } div.tright, div.floatright, table.floatright, div.tleft, div.floatleft, table.floatleft { margin: 0.6em 0; float: unset; } div.tright > a, div.floatright > a, table.floatright > a, div.tleft > a, div.floatleft > a, table.floatleft > a { display: block; text-align: center; } .md-hide { display: none; } .md-show { display: unset; } .md-block { display: block; } .md-inline { display: inline; } .md-inline-block { display: inline-block; } .md-flex { display: flex; } .md-inline-flex { display: inline-flex; } .md-grid { display: grid; } .md-inline-grid { display: inline-grid; } .md-table { display: table; } .md-inline-table { display: inline-table; } .md-table-row { display: table-row; } .md-table-cell { display: table-cell; } .md-list-item { display: list-item; } .wikitable > caption { font-weight: bold; display: inline-block; } body.skin-vector-2022 { #p-vector-user-menu-overflow, #firstHeading .editsection, .vector-menu-heading-label { display: none; } .mw-body-header .mw-portlet-lang .vector-menu-content { left: auto; } .mw-logo { min-width: 131px; } .vector-sidebar-container { position: absolute; z-index: 100; width: 80vw; } .vector-menu-portal .vector-menu-content ul { list-style: none; margin: 0; padding-top: 0.3em; display: flex; flex-direction: row; justify-content: flex-start; flex-wrap: wrap; } .vector-menu-portal .vector-menu-content li { margin-right: 10px; margin-top: 8px; } } body.skin-vector:not(.skin-vector-2022) { #mw-head-base { margin-top: -5em; margin-left: 10em; height: 7em; } .mw-body, #mw-data-after-content { margin-left: 0; } #left-navigation { float: left; margin-left: 0; margin-top: 4.5em; margin-bottom: -2.5em; } #right-navigation { float: right; margin-top: 4.5em; } .vector-menu-dropdown .vector-menu-content { right: -1px; left: unset; } .vector-menu-tabs-legacy { float: unset; } .vector-search-box { float: unset; margin-right: 0; margin-left: 0; position: absolute; top: 2em; left: 1em; width: 13em; } .vector-search-box-inner { min-width: 5em; width: 13em; max-width: 20em; } #p-personal ul { padding-left: 0; } .mw-footer { margin-left: 0; margin-top: 0; padding: 0.75em; } #p-logo { width: 10em; height: 160px; margin-bottom: 0; } #mw-panel { position: unset; width: 100%; } #mw-panel ul { list-style: none; margin: 0; padding-top: 0.3em; display: flex; flex-direction: row; justify-content: flex-start; flex-wrap: wrap; } #mw-panel li { margin-right: 10px; margin-top: 8px; } .toc { width: unset; } } } // 对齐 #content { .valign-middle, .valign-center, .va-m, .va-c { vertical-align:middle; } .valign-top, .va-t { vertical-align:top; } .valign-bottom, .va-b { vertical-align:bottom; } .align-middle, .align-center, .a-m, .a-c { margin: 0 auto; } .align-left, .a-l { float:left; } .align-right, .a-r { float:right; } .fulltable { width: 100%; box-sizing: border-box; } } // 特殊样式框 .type-box-6 { display: inline-block; font-size: 11px; min-width: 50px; text-align: center; box-sizing: border-box; height: 18px; border-radius: 9px; border: 1px solid #656557; box-shadow: 0 0 1px 1px #fff inset; line-height: 16px; text-shadow: 0 0 2px #656565; &, & a { color: #fff !important; text-decoration: none !important; } } // 文字对齐 .alignt-middle, .alignt-center, .at-m, .at-c { text-align:center; } .alignt-left, .at-l { text-align:left; } .alignt-right, .at-r { text-align:right; } // 缩略图圆角 div.thumbinner, li.gallerybox div.thumb { border-radius: 10px; } div.thumbinner img { border-radius: 6px; } // Typelink模板属性图标 .sprite-type, .sprite-category { display: inline-block; height: 20px; width: 20px; background: url(//media.52poke.com/wiki/8/87/MST_SV.webp) no-repeat; vertical-align: middle; background-size: 20px 420px; } .sprite-type-一般 { background-position: 0 0; } .sprite-type-格斗, .sprite-type-格鬥 { background-position: 0 -20px; } .sprite-type-飞行, .sprite-type-飛行 { background-position: 0 -40px; } .sprite-type-毒 { background-position: 0 -60px; } .sprite-type-地面 { background-position: 0 -80px; } .sprite-type-岩石 { background-position: 0 -100px; } .sprite-type-虫, .sprite-type-蟲 { background-position: 0 -120px; } .sprite-type-幽灵, .sprite-type-幽靈 { background-position: 0 -140px; } .sprite-type-钢, .sprite-type-鋼 { background-position: 0 -160px; } .sprite-type-火 { background-position: 0 -180px; } .sprite-type-水 { background-position: 0 -200px; } .sprite-type-草 { background-position: 0 -220px; } .sprite-type-电, .sprite-type-電 { background-position: 0 -240px; } .sprite-type-超能力 { background-position: 0 -260px; } .sprite-type-冰 { background-position: 0 -280px; } .sprite-type-龙, .sprite-type-龍 { background-position: 0 -300px; } .sprite-type-恶, .sprite-type-惡 { background-position: 0 -320px; } .sprite-type-妖精 { background-position: 0 -340px; } .sprite-category-物理 { background-position: 0 -360px; } .sprite-category-特殊 { background-position: 0 -380px; } .sprite-category-变化, .sprite-category-變化 { background-position: 0 -400px; }