404
+QWQ 迷路了~
+网络的尽头 虚无之地
+[飞回母星](https://justpureh2o.cn/)
+ + +diff --git a/404.html b/404.html new file mode 100644 index 0000000000..30219f4180 --- /dev/null +++ b/404.html @@ -0,0 +1,4195 @@ + + +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +JustPureH2O
+ + +深水里摸大鱼
+ +JustPureH2O
+ + +深水里摸大鱼
+ +JustPureH2O
+ + +深水里摸大鱼
+ +JustPureH2O
+ + +深水里摸大鱼
+ +JustPureH2O
+ + +深水里摸大鱼
+ +JustPureH2O
+ + +深水里摸大鱼
+ ++ 1 / 2 +
+ + +JustPureH2O
+ + +深水里摸大鱼
+ ++ 2 / 2 +
+ +JustPureH2O
+ + +深水里摸大鱼
+ +JustPureH2O
+ + +深水里摸大鱼
+ +JustPureH2O
+ + +深水里摸大鱼
+ +JustPureH2O
+ + +深水里摸大鱼
+ +JustPureH2O
+ + +深水里摸大鱼
+ +JustPureH2O
+ + +深水里摸大鱼
+ +本文转载自:【F444 +の 光荣历史•其二】人物传记·FRC +作者:Lucas2011
+曾就读于东辰「教学8班·行政11班」与我同班(两个都是哦),是我初中阶段最好的朋友。现就读于七林9班,在高中数学竞赛的道路上越走越远。喜好有Minecraft、原和一些神奇的卡牌游戏。有批判性思维,不从众,但是对自己的观点有强烈的自信,不拿出证据证明他是错的的话他绝对不会善罢甘休(但是在学校里证据真的很难找awa)。特别喜欢讲故事,经常编一些东西以假乱真,甚至到了剩下的5个人异口同声的问他“真的吗?”这种地步。
+FRC又知名为天皇陛下,冯进村等等(反正都是从“日本天皇”衍生出来的)。那么这个外号是从哪里来的呢?据传说(主要大家基本都快忘了,经过讨论认定了这个最终版本),一次中午回寝,大家在激烈的讨论历史课上刚刚讲的日本明治维新相关的内容,FRC为了让大家认真的听他的观点,就说“我是天皇陛下…”,于是这个外号就传开了。四舍五入这个外号是他自己取的
相信不用我多说了,能进七林九班的都不是什么善茬。但是我还是附上一次8年级(大概)的月考成绩图:
+∆天皇稳居第一,高第二名十多分
+除了学习,其实我更想说的是他的批判性思维。这一点可能和其他寝室不同,我们寝室常常谈论一些时政内容或者类似的需要表达自己的观点并证明的内容。在这样的环境下,小蝴蝶、我、天皇和其他公民(ffy经常偷听我们聊天但是不说话,sbffy)都能有一套自己的论证思路并相互交融,我不认为这对逻辑思维能力的发展没有帮助。
+分成两个部分吧,原和Minecraft。
+应该是初三下学期才入的坑,算比较晚的。他入坑在我看来应该是被逼无奈,实在和他的好朋友们没有共同话题才入的坑。但是他入坑后特别肝,现在应该55级了吧(思考)
+由于他B我官(他B服,我官服,我们两个之间已经隔了一道厚障壁力(悲),所以基本没怎么联过机,但是后来他朋友送了他一个官服号,就和我玩过一两次(主要O是养成类游戏,那个号上什么也没有)。
+他狂热地厨纳西妲,所以就在这里放两张纳西妲的游戏截图吧(太随性了awa):
+∆这个应该是他草神的面板(翻了10分钟聊天记录才找到qwq
+自从我认识他(在军训的时候)他就玩mc,还记得当时我们因为2个木板合成几个木棍而吵架(他说“两个木板合成两个木棍”,我说是4个,事后他便获得了“cloud +player”这个称号,不过现在已经没什么人喊了)。
+和他在信息技术课上(常规课和社团课)玩过1.12匠魂,1.18原版和空岛,1.18.2匠魂等等(甚至为了这个去学了C++并考了校队,走上一条OI不归路
+他记忆力很好,所有模组相关的合成表我都直接问他,像什么《匠魂宝典》都是他读,读完了就把有用的属性提炼出来给我说。
+当然,我主要负责生电和指令嘛(撅嘴
+下面是一些游戏截图:
+∆这些都是匠魂的存档,空岛的没怎么截图
+由于天皇现在在七林扫荡,找不到他人,所以这个部分先咕掉(*≧ω≦)
+当然,天皇是不会被放过的(早柚音
+这个部分应该是最精彩的部分(确信
++
天皇为什么叫天皇我也不知道,开始他看起来比较可爱但后面就越来越猥琐,有着非常智慧的大脑,比较喜欢理性分析问题,然后感性处理问题(指看心情),好玩做事比较冲动喜欢玄学,求知欲旺,又不的问题,一定会细心请教不是不擅长运动比较懒惰,口才很好喜欢讲故事,有点贪睡眠质量良好呼噜声特别大特别情况下被刺激会暴怒。
++
冯氏、本名瑞辰。传闻天地初开之时,天下五分,雷占其四而天皇独占其一,是为一人之下,万人之上矣。遂有天皇之名(语出《sl经典语录》)数学之王(官方限定)在数学方面卓有天赋。为人和善。初极狭,才通人。口才极佳,善于讲故事。京中有善口技者,为寝室建设作出卓越贡献,但会在晚上使用声波武器,对寝室成员们进行精神攻击0.o
+
+
+
+
+
+
++这个事件后面会讲(应该
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
++不可避免的偏题了qwq
+
总之感觉就是比我nb但是心术大不正(离谱 +的那种学神
++
++话题莫名其妙的回来了awa
+
+
天皇陛下,不知道为什么,每次看到他抱着自己家的柴犬的照片时,总有一种兄弟情深的感觉。
+感觉他严肃正经起来很有学霸的气息,但是一旦下了课,我总能在校围栏旁的草丛附近发现他的身影。
+尤其喜爱捉某些昆虫(指蝴蝶),采摘水果(指东辰的桃子和杏),能夹,yin叫起来比大部分人(除开胡睿杰)更像女的。
+自从他脸上受伤留下一道光荣印记以来,他的笑容比之前猥琐了指数倍。
+但是对于他的智力,无可置疑的是他确实实力无限,他和那些闷头整天坐在教室里学习的娃的最大区别就是:他深谙劳逸结合的重要性,平时也会和同学打成一片,尤其喜欢叫外号,据个人无数据的不完全统计——他最钟爱的外号包括guozhen、sb飞飞鱼、小蝴蝶、草绿等。
++
++不知道怎么请到的神奇人物
+
就看起来傻不拉叽,但十分聪明的一个人。奇奇怪怪,但很喜欢作为上课的气氛担当。就是说至于用书签削学校的转基因农作物,抓些小虫养在教室这种行为,我的评价是👍。讲真的,聪明人还是聪明人,还是有亿点离谱的。
+ + +在此记录我个人对博客的一些个性化改造
+本博客使用的Volantis(版本 6.0.0 alpha +1)改造版主题已Fork原主题:
+ +对视差滚动插件
在这里查看本网站的Banner信息
+添加了常用OJ网站(洛谷、AcWing)的题目难度标签CSS,现在可以直接通过span
标签显示:
洛谷风格
+以上均为整活
span
标签:
1 | <!-- 题目难度评级 --> |
对应CSS:
+1 | .lfe_caption { |
AcWing风格
+span
标签:
1 | <span class="label label-success round">简单</span> |
对应CSS:
+1 | .round { |
1 |
|
1 |
|
1 |
|
1 |
|
1 |
|
1 |
|
想象你在一个绝版手办售卖会上。这里的每种手办由于需要保证它的稀有程度,活动主办方提前向卖家商议了一个计策:即保证每种老婆
+手办有且只能有一个。这样他们就可以开出天价
+(但要保证在物价局划定的价格上限内) (爆long
+long也没问题!)。那么作为一个资深 御宅
+手办收藏家的你,自然不会错过这次难得的机会,你出门时偷偷拿走了麻麻の钱包,发现里面有
1 |
|
但是最后还是被麻麻发现力(悲
+这种问题类似于西方魔幻小说里的情节:一位勇士无意间闯进了古代君王的藏宝阁,受金钱和权力的蛊惑。看着地上不尽的金币与皇冠,他拿出了一个麻袋。他想要在麻袋规定的最大容量内装尽可能最大价值的物品,超出规定容量,这个袋子很可能破掉,导致财宝落入山谷、沼泽等任何危险的地方。这位勇士十分谨慎,他不希望总重量超过额定重量,那么他能装的最大物品价值是多少?
+1 |
|
然而我们的勇士痴迷于装入财宝,忽视了高悬在他头顶的致命机关,随着绳子断裂,我们的勇士就此葬身于这个隐蔽的藏宝阁中,带不走任何一枚金币。因此我们的最大价值应该是
+因此我们应该拒绝这种来历不明的诱惑,青少年反诈,从我做起!
++《竞赛班传奇》 第一部,第一幕
+人物:“和蔼可亲滴”福建籍物理竞赛教练 +茂华;“偷奸耍滑的”山东老家OIer +国祯;“热心尽职喜欢让同学们多多预习物理知识的”物理课代表曹牧
+茂华上场,开玩笑的语气说
+茂华: 电荷量滴单位是~库 +仑,符号C(写下一个大C),艹!
+全班哄笑,国祯猥琐的笑,茂华眉头一蹙,表情严肃,严肃语气
+茂华: +国祯!还在那里笑,曹牧,检查一下国祯有没有记笔记!
+曹牧起身走向国祯,其他人目光盯着曹牧,国祯将物理书翻开,指着笔记处,曹牧低头查看,然后抬头
+曹牧: 他写了,但是……
+严肃的,急速的,愤怒之极的,气震寰宇的,振聋发聩的,势如破竹的,响彻云霄的,如雷贯耳的,不共戴天的,耳机党爆炸的,外放党社死的
+茂华: 站起来!没写笔记!
+国祯吓一跳,乖乖站起,曹牧缓缓退回,众人起哄国祯,茂华声音略小
+茂华: +在这里偷奸耍滑是会被刷出去滴。到时候你竞赛搞不好,高考也考滴西撇,看你到时候怎么办!
+国祯: (解释的语气)我没有偷奸耍滑!
+茂华语气有所缓和
+茂华: 那你把这道题解出来,你就可以坐下了
+
题面: 给定
国祯小嘴一撇,这还不简单?他立马拿起了一支0.5mm的黑色签字笔在草稿纸上飞速演算。得益于他积累了一坤年的OI知识,2分钟后,在众人惊异的目光中,国祯自信满满地拿出了写有正确答案的草稿纸。他将右手伸得十分用力,好像要把草稿纸怼到茂华脸上一样,他的嘴角浮现出一抹byd笑容。
+只见茂华呆立原地,嘴巴微张,如同按下了暂停键。3秒钟的寂静过后,下课铃如同国祯的战鼓一般敲响,宣告这次对决以国祯的大比分取胜而落下帷幕。茂华直立的双腿尴尬的向门口转去,颤抖的双唇之间轻飘飘冒出了两个字:“下课”。随后咬紧嘴唇,一步一步踱向门外。
+国祯如获新生。在众人崇拜和惊诧的目光中,他迷失了自我,他快步走向一体机,熟练地打开希沃白板,好像已经练习过成千上万遍似的,将一句话加粗写在了白板上:
+++通常情况下,多重背包的思路是将一堆A物品拆分成n个A物品,每个物品只能使用一次,便可转化为01背包问题
+
他不管大家是否了解01背包的含义,他此刻只想在众人面前分享打败茂华的喜悦感,以及打败茂华所需要的知识,这又何尝不是一种爱屋及乌的思想呢?
+第二天,当上午的物理课准时来到,茂华却没有准时跨进教室的门。通常情况下,他每次课前都会提前2分钟来到教室里对同学进行题目过关。
+1分钟后,茂华挟着几本不合身份的普及组信息竞赛导论及考纲,昂首阔步地走进了一班教室。他大声说着:“通常情况下。这是国祯同学昨天下课后给你们上的课里的一句原话!”
+原来茂华前一天下课后并没有跑回办公室又哭又闹大发牢骚,而是现场网购了信息竞赛教程,准备在第二天的物理课上给国祯单独上节课:学生是永远无法击败老师滴!
他打开了浏览器,输入一行神秘的IP地址,按下回车,一个界面清爽的网站跳了出来。顶端用紫色的大写字母写着MHOI四个大字。
+“牛逼吧,这是我连夜赶工自创的网站,”他笑着打开了题目列表中的第一道题,标题:
+国祯接招
+。国祯轻蔑地瞥了一眼,题干还是昨天那样,一模一样,“看好了国祯,”他指向下排的一行小字,“数据范围:
显然,茂华是有备而来,国祯倒吸一口冷气。手工计算绝对是行不通了,但是对于竞赛班的高思娃国祯,绝对是有两把刷子的,毕竟正如茂华所说:“偷奸耍滑耍小聪明早就被刷下去了”。
+++面对如此巨大的物品总数,一些牛逼娃想到了用二进制拆分表示物品个数的方法。尽管换汤不换药,本质还是一个01背包问题,但是经过祖先们灵魂的注入,茂华是肯定不敢把你踢出竞赛班滴。
++
假设原有10个价值为2的物品,将10分为1+2+4+3,等同于有4个不同的01物品,价值分别为12=2,22=4,42=8,32=6,即2,4,8,6
+
国祯很快在VSCode上写出了一段教科书式的、注释易懂的模板代码,这次就算是物竞数竞化竞生竞的人也可以轻易看懂了:
+1 |
|
国祯长舒一口气,这次他又获得了胜利。评测点加载了几秒。国祯定住了,#10号点出现一个大大的
国祯尴尬的转向各位同学,其他同学瞬间停止了笑容。先前还在交头接耳的同学们如同机器一般齐刷刷的转向国祯,给人一种惊悚透骨的感觉。他们异口同声张开了嘴,在茂华扭曲的笑容下,说出了让国祯后悔了一辈子的话来:
+“三年OI一场空,不开long long见祖宗!”
+混合背包,顾名思义。它混合了多种背包,实际应用中这一类问题比较有现实意义。主要思路是,将分属于各个类型背包的物品用几个条件判断语句写出来,然后分别套用各类背包的解决方案进行求解。
+1 |
|
方案是对 https://blog.skk.moe/post/improve-fcp-for-my-blog/ +的开源实现
+首屏样式, 内含 首屏基础样式、 cover、 navbar、 +首屏search、首屏暗黑模式、首屏字体 等样式, +首屏样式采用硬编码的方式写在HTML中.
+内联硬编码自动化方案 see:scripts/helpers/first-style/index.js
+异步加载样式, 除首屏样式外的其他样式, 最终生成 /css/style.css +异步加载.
+暗黑模式样式被拆分为首屏暗黑模式样式和异步暗黑模式样式,其中在 +source/css/ 文件夹下:
+_first/dark_first.styl : 包含 首屏暗黑模式样式 的 暗黑模式 CSS 变量 +和 强制覆盖样式
+_style/_plugins/_dark : 异步暗黑模式样式文件夹
+_style/_plugins/_dark/dark_async.styl : 包含 异步暗黑模式样式 的 +暗黑模式 CSS 变量
+_style/_plugins/_dark/dark_plugins.styl : 包含 异步暗黑模式样式 的 +强制覆盖样式
diff --git a/css/collapsible.css b/css/collapsible.css new file mode 100644 index 0000000000..86b64bc536 --- /dev/null +++ b/css/collapsible.css @@ -0,0 +1,60 @@ +.collapsible { + margin: 5px 0; + padding: 0 15px; + border: 1px solid #E5E5E5; + position: relative; + clear: both; + border-radius: 3px; +} + +.collapsible .collapsible-title { + background: #E5E5E5; + margin: 0 -15px; + padding: 5px 15px; + color: #353535; + font-weight: bold; + font-size: 13px; + display: block; + cursor: pointer; +} + +.collapsible .collapsible-title:before { + font-weight: bold; +} + +.collapsible.collapsed .collapsible-title:before { + content: "展开 "; +} + +.collapsible.expanded .collapsible-title:before { + content: "隐藏 "; +} + +.collapsible .collapsible-content { + padding-top: 0; + padding-bottom: 0; + margin-top: 0; + margin-bottom: 0; + -moz-transition-duration: 0.3s; + -webkit-transition-duration: 0.3s; + -o-transition-duration: 0.3s; + transition-duration: 0.3s; + -moz-transition-timing-function: ease-in-out; + -webkit-transition-timing-function: ease-in-out; + -o-transition-timing-function: ease-in-out; + transition-timing-function: ease-in-out; +} + +.collapsible.collapsed .collapsible-content { + overflow: hidden; + max-height: 0; +} + +.collapsible.expanded .collapsible-content { + max-height: 3000px; + overflow: hidden; +} + +.collapsible .collapsible-content p:first-child { + margin-top: 0 !important; +} \ No newline at end of file diff --git a/css/first.css b/css/first.css new file mode 100644 index 0000000000..64d003d4ca --- /dev/null +++ b/css/first.css @@ -0,0 +1,1842 @@ +#safearea { + display: none; +} +.post-story + .post-story { + content-visibility: auto; + contain-intrinsic-size: 10px 500px; +} +:root { + --color-site-body: #f4f4f4; + --color-site-bg: #f4f4f4; + --color-site-inner: #fff; + --color-site-footer: #666; + --color-card: #fff; + --color-text: #444; + --color-block: #f6f6f6; + --color-inlinecode: #c74f00; + --color-codeblock: #fff7ea; + --color-h1: #3a3a3a; + --color-h2: #3a3a3a; + --color-h3: #333; + --color-h4: #444; + --color-h5: #555; + --color-h6: #666; + --color-p: #444; + --color-list: #666; + --color-list-hl: #30ad91; + --color-meta: #888; + --color-read-bkg: #e0d8c8; + --color-read-post: #f8f1e2; + --color-copyright-bkg: #f5f5f5; +} +* { + box-sizing: border-box; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + outline: none; + margin: 0; + padding: 0; +} +*::-webkit-scrollbar { + height: 4px; + width: 4px; +} +*::-webkit-scrollbar-track-piece { + background: transparent; +} +*::-webkit-scrollbar-thumb { + background: #3dd9b6; + cursor: pointer; + border-radius: 2px; + -webkit-border-radius: 2px; +} +*::-webkit-scrollbar-thumb:hover { + background: #ff5722; +} +html { + color: var(--color-text); + width: 100%; + height: 100%; + font-family: HYJiangJunJ, "PingFang SC", "Microsoft YaHei", Helvetica, Arial, Menlo, Monaco, monospace, sans-serif; + font-size: 16px; +} +html >::-webkit-scrollbar { + height: 4px; + width: 4px; +} +html >::-webkit-scrollbar-track-piece { + background: transparent; +} +html >::-webkit-scrollbar-thumb { + background: #3dd9b6; + cursor: pointer; + border-radius: 2px; + -webkit-border-radius: 2px; +} +html >::-webkit-scrollbar-thumb:hover { + background: #ff5722; +} +body { + background-color: var(--color-site-body); + text-rendering: optimizelegibility; + -webkit-tap-highlight-color: rgba(0,0,0,0); + line-height: 1.6; + -webkit-text-size-adjust: 100%; + -ms-text-size-adjust: 100%; +} +body.modal-active { + overflow: hidden; +} +@media screen and (max-width: 680px) { + body.modal-active { + position: fixed; + top: 0; + right: 0; + bottom: 0; + left: 0; + } +} +a { + color: #2092ec; + cursor: pointer; + text-decoration: none; + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; +} +a:hover { + color: #ff5722; +} +a:active, +a:hover { + outline: 0; +} +ul, +ol { + padding-left: 0; +} +ul li, +ol li { + list-style: none; +} +header { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; +} +img { + border: 0; + background: none; + max-width: 100%; +} +svg:not(:root) { + overflow: hidden; +} +hr { + -moz-box-sizing: content-box; + box-sizing: content-box; + -webkit-box-sizing: content-box; + -moz-box-sizing: content-box; + height: 0; + border: 0; + border-radius: 1px; + -webkit-border-radius: 1px; + border-bottom: 1px solid rgba(68,68,68,0.1); +} +button, +input { + color: inherit; + font: inherit; + margin: 0; +} +button { + overflow: visible; + text-transform: none; + -webkit-appearance: button; + cursor: pointer; +} +@supports (backdrop-filter: blur(20px)) { + .blur { + background: rgba(255,255,255,0.9) !important; + backdrop-filter: saturate(200%) blur(20px); + } +} +.shadow { + box-shadow: 0 1px 2px 0px rgba(0,0,0,0.1); + -webkit-box-shadow: 0 1px 2px 0px rgba(0,0,0,0.1); +} +.shadow.floatable { + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; +} +.shadow.floatable:hover { + box-shadow: 0 2px 4px 0px rgba(0,0,0,0.1), 0 4px 8px 0px rgba(0,0,0,0.1), 0 8px 16px 0px rgba(0,0,0,0.1); + -webkit-box-shadow: 0 2px 4px 0px rgba(0,0,0,0.1), 0 4px 8px 0px rgba(0,0,0,0.1), 0 8px 16px 0px rgba(0,0,0,0.1); +} +#l_cover { + min-height: 64px; +} +.cover-wrapper { + top: 0; + left: 0; + max-width: 100%; + height: 100vh; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + flex-wrap: nowrap; + -webkit-flex-wrap: nowrap; + -khtml-flex-wrap: nowrap; + -moz-flex-wrap: nowrap; + -o-flex-wrap: nowrap; + -ms-flex-wrap: nowrap; + -webkit-box-direction: normal; + -moz-box-direction: normal; + -webkit-box-orient: vertical; + -moz-box-orient: vertical; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + align-items: center; + align-self: center; + align-content: center; + color: var(--color-site-inner); + padding: 0 16px; + user-select: none; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + position: relative; + overflow: hidden; + margin-bottom: -100px; +} +.cover-wrapper .cover-bg { + position: absolute; + width: 100%; + height: 100%; + background-position: center; + background-size: cover; + -webkit-background-size: cover; + -moz-background-size: cover; +} +.cover-wrapper .cover-bg.lazyload:not(.loaded) { + opacity: 0; + -webkit-opacity: 0; + -moz-opacity: 0; +} +.cover-wrapper .cover-bg.lazyload.loaded { + animation-delay: 0s; + animation-duration: 0.5s; + animation-fill-mode: forwards; + animation-timing-function: ease-out; + animation-name: fadeIn; +} +@-moz-keyframes fadeIn { + 0% { + opacity: 0; + -webkit-opacity: 0; + -moz-opacity: 0; + filter: blur(12px); + transform: scale(1.02); + -webkit-transform: scale(1.02); + -khtml-transform: scale(1.02); + -moz-transform: scale(1.02); + -o-transform: scale(1.02); + -ms-transform: scale(1.02); + } + 100% { + opacity: 1; + -webkit-opacity: 1; + -moz-opacity: 1; + } +} +@-webkit-keyframes fadeIn { + 0% { + opacity: 0; + -webkit-opacity: 0; + -moz-opacity: 0; + filter: blur(12px); + transform: scale(1.02); + -webkit-transform: scale(1.02); + -khtml-transform: scale(1.02); + -moz-transform: scale(1.02); + -o-transform: scale(1.02); + -ms-transform: scale(1.02); + } + 100% { + opacity: 1; + -webkit-opacity: 1; + -moz-opacity: 1; + } +} +@-o-keyframes fadeIn { + 0% { + opacity: 0; + -webkit-opacity: 0; + -moz-opacity: 0; + filter: blur(12px); + transform: scale(1.02); + -webkit-transform: scale(1.02); + -khtml-transform: scale(1.02); + -moz-transform: scale(1.02); + -o-transform: scale(1.02); + -ms-transform: scale(1.02); + } + 100% { + opacity: 1; + -webkit-opacity: 1; + -moz-opacity: 1; + } +} +@keyframes fadeIn { + 0% { + opacity: 0; + -webkit-opacity: 0; + -moz-opacity: 0; + filter: blur(12px); + transform: scale(1.02); + -webkit-transform: scale(1.02); + -khtml-transform: scale(1.02); + -moz-transform: scale(1.02); + -o-transform: scale(1.02); + -ms-transform: scale(1.02); + } + 100% { + opacity: 1; + -webkit-opacity: 1; + -moz-opacity: 1; + } +} +.cover-wrapper .cover-body { + z-index: 1; + position: relative; + width: 100%; + height: 100%; +} +.cover-wrapper#full { + height: calc(100vh + 100px); + padding-bottom: 100px; +} +.cover-wrapper#half { + max-height: 640px; + min-height: 400px; + height: calc(36vh - 64px + 200px); +} +.cover-wrapper #scroll-down { + width: 100%; + height: 64px; + position: absolute; + bottom: 100px; + text-align: center; + cursor: pointer; +} +.cover-wrapper #scroll-down .scroll-down-effects { + color: #fff; + font-size: 24px; + line-height: 64px; + position: absolute; + width: 24px; + left: calc(50% - 12px); + text-shadow: 0 1px 2px rgba(0,0,0,0.1); + animation: scroll-down-effect 1.5s infinite; + -webkit-animation: scroll-down-effect 1.5s infinite; + -khtml-animation: scroll-down-effect 1.5s infinite; + -moz-animation: scroll-down-effect 1.5s infinite; + -o-animation: scroll-down-effect 1.5s infinite; + -ms-animation: scroll-down-effect 1.5s infinite; +} +@-moz-keyframes scroll-down-effect { + 0% { + top: 0; + opacity: 1; + -webkit-opacity: 1; + -moz-opacity: 1; + } + 50% { + top: -16px; + opacity: 0.4; + -webkit-opacity: 0.4; + -moz-opacity: 0.4; + } + 100% { + top: 0; + opacity: 1; + -webkit-opacity: 1; + -moz-opacity: 1; + } +} +@-webkit-keyframes scroll-down-effect { + 0% { + top: 0; + opacity: 1; + -webkit-opacity: 1; + -moz-opacity: 1; + } + 50% { + top: -16px; + opacity: 0.4; + -webkit-opacity: 0.4; + -moz-opacity: 0.4; + } + 100% { + top: 0; + opacity: 1; + -webkit-opacity: 1; + -moz-opacity: 1; + } +} +@-o-keyframes scroll-down-effect { + 0% { + top: 0; + opacity: 1; + -webkit-opacity: 1; + -moz-opacity: 1; + } + 50% { + top: -16px; + opacity: 0.4; + -webkit-opacity: 0.4; + -moz-opacity: 0.4; + } + 100% { + top: 0; + opacity: 1; + -webkit-opacity: 1; + -moz-opacity: 1; + } +} +@keyframes scroll-down-effect { + 0% { + top: 0; + opacity: 1; + -webkit-opacity: 1; + -moz-opacity: 1; + } + 50% { + top: -16px; + opacity: 0.4; + -webkit-opacity: 0.4; + -moz-opacity: 0.4; + } + 100% { + top: 0; + opacity: 1; + -webkit-opacity: 1; + -moz-opacity: 1; + } +} +.cover-wrapper .cover-body { + margin-top: 64px; + margin-bottom: 100px; +} +.cover-wrapper .cover-body, +.cover-wrapper .cover-body .top, +.cover-wrapper .cover-body .bottom { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + -webkit-box-direction: normal; + -moz-box-direction: normal; + -webkit-box-orient: vertical; + -moz-box-orient: vertical; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + align-items: center; + justify-content: center; + -webkit-justify-content: center; + -khtml-justify-content: center; + -moz-justify-content: center; + -o-justify-content: center; + -ms-justify-content: center; + max-width: 100%; +} +.cover-wrapper .cover-body .bottom { + margin-top: 32px; +} +.cover-wrapper .cover-body .title { + font-family: HFSnakylines, "PingFang SC", "Microsoft YaHei", Helvetica, Arial, Helvetica, monospace; + font-size: 3.125rem; + line-height: 1.2; + text-shadow: 0 1px 2px rgba(0,0,0,0.1); +} +.cover-wrapper .cover-body .subtitle { + font-size: 20px; +} +.cover-wrapper .cover-body .logo { + max-height: 120px; + max-width: calc(100% - 4 * 16px); +} +@media screen and (min-height: 1024px) { + .cover-wrapper .cover-body .title { + font-size: 3rem; + } + .cover-wrapper .cover-body .subtitle { + font-size: 1.05rem; + } + .cover-wrapper .cover-body .logo { + max-height: 150px; + } +} +.cover-wrapper .cover-body .m_search { + position: relative; + max-width: calc(100% - 16px); + width: 320px; + vertical-align: middle; +} +.cover-wrapper .cover-body .m_search .form { + position: relative; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + width: 100%; +} +.cover-wrapper .cover-body .m_search .icon, +.cover-wrapper .cover-body .m_search .input { + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; +} +.cover-wrapper .cover-body .m_search .icon { + position: absolute; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + line-height: 2.5rem; + width: 32px; + top: 0; + left: 5px; + color: rgba(68,68,68,0.75); +} +.cover-wrapper .cover-body .m_search .input { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + height: 2.5rem; + width: 100%; + box-shadow: none; + -webkit-box-shadow: none; + box-sizing: border-box; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + font-size: 0.875rem; + -webkit-appearance: none; + padding-left: 36px; + border-radius: 1.4rem; + -webkit-border-radius: 1.4rem; + background: rgba(255,255,255,0.6); + backdrop-filter: blur(10px); + border: none; + color: var(--color-text); +} +@media screen and (max-width: 500px) { + .cover-wrapper .cover-body .m_search .input { + padding-left: 36px; + } +} +.cover-wrapper .cover-body .m_search .input:hover { + background: rgba(255,255,255,0.8); +} +.cover-wrapper .cover-body .m_search .input:focus { + background: #fff; +} +.cover-wrapper .list-h { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + -webkit-box-direction: normal; + -moz-box-direction: normal; + -webkit-box-orient: horizontal; + -moz-box-orient: horizontal; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + flex-wrap: wrap; + -webkit-flex-wrap: wrap; + -khtml-flex-wrap: wrap; + -moz-flex-wrap: wrap; + -o-flex-wrap: wrap; + -ms-flex-wrap: wrap; + align-items: stretch; + border-radius: 4px; + -webkit-border-radius: 4px; + user-select: none; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; +} +.cover-wrapper .list-h a { + -webkit-box-flex: 1; + -moz-box-flex: 1; + -webkit-flex: 1 0; + -ms-flex: 1 0; + flex: 1 0; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + font-weight: 600; +} +.cover-wrapper .list-h a img { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + border-radius: 2px; + -webkit-border-radius: 2px; + margin: 4px; + min-width: 40px; + max-width: 44px; +} +@media screen and (max-width: 768px) { + .cover-wrapper .list-h a img { + min-width: 36px; + max-width: 40px; + } +} +@media screen and (max-width: 500px) { + .cover-wrapper .list-h a img { + margin: 2px 4px; + min-width: 32px; + max-width: 36px; + } +} +@media screen and (max-width: 375px) { + .cover-wrapper .list-h a img { + min-width: 28px; + max-width: 32px; + } +} +.cover-wrapper { + max-width: 100%; +} +.cover-wrapper.search .bottom .menu { + margin-top: 16px; +} +.cover-wrapper.search .bottom .menu .list-h a { + white-space: nowrap; + -webkit-box-direction: normal; + -moz-box-direction: normal; + -webkit-box-orient: horizontal; + -moz-box-orient: horizontal; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + align-items: baseline; + padding: 2px; + margin: 4px; + color: var(--color-site-inner); + opacity: 0.75; + -webkit-opacity: 0.75; + -moz-opacity: 0.75; + text-shadow: 0 1px 2px rgba(0,0,0,0.05); + border-bottom: 2px solid transparent; +} +.cover-wrapper.search .bottom .menu .list-h a i { + margin-right: 4px; +} +.cover-wrapper.search .bottom .menu .list-h a p { + font-size: 0.9375rem; +} +.cover-wrapper.search .bottom .menu .list-h a:hover, +.cover-wrapper.search .bottom .menu .list-h a.active, +.cover-wrapper.search .bottom .menu .list-h a:active { + opacity: 1; + -webkit-opacity: 1; + -moz-opacity: 1; + border-bottom: 2px solid var(--color-site-inner); +} +.cover-wrapper.dock .menu, +.cover-wrapper.featured .menu, +.cover-wrapper.focus .menu { + border-radius: 6px; + -webkit-border-radius: 6px; +} +.cover-wrapper.dock .menu .list-h a, +.cover-wrapper.featured .menu .list-h a, +.cover-wrapper.focus .menu .list-h a { + -webkit-box-direction: normal; + -moz-box-direction: normal; + -webkit-box-orient: vertical; + -moz-box-orient: vertical; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + align-items: center; + padding: 12px; + line-height: 24px; + border-radius: 4px; + -webkit-border-radius: 4px; + border-bottom: none; + text-align: center; + align-content: flex-end; + color: rgba(68,68,68,0.7); + font-size: 1.5rem; +} +@media screen and (max-width: 500px) { + .cover-wrapper.dock .menu .list-h a, + .cover-wrapper.featured .menu .list-h a, + .cover-wrapper.focus .menu .list-h a { + padding: 12px 8px; + } +} +.cover-wrapper.dock .menu .list-h a i, +.cover-wrapper.featured .menu .list-h a i, +.cover-wrapper.focus .menu .list-h a i { + margin: 8px; +} +.cover-wrapper.dock .menu .list-h a p, +.cover-wrapper.featured .menu .list-h a p, +.cover-wrapper.focus .menu .list-h a p { + font-size: 0.875rem; +} +.cover-wrapper.dock .menu .list-h a.active, +.cover-wrapper.featured .menu .list-h a.active, +.cover-wrapper.focus .menu .list-h a.active { + background: var(--color-card); + backdrop-filter: none; +} +.cover-wrapper.dock .menu .list-h a.active i, +.cover-wrapper.featured .menu .list-h a.active i, +.cover-wrapper.focus .menu .list-h a.active i, +.cover-wrapper.dock .menu .list-h a.active i+p, +.cover-wrapper.featured .menu .list-h a.active i+p, +.cover-wrapper.focus .menu .list-h a.active i+p { + color: #3dd9b6; +} +.cover-wrapper.dock .menu .list-h a.active img+p, +.cover-wrapper.featured .menu .list-h a.active img+p, +.cover-wrapper.focus .menu .list-h a.active img+p { + color: var(--color-text); +} +.cover-wrapper.dock .menu .list-h a:hover, +.cover-wrapper.featured .menu .list-h a:hover, +.cover-wrapper.focus .menu .list-h a:hover { + background: var(--color-card); +} +.cover-wrapper.dock .top { + margin-bottom: 48px; +} +.cover-wrapper.dock .menu { + background: rgba(255,255,255,0.5); + position: absolute; + bottom: 0; + max-width: 100%; +} +.cover-wrapper.dock .menu .list-h { + flex-wrap: nowrap; + -webkit-flex-wrap: nowrap; + -khtml-flex-wrap: nowrap; + -moz-flex-wrap: nowrap; + -o-flex-wrap: nowrap; + -ms-flex-wrap: nowrap; + margin: 4px; +} +.cover-wrapper.dock .menu .list-h a+a { + margin-left: 4px; +} +@media screen and (max-width: 500px) { + .cover-wrapper.dock .menu .list-h { + overflow-x: scroll; + } + .cover-wrapper.dock .menu .list-h::-webkit-scrollbar { + height: 0; + width: 0; + } + .cover-wrapper.dock .menu .list-h::-webkit-scrollbar-track-piece { + background: transparent; + } + .cover-wrapper.dock .menu .list-h::-webkit-scrollbar-thumb { + background: #3dd9b6; + cursor: pointer; + border-radius: 0; + -webkit-border-radius: 0; + } + .cover-wrapper.dock .menu .list-h::-webkit-scrollbar-thumb:hover { + background: #ff5722; + } +} +@supports (backdrop-filter: blur(20px)) { + .cover-wrapper.dock .menu { + background: rgba(255,255,255,0.5); + backdrop-filter: saturate(200%) blur(20px); + } +} +.cover-wrapper #parallax-window { + position: absolute; + width: 100%; + height: 100%; + background: transparent; +} +.parallax-mirror { + animation-delay: 0s; + animation-duration: 0.5s; + animation-fill-mode: forwards; + animation-timing-function: ease-out; + animation-name: fadeIn; +} +@-moz-keyframes fadeIn { + 0% { + opacity: 0; + -webkit-opacity: 0; + -moz-opacity: 0; + filter: blur(12px); + } + 100% { + opacity: 1; + -webkit-opacity: 1; + -moz-opacity: 1; + } +} +@-webkit-keyframes fadeIn { + 0% { + opacity: 0; + -webkit-opacity: 0; + -moz-opacity: 0; + filter: blur(12px); + } + 100% { + opacity: 1; + -webkit-opacity: 1; + -moz-opacity: 1; + } +} +@-o-keyframes fadeIn { + 0% { + opacity: 0; + -webkit-opacity: 0; + -moz-opacity: 0; + filter: blur(12px); + } + 100% { + opacity: 1; + -webkit-opacity: 1; + -moz-opacity: 1; + } +} +@keyframes fadeIn { + 0% { + opacity: 0; + -webkit-opacity: 0; + -moz-opacity: 0; + filter: blur(12px); + } + 100% { + opacity: 1; + -webkit-opacity: 1; + -moz-opacity: 1; + } +} +@media (prefers-color-scheme: dark) { + :root { + --color-mode: 'dark'; + } + :root:not([color-scheme]) { + --color-site-body: #121212; + --color-read-bkg: #1f1f1f; + --color-read-post: #262626; + --color-site-bg: #1f1f1f; + --color-site-inner: rgba(238,238,238,0.871); + --color-site-footer: rgba(170,170,170,0.871); + --color-card: #262626; + --color-text: rgba(238,238,238,0.871); + --color-block: #434343; + --color-codeblock: #1f1f1f; + --color-inlinecode: #d56d28; + --color-h1: rgba(255,255,255,0.871); + --color-h2: rgba(255,255,255,0.871); + --color-h3: rgba(255,255,255,0.6); + --color-h4: rgba(255,255,255,0.6); + --color-h5: rgba(255,255,255,0.6); + --color-h6: rgba(255,255,255,0.6); + --color-p: rgba(217,217,217,0.871); + --color-list: rgba(217,217,217,0.871); + --color-list-hl: #63e0c4; + --color-meta: rgba(191,191,191,0.871); + --color-link: rgba(191,191,191,0.871); + --color-copyright-bkg: #21252b; + } + :root:not([color-scheme]) img { + filter: brightness(70%) !important; + } + :root:not([color-scheme]) .blur { + background: rgba(31,31,31,0.9) !important; + } + :root:not([color-scheme]) .white-box.blur { + background: rgba(38,38,38,0.9) !important; + } + :root:not([color-scheme]) .nav-main .u-search-input { + background: var(--color-card) !important; + } + :root:not([color-scheme]) #l_main .article .prev-next>a { + background: var(--color-block) !important; + } + :root:not([color-scheme]) #l_main .article .prev-next>a:hover { + background: var(--color-site-bg) !important; + } + :root:not([color-scheme]) .article blockquote { + background: var(--color-block) !important; + } + :root:not([color-scheme]) .article-title a { + color: var(--color-h1) !important; + } + :root:not([color-scheme]) details>summary { + color: var(--color-p) !important; + background: var(--color-site-bg) !important; + } + :root:not([color-scheme]) details { + border: 1px solid var(--color-site-bg) !important; + background: var(--color-site-bg) !important; + } + :root:not([color-scheme]) #u-search .modal, + :root:not([color-scheme]) #u-search .modal-header, + :root:not([color-scheme]) #u-search .modal-body { + background: var(--color-card) !important; + } + :root:not([color-scheme]) #u-search .modal-body .modal-results .result:hover { + background: var(--color-block) !important; + } + :root:not([color-scheme]) .u-search-input:hover { + background: var(--color-block) !important; + } + :root:not([color-scheme]) .u-search-input:focus { + background: var(--color-site-body) !important; + } +} +[color-scheme='dark'] { + --color-site-body: #121212; + --color-read-bkg: #1f1f1f; + --color-read-post: #262626; + --color-site-bg: #1f1f1f; + --color-site-inner: rgba(238,238,238,0.871); + --color-site-footer: rgba(170,170,170,0.871); + --color-card: #262626; + --color-text: rgba(238,238,238,0.871); + --color-block: #434343; + --color-codeblock: #1f1f1f; + --color-inlinecode: #d56d28; + --color-h1: rgba(255,255,255,0.871); + --color-h2: rgba(255,255,255,0.871); + --color-h3: rgba(255,255,255,0.6); + --color-h4: rgba(255,255,255,0.6); + --color-h5: rgba(255,255,255,0.6); + --color-h6: rgba(255,255,255,0.6); + --color-p: rgba(217,217,217,0.871); + --color-list: rgba(217,217,217,0.871); + --color-list-hl: #63e0c4; + --color-meta: rgba(191,191,191,0.871); + --color-link: rgba(191,191,191,0.871); + --color-copyright-bkg: #21252b; +} +[color-scheme='dark'] img { + filter: brightness(70%) !important; +} +[color-scheme='dark'] .blur { + background: rgba(31,31,31,0.9) !important; +} +[color-scheme='dark'] .white-box.blur { + background: rgba(38,38,38,0.9) !important; +} +[color-scheme='dark'] .nav-main .u-search-input { + background: var(--color-card) !important; +} +[color-scheme='dark'] #l_main .article .prev-next>a { + background: var(--color-block) !important; +} +[color-scheme='dark'] #l_main .article .prev-next>a:hover { + background: var(--color-site-bg) !important; +} +[color-scheme='dark'] .article blockquote { + background: var(--color-block) !important; +} +[color-scheme='dark'] .article-title a { + color: var(--color-h1) !important; +} +[color-scheme='dark'] details>summary { + color: var(--color-p) !important; + background: var(--color-site-bg) !important; +} +[color-scheme='dark'] details { + border: 1px solid var(--color-site-bg) !important; + background: var(--color-site-bg) !important; +} +[color-scheme='dark'] #u-search .modal, +[color-scheme='dark'] #u-search .modal-header, +[color-scheme='dark'] #u-search .modal-body { + background: var(--color-card) !important; +} +[color-scheme='dark'] #u-search .modal-body .modal-results .result:hover { + background: var(--color-block) !important; +} +[color-scheme='dark'] .u-search-input:hover { + background: var(--color-block) !important; +} +[color-scheme='dark'] .u-search-input:focus { + background: var(--color-site-body) !important; +} +@media screen and (max-width: 500px) { + [color-scheme='dark'] .l_header .m_search { + background: var(--color-site-bg) !important; + } +} +@font-face { + font-family: 'HYJiangJunJ'; + src: url("https://justpureh2o.cn/fonts/HYJiangJun-J.ttf"); + font-weight: 'normal'; + font-style: 'normal'; + font-display: swap; +} +@font-face { + font-family: 'HFSnakylines'; + src: url("https://justpureh2o.cn/fonts/HFSnakylines.ttf"); + font-weight: 'normal'; + font-style: 'normal'; + font-display: swap; +} +.l_header { + position: fixed; + z-index: 1000; + top: 0; + width: 100%; + height: 64px; + background: var(--color-card); + box-shadow: 0 1px 2px 0px rgba(0,0,0,0.1); + -webkit-box-shadow: 0 1px 2px 0px rgba(0,0,0,0.1); +} +.l_header.auto { + transition: opacity 0.4s ease; + -webkit-transition: opacity 0.4s ease; + -khtml-transition: opacity 0.4s ease; + -moz-transition: opacity 0.4s ease; + -o-transition: opacity 0.4s ease; + -ms-transition: opacity 0.4s ease; + visibility: hidden; +} +.l_header.auto.show { + opacity: 1 !important; + -webkit-opacity: 1 !important; + -moz-opacity: 1 !important; + visibility: visible; +} +.l_header .container { + margin-left: 16px; + margin-right: 16px; +} +.l_header #wrapper { + height: 100%; + user-select: none; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; +} +.l_header #wrapper .nav-main, +.l_header #wrapper .nav-sub { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + flex-wrap: nowrap; + -webkit-flex-wrap: nowrap; + -khtml-flex-wrap: nowrap; + -moz-flex-wrap: nowrap; + -o-flex-wrap: nowrap; + -ms-flex-wrap: nowrap; + justify-content: space-between; + -webkit-justify-content: space-between; + -khtml-justify-content: space-between; + -moz-justify-content: space-between; + -o-justify-content: space-between; + -ms-justify-content: space-between; + align-items: center; +} +.l_header #wrapper .nav-main { + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; +} +.l_header #wrapper.sub .nav-main { + transform: translateY(-64px); + -webkit-transform: translateY(-64px); + -khtml-transform: translateY(-64px); + -moz-transform: translateY(-64px); + -o-transform: translateY(-64px); + -ms-transform: translateY(-64px); +} +.l_header #wrapper .nav-sub { + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; + opacity: 0; + -webkit-opacity: 0; + -moz-opacity: 0; + height: 64px; + width: calc(100% - 2 * 16px); + position: absolute; +} +.l_header #wrapper .nav-sub ::-webkit-scrollbar { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: none; +} +@media screen and (min-width: 2048px) { + .l_header #wrapper .nav-sub { + max-width: 55vw; + margin: auto; + } +} +.l_header #wrapper.sub .nav-sub { + opacity: 1; + -webkit-opacity: 1; + -moz-opacity: 1; +} +.l_header #wrapper .title { + position: relative; + color: var(--color-text); + padding-left: 24px; + max-height: 64px; +} +.l_header #wrapper .nav-main .title { + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + flex-shrink: 0; + line-height: 64px; + padding: 0 24px; + font-size: 1.25rem; + font-family: HFSnakylines, "PingFang SC", "Microsoft YaHei", Helvetica, Arial, Helvetica, monospace; +} +.l_header #wrapper .nav-main .title img { + height: 64px; +} +.l_header .nav-sub { + max-width: 1080px; + margin: auto; +} +.l_header .nav-sub .title { + font-weight: bold; + font-family: HYJiangJunJ, "PingFang SC", "Microsoft YaHei", Helvetica, Arial, Menlo, Monaco, monospace, sans-serif; + line-height: 1.2; + max-height: 64px; + white-space: normal; + flex-shrink: 1; +} +.l_header .switcher { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: none; + line-height: 64px; + align-items: center; +} +.l_header .switcher .s-toc { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: none; +} +@media screen and (max-width: 768px) { + .l_header .switcher .s-toc { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + } +} +.l_header .switcher >li { + height: 48px; + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; + margin: 2px; +} +@media screen and (max-width: 500px) { + .l_header .switcher >li { + margin: 0 1px; + height: 48px; + } +} +.l_header .switcher >li >a { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + justify-content: center; + -webkit-justify-content: center; + -khtml-justify-content: center; + -moz-justify-content: center; + -o-justify-content: center; + -ms-justify-content: center; + align-items: center; + width: 48px; + height: 48px; + padding: 0.85em 1.1em; + border-radius: 100px; + -webkit-border-radius: 100px; + border: none; + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; + color: #3dd9b6; +} +.l_header .switcher >li >a:hover { + border: none; +} +.l_header .switcher >li >a.active, +.l_header .switcher >li >a:active { + border: none; + background: var(--color-site-bg); +} +@media screen and (max-width: 500px) { + .l_header .switcher >li >a { + width: 36px; + height: 48px; + } +} +.l_header .nav-sub .switcher { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; +} +.l_header .m_search { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + height: 64px; + width: 240px; + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; +} +@media screen and (max-width: 1024px) { + .l_header .m_search { + width: 44px; + min-width: 44px; + } + .l_header .m_search input::placeholder { + opacity: 0; + -webkit-opacity: 0; + -moz-opacity: 0; + } + .l_header .m_search:hover { + width: 240px; + } + .l_header .m_search:hover input::placeholder { + opacity: 1; + -webkit-opacity: 1; + -moz-opacity: 1; + } +} +@media screen and (min-width: 500px) { + .l_header .m_search:hover .input { + width: 100%; + } + .l_header .m_search:hover .input::placeholder { + opacity: 1; + -webkit-opacity: 1; + -moz-opacity: 1; + } +} +@media screen and (max-width: 500px) { + .l_header .m_search { + min-width: 0; + } + .l_header .m_search input::placeholder { + opacity: 1; + -webkit-opacity: 1; + -moz-opacity: 1; + } +} +.l_header .m_search .form { + position: relative; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + width: 100%; + align-items: center; +} +.l_header .m_search .icon { + position: absolute; + width: 36px; + left: 5px; + color: var(--color-meta); +} +@media screen and (max-width: 500px) { + .l_header .m_search .icon { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: none; + } +} +.l_header .m_search .input { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + padding-top: 8px; + padding-bottom: 8px; + line-height: 1.3; + width: 100%; + color: var(--color-text); + background: #fafafa; + box-shadow: none; + -webkit-box-shadow: none; + box-sizing: border-box; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + padding-left: 40px; + font-size: 0.875rem; + border-radius: 8px; + -webkit-border-radius: 8px; + border: none; + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; +} +@media screen and (min-width: 500px) { + .l_header .m_search .input:focus { + box-shadow: 0 4px 8px 0px rgba(0,0,0,0.1); + -webkit-box-shadow: 0 4px 8px 0px rgba(0,0,0,0.1); + } +} +@media screen and (max-width: 500px) { + .l_header .m_search .input { + background: var(--color-block); + padding-left: 8px; + border: none; + } + .l_header .m_search .input:hover, + .l_header .m_search .input:focus { + border: none; + } +} +@media (max-width: 500px) { + .l_header .m_search { + left: 0; + width: 0; + overflow: hidden; + position: absolute; + background: #fff; + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; + } + .l_header .m_search .input { + border-radius: 32px; + -webkit-border-radius: 32px; + margin-left: 16px; + padding-left: 16px; + } + .l_header.z_search-open .m_search { + width: 100%; + } + .l_header.z_search-open .m_search .input { + width: calc(100% - 120px); + } +} +ul.m-pc >li>a { + color: inherit; + border-bottom: 2px solid transparent; +} +ul.m-pc >li>a:active, +ul.m-pc >li>a.active { + border-bottom: 2px solid #3dd9b6; +} +ul.m-pc li:hover >ul.list-v, +ul.list-v li:hover >ul.list-v { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; +} +ul.nav-list-h { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + align-items: stretch; +} +ul.nav-list-h>li { + position: relative; + justify-content: center; + -webkit-justify-content: center; + -khtml-justify-content: center; + -moz-justify-content: center; + -o-justify-content: center; + -ms-justify-content: center; + height: 100%; + line-height: 2.4; + border-radius: 4px; + -webkit-border-radius: 4px; +} +ul.nav-list-h>li >a { + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + font-weight: 600; +} +ul.list-v { + z-index: 1; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: none; + position: absolute; + background: var(--color-card); + box-shadow: 0 2px 4px 0px rgba(0,0,0,0.08), 0 4px 8px 0px rgba(0,0,0,0.08), 0 8px 16px 0px rgba(0,0,0,0.08); + -webkit-box-shadow: 0 2px 4px 0px rgba(0,0,0,0.08), 0 4px 8px 0px rgba(0,0,0,0.08), 0 8px 16px 0px rgba(0,0,0,0.08); + margin-top: -6px; + border-radius: 4px; + -webkit-border-radius: 4px; + padding: 8px 0; +} +ul.list-v.show { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; +} +ul.list-v hr { + margin-top: 8px; + margin-bottom: 8px; +} +ul.list-v >li { + white-space: nowrap; + word-break: keep-all; +} +ul.list-v >li.header { + font-size: 0.78125rem; + font-weight: bold; + line-height: 2em; + color: var(--color-meta); + margin: 8px 16px 4px; +} +ul.list-v >li.header i { + margin-right: 8px; +} +ul.list-v >li ul { + margin-left: 0; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: none; + margin-top: -40px; +} +ul.list-v .aplayer-container { + min-height: 64px; + padding: 6px 16px; +} +ul.list-v >li>a { + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + color: var(--color-list); + font-size: 0.875rem; + font-weight: bold; + line-height: 36px; + padding: 0 20px 0 16px; + text-overflow: ellipsis; + margin: 0 4px; + border-radius: 4px; + -webkit-border-radius: 4px; +} +@media screen and (max-width: 1024px) { + ul.list-v >li>a { + line-height: 40px; + } +} +ul.list-v >li>a >i { + margin-right: 8px; +} +ul.list-v >li>a:active, +ul.list-v >li>a.active { + color: var(--color-list-hl); +} +ul.list-v >li>a:hover { + color: var(--color-list-hl); + background: var(--color-site-bg); +} +.l_header .menu >ul>li>a { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + padding: 0 8px; +} +.l_header .menu >ul>li>a >i { + margin-right: 4px; +} +.l_header ul.nav-list-h>li { + color: var(--color-list); + line-height: 64px; +} +.l_header ul.nav-list-h>li >a { + max-height: 64px; + overflow: hidden; + color: inherit; +} +.l_header ul.nav-list-h>li >a:active, +.l_header ul.nav-list-h>li >a.active { + color: #3dd9b6; +} +.l_header ul.nav-list-h>li:hover>a { + color: var(--color-list-hl); +} +.l_header ul.nav-list-h>li i.music { + animation: rotate-effect 1.5s linear infinite; + -webkit-animation: rotate-effect 1.5s linear infinite; + -khtml-animation: rotate-effect 1.5s linear infinite; + -moz-animation: rotate-effect 1.5s linear infinite; + -o-animation: rotate-effect 1.5s linear infinite; + -ms-animation: rotate-effect 1.5s linear infinite; +} +@-moz-keyframes rotate-effect { + 0% { + transform: rotate(0); + -webkit-transform: rotate(0); + -khtml-transform: rotate(0); + -moz-transform: rotate(0); + -o-transform: rotate(0); + -ms-transform: rotate(0); + } + 25% { + transform: rotate(90deg); + -webkit-transform: rotate(90deg); + -khtml-transform: rotate(90deg); + -moz-transform: rotate(90deg); + -o-transform: rotate(90deg); + -ms-transform: rotate(90deg); + } + 50% { + transform: rotate(180deg); + -webkit-transform: rotate(180deg); + -khtml-transform: rotate(180deg); + -moz-transform: rotate(180deg); + -o-transform: rotate(180deg); + -ms-transform: rotate(180deg); + } + 75% { + transform: rotate(270deg); + -webkit-transform: rotate(270deg); + -khtml-transform: rotate(270deg); + -moz-transform: rotate(270deg); + -o-transform: rotate(270deg); + -ms-transform: rotate(270deg); + } + 100% { + transform: rotate(360deg); + -webkit-transform: rotate(360deg); + -khtml-transform: rotate(360deg); + -moz-transform: rotate(360deg); + -o-transform: rotate(360deg); + -ms-transform: rotate(360deg); + } +} +@-webkit-keyframes rotate-effect { + 0% { + transform: rotate(0); + -webkit-transform: rotate(0); + -khtml-transform: rotate(0); + -moz-transform: rotate(0); + -o-transform: rotate(0); + -ms-transform: rotate(0); + } + 25% { + transform: rotate(90deg); + -webkit-transform: rotate(90deg); + -khtml-transform: rotate(90deg); + -moz-transform: rotate(90deg); + -o-transform: rotate(90deg); + -ms-transform: rotate(90deg); + } + 50% { + transform: rotate(180deg); + -webkit-transform: rotate(180deg); + -khtml-transform: rotate(180deg); + -moz-transform: rotate(180deg); + -o-transform: rotate(180deg); + -ms-transform: rotate(180deg); + } + 75% { + transform: rotate(270deg); + -webkit-transform: rotate(270deg); + -khtml-transform: rotate(270deg); + -moz-transform: rotate(270deg); + -o-transform: rotate(270deg); + -ms-transform: rotate(270deg); + } + 100% { + transform: rotate(360deg); + -webkit-transform: rotate(360deg); + -khtml-transform: rotate(360deg); + -moz-transform: rotate(360deg); + -o-transform: rotate(360deg); + -ms-transform: rotate(360deg); + } +} +@-o-keyframes rotate-effect { + 0% { + transform: rotate(0); + -webkit-transform: rotate(0); + -khtml-transform: rotate(0); + -moz-transform: rotate(0); + -o-transform: rotate(0); + -ms-transform: rotate(0); + } + 25% { + transform: rotate(90deg); + -webkit-transform: rotate(90deg); + -khtml-transform: rotate(90deg); + -moz-transform: rotate(90deg); + -o-transform: rotate(90deg); + -ms-transform: rotate(90deg); + } + 50% { + transform: rotate(180deg); + -webkit-transform: rotate(180deg); + -khtml-transform: rotate(180deg); + -moz-transform: rotate(180deg); + -o-transform: rotate(180deg); + -ms-transform: rotate(180deg); + } + 75% { + transform: rotate(270deg); + -webkit-transform: rotate(270deg); + -khtml-transform: rotate(270deg); + -moz-transform: rotate(270deg); + -o-transform: rotate(270deg); + -ms-transform: rotate(270deg); + } + 100% { + transform: rotate(360deg); + -webkit-transform: rotate(360deg); + -khtml-transform: rotate(360deg); + -moz-transform: rotate(360deg); + -o-transform: rotate(360deg); + -ms-transform: rotate(360deg); + } +} +@keyframes rotate-effect { + 0% { + transform: rotate(0); + -webkit-transform: rotate(0); + -khtml-transform: rotate(0); + -moz-transform: rotate(0); + -o-transform: rotate(0); + -ms-transform: rotate(0); + } + 25% { + transform: rotate(90deg); + -webkit-transform: rotate(90deg); + -khtml-transform: rotate(90deg); + -moz-transform: rotate(90deg); + -o-transform: rotate(90deg); + -ms-transform: rotate(90deg); + } + 50% { + transform: rotate(180deg); + -webkit-transform: rotate(180deg); + -khtml-transform: rotate(180deg); + -moz-transform: rotate(180deg); + -o-transform: rotate(180deg); + -ms-transform: rotate(180deg); + } + 75% { + transform: rotate(270deg); + -webkit-transform: rotate(270deg); + -khtml-transform: rotate(270deg); + -moz-transform: rotate(270deg); + -o-transform: rotate(270deg); + -ms-transform: rotate(270deg); + } + 100% { + transform: rotate(360deg); + -webkit-transform: rotate(360deg); + -khtml-transform: rotate(360deg); + -moz-transform: rotate(360deg); + -o-transform: rotate(360deg); + -ms-transform: rotate(360deg); + } +} +.menu-phone li ul.list-v { + right: calc(100% - 0.5 * 16px); +} +.menu-phone li ul.list-v ul { + right: calc(100% - 0.5 * 16px); +} +#wrapper { + max-width: 1080px; + margin: auto; +} +@media screen and (min-width: 2048px) { + #wrapper { + max-width: 55vw; + } +} +#wrapper .menu { + -webkit-box-flex: 1; + -moz-box-flex: 1; + -webkit-flex: 1 1; + -ms-flex: 1 1; + flex: 1 1; + margin: 0 16px 0 0; +} +#wrapper .menu .list-v ul { + left: calc(100% - 0.5 * 16px); +} +.menu-phone { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: none; + margin-top: 16px; + right: 8px; + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; +} +.menu-phone ul { + right: calc(100% - 0.5 * 16px); +} +@media screen and (max-width: 500px) { + .menu-phone { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + } +} +.l_header { + max-width: 65vw; + left: calc((100% - 65vw) * 0.5); + border-bottom-left-radius: 8px; + border-bottom-right-radius: 8px; +} +@media screen and (max-width: 2048px) { + .l_header { + max-width: 1112px; + left: calc((100% - 1112px) * 0.5); + } +} +@media screen and (max-width: 1112px) { + .l_header { + left: 0; + border-radius: 0; + -webkit-border-radius: 0; + max-width: 100%; + } +} +@media screen and (max-width: 500px) { + .l_header .container { + margin-left: 0; + margin-right: 0; + } + .l_header #wrapper .nav-main .title { + padding-left: 16px; + padding-right: 16px; + } + .l_header #wrapper .nav-sub { + width: 100%; + } + .l_header #wrapper .nav-sub .title { + overflow-y: scroll; + margin-top: 2px; + padding: 8px 16px; + } + .l_header #wrapper .switcher { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + margin-right: 8px; + } + .l_header .menu { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: none; + } +} +@media screen and (max-width: 500px) { + .list-v li { + max-width: 270px; + } +} +#u-search { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: none; + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; + padding: 60px 20px; + z-index: 1001; +} +@media screen and (max-width: 680px) { + #u-search { + padding: 0px; + } +} +@media screen and (prefers-color-scheme: dark) and (max-width: 500px) { + .l_header .m_search { + background: var(--color-site-bg) !important; + } +} diff --git a/css/style.css b/css/style.css new file mode 100644 index 0000000000..e77cae5b2f --- /dev/null +++ b/css/style.css @@ -0,0 +1,7823 @@ +#safearea { + display: block; +} +:root { + --block-hover: #ededed; + --text-p1: #222; + --text-p3: #777; + --card: #fff; +} +::-moz-selection { + background: rgba(33,150,243,0.2); +} +::selection { + background: rgba(33,150,243,0.2); +} +h1 { + font-size: 1.5rem; +} +h2 { + font-size: 1.5rem; +} +h3 { + font-size: 1.25rem; +} +h4 { + font-size: 1.125rem; +} +h5 { + font-size: 1rem; +} +h6 { + font-size: 1rem; +} +h1, +h2, +h3, +h4, +h6 { + font-weight: normal; +} +a:not([href]) { + cursor: default; +} +pre { + tab-size: 4; + -moz-tab-size: 4; + -o-tab-size: 4; + -webkit-tab-size: 4; +} +.clearfix { + zoom: 1; +} +.clearfix:before, +.clearfix:after { + content: " "; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: table; +} +.clearfix:after { + clear: both; +} +.hidden { + text-indent: -9999px; + visibility: hidden; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: none; +} +.inner { + position: relative; + width: 80%; + max-width: 710px; + margin: 0 auto; +} +.vertical { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: table-cell; + vertical-align: middle; +} +article, +aside, +details, +figcaption, +figure, +footer, +hgroup, +main, +menu, +nav, +section, +summary { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; +} +article { + overflow: hidden; +} +abbr[title] { + border-bottom: 1px dotted; +} +b, +strong { + font-weight: bold; +} +dfn { + font-style: italic; +} +h1 { + font-size: 2em; + margin: 0.67em 0; +} +mark { + background: #ff0; + color: #000; +} +small { + font-size: 80%; +} +sub, +sup { + font-size: 50%; + line-height: 1em; +} +sup { + vertical-align: text-top; +} +sub { + vertical-align: text-bottom; +} +figure { + margin: 1em 40px; +} +pre { + overflow: auto; +} +span.dot, +span.sep { + font-size: 0.9em; + margin: 0 0.2rem; +} +span.dot:before { + content: '·'; +} +span.sep:before { + content: '/'; +} +code, +kbd, +pre, +samp { + font-family: monospace, monospace; + font-size: 1em; +} +optgroup, +select, +textarea { + color: inherit /* 1 */; + font: inherit /* 2 */; + margin: 0 /* 3 */; +} +select { + text-transform: none; +} +html input[type="button"], +input[type="reset"], +input[type="submit"] { + -webkit-appearance: button /* 2 */; + cursor: pointer /* 3 */; +} +button[disabled], +html input[disabled] { + cursor: default; +} +button::-moz-focus-inner, +input::-moz-focus-inner { + border: 0; + padding: 0; +} +input[type="checkbox"], +input[type="radio"] { + box-sizing: border-box /* 1 */; + -webkit-box-sizing: border-box /* 1 */; + -moz-box-sizing: border-box /* 1 */; + padding: 0 /* 2 */; +} +input[type="number"]::-webkit-inner-spin-button, +input[type="number"]::-webkit-outer-spin-button { + height: auto; +} +input[type="search"] { + -webkit-appearance: textfield /* 1 */; + -moz-box-sizing: content-box; + -webkit-box-sizing: content-box /* 2 */; + box-sizing: content-box; + -webkit-box-sizing: content-box; + -moz-box-sizing: content-box; +} +input[type="search"]::-webkit-search-cancel-button, +input[type="search"]::-webkit-search-decoration { + -webkit-appearance: none; +} +fieldset { + border: 1px solid #c0c0c0; + margin: 0 2px; + padding: 0.35em 0.625em 0.75em; +} +legend { + border: 0 /* 1 */; + padding: 0 /* 2 */; +} +textarea { + overflow: auto; +} +optgroup { + font-weight: bold; +} +table:not([class]) { + border-collapse: collapse; + overflow: auto; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: inline-block; + max-width: 100%; + vertical-align: text-top; +} +table:not([class]) th { + background-color: #f1f1f1; +} +table:not([class]) td, +table:not([class]) th { + padding: 8px 16px; + border: 2px solid #f1f1f1; + line-height: 1.5; + font-size: 90%; +} +table:not([class]) tr { + word-break: keep-all; + background-color: #fefefe; + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; +} +table:not([class]) tr:hover { + background-color: #f1f1f1; +} +td, +th { + padding: 0; +} +@font-face { + font-family: 'JetbrainsMono'; + src: url("https://justpureh2o.cn/fonts/JetBrainsMono.ttf"); + font-weight: 'normal'; + font-style: 'normal'; + font-display: swap; +} +article#arc, +article#cat, +article#tag { + padding-top: 48px; + padding-bottom: 48px; +} +article#arc h2, +article#cat h2, +article#tag h2 { + font-weight: 600; +} +article#arc h2:first-child, +article#cat h2:first-child, +article#tag h2:first-child { + margin-top: 0; +} +article#arc { + margin-bottom: 32px; + padding-bottom: 64px; +} +article#arc .timenode:before, +article#arc .timenode:after { + margin-left: 12px; +} +article#arc .timenode .meta { + padding: 6px 0; + line-height: 1.5; + height: auto; + max-width: 100%; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + font-size: 0.9375rem; + font-weight: 500; + border-radius: 2px; + -webkit-border-radius: 2px; + color: var(--color-list); +} +article#arc .timenode .meta:before { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: none; +} +article#arc .timenode .meta:after { + margin-left: 14px; +} +article#arc .timenode .meta:hover { + color: var(--color-p); + background: var(--color-site-bg); +} +article#arc .timenode .meta time { + color: var(--color-meta); + margin-left: 34px; + margin-right: 4px; + flex-shrink: 0; + width: 60px; +} +article#arc .timenode .meta i { + line-height: 1.5; + color: #ff5722; +} +article#arc .timenode .meta i.red { + color: #fe5f58; +} +article#arc .timenode .meta i.green { + color: #3dc550; +} +article#arc .timenode .meta i.yellow { + color: #ffbd2b; +} +article#arc .timenode .meta i.blue { + color: #1bcdfc; +} +article#arc .timenode .meta i.theme { + color: #3dd9b6; +} +article#arc .timenode .meta i.accent { + color: #ff5722; +} +article#arc .timenode .meta i.orange { + color: #ff5722; +} +article#cat .all-cats a { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + padding: 8px 16px; + border-radius: 4px; + -webkit-border-radius: 4px; + color: var(--color-list); + font-size: 0.9375rem; + font-weight: 500; +} +article#cat .all-cats a:hover { + color: var(--color-list-hl); + background: var(--color-site-bg); +} +article#cat .all-cats a.child { + padding-left: 48px; +} +article#tag .all-tags { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + flex-wrap: wrap; + -webkit-flex-wrap: wrap; + -khtml-flex-wrap: wrap; + -moz-flex-wrap: wrap; + -o-flex-wrap: wrap; + -ms-flex-wrap: wrap; + align-items: flex-start; + justify-content: flex-start; + -webkit-justify-content: flex-start; + -khtml-justify-content: flex-start; + -moz-justify-content: flex-start; + -o-justify-content: flex-start; + -ms-justify-content: flex-start; + align-items: baseline; + text-align: center; +} +article#tag .all-tags ul { + margin: 0 -8px; + padding: 0; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + flex-wrap: wrap; + -webkit-flex-wrap: wrap; + -khtml-flex-wrap: wrap; + -moz-flex-wrap: wrap; + -o-flex-wrap: wrap; + -ms-flex-wrap: wrap; +} +article#tag .all-tags ul li { + list-style: none; + margin: 8px; + border-radius: 4px; + -webkit-border-radius: 4px; + overflow: hidden; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + position: relative; + font-size: 0.9375rem; +} +article#tag .all-tags ul li a { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: inline-block; + color: var(--color-list); + padding: 4px 52px 4px 16px; + background: var(--color-block); + font-weight: 500; +} +article#tag .all-tags ul li a:hover { + background: #ff5722; + color: #fff; +} +article#tag .all-tags ul li span { + color: var(--color-meta); + background: var(--color-card); + padding: 2px 8px; + border-radius: 2px; + -webkit-border-radius: 2px; + pointer-events: none; + position: absolute; + right: 2px; + top: 2px; + height: calc(100% - 4px); +} +article#tag .all-tags ul li span:before { + content: 'x'; +} +.article { + color: var(--color-p); + word-wrap: break-word; +} +.article a { + word-break: break-word; +} +.article h1.title, +.article h2.title { + left: 0; +} +.article h1.title:before, +.article h2.title:before { + content: none; +} +.article h1, +.article h2 { + padding-bottom: 0.2rem; + margin-bottom: 1rem; + border-bottom: 1px solid rgba(68,68,68,0.1); +} +.article h1 { + text-align: left; + color: var(--color-h1); + margin-top: 48px; +} +.article h2 { + text-align: left; + color: var(--color-h2); + margin-top: 48px; +} +.article h3 { + text-align: left; + color: var(--color-h3); + margin-top: 24px; +} +.article h4 { + text-align: left; + color: var(--color-h4); + margin-top: 16px; +} +.article h5 { + font-weight: bold; + color: var(--color-h5); + margin-top: 1em; +} +.article h6 { + color: var(--color-h6); + margin-top: 1em; +} +.article center, +.article center p { + text-align: center; +} +.article .aplayer { + margin: 1em 0; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: inline-block; + width: 400px; + max-width: 100%; + border-radius: 4px; + -webkit-border-radius: 4px; + color: #666; +} +.article p.small-img img, +.article div.small-img img { + width: auto; + max-width: 100%; + margin: 0; + box-shadow: none; + -webkit-box-shadow: none; +} +.article s { + color: #8e8e8e; + text-decoration-color: #8e8e8e; +} +.article p { + margin-top: 1em; + margin-bottom: 1em; + text-align: justify; + max-width: 100%; + line-height: inherit; +} +.article .subtitle h6 { + color: rgba(68,68,68,0.9); +} +.article figure figcaption span { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: inline-block; + margin-right: 5px; +} +.article blockquote { + background: var(--color-block); + border-left: 4px solid #3dd9b6; + border-radius: 4px; + -webkit-border-radius: 4px; +} +.article blockquote { + position: relative; + width: 100%; + padding: 16px; + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; +} +.article blockquote, +.article blockquote p, +.article blockquote ul, +.article blockquote ol { + text-align: left; + word-wrap: normal; + font-size: 0.9375rem; + margin-top: 0.5em; + margin-bottom: 0.5em; +} +.article blockquote footer { + padding: 0; + text-align: justify; + color: inherit; + font-style: italic; + margin: 1em 0; +} +.article blockquote footer cite { + color: var(--color-meta); + margin-left: 1em; +} +.article blockquote footer cite::before { + content: '----'; + padding: 0 0.3em; +} +.article blockquote.pullquote.right { + border-left: none; + border-right: 4px solid #3dd9b6; +} +.article blockquote.pullquote.right p { + text-align: right; +} +.article pre { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + -moz-box-sizing: border-box; + box-sizing: border-box; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + margin-top: 1em; + margin-bottom: 1em; + overflow: auto; + background: var(--color-codeblock); + font-size: 0.8125rem; + font-family: JetbrainsMono, "PingFang SC", "Microsoft YaHei", Helvetica, Arial, monospace, courier, sans-serif; + border: 1px solid #ffebcb; + padding: 16px; + border-radius: 4px; + -webkit-border-radius: 4px; +} +.article pre >code:not([class]) { + background: transparent; +} +.article div>pre { + border-radius: 4px; + -webkit-border-radius: 4px; +} +.article div>pre>code:not([class]) { + padding: 0; + margin: 0; + background: transparent; + color: rgba(68,68,68,0.9); +} +.article code { + font-family: JetbrainsMono, "PingFang SC", "Microsoft YaHei", Helvetica, Arial, monospace, courier, sans-serif; +} +.article code:not([class]) { + word-break: break-all; + color: var(--color-inlinecode); + border-radius: 2px; + -webkit-border-radius: 2px; +} +@media screen and (max-width: 500px) { + .article ul, + .article ol { + font-size: 0.875rem; + } + .article figure { + font-size: 13px; + line-height: 1.5; + } +} +.article .widget { + background: transparent; + margin: 1em 0; + box-shadow: none; + -webkit-box-shadow: none; + border-radius: 4px; + -webkit-border-radius: 4px; + cursor: auto; + background: var(--color-block); + padding: 8px 0; + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; + width: 100%; +} +.article .widget:hover { + box-shadow: none; + -webkit-box-shadow: none; +} +.article .widget:active { + box-shadow: none; + -webkit-box-shadow: none; +} +.article .widget header { + padding: 4px 0.6em; + padding-bottom: 0; +} +.article .widget header, +.article .widget header a { + color: rgba(68,68,68,0.85); +} +.article .widget.copyright, +.article .widget.qrcode { + background: none; + padding: 0; +} +.article .widget.copyright header, +.article .widget.qrcode header { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: none; +} +.article .widget.copyright .content, +.article .widget.qrcode .content { + padding: 0; +} +.article .widget.list .content, +.article .widget.related_posts .content { + padding: 0 0.6em !important; +} +.article .widget.list .content a, +.article .widget.related_posts .content a { + color: #2092ec; +} +.article .widget.list .content a:hover, +.article .widget.related_posts .content a:hover { + color: #ff5722; +} +.article .widget .content { + padding: 0 0.6em; + margin: 0; +} +.article .widget .content ul { + padding-left: 4px; + margin-left: 16px; +} +.article .widget .content ul a { + transition: all 0.1s ease; + -webkit-transition: all 0.1s ease; + -khtml-transition: all 0.1s ease; + -moz-transition: all 0.1s ease; + -o-transition: all 0.1s ease; + -ms-transition: all 0.1s ease; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: inline; + border-left: none; + padding: 0; + padding-left: 4px; + color: #2092ec; + font-weight: normal; + text-decoration: none; +} +.article .widget .content ul a:hover, +.article .widget .content ul a.active, +.article .widget .content ul a:active { + border-left: none !important; + background: none !important; +} +.article .widget .content ul a:hover { + color: #ff5722; +} +.article .widget .content .list a .name { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: inline; + color: #2092ec; +} +.article .widget .content .list a:hover .name { + color: #ff5722; +} +.article .widget.qrcode > .content { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + flex-wrap: wrap; + -webkit-flex-wrap: wrap; + -khtml-flex-wrap: wrap; + -moz-flex-wrap: wrap; + -o-flex-wrap: wrap; + -ms-flex-wrap: wrap; + align-items: center; + justify-content: center; + -webkit-justify-content: center; + -khtml-justify-content: center; + -moz-justify-content: center; + -o-justify-content: center; + -ms-justify-content: center; + padding-left: 16px; + padding-right: 16px; + margin-bottom: 4px; +} +.article .widget.qrcode > .content>.fancybox, +.article .widget.qrcode > .content>img { + margin: 0 8px; +} +.article .widget.qrcode > .content img { + margin-bottom: 4px; +} +.article .article_footer { + margin-top: 64px; +} +.article .widget-blur { + backdrop-filter: none; +} +.md .footer { + margin-top: 64px; +} +.md .footer >div { + margin-top: 1em; + margin-bottom: 1em; +} +.md .footer .header { + line-height: 1.75; + padding-bottom: 8px; + font-weight: 500; + font-size: 0.875rem; + color: var(--color-list); +} +.md .footer .header i { + margin-right: 2px; +} +.md .footer .body ul, +.md .footer .body ol { + margin-top: 0; + margin-bottom: 0; +} +.md .footer .references, +.md .footer .related_posts { + background: var(--color-block); + border-radius: 4px; + -webkit-border-radius: 4px; + padding: 16px; +} +.md .footer .references .body a { + font-size: 0.9375rem; + font-weight: 500; +} +.md .footer .related_posts .body { + margin: 4px; + overflow: hidden; + border-radius: 2px; + -webkit-border-radius: 2px; +} +.md .footer .related_posts .body .vlts-rps { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; +} +.md .footer .related_posts .body .vlts-rps .item { + flex-shrink: 0; + width: 240px; +} +.md .footer .related_posts .body .vlts-rps .item+.item { + margin-left: 16px; +} +.md .footer .related_posts .body .vlts-rps .item:hover img { + filter: ; +} +.md .footer .related_posts .body .vlts-rps img { + border-radius: 2px; + -webkit-border-radius: 2px; + width: 100%; + height: 120px; + object-fit: cover; + filter: ; +} +.md .footer .related_posts .body .vlts-rps span { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + text-align: justify; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -webkit-box; + -webkit-box-orient: vertical; + overflow: hidden; +} +.md .footer .related_posts .body .vlts-rps .title { + font-weight: 600; + -webkit-line-clamp: 1; +} +.md .footer .related_posts .body .vlts-rps .excerpt { + font-size: 0.875rem; + color: var(--color-meta); + -webkit-line-clamp: 3; +} +.md .footer .copyright blockquote p { + font-size: 0.875rem; + margin: 0.25em 0; +} +.md .footer .copyright blockquote p a { + font-weight: 500; +} +.md .footer .donate { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + margin: 0 auto; +} +.md .footer .donate .imgs { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-inline-flexbox /* TWEENER - IE 10 */; + display: -webkit-inline-flex /* NEW - Chrome */; + display: inline-flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: inline-flex; + margin: 0 auto; +} +.md .footer .donate .imgs .fancybox { + margin: 8px; +} +.md .footer .donate .imgs img { + width: 80px; +} +article .readmore { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + margin-top: 24px; + font-size: 0.875rem; +} +.copyright.license { + background: var(--color-copyright-bkg); + color: var(--color-meta); + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + font-size: 0.95rem; + line-height: 1.2; + margin: 15px -40px; + overflow: hidden; + padding: 1.25em 40px; + position: relative; + border-radius: 4px; + -webkit-border-radius: 4px; +} +.copyright.license:after { + background: url("data:image/svg+xml;charset=utf-8,%3Csvg version='1.1' id='Capa_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 367.467 367.467' style='enable-background:new 0 0 367.467 367.467;' xml:space='preserve'%3E%3Cg%3E%3Cpath d='M183.73,0.018C82.427,0.018,0,82.404,0,183.733c0,101.289,82.427,183.716,183.73,183.716 c101.315,0,183.737-82.427,183.737-183.716C367.467,82.404,285.045,0.018,183.73,0.018z M183.73,326.518 c-78.743,0-142.798-64.052-142.798-142.784c0-78.766,64.055-142.817,142.798-142.817c78.752,0,142.807,64.052,142.807,142.817 C326.536,262.466,262.481,326.518,183.73,326.518z'/%3E%3Cpath d='M244.036,217.014c-11.737,20.141-33.562,32.635-56.956,32.635c-36.329,0-65.921-29.585-65.921-65.915 c0-36.36,29.592-65.955,65.921-65.955c23.395,0,45.219,12.54,56.956,32.641l1.517,2.627h44.28l-2.658-7.129 c-7.705-20.413-21.225-37.769-39.122-50.157c-17.942-12.42-39.017-19.009-60.973-19.009c-58.981,0-106.946,48.006-106.946,106.982 c0,58.98,47.965,106.941,106.946,106.941c21.956,0,43.03-6.567,60.973-19.006c17.897-12.391,31.417-29.741,39.122-50.154 l2.658-7.133h-44.28L244.036,217.014z'/%3E%3C/g%3E%3C/svg%3E"); + content: " "; + opacity: 0.1; + -webkit-opacity: 0.1; + -moz-opacity: 0.1; + height: 180px; + right: -10px; + top: -35px; + width: 180px; + position: absolute; +} +.copyright.license a { + color: var(--color-meta); +} +.copyright.license a:hover { + color: #ff5722; +} +.copyright.license .license-title, +.copyright.license .license-meta-title { + margin: 0 0 0.25rem; +} +.copyright.license .license-link, +.copyright.license .license-meta-title { + font-size: 0.8rem; +} +.copyright.license .license-title { + font-weight: 700; +} +.copyright.license .license-link { + margin-bottom: 1rem; +} +.copyright.license .license-meta { + align-items: center; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + flex-wrap: wrap; + -webkit-flex-wrap: wrap; + -khtml-flex-wrap: wrap; + -moz-flex-wrap: wrap; + -o-flex-wrap: wrap; + -ms-flex-wrap: wrap; + justify-content: flex-start; + -webkit-justify-content: flex-start; + -khtml-justify-content: flex-start; + -moz-justify-content: flex-start; + -o-justify-content: flex-start; + -ms-justify-content: flex-start; +} +.copyright.license .license-meta-item { + margin: 0 2rem 1em 0; +} +.copyright.license .license-meta-text { + margin: 0; +} +.copyright.license .license-meta-text a { + border-bottom: 1px solid var(--color-meta); +} +.copyright.license .license-meta-text a:hover { + border-bottom-color: #ff5722; +} +.recommended-article { + overflow: hidden; +} +.recommended-article .recommended-article-header { + margin-top: 8px; + margin-left: 8px; + margin-right: 0; +} +.recommended-article .recommended-article-group { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + flex-wrap: wrap; + -webkit-flex-wrap: wrap; + -khtml-flex-wrap: wrap; + -moz-flex-wrap: wrap; + -o-flex-wrap: wrap; + -ms-flex-wrap: wrap; + overflow: hidden; +} +@media screen and (max-width: 768px) { + .recommended-article .recommended-article-group { + height: 190px; + overflow: scroll; + -ms-overflow-style: none; + } + .recommended-article .recommended-article-group::-webkit-scrollbar { + width: 0 !important; + } +} +.recommended-article .recommended-article-group .recommended-article-item { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + flex-wrap: wrap; + -webkit-flex-wrap: wrap; + -khtml-flex-wrap: wrap; + -moz-flex-wrap: wrap; + -o-flex-wrap: wrap; + -ms-flex-wrap: wrap; + align-content: center; + justify-content: center; + -webkit-justify-content: center; + -khtml-justify-content: center; + -moz-justify-content: center; + -o-justify-content: center; + -ms-justify-content: center; + align-items: center; + overflow: hidden; + width: calc(100%/3 - 16px); + max-height: 200px; + margin-top: 8px; + margin-left: 8px; + margin-right: 0; +} +@media screen and (max-width: 768px) { + .recommended-article .recommended-article-group .recommended-article-item { + width: calc(100%/2 - 16px); + } +} +@media screen and (max-width: 500px) { + .recommended-article .recommended-article-group .recommended-article-item { + width: calc(100% - 16px); + } +} +.recommended-article .recommended-article-group .recommended-article-item img { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + width: 100%; + height: 150px; +} +.recommended-article .recommended-article-group .recommended-article-item span { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + text-align: justify; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -webkit-box; + -webkit-box-orient: vertical; + -webkit-line-clamp: 1; + overflow: hidden; +} +footer.footer { + position: relative; + padding: 40px 10px 120px 10px; + width: 100%; + color: var(--color-site-footer); + margin: 0px auto; + overflow: hidden; + text-align: center; +} +footer.footer, +footer.footer p { + font-size: 0.8125rem; +} +footer.footer .licenses { + color: fade(, 50%); +} +footer.footer .social-wrapper { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + justify-content: center; + -webkit-justify-content: center; + -khtml-justify-content: center; + -moz-justify-content: center; + -o-justify-content: center; + -ms-justify-content: center; + flex-wrap: wrap; + -webkit-flex-wrap: wrap; + -khtml-flex-wrap: wrap; + -moz-flex-wrap: wrap; + -o-flex-wrap: wrap; + -ms-flex-wrap: wrap; + margin: 4px 8px; +} +footer.footer a { + color: var(--color-site-footer); + padding: 0; + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; +} +footer.footer a:hover { + color: #ff5722; +} +footer.footer a:not(.social):hover { + text-decoration: underline; +} +footer.footer a.social { + position: relative; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: inline-block; + text-align: center; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + justify-content: center; + -webkit-justify-content: center; + -khtml-justify-content: center; + -moz-justify-content: center; + -o-justify-content: center; + -ms-justify-content: center; + align-items: center; + min-width: 36px; + min-height: 36px; + margin: 4px; + opacity: 0.75; + -webkit-opacity: 0.75; + -moz-opacity: 0.75; + border-radius: 4px; + -webkit-border-radius: 4px; + font-size: 1rem; +} +footer.footer a.social img { + margin: 8px; + height: 24px; +} +footer.footer a.social:hover { + color: #ff5722; + background: rgba(255,87,34,0.1); +} +footer.footer .copyright { + margin-top: 16px; +} +footer.footer .copyright p { + font-size: 0.78125rem; +} +@media screen and (max-width: 768px) { + footer.footer { + justify-content: center; + -webkit-justify-content: center; + -khtml-justify-content: center; + -moz-justify-content: center; + -o-justify-content: center; + -ms-justify-content: center; + } +} +.article.l_friends .friends-group .friend-content { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + flex-wrap: wrap; + -webkit-flex-wrap: wrap; + -khtml-flex-wrap: wrap; + -moz-flex-wrap: wrap; + -o-flex-wrap: wrap; + -ms-flex-wrap: wrap; + margin: -8px; + border-radius: 8px; + -webkit-border-radius: 8px; + align-items: flex-start; + line-height: 1.3; +} +.article.l_friends .friends-group .friend-content .friend-card { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + border-radius: 4px; + -webkit-border-radius: 4px; + box-shadow: 0 1px 2px 0px rgba(0,0,0,0.1); + -webkit-box-shadow: 0 1px 2px 0px rgba(0,0,0,0.1); + padding: 8px 0; + margin: 8px; + margin-top: calc(2.25 * 16px + 32px); + color: var(--color-meta); + background: var(--color-block); + justify-content: flex-start; + -webkit-justify-content: flex-start; + -khtml-justify-content: flex-start; + -moz-justify-content: flex-start; + -o-justify-content: flex-start; + -ms-justify-content: flex-start; + align-content: flex-start; + -webkit-box-direction: normal; + -moz-box-direction: normal; + -webkit-box-orient: vertical; + -moz-box-orient: vertical; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + width: calc(100%/4 - 16px); +} +@media screen and (max-width: 1024px) { + .article.l_friends .friends-group .friend-content .friend-card { + width: calc(100%/4 - 16px); + } +} +@media screen and (max-width: 768px) { + .article.l_friends .friends-group .friend-content .friend-card { + width: calc(100%/3 - 16px); + } +} +@media screen and (max-width: 500px) { + .article.l_friends .friends-group .friend-content .friend-card { + width: calc(100%/2 - 16px); + } +} +.article.l_friends .friends-group .friend-content .friend-card:hover .friend-left .avatar { + transform: scale(1.2) rotate(12deg); + -webkit-transform: scale(1.2) rotate(12deg); + -khtml-transform: scale(1.2) rotate(12deg); + -moz-transform: scale(1.2) rotate(12deg); + -o-transform: scale(1.2) rotate(12deg); + -ms-transform: scale(1.2) rotate(12deg); + box-shadow: 0 2px 4px 0px rgba(0,0,0,0.1), 0 4px 8px 0px rgba(0,0,0,0.1), 0 8px 16px 0px rgba(0,0,0,0.1); + -webkit-box-shadow: 0 2px 4px 0px rgba(0,0,0,0.1), 0 4px 8px 0px rgba(0,0,0,0.1), 0 8px 16px 0px rgba(0,0,0,0.1); +} +.article.l_friends .friends-group .friend-content .friend-card .friend-left { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + align-self: center; +} +.article.l_friends .friends-group .friend-content .friend-card .friend-left .avatar { + width: 64px; + height: 64px; + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; + box-shadow: 0 1px 2px 0px rgba(0,0,0,0.1); + -webkit-box-shadow: 0 1px 2px 0px rgba(0,0,0,0.1); + margin: 16px 8px 4px 8px; + margin-top: calc(-1.25 * 16px - 32px); + border-radius: 100%; + -webkit-border-radius: 100%; + border: 2px solid #fff; + background: #fff; +} +.article.l_friends .friends-group .friend-content .friend-card .friend-right { + margin: 4px 8px; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + -webkit-box-direction: normal; + -moz-box-direction: normal; + -webkit-box-orient: vertical; + -moz-box-orient: vertical; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + text-align: center; +} +.article.l_friends .friends-group .friend-content .friend-card .friend-right p { + text-align: center; +} +.article.l_friends .friends-group .friend-content .friend-card .friend-right .friend-tags-wrapper { + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; + margin-left: -2px; + word-break: break-all; +} +.article.l_friends .friends-group .friend-content .friend-card .friend-right p { + margin: 0; +} +.article.l_friends .friends-group .friend-content .friend-card .friend-right p.friend-name { + font-size: 0.8125rem; + padding-top: 4px; + font-weight: bold; +} +.article.l_friends .friends-group .friend-content .friend-card .friend-right p.tags { + font-size: 0.78125rem; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: inline; + background: none; + word-wrap: break-word; + padding-right: 4px; +} +.md img { + position: relative; + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; +} +@media screen and (max-width: 500px) { + .md img { + box-shadow: none; + -webkit-box-shadow: none; + } +} +.md div>img, +.md p>img { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + margin: auto; + border-radius: 4px; + -webkit-border-radius: 4px; +} +@media screen and (max-width: 500px) { + .md div>img, + .md p>img { + border-radius: 2px; + -webkit-border-radius: 2px; + } +} +.md span img { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: inline; + margin: auto; +} +.md .img-wrap { + margin: 1.5rem auto; + text-align: center; + border-radius: 2px; + -webkit-border-radius: 2px; + overflow: hidden; +} +.md .img-wrap .img-bg { + width: 100%; +} +.md .img-wrap .image-caption { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + margin: 0.75rem auto; + font-size: 0.8125rem; + color: var(--color-meta); +} +.md .img-wrap .image-caption:empty { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: none; +} +svg.loading { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + position: absolute; + color: var(--text-p3); + width: 100%; + height: 2rem; + margin: auto; + animation: spin infinite 2s; + -webkit-animation: spin infinite 2s; + -khtml-animation: spin infinite 2s; + -moz-animation: spin infinite 2s; + -o-animation: spin infinite 2s; + -ms-animation: spin infinite 2s; + animation-timing-function: linear; +} +@-moz-keyframes spin { + from { + transform: rotate(0deg); + -webkit-transform: rotate(0deg); + -khtml-transform: rotate(0deg); + -moz-transform: rotate(0deg); + -o-transform: rotate(0deg); + -ms-transform: rotate(0deg); + } + to { + transform: rotate(360deg); + -webkit-transform: rotate(360deg); + -khtml-transform: rotate(360deg); + -moz-transform: rotate(360deg); + -o-transform: rotate(360deg); + -ms-transform: rotate(360deg); + } +} +@-webkit-keyframes spin { + from { + transform: rotate(0deg); + -webkit-transform: rotate(0deg); + -khtml-transform: rotate(0deg); + -moz-transform: rotate(0deg); + -o-transform: rotate(0deg); + -ms-transform: rotate(0deg); + } + to { + transform: rotate(360deg); + -webkit-transform: rotate(360deg); + -khtml-transform: rotate(360deg); + -moz-transform: rotate(360deg); + -o-transform: rotate(360deg); + -ms-transform: rotate(360deg); + } +} +@-o-keyframes spin { + from { + transform: rotate(0deg); + -webkit-transform: rotate(0deg); + -khtml-transform: rotate(0deg); + -moz-transform: rotate(0deg); + -o-transform: rotate(0deg); + -ms-transform: rotate(0deg); + } + to { + transform: rotate(360deg); + -webkit-transform: rotate(360deg); + -khtml-transform: rotate(360deg); + -moz-transform: rotate(360deg); + -o-transform: rotate(360deg); + -ms-transform: rotate(360deg); + } +} +@keyframes spin { + from { + transform: rotate(0deg); + -webkit-transform: rotate(0deg); + -khtml-transform: rotate(0deg); + -moz-transform: rotate(0deg); + -o-transform: rotate(0deg); + -ms-transform: rotate(0deg); + } + to { + transform: rotate(360deg); + -webkit-transform: rotate(360deg); + -khtml-transform: rotate(360deg); + -moz-transform: rotate(360deg); + -o-transform: rotate(360deg); + -ms-transform: rotate(360deg); + } +} +#safearea { + margin: 16px 16px 0; +} +#l_body { + position: relative; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} +#l_body div.loading { + margin: 16px 0; + width: 100%; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; +} +#l_body div.loading, +#l_body div.loading p { + text-align: center; +} +#l_body #s-top { + transition: all 0.6s ease; + -webkit-transition: all 0.6s ease; + -khtml-transition: all 0.6s ease; + -moz-transition: all 0.6s ease; + -o-transition: all 0.6s ease; + -ms-transition: all 0.6s ease; + z-index: 50; + position: fixed; + width: 48px; + height: 48px; + line-height: 48px; + border-radius: 100%; + -webkit-border-radius: 100%; + bottom: 32px; + right: 32px; + transform: translateY(100px) scale(0); + -webkit-transform: translateY(100px) scale(0); + -khtml-transform: translateY(100px) scale(0); + -moz-transform: translateY(100px) scale(0); + -o-transform: translateY(100px) scale(0); + -ms-transform: translateY(100px) scale(0); + transform-origin: bottom; + -webkit-transform-origin: bottom; + -khtml-transform-origin: bottom; + -moz-transform-origin: bottom; + -o-transform-origin: bottom; + -ms-transform-origin: bottom; + color: var(--color-text); +} +@media screen and (max-width: 768px) { + #l_body #s-top { + right: 16px; + } +} +#l_body #s-top.show { + transform: translateY(0) scale(1); + -webkit-transform: translateY(0) scale(1); + -khtml-transform: translateY(0) scale(1); + -moz-transform: translateY(0) scale(1); + -o-transform: translateY(0) scale(1); + -ms-transform: translateY(0) scale(1); +} +#l_body #s-top.show.hl { + background: #3dd9b6; + color: #fff; + box-shadow: 0 1px 2px 0px rgba(0,0,0,0.1); + -webkit-box-shadow: 0 1px 2px 0px rgba(0,0,0,0.1); +} +@media screen and (min-width: 768px) { + #l_body #s-top:hover { + transform: scale(1.2); + -webkit-transform: scale(1.2); + -khtml-transform: scale(1.2); + -moz-transform: scale(1.2); + -o-transform: scale(1.2); + -ms-transform: scale(1.2); + border-radius: 25%; + -webkit-border-radius: 25%; + background: #3dd9b6; + color: #fff; + box-shadow: 0 2px 4px 0px rgba(0,0,0,0.1), 0 4px 8px 0px rgba(0,0,0,0.1), 0 8px 16px 0px rgba(0,0,0,0.1); + -webkit-box-shadow: 0 2px 4px 0px rgba(0,0,0,0.1), 0 4px 8px 0px rgba(0,0,0,0.1), 0 8px 16px 0px rgba(0,0,0,0.1); + } + #l_body #s-top:hover.hl { + box-shadow: 0 2px 4px 0px rgba(0,0,0,0.1), 0 4px 8px 0px rgba(0,0,0,0.1), 0 8px 16px 0px rgba(0,0,0,0.1); + -webkit-box-shadow: 0 2px 4px 0px rgba(0,0,0,0.1), 0 4px 8px 0px rgba(0,0,0,0.1), 0 8px 16px 0px rgba(0,0,0,0.1); + } +} +#l_main { + width: calc(100% - 1 * 240px); + padding-right: 16px; + float: left; +} +@media screen and (max-width: 768px) { + #l_main { + width: 100%; + } +} +#l_main.no_sidebar { + width: 100%; + padding-right: 0; + max-width: 840px; + margin: auto; +} +@media screen and (min-width: 2048px) { + #l_main.no_sidebar { + max-width: calc(55vw - 240px); + } +} +#l_main.no_sidebar ~#l_side { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: none; +} +#l_main .post-list { + position: relative; + margin-bottom: 16px; + column-gap: 16px; + -webkit-column-gap: 16px; + -moz-column-gap: 16px; +} +#l_main .post-list.multiple-columns { + columns: 320px; +} +#l_main .post-wrapper { + column-break-inside: avoid; + break-inside: avoid-column; +} +#l_main .widget .content p, +#l_main .widget .content ul, +#l_main .widget .content ol, +#l_main .widget .content table, +#l_main .widget .content .tabs, +#l_main .widget .content details { + margin-top: 1em; + margin-bottom: 1em; +} +#l_main .widget .content .post { + padding-top: 0; + padding-bottom: 0; + margin-top: 1em; + margin-bottom: 1em; +} +#l_main .widget.grid .content .grid.fixed a { + width: calc(100%/8 - 0 * 16px); +} +@media screen and (max-width: 1024px) { + #l_main .widget.grid .content .grid.fixed a { + width: calc(100%/7 - 0 * 16px); + } +} +@media screen and (max-width: 768px) { + #l_main .widget.grid .content .grid.fixed a { + width: calc(100%/6 - 0 * 16px); + } +} +@media screen and (max-width: 500px) { + #l_main .widget.grid .content .grid.fixed a { + width: calc(100%/5 - 0 * 16px); + } +} +@media screen and (max-width: 425px) { + #l_main .widget.grid .content .grid.fixed a { + width: calc(100%/4 - 0 * 16px); + } +} +@media screen and (max-width: 375px) { + #l_main .widget.grid .content .grid.fixed a { + width: calc(100%/3 - 0 * 16px); + } +} +#l_main .post { + position: relative; + margin-bottom: 16px; + padding: 24px; + border-radius: 8px; + -webkit-border-radius: 8px; +} +#l_main .post h1.title { + font-size: 1.5rem; + margin: 0; + border-bottom: none; + padding-bottom: 4px; + border-bottom: none; +} +#l_main .post .article-meta { + color: var(--color-meta); + margin-bottom: 16px; + line-height: normal; +} +#l_main .post .article-meta#top { + margin-top: 16px; + margin-bottom: 32px; +} +#l_main .post .article-meta#bottom { + margin-top: 32px; + margin-bottom: 8px; +} +#l_main .post .article-meta .aplayer, +#l_main .post .article-meta .aplayer-pic, +#l_main .post .article-meta .thumbnail { + width: 48px; + height: 48px; +} +#l_main .post .article-meta .aplayer, +#l_main .post .article-meta .thumbnail { + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; + border-radius: 100%; + -webkit-border-radius: 100%; + float: right; + margin: 2px; + box-shadow: 0 1px 2px 0px rgba(0,0,0,0.1); + -webkit-box-shadow: 0 1px 2px 0px rgba(0,0,0,0.1); +} +#l_main .post .article-meta .aplayer:hover, +#l_main .post .article-meta .thumbnail:hover { + border-radius: 25%; + -webkit-border-radius: 25%; + transform: scale(1.1); + -webkit-transform: scale(1.1); + -khtml-transform: scale(1.1); + -moz-transform: scale(1.1); + -o-transform: scale(1.1); + -ms-transform: scale(1.1); + box-shadow: 0 2px 4px 0px rgba(0,0,0,0.1), 0 4px 8px 0px rgba(0,0,0,0.1), 0 8px 16px 0px rgba(0,0,0,0.1); + -webkit-box-shadow: 0 2px 4px 0px rgba(0,0,0,0.1), 0 4px 8px 0px rgba(0,0,0,0.1), 0 8px 16px 0px rgba(0,0,0,0.1); +} +@media screen and (max-width: 500px) { + #l_main .post .article-meta .aplayer:hover, + #l_main .post .article-meta .thumbnail:hover { + border-radius: 100%; + -webkit-border-radius: 100%; + transform: scale(1); + -webkit-transform: scale(1); + -khtml-transform: scale(1); + -moz-transform: scale(1); + -o-transform: scale(1); + -ms-transform: scale(1); + box-shadow: 0 1px 2px 0px rgba(0,0,0,0.1); + -webkit-box-shadow: 0 1px 2px 0px rgba(0,0,0,0.1); + } +} +#l_main .post .article-meta .thumbnail { + width: auto; + border-radius: 4px; + -webkit-border-radius: 4px; + box-shadow: none; + -webkit-box-shadow: none; + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; +} +#l_main .post .article-meta .thumbnail:hover { + border-radius: 4px; + -webkit-border-radius: 4px; + transform: scale(1.1) rotate(4deg); + -webkit-transform: scale(1.1) rotate(4deg); + -khtml-transform: scale(1.1) rotate(4deg); + -moz-transform: scale(1.1) rotate(4deg); + -o-transform: scale(1.1) rotate(4deg); + -ms-transform: scale(1.1) rotate(4deg); + box-shadow: none; + -webkit-box-shadow: none; +} +#l_main .post .article-meta .new-meta-box { + transition: all 0.1s ease; + -webkit-transition: all 0.1s ease; + -khtml-transition: all 0.1s ease; + -moz-transition: all 0.1s ease; + -o-transition: all 0.1s ease; + -ms-transition: all 0.1s ease; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + align-items: center; + flex-wrap: wrap; + -webkit-flex-wrap: wrap; + -khtml-flex-wrap: wrap; + -moz-flex-wrap: wrap; + -o-flex-wrap: wrap; + -ms-flex-wrap: wrap; + -webkit-font-smoothing: auto; + -moz-osx-font-smoothing: auto; +} +#l_main .post .article-meta .new-meta-box, +#l_main .post .article-meta .new-meta-box p, +#l_main .post .article-meta .new-meta-box i { + font-size: 0.8125rem; +} +#l_main .post .article-meta .new-meta-box .new-meta-item { + color: var(--color-meta); + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + align-items: baseline; + justify-content: center; + -webkit-justify-content: center; + -khtml-justify-content: center; + -moz-justify-content: center; + -o-justify-content: center; + -ms-justify-content: center; + margin: 0 16px 0 0; + padding: 8px 0; +} +#l_main .post .article-meta .new-meta-box .new-meta-item .notlink { + cursor: default; +} +#l_main .post .article-meta .new-meta-box .new-meta-item .notlink:hover { + color: var(--color-meta); +} +#l_main .post .article-meta .new-meta-box .new-meta-item .notlink:hover p { + color: var(--color-meta); +} +#l_main .post .article-meta .new-meta-box .new-meta-item:last-child { + margin-right: 0; +} +#l_main .post .article-meta .new-meta-box .new-meta-item img, +#l_main .post .article-meta .new-meta-box .new-meta-item i { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: inline-block; +} +#l_main .post .article-meta .new-meta-box .new-meta-item i { + margin-right: 4px; + border-radius: 0; + -webkit-border-radius: 0; +} +#l_main .post .article-meta .new-meta-box .new-meta-item i.fa-hashtag { + margin-right: 2px; +} +#l_main .post .article-meta .new-meta-box .new-meta-item p, +#l_main .post .article-meta .new-meta-box .new-meta-item a { + color: var(--color-meta); + padding: 3px 0; +} +#l_main .post .article-meta .new-meta-box .new-meta-item a { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + justify-content: center; + -webkit-justify-content: center; + -khtml-justify-content: center; + -moz-justify-content: center; + -o-justify-content: center; + -ms-justify-content: center; + align-items: center; +} +#l_main .post .article-meta .new-meta-box .new-meta-item a img { + height: 16px; + width: 16px; + margin-right: 8px; +} +#l_main .post .article-meta .new-meta-box .new-meta-item a p { + margin: 0; + font-weight: normal; + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; +} +#l_main .post .article-meta .new-meta-box .new-meta-item a:hover { + color: #ff5722; +} +#l_main .post .article-meta .new-meta-box .new-meta-item a:hover p { + color: #ff5722; +} +#l_main .post .article-meta .new-meta-box .author img, +#l_main .post .article-meta .new-meta-box .author i { + border-radius: 100%; + -webkit-border-radius: 100%; +} +#l_main .post .article-meta .new-meta-box .author img { + transform: translateY(-0.5px); + -webkit-transform: translateY(-0.5px); + -khtml-transform: translateY(-0.5px); + -moz-transform: translateY(-0.5px); + -o-transform: translateY(-0.5px); + -ms-transform: translateY(-0.5px); +} +@media screen and (max-width: 500px) { + #l_main .post .article-meta .new-meta-box .share { + width: 100%; + margin-top: 16px; + background: var(--color-block); + border-radius: 4px; + -webkit-border-radius: 4px; + } +} +#l_main .post .article-meta .new-meta-box .share-body { + position: relative; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + justify-content: center; + -webkit-justify-content: center; + -khtml-justify-content: center; + -moz-justify-content: center; + -o-justify-content: center; + -ms-justify-content: center; + margin: 0; + padding: 0 2px; +} +#l_main .post .article-meta .new-meta-box .share-body a { + padding: 0; + margin: 0 1px; +} +#l_main .post .article-meta .new-meta-box .share-body a img { + margin: 2px; + height: 24px; + width: auto; + background: transparent; +} +@media screen and (max-width: 500px) { + #l_main .post .article-meta .new-meta-box .share-body a img { + height: 32px; + margin: 8px; + } +} +#l_main .post .article-meta .new-meta-box .share-body div.hoverbox div.target { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: none; + position: absolute; + background: var(--color-card); + border-radius: 8px; + -webkit-border-radius: 8px; + box-shadow: 0 2px 4px 0px rgba(0,0,0,0.1), 0 4px 8px 0px rgba(0,0,0,0.1), 0 8px 16px 0px rgba(0,0,0,0.1); + -webkit-box-shadow: 0 2px 4px 0px rgba(0,0,0,0.1), 0 4px 8px 0px rgba(0,0,0,0.1), 0 8px 16px 0px rgba(0,0,0,0.1); + padding: 8px; + left: 50%; + top: -20px; + transform: translate(-50%, -100%); + -webkit-transform: translate(-50%, -100%); + -khtml-transform: translate(-50%, -100%); + -moz-transform: translate(-50%, -100%); + -o-transform: translate(-50%, -100%); + -ms-transform: translate(-50%, -100%); +} +#l_main .post .article-meta .new-meta-box .share-body div.hoverbox div.target img { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + margin: 0; + padding: 0; + height: 128px; + width: 128px; + min-width: 128px; +} +#l_main .post .article-meta .new-meta-box .share-body div.hoverbox:hover div.target { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; +} +@media screen and (max-width: 500px) { + #l_main .post .article-meta .new-meta-box .share-body div.hoverbox div.target { + position: absolute; + } +} +#l_main .post span>img { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: inline-block; +} +#l_main .post a img { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: inline; +} +@media screen and (max-width: 768px) { + #l_main { + padding-right: 0; + } +} +@media screen and (max-width: 768px) and (max-width: 500px) { + #l_main { + width: 100%; + } +} +.body-wrapper { + position: relative; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + width: 100%; + max-width: 1080px; + margin: 0 auto; + flex-wrap: wrap; + -webkit-flex-wrap: wrap; + -khtml-flex-wrap: wrap; + -moz-flex-wrap: wrap; + -o-flex-wrap: wrap; + -ms-flex-wrap: wrap; + justify-content: space-between; + -webkit-justify-content: space-between; + -khtml-justify-content: space-between; + -moz-justify-content: space-between; + -o-justify-content: space-between; + -ms-justify-content: space-between; + align-items: stretch; +} +@media screen and (min-width: 2048px) { + .body-wrapper { + max-width: 55vw; + } +} +article#comments p[ct] { + margin-top: 0; + margin-bottom: 1em; + font-size: 1.125rem; + color: var(--color-text); + font-weight: 600; +} +article#comments p[cst] { + margin-top: 1em; + margin-bottom: 1em; + font-size: 0.875rem; +} +article#comments #load-btns, +article#comments #loading-comments { + text-align: center; + margin: 16px 0; +} +article#comments #load-btns, +article#comments #loading-comments, +article#comments #load-btns a, +article#comments #loading-comments a, +article#comments #load-btns i, +article#comments #loading-comments i { + line-height: 3em; +} +article#comments #load-btns a.load-comments, +article#comments #loading-comments a.load-comments { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: inline-block; + border-radius: 2px; + -webkit-border-radius: 2px; + cursor: pointer; + background: #44d7b6; + color: #fff; + padding-left: 48px; + padding-right: 48px; +} +article#comments #load-btns a.load-comments:hover, +article#comments #loading-comments a.load-comments:hover { + background: #ff5722; +} +.white-box { + background: var(--color-card); +} +img { + max-width: 100%; +} +img.lazyload:not(.placeholder) { + transition: opacity 0.5s ease-out 0s; + -webkit-transition: opacity 0.5s ease-out 0s; + -khtml-transition: opacity 0.5s ease-out 0s; + -moz-transition: opacity 0.5s ease-out 0s; + -o-transition: opacity 0.5s ease-out 0s; + -ms-transition: opacity 0.5s ease-out 0s; + transition: filter 0.25s ease-out 0s; + -webkit-transition: filter 0.25s ease-out 0s; + -khtml-transition: filter 0.25s ease-out 0s; + -moz-transition: filter 0.25s ease-out 0s; + -o-transition: filter 0.25s ease-out 0s; + -ms-transition: filter 0.25s ease-out 0s; +} +img.lazyload:not(.placeholder):not(.loaded) { + opacity: 0; + -webkit-opacity: 0; + -moz-opacity: 0; +} +img.lazyload:not(.placeholder).loaded { + opacity: 1; + -webkit-opacity: 1; + -moz-opacity: 1; +} +img.lazyload:not(.placeholder):not(.loaded) { + filter: blur(8px); +} +img.lazyload:not(.placeholder).loaded { + filter: none; +} +.md >p { + padding-top: 4px; +} +.md h1, +.md h2, +.md h3, +.md h4, +.md h5, +.md h6 { + position: relative; + pointer-events: none; + margin-top: 0; + font-weight: 500; +} +.md h1 >a, +.md h2 >a, +.md h3 >a, +.md h4 >a, +.md h5 >a, +.md h6 >a { + color: inherit; + pointer-events: auto; +} +.md h1 >a:hover, +.md h2 >a:hover, +.md h3 >a:hover, +.md h4 >a:hover, +.md h5 >a:hover, +.md h6 >a:hover { + color: #ff5722; +} +.md h1:before, +.md h2:before, +.md h3:before, +.md h4:before, +.md h5:before, +.md h6:before { + content: ''; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + margin-top: -48px; + height: 96px; + visibility: hidden; + pointer-events: none; +} +.md h1:before, +.md h2:before { + margin-top: -32px; +} +.md .article-meta+h1, +.md .article-meta+h2 { + margin-top: -80px; +} +.md h3, +.md h4, +.md h5, +.md h6 { + margin-bottom: 1em; +} +.md h3:before { + margin-top: -56px; +} +.md h4:before { + margin-top: -64px; +} +.md h5 { + font-weight: bold; +} +.md h2+h3:before { + margin-top: -80px; +} +.md ul, +.md ol { + font-size: 0.9375rem; + list-style: initial; + padding-left: 8px; + margin-left: 16px; + margin-top: 1em; + margin-bottom: 1em; +} +.md ul ul, +.md ol ul, +.md ul ol, +.md ol ol { + margin-top: 0; + margin-bottom: 0; +} +.md ul li, +.md ol li { + margin-top: 0px; + margin-bottom: 0px; +} +.md ul li li, +.md ol li li { + margin-top: 0; + margin-bottom: 0; +} +.md ul li p, +.md ol li p { + margin-top: 4px; + margin-bottom: 0; +} +.md ul.task-list, +.md ol.task-list { + padding-left: 0; + margin-left: 4px; +} +.md ul.task-list li, +.md ol.task-list li { + list-style: none; +} +.md ul.task-list li input, +.md ol.task-list li input { + margin-right: 4px; +} +.md ul>li { + list-style: initial; +} +.md ol>li { + list-style: decimal; +} +.md .div-ori-link { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + text-align: center; + margin: 4rem 0; +} +.md .ori-link { + margin: auto; + padding: 1em 3em; + border: 1px solid #3dd9b6; + border-radius: 4px; + -webkit-border-radius: 4px; + color: #3dd9b6; + font-weight: 500; +} +.md .ori-link:hover { + color: #ff5722; + border-color: #ff5722; +} +#l_main .prev-next { + width: 100%; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + justify-content: space-between; + -webkit-justify-content: space-between; + -khtml-justify-content: space-between; + -moz-justify-content: space-between; + -o-justify-content: space-between; + -ms-justify-content: space-between; + align-items: baseline; + color: var(--color-meta); + margin: 0; + font-weight: 600; +} +#l_main .prev-next .prev { + text-align: left; + border-top-right-radius: 32px; + border-bottom-right-radius: 32px; +} +#l_main .prev-next .next { + text-align: right; + border-top-left-radius: 32px; + border-bottom-left-radius: 32px; +} +#l_main .prev-next p { + margin: 16px; +} +#l_main .prev-next section { + color: var(--color-meta); + padding: 16px; + border-radius: 8px; + -webkit-border-radius: 8px; +} +#l_main .prev-next section:hover { + color: #ff5722; +} +#l_main .article .prev-next { + width: 100%; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + justify-content: space-between; + -webkit-justify-content: space-between; + -khtml-justify-content: space-between; + -moz-justify-content: space-between; + -o-justify-content: space-between; + -ms-justify-content: space-between; + align-content: flex-start; + margin-top: 8px; +} +#l_main .article .prev-next >a { + width: 100%; + padding: 8px; + color: var(--color-meta); + background: var(--color-block); + border-radius: 4px; + -webkit-border-radius: 4px; +} +#l_main .article .prev-next >a:hover { + background: #ffeee8; +} +#l_main .article .prev-next >a:hover p.title { + color: #ff5722; +} +#l_main .article .prev-next >a p { + margin: 8px 0.5rem; +} +#l_main .article .prev-next >a p.title { + font-weight: 600; + font-size: 1rem; +} +#l_main .article .prev-next >a p.title >i { + width: 1rem; +} +#l_main .article .prev-next >a p.content { + font-size: 0.875rem; + font-weight: 400; + text-align: justify; + word-break: break-all; +} +#l_main .article .prev-next >a:only-child { + margin-left: 0; + margin-right: 0; +} +#l_main .article .prev-next .prev { + margin-left: 0; + margin-right: 8px; +} +#l_main .article .prev-next .prev p.title { + text-align: left; +} +#l_main .article .prev-next .next { + margin-left: 8px; + margin-right: 0; +} +#l_main .article .prev-next .next p.title { + text-align: right; +} +.article-title { + font-weight: 500; + margin-bottom: 12px; + line-height: 1.4; +} +.article-title a { + color: var(--color-h1); +} +.article-title a:hover { + color: #ff5722; +} +.article-title[pin] { + margin-right: 36px; +} +.article-desc { + word-break: break-word; +} +.post-v3 { + overflow: hidden; + text-align: justify; +} +.post-v3 .md { + color: var(--color-p); +} +.post-v3 .pin { + position: absolute; + width: 20px; + height: 20px; + border-radius: 20px; + -webkit-border-radius: 20px; + right: 24px; + top: 24px; + z-index: 1; + pointer-events: none; +} +.meta-v3[line_style='solid'] { + border-top: 1px solid rgba(68,68,68,0.1); +} +.meta-v3[line_style='dashed'] { + border-top: 2px dashed rgba(68,68,68,0.1); +} +.meta-v3[line_style='dotted'] { + border-top: 4px dotted rgba(68,68,68,0.1); +} +.meta-v3 { + margin-top: 16px; + padding-top: 12px; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + flex-wrap: wrap; + -webkit-flex-wrap: wrap; + -khtml-flex-wrap: wrap; + -moz-flex-wrap: wrap; + -o-flex-wrap: wrap; + -ms-flex-wrap: wrap; + justify-content: space-between; + -webkit-justify-content: space-between; + -khtml-justify-content: space-between; + -moz-justify-content: space-between; + -o-justify-content: space-between; + -ms-justify-content: space-between; + color: var(--color-meta); +} +.meta-v3 >div { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + align-items: center; + user-select: none; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; +} +.meta-v3 time { + font-size: 0.875rem; +} +.meta-v3 .category-link { + font-size: 0.875rem; + color: var(--color-meta); + -webkit-font-smoothing: auto; + -moz-osx-font-smoothing: auto; +} +.meta-v3 .category-link:hover { + color: #ff5722; +} +.meta-v3 .readmore { + font-weight: bold; +} +.meta-v3 .avatar { + line-height: 0; + margin-right: 0.75em; +} +.meta-v3 .avatar img { + width: 24px; + height: 24px; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + border-radius: 12px; + -webkit-border-radius: 12px; + object-fit: cover; +} +.headimg-div { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + margin-left: -24px; + margin-top: -24px; + margin-bottom: 20px; + width: calc(100% + 3 * 16px); +} +.headimg-div .headimg-a { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + overflow: hidden; + height: 280px; +} +@media screen and (max-width: 768px) { + .headimg-div .headimg-a { + height: 250px; + } +} +@media screen and (max-width: 500px) { + .headimg-div .headimg-a { + height: 220px; + } +} +@media screen and (max-width: 425px) { + .headimg-div .headimg-a { + height: 190px; + } +} +.headimg-div .headimg { + object-fit: cover; + width: 100%; + height: 100%; + transition: transform 3s ease-out; + -webkit-transition: transform 3s ease-out; + -khtml-transition: transform 3s ease-out; + -moz-transition: transform 3s ease-out; + -o-transition: transform 3s ease-out; + -ms-transition: transform 3s ease-out; +} +.headimg-div .headimg:hover { + transform: scale(1.1); + -webkit-transform: scale(1.1); + -khtml-transform: scale(1.1); + -moz-transform: scale(1.1); + -o-transform: scale(1.1); + -ms-transform: scale(1.1); +} +.headimg-div .headimg.lazyload:not(.placeholder) { + transition: transform 3s ease-out, opacity 0.5s ease-out; + -webkit-transition: transform 3s ease-out, opacity 0.5s ease-out; + -khtml-transition: transform 3s ease-out, opacity 0.5s ease-out; + -moz-transition: transform 3s ease-out, opacity 0.5s ease-out; + -o-transition: transform 3s ease-out, opacity 0.5s ease-out; + -ms-transition: transform 3s ease-out, opacity 0.5s ease-out; +} +.headimg-div .headimg.lazyload:not(.placeholder):not(.loaded) { + opacity: 0; + -webkit-opacity: 0; + -moz-opacity: 0; +} +.headimg-div .headimg.lazyload:not(.placeholder).loaded { + opacity: 1; + -webkit-opacity: 1; + -moz-opacity: 1; +} +#u-search .modal { + position: fixed; + height: 80%; + width: 100%; + max-width: 640px; + left: 50%; + top: 0; + margin: 64px 0px 0px -320px; + background: var(--color-card); + z-index: 3; + border-radius: 8px; + -webkit-border-radius: 8px; + overflow: hidden; +} +#u-search .modal .search-icon, +#u-search .modal #resule-hits-empty { + position: absolute; + top: 50%; + left: 50%; + width: 50%; + text-align: center; + transform: translate(-50%, -50%); + -webkit-transform: translate(-50%, -50%); + -khtml-transform: translate(-50%, -50%); + -moz-transform: translate(-50%, -50%); + -o-transform: translate(-50%, -50%); + -ms-transform: translate(-50%, -50%); +} +#u-search .modal .search-icon i, +#u-search .modal #resule-hits-empty i { + font-size: 8em; + color: #e8e8e8; + margin-bottom: 10px; +} +@media screen and (max-width: 680px) { + #u-search .modal { + box-shadow: none; + -webkit-box-shadow: none; + max-width: none; + top: 0; + left: 0; + margin: 0; + height: 100%; + border-radius: 0; + -webkit-border-radius: 0; + } +} +#u-search .modal .modal-header { + position: relative; + width: 100%; + height: 64px; + z-index: 3; + border-top-left-radius: 8px; + border-top-right-radius: 8px; + font-size: $fontsize; + box-shadow: 0 1px 2px 0px rgba(0,0,0,0.1); + -webkit-box-shadow: 0 1px 2px 0px rgba(0,0,0,0.1); + background: #fff; + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; +} +@media screen and (max-width: 680px) { + #u-search .modal .modal-header { + border-radius: 0; + -webkit-border-radius: 0; + padding: 0px; + } +} +#u-search .modal .modal-header .btn-close { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + position: absolute; + width: 55px; + height: 64px; + top: 0; + right: 0; + color: #3dd9b6; + cursor: pointer; + text-align: center; + line-height: 64px; + vertical-align: middle; + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; + z-index: 2; +} +#u-search .modal .modal-header .btn-close:hover { + transform: rotate(90deg); + -webkit-transform: rotate(90deg); + -khtml-transform: rotate(90deg); + -moz-transform: rotate(90deg); + -o-transform: rotate(90deg); + -ms-transform: rotate(90deg); +} +#u-search .modal .modal-header #u-search-modal-form { + position: relative; + width: 100%; + height: 100%; + z-index: 2; +} +#u-search .modal .modal-header #u-search-modal-form input { + color: var(--color-text); +} +#u-search .modal .modal-header #u-search-modal-form #u-search-modal-input { + margin: 16px 50px; + padding: 0 8px; + width: calc(100% - 100px - 16px); + line-height: 2rem; + border-radius: 8px; + -webkit-border-radius: 8px; + vertical-align: middle; + border: none; + appearance: none; + box-shadow: none; + -webkit-box-shadow: none; + background: transparent; + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; +} +@media screen and (max-width: 680px) { + #u-search .modal .modal-header #u-search-modal-form #u-search-modal-input { + padding: 0; + } +} +#u-search .modal .modal-header #u-search-modal-form #u-search-modal-input:focus { + border-top-left-radius: 8px; + border-top-right-radius: 8px; +} +#u-search .modal .modal-header #u-search-modal-btn-submit { + position: absolute; + top: 0; + left: 0; + padding-left: 5px; + padding-top: 2px; + background: transparent; + border: none; + width: 50px; + height: 64px; + vertical-align: middle; + color: #3dd9b6; + z-index: 2; +} +#u-search .modal .modal-body { + position: absolute; + padding: 16px; + width: 100%; + height: calc(100% - 64px); + top: 64px; + left: 0; + overflow-y: scroll; + -webkit-overflow-scrolling: touch; + background: var(--color-card); + border-radius: 8px; + -webkit-border-radius: 8px; +} +#u-search .modal .modal-body::-webkit-scrollbar { + height: 4px; + width: 4px; +} +#u-search .modal .modal-body::-webkit-scrollbar-track-piece { + background: transparent; +} +#u-search .modal .modal-body::-webkit-scrollbar-thumb { + background: #3dd9b6; + cursor: pointer; + border-radius: 2px; + -webkit-border-radius: 2px; +} +#u-search .modal .modal-body::-webkit-scrollbar-thumb:hover { + background: #ff5722; +} +#u-search .modal .modal-body .modal-results { + list-style: none; +} +#u-search .modal .modal-body .modal-results .result { + position: relative; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + padding: 16px; + border-radius: 8px; + -webkit-border-radius: 8px; +} +#u-search .modal .modal-body .modal-results .result b[mark] { + color: #25be9c; + text-decoration: underline; + font-size: 120%; + background-color: #ffe600; +} +#u-search .modal .modal-body .modal-results .result:hover { + background: var(--color-site-bg); +} +#u-search .modal .modal-body .modal-results .result:hover .title { + color: var(--color-list-hl); +} +#u-search .modal .modal-body .modal-results .result .title { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: inline-block; + max-width: 100%; + color: var(--color-list); + font-weight: bold; + padding: 1px; + margin-bottom: 2px; + white-space: normal; + overflow: hidden; + text-overflow: ellipsis; + font-size: 1.125rem; +} +#u-search .modal .modal-body .modal-results .result .digest { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + white-space: inherit; + overflow: hidden; + word-break: break-all; + text-overflow: ellipsis; + font-size: 0.8125rem; + color: var(--color-meta); +} +#u-search .modal .modal-body .modal-results .result .icon { + position: absolute; + top: 50%; + right: 0; + margin-top: -4px; + font-size: 11px; + color: var(--color-meta); +} +#u-search .modal-overlay { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + background: rgba(0,0,0,0.7); + z-index: 1; +} +#l_side { + width: 240px; + float: right; + position: relative; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + -webkit-box-direction: normal; + -moz-box-direction: normal; + -webkit-box-orient: vertical; + -moz-box-orient: vertical; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; +} +@media screen and (max-width: 768px) { + #l_side { + width: 100%; + } +} +#l_side .widget { + overflow: hidden; +} +#l_side .widget.sticky { + position: sticky; + top: 80px; + z-index: 1; +} +#l_side .widget >.content { + max-height: 200vh; + overflow: auto; + text-align: justify; + font-size: 0.875rem; + max-width: 100%; +} +@media screen and (max-width: 768px) { + #l_side .widget >.content { + max-height: none; + } +} +#l_side .widget >.content::-webkit-scrollbar { + height: 4px; + width: 4px; +} +#l_side .widget >.content::-webkit-scrollbar-track-piece { + background: transparent; +} +#l_side .widget >.content::-webkit-scrollbar-thumb { + background: #3dd9b6; + cursor: pointer; + border-radius: 2px; + -webkit-border-radius: 2px; +} +#l_side .widget >.content::-webkit-scrollbar-thumb:hover { + background: #ff5722; +} +.widget { + z-index: 0; + background: var(--color-card); + margin-bottom: 16px; + border-radius: 8px; + -webkit-border-radius: 8px; + width: 100%; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: none; +} +.widget ul li, +.widget ol li { + margin-top: 0; + margin-bottom: 0; +} +.widget.desktop { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; +} +@media screen and (max-width: 768px) { + .widget { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: none !important; + } + .widget.mobile { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block !important; + } +} +.widget header { + border-top-left-radius: 8px; + border-top-right-radius: 8px; + padding: calc(16px - 2px); + font-weight: bold; + font-size: 0.875rem; + padding-bottom: 0; +} +.widget header, +.widget header a { + color: var(--color-meta); +} +.widget header >a:hover { + color: #ff5722; +} +.widget header span.name { + margin-left: 8px; +} +.widget >.content { + padding: 8px 0; +} +.widget >.content p { + margin-top: 1em; + margin-bottom: 1em; +} +.widget >.content p:first-child { + margin-top: 0.5em; +} +.widget >.content ul>li a { + color: var(--color-meta); + padding: 0 16px; + padding-left: 12px; + line-height: 2; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + justify-content: space-between; + -webkit-justify-content: space-between; + -khtml-justify-content: space-between; + -moz-justify-content: space-between; + -o-justify-content: space-between; + -ms-justify-content: space-between; + align-content: center; + border-left: 2px solid transparent; + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; +} +.widget >.content ul.entry, +.widget >.content ul.popular-posts { + list-style: none; +} +.widget >.content ul.entry a, +.widget >.content ul.popular-posts a { + color: var(--color-list); +} +.widget >.content ul.entry a .name, +.widget >.content ul.popular-posts a .name { + -webkit-box-flex: auto; + -moz-box-flex: auto; + -webkit-flex: auto 0; + -ms-flex: auto 0; + flex: auto 0; +} +.widget >.content ul.entry a .badge, +.widget >.content ul.popular-posts a .badge { + -webkit-box-flex: none; + -moz-box-flex: none; + -webkit-flex: none 0; + -ms-flex: none 0; + flex: none 0; + font-weight: normal; + font-size: 0.875rem; + color: rgba(68,68,68,0.7); +} +.widget >.content ul.entry a.active, +.widget >.content ul.popular-posts a.active { + border-left: 2px solid #3dd9b6; + color: var(--color-list-hl); +} +.widget >.content ul.entry a.active .badge, +.widget >.content ul.popular-posts a.active .badge { + color: rgba(61,217,182,0.9); +} +.widget >.content ul.entry a.child, +.widget >.content ul.popular-posts a.child { + padding-left: 32px; +} +.widget >.content ul.entry a:hover, +.widget >.content ul.popular-posts a:hover { + border-left: 2px solid #3dd9b6; + color: var(--color-list-hl); + background: var(--color-site-bg); +} +.widget.blogger { + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; +} +.widget.blogger .content { + padding: 0; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + -webkit-box-direction: normal; + -moz-box-direction: normal; + -webkit-box-orient: vertical; + -moz-box-orient: vertical; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + align-items: stretch; +} +.widget.blogger .content >.avatar { + align-self: center; + overflow: hidden; + position: relative; + border-top-left-radius: 8px; + border-top-right-radius: 8px; + line-height: 0; +} +.widget.blogger .content >.avatar.circle { + border-radius: 100%; + -webkit-border-radius: 100%; + width: 128px; + height: 128px; + margin-top: 32px; + margin-bottom: 1em; +} +.widget.blogger .content >.avatar.circle img { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + -webkit-transform: translate(-50%, -50%); + -khtml-transform: translate(-50%, -50%); + -moz-transform: translate(-50%, -50%); + -o-transform: translate(-50%, -50%); + -ms-transform: translate(-50%, -50%); +} +@media screen and (max-width: 768px) { + .widget.blogger .content >.avatar { + width: 80px; + height: 80px; + border-radius: 100%; + -webkit-border-radius: 100%; + border: 2px solid #fff; + } + .widget.blogger .content >.avatar img { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + -webkit-transform: translate(-50%, -50%); + -khtml-transform: translate(-50%, -50%); + -moz-transform: translate(-50%, -50%); + -o-transform: translate(-50%, -50%); + -ms-transform: translate(-50%, -50%); + position: absolute; + } +} +.widget.blogger .content .text :first-child { + margin-top: 16px; +} +.widget.blogger .content h2 { + text-align: center; + font-weight: bold; + margin: 8px; +} +@media screen and (max-width: 768px) { + .widget.blogger .content h2 { + margin: 8px; + } +} +.widget.blogger .content p { + text-align: center; + font-weight: bold; + margin: 8px 8px 0 8px; + empty-cells: hide; +} +.widget.blogger .content .social-wrapper { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + justify-content: space-between; + -webkit-justify-content: space-between; + -khtml-justify-content: space-between; + -moz-justify-content: space-between; + -o-justify-content: space-between; + -ms-justify-content: space-between; + flex-wrap: wrap; + -webkit-flex-wrap: wrap; + -khtml-flex-wrap: wrap; + -moz-flex-wrap: wrap; + -o-flex-wrap: wrap; + -ms-flex-wrap: wrap; + margin: 4px 4px; +} +.widget.blogger .content .social-wrapper a { + color: var(--color-meta); + padding: 0; + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; +} +.widget.blogger .content .social-wrapper a:hover { + color: #ff5722; +} +.widget.blogger .content .social-wrapper a.social { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + justify-content: center; + -webkit-justify-content: center; + -khtml-justify-content: center; + -moz-justify-content: center; + -o-justify-content: center; + -ms-justify-content: center; + align-items: center; + width: 32px; + height: 32px; + margin: 4px; + border-radius: 100px; + -webkit-border-radius: 100px; +} +.widget.blogger .content .social-wrapper a.social:hover { + background: #ebfbf7; + color: #3dd9b6; +} +@media screen and (max-width: 768px) { + .widget.blogger .content .social-wrapper { + justify-content: center; + -webkit-justify-content: center; + -khtml-justify-content: center; + -moz-justify-content: center; + -o-justify-content: center; + -ms-justify-content: center; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: none; + } +} +@media screen and (max-width: 768px) { + .widget.blogger { + box-shadow: none; + -webkit-box-shadow: none; + background: transparent !important; + margin-top: 32px; + backdrop-filter: none; + color: var(--color-site-inner); + } +} +.widget.text .content { + padding: 4px 16px; +} +.widget.text .content, +.widget.text .content p { + font-size: 0.875rem; + word-break: break-all; +} +.widget.text .content a { + color: #2092ec; + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; +} +.widget.text .content a:hover { + color: #ff5722; +} +.widget.text .content a:active { + color: #d93400; +} +.widget.list .content { + padding: 8px 0; +} +.widget.list .content a { + font-size: 0.875rem; + font-weight: bold; + line-height: 1.5; + padding-top: 6px; + padding-bottom: 6px; +} +.widget.list .content a img, +.widget.list .content a i { + margin-right: 4px; +} +.widget.list .content a i { + margin-left: 1px; +} +.widget.list .content a img { + vertical-align: middle; + height: 20px; + width: 20px; + margin-bottom: 4px; +} +.widget.list .content a img#round { + border-radius: 100%; + -webkit-border-radius: 100%; +} +.widget.grid .content .grid { + border: none; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + flex-wrap: wrap; + -webkit-flex-wrap: wrap; + -khtml-flex-wrap: wrap; + -moz-flex-wrap: wrap; + -o-flex-wrap: wrap; + -ms-flex-wrap: wrap; + justify-content: space-around; + -webkit-justify-content: space-around; + -khtml-justify-content: space-around; + -moz-justify-content: space-around; + -o-justify-content: space-around; + -ms-justify-content: space-around; + padding: 4px 16px; +} +.widget.grid .content .grid a { + text-align: center; + border-radius: 2px; + -webkit-border-radius: 2px; + margin: 0; + padding: 4px 8px; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + -webkit-box-direction: normal; + -moz-box-direction: normal; + -webkit-box-orient: vertical; + -moz-box-orient: vertical; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + align-items: center; + font-size: 0.78125rem; + font-weight: bold; + color: rgba(68,68,68,0.7); + line-height: 1.5; + word-wrap: break-word; +} +.widget.grid .content .grid a i { + margin-top: 0.3em; + margin-bottom: 0.3em; + font-size: 1.8em; +} +.widget.grid .content .grid a img { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: inline; + vertical-align: middle; + margin-bottom: 4px; +} +.widget.grid .content .grid a img#round { + border-radius: 100%; + -webkit-border-radius: 100%; +} +.widget.grid .content .grid a.active { + color: var(--color-list-hl); + background: var(--color-site-bg); +} +.widget.grid .content .grid a:hover { + color: var(--color-list-hl); + background: var(--color-site-bg); + border-radius: 2px; + -webkit-border-radius: 2px; +} +.widget.grid .content .grid.fixed a { + width: calc(100%/3 - 0 * 16px); +} +@media screen and (max-width: 768px) { + .widget.grid .content .grid.fixed a { + width: calc(100%/6 - 0 * 16px); + } +} +@media screen and (max-width: 500px) { + .widget.grid .content .grid.fixed a { + width: calc(100%/5 - 0 * 16px); + } +} +@media screen and (max-width: 425px) { + .widget.grid .content .grid.fixed a { + width: calc(100%/4 - 0 * 16px); + } +} +@media screen and (max-width: 375px) { + .widget.grid .content .grid.fixed a { + width: calc(100%/3 - 0 * 16px); + } +} +.widget.tagcloud .content { + text-align: justify; + padding: 8px 16px; +} +.widget.tagcloud .content a { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: inline-block; + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; + line-height: 1.2em; + margin: 4px 0; + border-bottom: 1px solid transparent; +} +.widget.tagcloud .content a:hover { + color: #ff5722 !important; + border-bottom: 1px solid #ff5722; +} +.widget.related_posts .content { + font-weight: bold; +} +.widget.related_posts .content ul { + margin-top: 8px; + margin-bottom: 8px; +} +.widget.related_posts .content h3 { + font-size: 0.875rem; + font-weight: bold; + margin: 0; +} +.widget.related_posts .content h3 a { + line-height: inherit; + padding-top: 4px; + padding-bottom: 4px; +} +.widget.qrcode .content { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + flex-wrap: wrap; + -webkit-flex-wrap: wrap; + -khtml-flex-wrap: wrap; + -moz-flex-wrap: wrap; + -o-flex-wrap: wrap; + -ms-flex-wrap: wrap; + align-items: center; + justify-content: space-around; + -webkit-justify-content: space-around; + -khtml-justify-content: space-around; + -moz-justify-content: space-around; + -o-justify-content: space-around; + -ms-justify-content: space-around; + padding-left: 16px; + padding-right: 16px; +} +.widget.qrcode .content, +.widget.qrcode .content img { + margin-bottom: 4px; +} +#l_side>.widget.page >.content { + padding-top: 0; + padding-left: 12px; + padding-right: 12px; +} +.webinfo { + padding: 0.2rem 1rem; +} +.webinfo .webinfo-item { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + padding: 4px 0 0; +} +.webinfo .webinfo-item div:first-child { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: inline-block; +} +.webinfo .webinfo-item div:last-child { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: inline-block; + float: right; +} +.widget-last { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block !important; +} +.widget-last .item { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + justify-content: space-between; + -webkit-justify-content: space-between; + -khtml-justify-content: space-between; + -moz-justify-content: space-between; + -o-justify-content: space-between; + -ms-justify-content: space-between; + font-size: 0.8rem; +} +.widget-last .item-title { + width: 100%; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: inline-block; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; +} +.widget-sticky { + position: sticky; + top: 80px; + z-index: 10; +} +.bber-talk { + padding: 0.2rem 1rem; +} +.bber-talk :hover { + border-color: #49b1f5; + box-shadow: none; + -webkit-box-shadow: none; +} +.bber-talk a { + color: var(--font-color); +} +.bber-talk .talk-list { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block !important; + max-height: 25px; + overflow: hidden; +} +.bber-talk .talk-list :hover { + color: #49b1f5 !important; + transition: all 0.2s ease-in-out; + -webkit-transition: all 0.2s ease-in-out; + -khtml-transition: all 0.2s ease-in-out; + -moz-transition: all 0.2s ease-in-out; + -o-transition: all 0.2s ease-in-out; + -ms-transition: all 0.2s ease-in-out; +} +.bber-talk .talk-list .item { + text-overflow: ellipsis; + white-space: nowrap; + width: 98%; + overflow: hidden; +} +.snackbar-wrap { + position: fixed; + width: 100%; + left: 0; + bottom: 0; + background: #3dd9b6; + padding: 16px; + z-index: 2; +} +.snackbar-content { + max-width: 1080px; + margin: 16px auto; +} +@media screen and (max-width: 1080px) { + .snackbar-content { + max-width: 100%; + } +} +.snackbar-content p { + margin-top: 0.5rem; + margin-bottom: 0.5rem; + color: #fff; +} +.snackbar-content .title { + font-size: 1.5rem; + font-weight: 600; +} +.snackbar-content .action { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + margin: 1.5rem -4px; +} +.snackbar-content .action a { + margin: 4px; + cursor: pointer; + color: #fff; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: inline-block; + padding: 0.4em 2em; + font-weight: 600; + border-radius: 2px; + -webkit-border-radius: 2px; + border: 1px solid #fff; +} +.snackbar-content .action a:hover { + color: #3dd9b6; + background: #fff; +} +.snackbar-wrap[theme='warning'] { + background: #f7e751; +} +.snackbar-wrap[theme='warning'] .snackbar-content p { + color: #000; +} +.snackbar-wrap[theme='warning'] .snackbar-content a { + color: #000; + border-color: #000; +} +.snackbar-wrap[theme='warning'] .snackbar-content a:hover { + color: #f7e751; + background: #000; +} +#l_side .toc-wrapper { + z-index: 1; + overflow: hidden; + border-radius: 8px; + -webkit-border-radius: 8px; + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; + line-height: 1.6; + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; +} +#l_side .toc-wrapper header { + position: sticky; + width: 100%; + top: 0; + padding-bottom: 4px; +} +#l_side .toc-wrapper .content { + max-height: calc(100vh - 144px); +} +#l_side .toc-wrapper .content a { + border-left: 2px solid transparent; +} +#l_side .toc-wrapper .content a.active { + color: var(--color-list-hl); + border-left: 2px solid #3dd9b6; +} +#l_side .toc-wrapper .content a:hover { + color: var(--color-list-hl); + background: var(--color-site-bg); + border-left: 2px solid #3dd9b6; +} +@media screen and (max-width: 768px) { + #l_side .toc-wrapper { + z-index: 1001; + position: fixed; + max-height: 1000px; + width: auto; + max-width: calc(100% - 2 * 16px); + top: 48px; + right: 16px; + border-radius: 4px; + -webkit-border-radius: 4px; + box-shadow: 0 4px 8px 0px rgba(0,0,0,0.1); + -webkit-box-shadow: 0 4px 8px 0px rgba(0,0,0,0.1); + border: 1px solid #e7e7e7; + visibility: hidden; + transform: scale(0, 0); + -webkit-transform: scale(0, 0); + -khtml-transform: scale(0, 0); + -moz-transform: scale(0, 0); + -o-transform: scale(0, 0); + -ms-transform: scale(0, 0); + transform-origin: right top; + -webkit-transform-origin: right top; + -khtml-transform-origin: right top; + -moz-transform-origin: right top; + -o-transform-origin: right top; + -ms-transform-origin: right top; + } + #l_side .toc-wrapper.active { + visibility: visible; + transform: scale(1, 1); + -webkit-transform: scale(1, 1); + -khtml-transform: scale(1, 1); + -moz-transform: scale(1, 1); + -o-transform: scale(1, 1); + -ms-transform: scale(1, 1); + } +} +@media screen and (max-width: 375px) { + #l_side .toc-wrapper { + right: 0; + } +} +#l_side .toc-wrapper a { + padding-left: 8px; + color: var(--color-meta); + font-size: 0.875rem; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: inline-block; +} +#l_side .toc-wrapper ul .toc-child a, +#l_side .toc-wrapper ol .toc-child a { + font-weight: normal; +} +#l_side .toc-wrapper ul .toc-item.toc-level-1 .toc-child a, +#l_side .toc-wrapper ol .toc-item.toc-level-1 .toc-child a { + padding-left: 12.8px; +} +#l_side .toc-wrapper ul .toc-item.toc-level-2 .toc-child a, +#l_side .toc-wrapper ol .toc-item.toc-level-2 .toc-child a { + padding-left: 25.6px; +} +#l_side .toc-wrapper ul .toc-item.toc-level-3 .toc-child a, +#l_side .toc-wrapper ol .toc-item.toc-level-3 .toc-child a { + padding-left: 38.4px; +} +#l_side .toc-wrapper ul .toc-item.toc-level-4 .toc-child a, +#l_side .toc-wrapper ol .toc-item.toc-level-4 .toc-child a { + padding-left: 51.2px; +} +#l_side .toc-wrapper ul .toc-item.toc-level-5 .toc-child a, +#l_side .toc-wrapper ol .toc-item.toc-level-5 .toc-child a { + padding-left: 64px; +} +#l_side .toc-wrapper ul .toc-item.toc-level-6 .toc-child a, +#l_side .toc-wrapper ol .toc-item.toc-level-6 .toc-child a { + padding-left: 76.8px; +} +#l_side .toc-wrapper ul li, +#l_side .toc-wrapper ol li { + width: auto; + text-align: left; +} +#l_side .toc-wrapper ul li a, +#l_side .toc-wrapper ol li a { + padding: 0 8px 0 11px; + font-weight: bold; + width: 100%; +} +#l_side .toc-wrapper:empty { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: none; +} +#l_side .toc-wrapper .toc-child { + font-size: 1rem; + overflow: hidden; + transition: max-height 0.6s ease-in; + -webkit-transition: max-height 0.6s ease-in; + -khtml-transition: max-height 0.6s ease-in; + -moz-transition: max-height 0.6s ease-in; + -o-transition: max-height 0.6s ease-in; + -ms-transition: max-height 0.6s ease-in; + max-height: 0; +} +#l_side .toc-wrapper .toc-item.active>.toc-link { + color: var(--color-list-hl); + border-left: 2px solid #3dd9b6; +} +#l_side .toc-wrapper .toc-item.active>.toc-child { + max-height: 1000px; +} +.md .video-wrap { + margin: 1.5rem auto; +} +.article span.btn, +.md span.btn { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: inline; +} +.article span.btn a, +.md span.btn a { + text-decoration: none; + border-bottom: none; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: inline-block; + padding: 3px 4px 2px 4px; + margin: 2px; + line-height: 1.1; + border-radius: 2px; + -webkit-border-radius: 2px; + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; +} +.article span.btn a i, +.md span.btn a i { + margin-right: 2px; +} +.article span.btn a:not([href]), +.md span.btn a:not([href]) { + opacity: 0.5; + -webkit-opacity: 0.5; + -moz-opacity: 0.5; +} +.article span.btn a:not([href]):hover, +.md span.btn a:not([href]):hover { + cursor: $not-allowed, not-allowed; +} +.article span.btn a, +.md span.btn a, +.article span.btn.regular a, +.md span.btn.regular a { + color: #44d7b6; + border: 1px solid #44d7b6; +} +.article span.btn a:hover, +.md span.btn a:hover, +.article span.btn.regular a:hover, +.md span.btn.regular a:hover { + color: #ff5722; + border-color: #ff5722; +} +.article span.btn a i, +.md span.btn a i, +.article span.btn.regular a i, +.md span.btn.regular a i { + margin-right: 4px; +} +.article span.btn.regular a, +.md span.btn.regular a, +.article span.btn.solid a, +.md span.btn.solid a { + padding: 8px 12px; +} +.article span.btn.solid a, +.md span.btn.solid a { + border: none; + background: #44d7b6; + color: #fff; +} +.article span.btn.solid a:hover, +.md span.btn.solid a:hover { + color: #fff; + background: #ff5722; +} +.article span.btn.large a, +.md span.btn.large a { + font-size: 1rem; + padding: 12px 36px; +} +.article span.btn.large a i, +.md span.btn.large a i { + margin-right: 8px; +} +.article span.btn.center, +.md span.btn.center { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + text-align: center; +} +.article div.btns, +.md div.btns { + margin: 0 -8px; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + flex-wrap: wrap; + -webkit-flex-wrap: wrap; + -khtml-flex-wrap: wrap; + -moz-flex-wrap: wrap; + -o-flex-wrap: wrap; + -ms-flex-wrap: wrap; + align-items: flex-start; + overflow: visible; + line-height: 1.8; +} +.article div.btns, +.md div.btns, +.article div.btns p, +.md div.btns p, +.article div.btns a, +.md div.btns a { + font-size: 0.8125rem; + color: var(--color-p); +} +.article div.btns b, +.md div.btns b { + font-size: 0.875rem; +} +.article div.btns.wide>a, +.md div.btns.wide>a { + padding-left: 32px; + padding-right: 32px; +} +.article div.btns.fill>a, +.md div.btns.fill>a { + flex-grow: 1; + width: auto; +} +.article div.btns.around, +.md div.btns.around { + justify-content: space-around; + -webkit-justify-content: space-around; + -khtml-justify-content: space-around; + -moz-justify-content: space-around; + -o-justify-content: space-around; + -ms-justify-content: space-around; +} +.article div.btns.center, +.md div.btns.center { + justify-content: center; + -webkit-justify-content: center; + -khtml-justify-content: center; + -moz-justify-content: center; + -o-justify-content: center; + -ms-justify-content: center; +} +.article div.btns.grid2>a, +.md div.btns.grid2>a { + width: calc(100%/2 - 16px); +} +@media screen and (max-width: 1024px) { + .article div.btns.grid2>a, + .md div.btns.grid2>a { + width: calc(100%/2 - 16px); + } +} +@media screen and (max-width: 768px) { + .article div.btns.grid2>a, + .md div.btns.grid2>a { + width: calc(100%/2 - 16px); + } +} +@media screen and (max-width: 500px) { + .article div.btns.grid2>a, + .md div.btns.grid2>a { + width: calc(100%/1 - 16px); + } +} +.article div.btns.grid3>a, +.md div.btns.grid3>a { + width: calc(100%/3 - 16px); +} +@media screen and (max-width: 1024px) { + .article div.btns.grid3>a, + .md div.btns.grid3>a { + width: calc(100%/3 - 16px); + } +} +@media screen and (max-width: 768px) { + .article div.btns.grid3>a, + .md div.btns.grid3>a { + width: calc(100%/3 - 16px); + } +} +@media screen and (max-width: 500px) { + .article div.btns.grid3>a, + .md div.btns.grid3>a { + width: calc(100%/1 - 16px); + } +} +.article div.btns.grid4>a, +.md div.btns.grid4>a { + width: calc(100%/4 - 16px); +} +@media screen and (max-width: 1024px) { + .article div.btns.grid4>a, + .md div.btns.grid4>a { + width: calc(100%/3 - 16px); + } +} +@media screen and (max-width: 768px) { + .article div.btns.grid4>a, + .md div.btns.grid4>a { + width: calc(100%/3 - 16px); + } +} +@media screen and (max-width: 500px) { + .article div.btns.grid4>a, + .md div.btns.grid4>a { + width: calc(100%/2 - 16px); + } +} +.article div.btns.grid5>a, +.md div.btns.grid5>a { + width: calc(100%/5 - 16px); +} +@media screen and (max-width: 1024px) { + .article div.btns.grid5>a, + .md div.btns.grid5>a { + width: calc(100%/4 - 16px); + } +} +@media screen and (max-width: 768px) { + .article div.btns.grid5>a, + .md div.btns.grid5>a { + width: calc(100%/3 - 16px); + } +} +@media screen and (max-width: 500px) { + .article div.btns.grid5>a, + .md div.btns.grid5>a { + width: calc(100%/2 - 16px); + } +} +.article div.btns a, +.md div.btns a { + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; + text-decoration: none; + border-bottom: none; + margin: 8px; + margin-top: calc(1.25 * 16px + 32px); + min-width: 120px; + font-weight: bold; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + justify-content: flex-start; + -webkit-justify-content: flex-start; + -khtml-justify-content: flex-start; + -moz-justify-content: flex-start; + -o-justify-content: flex-start; + -ms-justify-content: flex-start; + align-content: center; + align-items: center; + -webkit-box-direction: normal; + -moz-box-direction: normal; + -webkit-box-orient: vertical; + -moz-box-orient: vertical; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + padding: 8px; + text-align: center; + background: var(--color-block); + border-radius: 4px; + -webkit-border-radius: 4px; +} +.article div.btns a>img:first-child, +.md div.btns a>img:first-child, +.article div.btns a>i:first-child, +.md div.btns a>i:first-child { + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; + height: 64px; + width: 64px; + box-shadow: 0 1px 2px 0px rgba(0,0,0,0.1); + -webkit-box-shadow: 0 1px 2px 0px rgba(0,0,0,0.1); + margin: 16px 8px 4px 8px; + margin-top: calc(-1.25 * 16px - 32px); + border: 2px solid var(--color-card); + background: #fff; + line-height: 60px; + font-size: 28px; +} +.article div.btns a>img:first-child.auto, +.md div.btns a>img:first-child.auto, +.article div.btns a>i:first-child.auto, +.md div.btns a>i:first-child.auto { + width: auto; +} +.article div.btns a>i:first-child, +.md div.btns a>i:first-child { + color: #fff; + background: #3dd9b6; +} +.article div.btns a p, +.md div.btns a p, +.article div.btns a b, +.md div.btns a b { + margin: 0.25em; + font-weight: normal; + line-height: 1.25; + word-wrap: break-word; +} +.article div.btns a b, +.md div.btns a b { + font-weight: bold; + line-height: 1.3; +} +.article div.btns a img, +.md div.btns a img { + margin: 0.4em auto; +} +.article div.btns a:not([href]), +.md div.btns a:not([href]) { + cursor: default; + color: inherit; +} +.article div.btns a[href]:hover, +.md div.btns a[href]:hover { + background: rgba(255,87,34,0.15); +} +.article div.btns a[href]:hover, +.md div.btns a[href]:hover, +.article div.btns a[href]:hover b, +.md div.btns a[href]:hover b { + color: #ff5722; +} +.article div.btns a[href]:hover>img:first-child, +.md div.btns a[href]:hover>img:first-child, +.article div.btns a[href]:hover>i:first-child, +.md div.btns a[href]:hover>i:first-child { + transform: scale(1.1) translateY(-8px); + -webkit-transform: scale(1.1) translateY(-8px); + -khtml-transform: scale(1.1) translateY(-8px); + -moz-transform: scale(1.1) translateY(-8px); + -o-transform: scale(1.1) translateY(-8px); + -ms-transform: scale(1.1) translateY(-8px); + box-shadow: 0 4px 8px 0px rgba(0,0,0,0.1); + -webkit-box-shadow: 0 4px 8px 0px rgba(0,0,0,0.1); +} +.article div.btns a[href]:hover>i:first-child, +.md div.btns a[href]:hover>i:first-child { + background: #ff5722; +} +.article div.btns.circle a>img:first-child, +.md div.btns.circle a>img:first-child, +.article div.btns.circle a>i:first-child, +.md div.btns.circle a>i:first-child { + border-radius: 32px; + -webkit-border-radius: 32px; +} +.article div.btns.rounded a>img:first-child, +.md div.btns.rounded a>img:first-child, +.article div.btns.rounded a>i:first-child, +.md div.btns.rounded a>i:first-child { + border-radius: 16px; + -webkit-border-radius: 16px; +} +.md .checkbox { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + align-items: center; + margin-top: 1em; + margin-bottom: 1em; +/* Checkbox */ +/* Radio */ +/* Colors */ +} +.md .checkbox+.checkbox { + margin-top: -1em; +} +.md .checkbox input { + transform: translate(0, -1px); + -webkit-transform: translate(0, -1px); + -khtml-transform: translate(0, -1px); + -moz-transform: translate(0, -1px); + -o-transform: translate(0, -1px); + -ms-transform: translate(0, -1px); + -webkit-appearance: none; + -moz-appearance: none; + -ms-appearance: none; + -o-appearance: none; + appearance: none; + position: relative; + height: 16px; + width: 16px; + transition: all 0.15s ease-out 0s; + -webkit-transition: all 0.15s ease-out 0s; + -khtml-transition: all 0.15s ease-out 0s; + -moz-transition: all 0.15s ease-out 0s; + -o-transition: all 0.15s ease-out 0s; + -ms-transition: all 0.15s ease-out 0s; + cursor: pointer; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: inline-block; + outline: none; + border-radius: 2px; + -webkit-border-radius: 2px; + flex-shrink: 0; + margin-right: 8px; + pointer-events: none; +} +.md .checkbox input[type=checkbox]:before, +.md .checkbox input[type=checkbox]:after { + position: absolute; + content: ""; + background: #fff; +} +.md .checkbox input[type=checkbox]:before { + left: 1px; + top: 5px; + width: 0px; + height: 2px; + transition: all 0.2s ease-in; + -webkit-transition: all 0.2s ease-in; + -khtml-transition: all 0.2s ease-in; + -moz-transition: all 0.2s ease-in; + -o-transition: all 0.2s ease-in; + -ms-transition: all 0.2s ease-in; + transform: rotate(45deg); + -webkit-transform: rotate(45deg); + -khtml-transform: rotate(45deg); + -moz-transform: rotate(45deg); + -o-transform: rotate(45deg); + -ms-transform: rotate(45deg); + -webkit-transform: rotate(45deg); + -moz-transform: rotate(45deg); + -ms-transform: rotate(45deg); + -o-transform: rotate(45deg); +} +.md .checkbox input[type=checkbox]:after { + right: 7px; + bottom: 3px; + width: 2px; + height: 0px; + transition: all 0.2s ease-out; + -webkit-transition: all 0.2s ease-out; + -khtml-transition: all 0.2s ease-out; + -moz-transition: all 0.2s ease-out; + -o-transition: all 0.2s ease-out; + -ms-transition: all 0.2s ease-out; + transform: rotate(40deg); + -webkit-transform: rotate(40deg); + -khtml-transform: rotate(40deg); + -moz-transform: rotate(40deg); + -o-transform: rotate(40deg); + -ms-transform: rotate(40deg); + -webkit-transform: rotate(40deg); + -moz-transform: rotate(40deg); + -ms-transform: rotate(40deg); + -o-transform: rotate(40deg); + transition-delay: 0.25s; + -webkit-transition-delay: 0.25s; + -khtml-transition-delay: 0.25s; + -moz-transition-delay: 0.25s; + -o-transition-delay: 0.25s; + -ms-transition-delay: 0.25s; +} +.md .checkbox input[type=checkbox]:checked:before { + left: 0px; + top: 7px; + width: 6px; + height: 2px; +} +.md .checkbox input[type=checkbox]:checked:after { + right: 3px; + bottom: 1px; + width: 2px; + height: 10px; +} +.md .checkbox.minus input[type=checkbox]:before { + transform: rotate(0); + -webkit-transform: rotate(0); + -khtml-transform: rotate(0); + -moz-transform: rotate(0); + -o-transform: rotate(0); + -ms-transform: rotate(0); + left: 1px; + top: 5px; + width: 0px; + height: 2px; +} +.md .checkbox.minus input[type=checkbox]:after { + transform: rotate(0); + -webkit-transform: rotate(0); + -khtml-transform: rotate(0); + -moz-transform: rotate(0); + -o-transform: rotate(0); + -ms-transform: rotate(0); + left: 1px; + top: 5px; + width: 0px; + height: 2px; +} +.md .checkbox.minus input[type=checkbox]:checked:before { + left: 1px; + top: 5px; + width: 10px; + height: 2px; +} +.md .checkbox.minus input[type=checkbox]:checked:after { + left: 1px; + top: 5px; + width: 10px; + height: 2px; +} +.md .checkbox.plus input[type=checkbox]:before { + transform: rotate(0); + -webkit-transform: rotate(0); + -khtml-transform: rotate(0); + -moz-transform: rotate(0); + -o-transform: rotate(0); + -ms-transform: rotate(0); + left: 1px; + top: 5px; + width: 0px; + height: 2px; +} +.md .checkbox.plus input[type=checkbox]:after { + transform: rotate(0); + -webkit-transform: rotate(0); + -khtml-transform: rotate(0); + -moz-transform: rotate(0); + -o-transform: rotate(0); + -ms-transform: rotate(0); + left: 5px; + top: 1px; + width: 2px; + height: 0px; +} +.md .checkbox.plus input[type=checkbox]:checked:before { + left: 1px; + top: 5px; + width: 10px; + height: 2px; +} +.md .checkbox.plus input[type=checkbox]:checked:after { + left: 5px; + top: 1px; + width: 2px; + height: 10px; +} +.md .checkbox.times input[type=checkbox]:before { + transform: rotate(45deg); + -webkit-transform: rotate(45deg); + -khtml-transform: rotate(45deg); + -moz-transform: rotate(45deg); + -o-transform: rotate(45deg); + -ms-transform: rotate(45deg); + left: 3px; + top: 1px; + width: 0px; + height: 2px; +} +.md .checkbox.times input[type=checkbox]:after { + transform: rotate(135deg); + -webkit-transform: rotate(135deg); + -khtml-transform: rotate(135deg); + -moz-transform: rotate(135deg); + -o-transform: rotate(135deg); + -ms-transform: rotate(135deg); + right: 3px; + top: 1px; + width: 0px; + height: 2px; +} +.md .checkbox.times input[type=checkbox]:checked:before { + left: 1px; + top: 5px; + width: 10px; + height: 2px; +} +.md .checkbox.times input[type=checkbox]:checked:after { + right: 1px; + top: 5px; + width: 10px; + height: 2px; +} +.md .checkbox input[type=radio] { + border-radius: 50%; + -webkit-border-radius: 50%; +} +.md .checkbox input[type=radio]:before { + content: ""; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + width: 8px; + height: 8px; + border-radius: 50%; + -webkit-border-radius: 50%; + margin: 2px; + transform: scale(0); + -webkit-transform: scale(0); + -khtml-transform: scale(0); + -moz-transform: scale(0); + -o-transform: scale(0); + -ms-transform: scale(0); + transition: all 0.25s ease-out; + -webkit-transition: all 0.25s ease-out; + -khtml-transition: all 0.25s ease-out; + -moz-transition: all 0.25s ease-out; + -o-transition: all 0.25s ease-out; + -ms-transition: all 0.25s ease-out; +} +.md .checkbox input[type=radio]:checked:before { + transform: scale(1); + -webkit-transform: scale(1); + -khtml-transform: scale(1); + -moz-transform: scale(1); + -o-transform: scale(1); + -ms-transform: scale(1); +} +.md .checkbox input { + border: 2px solid #3dd9b6; +} +.md .checkbox input[type=checkbox]:checked { + background: #3dd9b6; +} +.md .checkbox input[type=radio]:checked:before { + background: #3dd9b6; +} +.md .checkbox.red input { + border-color: #fe5f58; +} +.md .checkbox.red input[type=checkbox]:checked { + background: #fe5f58; +} +.md .checkbox.red input[type=radio]:checked:before { + background: #fe5f58; +} +.md .checkbox.green input { + border-color: #3dc550; +} +.md .checkbox.green input[type=checkbox]:checked { + background: #3dc550; +} +.md .checkbox.green input[type=radio]:checked:before { + background: #3dc550; +} +.md .checkbox.yellow input { + border-color: #ffbd2b; +} +.md .checkbox.yellow input[type=checkbox]:checked { + background: #ffbd2b; +} +.md .checkbox.yellow input[type=radio]:checked:before { + background: #ffbd2b; +} +.md .checkbox.cyan input { + border-color: #1bcdfc; +} +.md .checkbox.cyan input[type=checkbox]:checked { + background: #1bcdfc; +} +.md .checkbox.cyan input[type=radio]:checked:before { + background: #1bcdfc; +} +.md .checkbox.blue input { + border-color: #2196f3; +} +.md .checkbox.blue input[type=checkbox]:checked { + background: #2196f3; +} +.md .checkbox.blue input[type=radio]:checked:before { + background: #2196f3; +} +article .checkbox p { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: inline-block; + margin-top: 0 !important; + margin-bottom: 0 !important; +} +div.dropmenu-wrapper { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: inline-block; +} +div.dropmenu { + position: relative; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: inline-block; + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; + color: #2092ec; +} +div.dropmenu:hover { + color: inherit; +} +div.dropmenu:hover >ul { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + left: 0; + margin-left: 0; + margin-top: 0px; +} +div.dropmenu ul>li { + list-style: none; +} +div.dropmenu ul>li >a:hover { + text-decoration: none !important; +} +div.dropmenu .list-v .list-v { + left: calc(100% - 0.5 * 16px); +} +div.gallery { + margin: 1em 0; + overflow: hidden; +} +div.gallery+.gallery { + margin-top: -1em; +} +div.gallery >.fancybox, +div.gallery >p>.fancybox { + margin: 1px; + padding: 0; + position: relative; +} +div.gallery >.fancybox a, +div.gallery >p>.fancybox a { + height: 100%; + width: 100%; +} +div.gallery >.fancybox img, +div.gallery >p>.fancybox img { + object-fit: cover; + height: 100%; + width: 100%; +} +div.gallery >.fancybox .image-caption, +div.gallery >p>.fancybox .image-caption { + opacity: 0; + -webkit-opacity: 0; + -moz-opacity: 0; + transform: translateY(100%); + -webkit-transform: translateY(100%); + -khtml-transform: translateY(100%); + -moz-transform: translateY(100%); + -o-transform: translateY(100%); + -ms-transform: translateY(100%); + transition: all 0.3s ease; + -webkit-transition: all 0.3s ease; + -khtml-transition: all 0.3s ease; + -moz-transition: all 0.3s ease; + -o-transition: all 0.3s ease; + -ms-transition: all 0.3s ease; + pointer-events: none; + position: absolute; + width: 100%; + bottom: 0; + text-align: center; + background: rgba(0,0,0,0.3); + color: #fff; +} +div.gallery >.fancybox .image-caption:empty, +div.gallery >p>.fancybox .image-caption:empty { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: none; +} +div.gallery >.fancybox:hover .image-caption, +div.gallery >p>.fancybox:hover .image-caption { + opacity: 1; + -webkit-opacity: 1; + -moz-opacity: 1; + transform: translateY(0); + -webkit-transform: translateY(0); + -khtml-transform: translateY(0); + -moz-transform: translateY(0); + -o-transform: translateY(0); + -ms-transform: translateY(0); +} +div.gallery, +div.gallery >p { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + justify-content: center; + -webkit-justify-content: center; + -khtml-justify-content: center; + -moz-justify-content: center; + -o-justify-content: center; + -ms-justify-content: center; + align-items: center; + flex-wrap: nowrap; + -webkit-flex-wrap: nowrap; + -khtml-flex-wrap: nowrap; + -moz-flex-wrap: nowrap; + -o-flex-wrap: nowrap; + -ms-flex-wrap: nowrap; + padding: 0 !important; + align-items: stretch; +} +div.gallery[col] { + flex-wrap: wrap; + -webkit-flex-wrap: wrap; + -khtml-flex-wrap: wrap; + -moz-flex-wrap: wrap; + -o-flex-wrap: wrap; + -ms-flex-wrap: wrap; + justify-content: flex-start; + -webkit-justify-content: flex-start; + -khtml-justify-content: flex-start; + -moz-justify-content: flex-start; + -o-justify-content: flex-start; + -ms-justify-content: flex-start; +} +div.gallery[col='2']>.fancybox { + width: calc(50% - 2 * 1px); +} +div.gallery[col='3']>.fancybox { + width: calc(33.33% - 2 * 1px); +} +div.gallery[col='4']>.fancybox { + width: calc(25% - 2 * 1px); +} +div.gallery[col='5']>.fancybox { + width: calc(20% - 2 * 1px); +} +div.gallery[col='6']>.fancybox { + width: calc(16.66% - 2 * 1px); +} +div.gallery[col='7']>.fancybox { + width: calc(14.2857% - 2 * 1px); +} +div.gallery[col='8']>.fancybox { + width: calc(12.5% - 2 * 1px); +} +div.gallery >p { + margin: 0; +} +div.gallery.left, +div.gallery.left>p { + justify-content: flex-start; + -webkit-justify-content: flex-start; + -khtml-justify-content: flex-start; + -moz-justify-content: flex-start; + -o-justify-content: flex-start; + -ms-justify-content: flex-start; +} +div.gallery.center, +div.gallery.center>p { + justify-content: center; + -webkit-justify-content: center; + -khtml-justify-content: center; + -moz-justify-content: center; + -o-justify-content: center; + -ms-justify-content: center; +} +div.gallery.right, +div.gallery.right>p { + justify-content: flex-end; + -webkit-justify-content: flex-end; + -khtml-justify-content: flex-end; + -moz-justify-content: flex-end; + -o-justify-content: flex-end; + -ms-justify-content: flex-end; +} +div.gallery.stretch, +div.gallery.stretch>p { + align-items: stretch; +} +.fancybox-container .fancybox-stage { + cursor: zoom-out; +} +div.fancybox { + margin-top: 1em; + margin-bottom: 1em; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + -webkit-box-direction: normal; + -moz-box-direction: normal; + -webkit-box-orient: vertical; + -moz-box-orient: vertical; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + justify-content: center; + -webkit-justify-content: center; + -khtml-justify-content: center; + -moz-justify-content: center; + -o-justify-content: center; + -ms-justify-content: center; + align-items: center; + flex-wrap: nowrap; + -webkit-flex-wrap: nowrap; + -khtml-flex-wrap: nowrap; + -moz-flex-wrap: nowrap; + -o-flex-wrap: nowrap; + -ms-flex-wrap: nowrap; + padding: 0 !important; + overflow: hidden; + border-radius: 2px; + -webkit-border-radius: 2px; +} +@media screen and (max-width: 500px) { + div.fancybox { + border-radius: 1px; + -webkit-border-radius: 1px; + } +} +div.fancybox a { + line-height: 0; + margin: 0 auto; + align-items: stretch; +} +div.fancybox .gallery { + overflow: hidden; +} +div.fancybox .image-caption { + font-size: 0.8125rem; + padding-top: 0.5em; + padding-bottom: 1em; + color: var(--color-meta); +} +div.fancybox .image-caption:empty { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: none; +} +details { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + padding: 16px; + margin: 1em 0; + border-radius: 4px; + -webkit-border-radius: 4px; + background: var(--color-card); + font-size: 0.9375rem; + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; + border: 1px solid var(--color-block); +} +details summary { + cursor: pointer; + padding: 16px; + margin: -16px; + border-radius: 4px; + -webkit-border-radius: 4px; + color: rgba(68,68,68,0.7); + font-size: 0.875rem; + font-weight: bold; + position: relative; + line-height: normal; +} +details summary > p, +details summary > h1, +details summary > h2, +details summary > h3, +details summary > h4, +details summary > h5, +details summary > h6 { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: inline; + border-bottom: none !important; +} +details summary:hover { + color: var(--color-p); +} +details summary:hover:after { + position: absolute; + content: '+'; + text-align: center; + top: 50%; + transform: translateY(-50%); + -webkit-transform: translateY(-50%); + -khtml-transform: translateY(-50%); + -moz-transform: translateY(-50%); + -o-transform: translateY(-50%); + -ms-transform: translateY(-50%); + right: 16px; +} +details >summary { + background: var(--color-block); +} +details[blue] { + border-color: #e8f4fd; +} +details[blue] >summary { + background: #e8f4fd; +} +details[cyan] { + border-color: #e8fafe; +} +details[cyan] >summary { + background: #e8fafe; +} +details[green] { + border-color: #ebf9ed; +} +details[green] >summary { + background: #ebf9ed; +} +details[yellow] { + border-color: #fff8e9; +} +details[yellow] >summary { + background: #fff8e9; +} +details[red] { + border-color: #feefee; +} +details[red] >summary { + background: #feefee; +} +details[open] { + border-color: rgba(68,68,68,0.2); +} +details[open] >summary { + border-bottom: 1px solid rgba(68,68,68,0.2); + border-bottom-left-radius: 0; + border-bottom-right-radius: 0; +} +details[open][blue] { + border-color: rgba(33,150,243,0.3); +} +details[open][blue] >summary { + border-bottom-color: rgba(33,150,243,0.3); +} +details[open][cyan] { + border-color: rgba(27,205,252,0.3); +} +details[open][cyan] >summary { + border-bottom-color: rgba(27,205,252,0.3); +} +details[open][green] { + border-color: rgba(61,197,80,0.3); +} +details[open][green] >summary { + border-bottom-color: rgba(61,197,80,0.3); +} +details[open][yellow] { + border-color: rgba(255,189,43,0.3); +} +details[open][yellow] >summary { + border-bottom-color: rgba(255,189,43,0.3); +} +details[open][red] { + border-color: rgba(254,95,88,0.3); +} +details[open][red] >summary { + border-bottom-color: rgba(254,95,88,0.3); +} +details[open] >summary { + color: #444; + margin-bottom: 0; +} +details[open] >summary:hover:after { + content: '-'; +} +details[open] >div.content { + padding: 16px; + margin: -16px; + margin-top: 0; +} +details[open] >div.content p>a:hover { + text-decoration: underline; +} +details[open] >div.content > p:first-child, +details[open] >div.content > .tabs:first-child, +details[open] >div.content > ul:first-child, +details[open] >div.content > ol:first-child, +details[open] >div.content > .highlight:first-child, +details[open] >div.content > .note:first-child, +details[open] >div.content > details:first-child { + margin-top: 0; +} +details[open] >div.content > p:last-child, +details[open] >div.content > .tabs:last-child, +details[open] >div.content > ul:last-child, +details[open] >div.content > ol:last-child, +details[open] >div.content > .highlight:last-child, +details[open] >div.content > .note:last-child, +details[open] >div.content > details:last-child { + margin-bottom: 0; +} +.md .frame-wrap { + position: relative; + overflow: hidden; + margin: 0 auto; + max-width: 100%; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + -webkit-box-direction: normal; + -moz-box-direction: normal; + -webkit-box-orient: vertical; + -moz-box-orient: vertical; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + align-items: center; +} +.md .frame-wrap img, +.md .frame-wrap video { + border-radius: 0; + -webkit-border-radius: 0; +} +.md .frame-wrap .frame { + z-index: 1; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + position: absolute; + background-size: 100%; + -webkit-background-size: 100%; + -moz-background-size: 100%; + background-repeat: no-repeat; + overflow: hidden; +} +.md .img-wrap .frame-wrap[part] { + height: auto; +} +.md .frame-wrap#iphone11 img, +.md .frame-wrap#iphone11 video { + width: 287px; + margin-top: 19px; + margin-bottom: 20px; +} +.md .frame-wrap#iphone11 .frame { + background-image: url("https://cdn.jsdelivr.net/gh/volantis-x/cdn-volantis@3/img/frame/iphone11.svg"); + width: 329px; + height: 658px; +} +.md .frame-wrap[part='top'] img, +.md .frame-wrap[part='top'] video { + margin-bottom: 0 !important; +} +.md .frame-wrap:not([part='bottom']) .frame { + top: 0; +} +.md .frame-wrap[part='bottom'] img, +.md .frame-wrap[part='bottom'] video { + bottom: 0; + margin-top: 0 !important; +} +.md .frame-wrap[part='bottom'] .frame { + bottom: 0; +} +@media screen and (max-width: 500px) { + .md .frame-wrap#iphone11 img, + .md .frame-wrap#iphone11 video { + width: 208px; + margin-top: 13px; + margin-bottom: 14px; + } + .md .frame-wrap#iphone11 .frame { + width: 238px; + height: 476px; + } +} +.users-wrap { + overflow: hidden; +} +.users-wrap .group-header { + margin: 0 0 1rem; +} +.users-wrap .group-header p { + margin: 0; + font-size: 0.875rem; +} +.users-wrap .group-header p:first-child { + font-size: 1.25rem; + font-weight: 500; +} +.users-wrap .group-body { + width: 100%; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + flex-wrap: wrap; + -webkit-flex-wrap: wrap; + -khtml-flex-wrap: wrap; + -moz-flex-wrap: wrap; + -o-flex-wrap: wrap; + -ms-flex-wrap: wrap; + align-items: stretch; + margin-bottom: 2rem; +} +.users-wrap .friendsjs-wrap { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; +} +.users-wrap .friendsjs-wrap .loading-wrap { + min-height: 50px; + margin: 2rem 0; + text-align: center; +} +.users-wrap .user-card { + flex-shrink: 1; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + align-items: stretch; + width: 12.5%; +} +@media screen and (max-width: 980px) { + .users-wrap .user-card { + width: 14.28%; + } +} +@media screen and (max-width: 900px) { + .users-wrap .user-card { + width: 16.66%; + } +} +@media screen and (max-width: 820px) { + .users-wrap .user-card { + width: 20%; + } +} +@media screen and (max-width: 768px) { + .users-wrap .user-card { + width: 16.66%; + } +} +@media screen and (max-width: 500px) { + .users-wrap .user-card { + width: 25%; + } +} +.users-wrap .user-card .card-link { + margin: 0; + width: 100%; + color: var(--text-p1); + font-size: 10px; + font-weight: 500; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + justify-content: flex-start; + -webkit-justify-content: flex-start; + -khtml-justify-content: flex-start; + -moz-justify-content: flex-start; + -o-justify-content: flex-start; + -ms-justify-content: flex-start; + -webkit-box-direction: normal; + -moz-box-direction: normal; + -webkit-box-orient: vertical; + -moz-box-orient: vertical; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + align-items: center; + text-align: center; + line-height: 1.2; + border-radius: 4px; + -webkit-border-radius: 4px; + overflow: hidden; + position: relative; + padding: 1rem 0.5rem; +} +.users-wrap .user-card .card-link img { + object-fit: cover; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + width: 48px; + height: 48px; + background: var(--card); + border-radius: 64px; + -webkit-border-radius: 64px; + margin: 0 0 0.5rem; +} +.users-wrap .user-card .card-link >img { + transition: transform 0.2s ease-out, box-shadow 0.2s ease-out; + -webkit-transition: transform 0.2s ease-out, box-shadow 0.2s ease-out; + -khtml-transition: transform 0.2s ease-out, box-shadow 0.2s ease-out; + -moz-transition: transform 0.2s ease-out, box-shadow 0.2s ease-out; + -o-transition: transform 0.2s ease-out, box-shadow 0.2s ease-out; + -ms-transition: transform 0.2s ease-out, box-shadow 0.2s ease-out; +} +.users-wrap .user-card .card-link:hover { + background: var(--block-hover); +} +.users-wrap .user-card .card-link:hover img { + transform: scale(1.2) rotate(8deg); + -webkit-transform: scale(1.2) rotate(8deg); + -khtml-transform: scale(1.2) rotate(8deg); + -moz-transform: scale(1.2) rotate(8deg); + -o-transform: scale(1.2) rotate(8deg); + -ms-transform: scale(1.2) rotate(8deg); + box-shadow: 0 2px 4px 0px rgba(0,0,0,0.1), 0 4px 8px 0px rgba(0,0,0,0.1), 0 8px 16px 0px rgba(0,0,0,0.1); + -webkit-box-shadow: 0 2px 4px 0px rgba(0,0,0,0.1), 0 4px 8px 0px rgba(0,0,0,0.1), 0 8px 16px 0px rgba(0,0,0,0.1); +} +a.ghcard { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: inline-block; + line-height: 0; +} +.md .ghcard-group { + column-count: 2; + -webkit-column-count: 2; + -moz-column-count: 2; + column-gap: 0; + -webkit-column-gap: 0; + -moz-column-gap: 0; + margin: 0 -8px; +} +.md .ghcard-group .ghcard { + margin: 8px; +} +.md .img { + object-fit: contain; +} +img.inline { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: inline !important; + vertical-align: middle; + transform: translateY(-4px); + -webkit-transform: translateY(-4px); + -khtml-transform: translateY(-4px); + -moz-transform: translateY(-4px); + -o-transform: translateY(-4px); + -ms-transform: translateY(-4px); +} +.md .tag.link { + margin-top: 1em; + margin-bottom: 1em; +} +.md .link-card { + margin-right: 1em; + background: var(--color-block); + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-inline-flexbox /* TWEENER - IE 10 */; + display: -webkit-inline-flex /* NEW - Chrome */; + display: inline-flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: inline-flex; + align-items: center; + cursor: pointer; + text-align: center; + width: 361px; + max-width: 100%; + box-shadow: 0 1px 2px 0px rgba(0,0,0,0.1); + -webkit-box-shadow: 0 1px 2px 0px rgba(0,0,0,0.1); + color: var(--color-p); + border-radius: 8px; + -webkit-border-radius: 8px; +} +@media screen and (max-width: 425px) { + .md .link-card { + max-width: 100%; + width: 100%; + } +} +.md .link-card:hover { + box-shadow: 0 4px 8px 0px rgba(0,0,0,0.1), 0 2px 4px 0px rgba(0,0,0,0.1), 0 4px 8px 0px rgba(0,0,0,0.1), 0 8px 16px 0px rgba(0,0,0,0.1); + -webkit-box-shadow: 0 4px 8px 0px rgba(0,0,0,0.1), 0 2px 4px 0px rgba(0,0,0,0.1), 0 4px 8px 0px rgba(0,0,0,0.1), 0 8px 16px 0px rgba(0,0,0,0.1); +} +.md .link-card div.left, +.md .link-card div.right { + pointer-events: none; +} +.md .link-card div.left { + width: 54px; + height: 54px; + margin: 12px; + overflow: hidden; + flex-shrink: 0; + position: relative; +} +.md .link-card div.left i { + font-size: 32px; + line-height: 48px; + margin-left: 4px; +} +.md .link-card div.left img { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + position: absolute; + border-radius: 8px/4; + -webkit-border-radius: 8px/4; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + -webkit-transform: translate(-50%, -50%); + -khtml-transform: translate(-50%, -50%); + -moz-transform: translate(-50%, -50%); + -o-transform: translate(-50%, -50%); + -ms-transform: translate(-50%, -50%); +} +.md .link-card div.right { + overflow: hidden; + margin-right: 16px; +} +.md .link-card p { + margin: 0; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; +} +.md .link-card p.text { + font-weight: bold; +} +.md .link-card p.url { + flex-shrink: 0; + color: var(--color-meta); + font-size: 0.8125rem; +} +.md .link-group { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: grid; + grid-template-columns: 1fr 1fr; + grid-gap: 16px; +} +@media screen and (max-width: 850px) { + .md .link-group { + grid-template-columns: 1fr; + } +} +.md .link-group .tag.link { + margin: 0; +} +.md .link-group .link-card { + width: 100%; +} +audio, +video { + border-radius: 4px; + -webkit-border-radius: 4px; + max-width: 100%; +} +video { + z-index: 1; + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; +} +video:hover { + box-shadow: 0 4px 8px 0px rgba(0,0,0,0.24), 0 8px 16px 0px rgba(0,0,0,0.24); + -webkit-box-shadow: 0 4px 8px 0px rgba(0,0,0,0.24), 0 8px 16px 0px rgba(0,0,0,0.24); +} +div.video { + line-height: 0; + text-align: center; +} +div.videos { + max-width: calc(100% + 2 * 4px); + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + flex-wrap: wrap; + -webkit-flex-wrap: wrap; + -khtml-flex-wrap: wrap; + -moz-flex-wrap: wrap; + -o-flex-wrap: wrap; + -ms-flex-wrap: wrap; + justify-content: flex-start; + -webkit-justify-content: flex-start; + -khtml-justify-content: flex-start; + -moz-justify-content: flex-start; + -o-justify-content: flex-start; + -ms-justify-content: flex-start; + align-items: flex-end; + margin: 1em -4px; +} +div.videos .video, +div.videos iframe { + width: 100%; + margin: 4px; +} +div.videos iframe { + border-radius: 4px; + -webkit-border-radius: 4px; + width: 100%; + min-height: 300px; +} +div.videos.left { + justify-content: flex-start; + -webkit-justify-content: flex-start; + -khtml-justify-content: flex-start; + -moz-justify-content: flex-start; + -o-justify-content: flex-start; + -ms-justify-content: flex-start; +} +div.videos.center { + justify-content: center; + -webkit-justify-content: center; + -khtml-justify-content: center; + -moz-justify-content: center; + -o-justify-content: center; + -ms-justify-content: center; +} +div.videos.right { + justify-content: flex-end; + -webkit-justify-content: flex-end; + -khtml-justify-content: flex-end; + -moz-justify-content: flex-end; + -o-justify-content: flex-end; + -ms-justify-content: flex-end; +} +div.videos.stretch { + align-items: stretch; +} +div.videos[col='1'] .video, +div.videos[col='1'] iframe { + width: 100%; +} +div.videos[col='2'] .video, +div.videos[col='2'] iframe { + width: calc(50% - 2 * 4px); +} +div.videos[col='3'] .video, +div.videos[col='3'] iframe { + width: calc(33.33% - 2 * 4px); +} +div.videos[col='4'] .video, +div.videos[col='4'] iframe { + width: calc(25% - 2 * 4px); +} +div.note { + position: relative; + margin-top: 1em; + margin-bottom: 1em; + padding: 16px; + padding-left: calc(16px + 16px); + border-radius: 4px; + -webkit-border-radius: 4px; + font-size: 0.9375rem; + background: var(--color-block); + border-left: 4px solid #3dd9b6; +} +div.note h2, +div.note h3, +div.note h4, +div.note h5, +div.note h6 { + margin-top: 3px; + margin-bottom: 0; + padding-top: 0 !important; + border-bottom: initial; +} +div.note p, +div.note ul, +div.note ol, +div.note blockquote, +div.note img { + margin-top: 0.5em; + margin-bottom: 0.5em; +} +div.note .link-card { + background: var(--color-card); +} +div.note::before { + position: absolute; + top: calc(50% - 24px * 0.5); + left: 4px; + width: 24px; + height: 24px; + text-align: center; + font-weight: 600; + line-height: 24px; + vertical-align: middle; + font-family: 'Font Awesome 6 Pro'; +} +div.note::before { + color: #3dd9b6; + content: '\f054'; +} +div.note::before { + content: '\f054'; +} +div.note.quote { + background: #e8f4fd; + border-color: #2196f3; +} +div.note.quote::before { + color: #2196f3; + content: '\f10d'; +} +div.note.info { + background: #ebfbf7; + border-color: #3dd9b6; +} +div.note.info::before { + color: #3dd9b6; + content: '\f129'; +} +div.note.success, +div.note.done { + background: #ebf9ed; + border-color: #3dc550; +} +div.note.success::before, +div.note.done::before { + color: #3dc550; + content: '\f00c'; +} +div.note.warning { + background: #fff8e9; + border-color: #ffbd2b; +} +div.note.warning::before { + color: #ffbd2b; + content: '\f12a'; +} +div.note.danger, +div.note.error { + background: #feefee; + border-color: #fe5f58; +} +div.note.danger::before, +div.note.error::before { + color: #fe5f58; + content: '\f00d'; +} +div.note.radiation::before { + content: '\f7b9'; +} +div.note.bug::before { + content: '\f188'; +} +div.note.idea::before { + content: '\f0eb'; +} +div.note.link::before { + content: '\f0c1'; +} +div.note.paperclip::before { + content: '\f0c6'; +} +div.note.todo::before { + content: '\f0ae'; +} +div.note.message::before { + content: '\f4ad'; +} +div.note.guide::before { + content: '\f277'; +} +div.note.download::before { + content: '\f019'; +} +div.note.up::before { + content: '\f102'; +} +div.note.undo::before { + content: '\f2ea'; +} +div.note.play::before { + content: '\f144'; +} +div.note.clear { + background: none; + border-color: none; +} +div.note.light { + background: #f5f5f5; + border-color: #a1a1a1; +} +div.note.light::before { + color: #a1a1a1; +} +div.note.gray { + background: #f5f5f5; + border-color: #696969; +} +div.note.gray::before { + color: #696969; +} +div.note.theme { + background: #ebfbf7; + border-color: #3dd9b6; +} +div.note.theme::before { + color: #3dd9b6; +} +div.note.red { + background: #feefee; + border-color: #fe5f58; +} +div.note.red::before { + color: #fe5f58; +} +div.note.yellow { + background: #fff8e9; + border-color: #ffbd2b; +} +div.note.yellow::before { + color: #ffbd2b; +} +div.note.green { + background: #ebf9ed; + border-color: #3dc550; +} +div.note.green::before { + color: #3dc550; +} +div.note.cyan { + background: #e8fafe; + border-color: #1bcdfc; +} +div.note.cyan::before { + color: #1bcdfc; +} +div.note.blue { + background: #e8f4fd; + border-color: #2196f3; +} +div.note.blue::before { + color: #2196f3; +} +.sites-wrap .group-header { + margin: 0 0 1rem; +} +.sites-wrap .group-header p { + margin: 0; + font-size: 0.875rem; +} +.sites-wrap .group-header p:first-child { + font-size: 1.25rem; + font-weight: 500; +} +.sites-wrap .group-body { + width: 100%; + margin-bottom: 2rem; +} +.sites-wrap .sitesjs-wrap { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; +} +.sites-wrap .sitesjs-wrap .loading-wrap { + min-height: 50px; + margin: 2rem 0; + text-align: center; +} +.sites-wrap .group-body { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: grid; + grid-gap: 1rem 1rem; + grid-template-columns: repeat(auto-fill, calc((100% - 3 * 1rem) / 4)); + margin-bottom: 2rem; +} +@media screen and (max-width: 1024px) { + .sites-wrap .group-body { + grid-template-columns: repeat(auto-fill, calc((100% - 2 * 1rem) / 3)); + } +} +@media screen and (max-width: 900px) { + .sites-wrap .group-body { + grid-template-columns: repeat(auto-fill, calc((100% - 1 * 1rem) / 2)); + } +} +@media screen and (max-width: 768px) { + .sites-wrap .group-body { + grid-template-columns: repeat(auto-fill, calc((100% - 2 * 1rem) / 3)); + } +} +@media screen and (max-width: 500px) { + .sites-wrap .group-body { + grid-template-columns: repeat(auto-fill, calc((100% - 1 * 1rem) / 2)); + } +} +.sites-wrap .group-body .site-card .card-link { + width: 100%; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + -webkit-box-direction: normal; + -moz-box-direction: normal; + -webkit-box-orient: vertical; + -moz-box-orient: vertical; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; +} +.sites-wrap .group-body .site-card .card-link >img { + width: 100%; + height: 120px; + border-radius: 4px; + -webkit-border-radius: 4px; + object-fit: cover; + box-shadow: 0 1px 2px 0px rgba(0,0,0,0.2); + -webkit-box-shadow: 0 1px 2px 0px rgba(0,0,0,0.2); +} +@media screen and (max-width: 1024px) { + .sites-wrap .group-body .site-card .card-link >img { + height: 150px; + } +} +@media screen and (max-width: 900px) { + .sites-wrap .group-body .site-card .card-link >img { + height: 180px; + } +} +@media screen and (max-width: 768px) { + .sites-wrap .group-body .site-card .card-link >img { + height: 150px; + } +} +.sites-wrap .group-body .site-card .card-link .info { + margin-top: 0.5rem; + line-height: 1.2; +} +.sites-wrap .group-body .site-card .card-link .info >img { + width: 28px; + height: 28px; + border-radius: 28px; + -webkit-border-radius: 28px; + float: left; + margin-right: 8px; + margin-top: 2px; +} +.sites-wrap .group-body .site-card .card-link .info span { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; +} +.sites-wrap .group-body .site-card .card-link .info .title { + font-weight: 500; + color: var(--text-p1); + font-size: 0.875rem; + margin-top: 1px; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -webkit-box; + -webkit-box-orient: vertical; + overflow: hidden; + -webkit-line-clamp: 1; +} +.sites-wrap .group-body .site-card .card-link .info .desc { + font-size: 10px; + margin-top: 2px; + word-wrap: break-word; + color: var(--text-p3); + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -webkit-box; + -webkit-box-orient: vertical; + overflow: hidden; + -webkit-line-clamp: 2; +} +.sites-wrap .site-card .card-link >img { + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; +} +.sites-wrap .site-card .card-link:hover >img { + box-shadow: 0 4px 8px 0px rgba(0,0,0,0.1), 0 2px 4px 0px rgba(0,0,0,0.1), 0 4px 8px 0px rgba(0,0,0,0.1), 0 8px 16px 0px rgba(0,0,0,0.1); + -webkit-box-shadow: 0 4px 8px 0px rgba(0,0,0,0.1), 0 2px 4px 0px rgba(0,0,0,0.1), 0 4px 8px 0px rgba(0,0,0,0.1), 0 8px 16px 0px rgba(0,0,0,0.1); +} +p.p.subtitle { + font-weight: bold; + color: #3eb399; + font-size: 1.25rem !important; + padding-top: 1.5rem; +} +p.p.subtitle:first-child { + padding-top: 1rem; +} +span.p.logo, +p.p.logo { + font-family: HFSnakylines, "PingFang SC", "Microsoft YaHei", Helvetica, Arial, Helvetica, monospace; +} +span.p.code, +p.p.code { + font-family: JetbrainsMono, "PingFang SC", "Microsoft YaHei", Helvetica, Arial, monospace, courier, sans-serif; +} +span.p.left, +p.p.left { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + text-align: left; +} +span.p.center, +p.p.center { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + text-align: center; +} +span.p.right, +p.p.right { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + text-align: right; +} +span.p.small, +p.p.small { + font-size: 0.875rem; +} +span.p.large, +p.p.large { + font-size: 2.5rem; + line-height: 1.4; +} +span.p.huge, +p.p.huge { + font-size: 4rem; + line-height: 1.4; +} +span.p.ultra, +p.p.ultra { + font-size: 6rem; + line-height: 1.4; +} +span.p.small, +p.p.small, +span.p.large, +p.p.large, +span.p.huge, +p.p.huge, +span.p.ultra, +p.p.ultra { + margin: 0; + padding: 0; +} +span.p.bold, +p.p.bold { + font-weight: bold; +} +span.p.h1, +p.p.h1, +span.p.h2, +p.p.h2 { + padding-bottom: 0.2rem; + font-weight: 500; +} +span.p.h1, +p.p.h1 { + font-size: 1.5rem; + color: var(--color-h1); + padding-top: 2em; +} +span.p.h2, +p.p.h2 { + font-size: 1.5rem; + color: var(--color-h2); + padding-top: 2em; + border-bottom: 1px solid rgba(68,68,68,0.1); +} +span.p.h3, +p.p.h3 { + font-size: 1.25rem; + color: var(--color-h3); + padding-top: 2em; +} +span.p.h4, +p.p.h4 { + font-size: 1.125rem; + color: var(--color-h4); + padding-top: 2em; +} +span.p.h5, +p.p.h5 { + font-size: 1rem; + color: var(--color-h5); + padding-top: 1.5em; +} +span.p.red, +p.p.red { + color: #fe5f58; +} +span.p.yellow, +p.p.yellow { + color: #ffbd2b; +} +span.p.green, +p.p.green { + color: #3dc550; +} +span.p.cyan, +p.p.cyan { + color: #1bcdfc; +} +span.p.blue, +p.p.blue { + color: #2196f3; +} +span.p.purple, +p.p.purple { + color: #9c27b0; +} +span.p.gray, +p.p.gray { + color: #999; +} +.swiper-container { + width: 100%; + border-radius: 4px; + -webkit-border-radius: 4px; + --gap-p: 2rem; +} +.swiper-container:not(.swiper-container-initialized) { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: none; +} +div.swiper-slide { + text-align: center; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -webkit-box; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -webkit-flex; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + align-self: center; + -webkit-box-pack: center; + -ms-flex-pack: center; + -webkit-justify-content: center; + justify-content: center; + -webkit-justify-content: center; + -khtml-justify-content: center; + -moz-justify-content: center; + -o-justify-content: center; + -ms-justify-content: center; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; + width: 50%; +} +div.swiper-slide img { + border-radius: 4px; + -webkit-border-radius: 4px; +} +.swiper-container[width='max'] div.swiper-slide { + width: 100%; +} +.swiper-container[width='min'] div.swiper-slide { + width: 25%; +} +.swiper-button-prev, +.swiper-button-next { + padding: 1rem 0.5rem; + margin-top: -2rem !important; + border-radius: 4px; + -webkit-border-radius: 4px; + background: rgba(255,255,255,0.25); + transition: background 0.2s ease-out; + -webkit-transition: background 0.2s ease-out; + -khtml-transition: background 0.2s ease-out; + -moz-transition: background 0.2s ease-out; + -o-transition: background 0.2s ease-out; + -ms-transition: background 0.2s ease-out; + --swiper-theme-color: #000 !important; +} +.swiper-button-prev:after, +.swiper-button-next:after { + font-size: 1.2rem !important; + font-weight: 700 !important; +} +.swiper-button-prev:hover, +.swiper-button-next:hover { + background: #fff !important; + --swiper-theme-color: #ff5722 !important; +} +.md .table { + overflow: auto; + margin-top: 1em; + margin-bottom: 1em; +} +.md .table table { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: table; + width: 100%; +} +div.tabs { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + position: relative; + margin-top: 1em; + margin-bottom: 1em; + border-radius: 4px; + -webkit-border-radius: 4px; + background: var(--color-card); + border: 1px solid rgba(68,68,68,0.2); + font-size: 0.9375rem; +} +div.tabs .highlight, +div.tabs p, +div.tabs ul, +div.tabs ol, +div.tabs div.note, +div.tabs details { + margin-top: 1em; + margin-bottom: 1em; +} +div.tabs ul.nav-tabs { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + overflow-x: auto; + white-space: nowrap; + justify-content: flex-start; + -webkit-justify-content: flex-start; + -khtml-justify-content: flex-start; + -moz-justify-content: flex-start; + -o-justify-content: flex-start; + -ms-justify-content: flex-start; + margin: 0 !important; + padding: 8px 8px 0 8px; + background: var(--color-block); + border-radius: 4px 4px 0 0; + -webkit-border-radius: 4px 4px 0 0; + line-height: 1.5; +} +div.tabs ul.nav-tabs li.tab { + list-style-type: none; + margin-top: 0; + margin-bottom: 0; +} +div.tabs ul.nav-tabs li.tab:last-child { + padding-right: 16px; +} +div.tabs ul.nav-tabs li.tab a { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + cursor: pointer; + border-radius: 4px 4px 0 0; + -webkit-border-radius: 4px 4px 0 0; + padding: 8px; + text-align: center; + font-size: 0.875rem; + line-height: inherit; + font-weight: bold; + color: var(--color-meta); + border: 1px solid transparent; +} +div.tabs ul.nav-tabs li.tab a:hover { + color: var(--color-p); +} +div.tabs ul.nav-tabs li.tab a i { + pointer-events: none; +} +div.tabs ul.nav-tabs li.tab.active a { + cursor: default; + color: var(--color-p); + background: #fff; + border: 1px solid rgba(68,68,68,0.2); + border-bottom: 1px solid var(--color-card); +} +div.tabs .tab-content { + border-top: 1px solid rgba(68,68,68,0.2); + margin-top: -1px; +} +div.tabs .tab-content .tab-pane { + padding: 16px; +} +div.tabs .tab-content .tab-pane:not(.active) { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: none; +} +div.tabs .tab-content .tab-pane.active { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; +} +div.tabs .tab-content .tab-pane > p:first-child, +div.tabs .tab-content .tab-pane > .tabs:first-child, +div.tabs .tab-content .tab-pane > ul:first-child, +div.tabs .tab-content .tab-pane > ol:first-child, +div.tabs .tab-content .tab-pane > .highlight:first-child, +div.tabs .tab-content .tab-pane > .note:first-child { + margin-top: 0; +} +div.tabs .tab-content .tab-pane > p:last-child, +div.tabs .tab-content .tab-pane > .tabs:last-child, +div.tabs .tab-content .tab-pane > ul:last-child, +div.tabs .tab-content .tab-pane > ol:last-child, +div.tabs .tab-content .tab-pane > .highlight:last-child, +div.tabs .tab-content .tab-pane > .note:last-child { + margin-bottom: 0; +} +.article del { + color: #8e8e8e; + text-decoration-color: #8e8e8e; +} +.article u { + color: var(--color-text); + text-decoration: none; + border-bottom: 1px solid #fe5f58; +} +.article emp { + color: var(--color-text); + border-bottom: 4px dotted #fe5f58; +} +.article wavy { + color: var(--color-text); + text-decoration-style: wavy; + text-decoration-line: underline; + text-decoration-color: #fe5f58; +} +.article psw { + color: transparent; + background: #a1a1a1; + border-radius: 2px; + -webkit-border-radius: 2px; + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; +} +.article psw:hover { + color: var(--color-p); + background: none; +} +.article kbd { + border-radius: 4px; + -webkit-border-radius: 4px; + border: 1px solid #d2d2d2; + border-bottom-width: 2px; + background: #fafafa; + padding-left: 4px; + padding-right: 4px; +} +div.timenode { + position: relative; +} +div.timenode:before, +div.timenode:after { + content: ''; + z-index: 1; + position: absolute; + background: rgba(61,217,182,0.5); + width: 2px; + left: 7px; +} +div.timenode:before { + top: 0px; + height: 6px; +} +div.timenode:after { + top: 26px; + height: calc(100% - 26px); +} +div.timenode:last-child:after { + height: calc(100% - 26px - 16px); + border-bottom-left-radius: 2px; + border-bottom-right-radius: 2px; +} +div.timenode .meta, +div.timenode .body { + max-width: calc(100% - 24px); +} +div.timenode .meta { + position: relative; + color: var(--color-meta); + font-size: 0.875rem; + line-height: 32px; + height: 32px; +} +div.timenode .meta:before, +div.timenode .meta:after { + content: ''; + position: absolute; + top: 8px; + z-index: 2; +} +div.timenode .meta:before { + background: rgba(61,217,182,0.5); + width: 16px; + height: 16px; + border-radius: 8px; + -webkit-border-radius: 8px; +} +div.timenode .meta:after { + background: #3dd9b6; + margin-left: 2px; + margin-top: 2px; + width: 12px; + height: 12px; + border-radius: 6px; + -webkit-border-radius: 6px; + transform: scale(0.5); + -webkit-transform: scale(0.5); + -khtml-transform: scale(0.5); + -moz-transform: scale(0.5); + -o-transform: scale(0.5); + -ms-transform: scale(0.5); + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; +} +div.timenode .meta p { + font-weight: bold; + margin: 0 0 0 24px; +} +div.timenode .body { + margin: 4px 0 16px 24px; + padding: 16px; + border-radius: 8px; + -webkit-border-radius: 8px; + background: var(--color-block); + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: inline-block; +} +div.timenode .body:empty { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: none; +} +div.timenode .body >*:first-child { + margin-top: 0.25em; +} +div.timenode .body >*:last-child { + margin-bottom: 0.25em; +} +div.timenode .body .highlight { + border: 1px solid #e4e4e4; +} +div.timenode:hover .meta { + color: var(--color-text); +} +div.timenode:hover .meta:before { + background: rgba(255,87,34,0.5); +} +div.timenode:hover .meta:after { + background: #ff5722; + transform: scale(1); + -webkit-transform: scale(1); + -khtml-transform: scale(1); + -moz-transform: scale(1); + -o-transform: scale(1); + -ms-transform: scale(1); +} +.article mjx-container { + font-family: JetbrainsMono, "PingFang SC", "Microsoft YaHei", Helvetica, Arial, monospace, courier, sans-serif; + padding: 16px 8px; + border-radius: 4px; + -webkit-border-radius: 4px; + min-width: 0 !important; +} +.article mjx-container[jax="CHTML"][display="true"], +.article .has-jax { + overflow: auto hidden; +} +.article mjx-container + br { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: none; +} +.fa.red, +.fas.red, +.far.red, +.fad.red, +.fal.red, +.fa-solid.red, +.fa-regular.red, +.fa-duotone.red, +.fa-light.red, +.fa-thin.red, +.iziToast>.iziToast-body .iziToast-icon.red { + color: #f44336; +} +.fa.pink, +.fas.pink, +.far.pink, +.fad.pink, +.fal.pink, +.fa-solid.pink, +.fa-regular.pink, +.fa-duotone.pink, +.fa-light.pink, +.fa-thin.pink, +.iziToast>.iziToast-body .iziToast-icon.pink { + color: #e91e63; +} +.fa.purple, +.fas.purple, +.far.purple, +.fad.purple, +.fal.purple, +.fa-solid.purple, +.fa-regular.purple, +.fa-duotone.purple, +.fa-light.purple, +.fa-thin.purple, +.iziToast>.iziToast-body .iziToast-icon.purple { + color: #9c27b0; +} +.fa.indigo, +.fas.indigo, +.far.indigo, +.fad.indigo, +.fal.indigo, +.fa-solid.indigo, +.fa-regular.indigo, +.fa-duotone.indigo, +.fa-light.indigo, +.fa-thin.indigo, +.iziToast>.iziToast-body .iziToast-icon.indigo { + color: #3f51b5; +} +.fa.light-blue, +.fas.light-blue, +.far.light-blue, +.fad.light-blue, +.fal.light-blue, +.fa-solid.light-blue, +.fa-regular.light-blue, +.fa-duotone.light-blue, +.fa-light.light-blue, +.fa-thin.light-blue, +.iziToast>.iziToast-body .iziToast-icon.light-blue { + color: #4ba7ee; +} +.fa.deep-blue, +.fas.deep-blue, +.far.deep-blue, +.fad.deep-blue, +.fal.deep-blue, +.fa-solid.deep-blue, +.fa-regular.deep-blue, +.fa-duotone.deep-blue, +.fa-light.deep-blue, +.fa-thin.deep-blue, +.iziToast>.iziToast-body .iziToast-icon.deep-blue { + color: #3367d6; +} +.fa.teal, +.fas.teal, +.far.teal, +.fad.teal, +.fal.teal, +.fa-solid.teal, +.fa-regular.teal, +.fa-duotone.teal, +.fa-light.teal, +.fa-thin.teal, +.iziToast>.iziToast-body .iziToast-icon.teal { + color: #009688; +} +.fa.light-green, +.fas.light-green, +.far.light-green, +.fad.light-green, +.fal.light-green, +.fa-solid.light-green, +.fa-regular.light-green, +.fa-duotone.light-green, +.fa-light.light-green, +.fa-thin.light-green, +.iziToast>.iziToast-body .iziToast-icon.light-green { + color: #8bc34a; +} +.fa.orange, +.fas.orange, +.far.orange, +.fad.orange, +.fal.orange, +.fa-solid.orange, +.fa-regular.orange, +.fa-duotone.orange, +.fa-light.orange, +.fa-thin.orange, +.iziToast>.iziToast-body .iziToast-icon.orange { + color: #ff9800; +} +.fa.deep-orange, +.fas.deep-orange, +.far.deep-orange, +.fad.deep-orange, +.fal.deep-orange, +.fa-solid.deep-orange, +.fa-regular.deep-orange, +.fa-duotone.deep-orange, +.fa-light.deep-orange, +.fa-thin.deep-orange, +.iziToast>.iziToast-body .iziToast-icon.deep-orange { + color: #ff5722; +} +.fa.brown, +.fas.brown, +.far.brown, +.fad.brown, +.fal.brown, +.fa-solid.brown, +.fa-regular.brown, +.fa-duotone.brown, +.fa-light.brown, +.fa-thin.brown, +.iziToast>.iziToast-body .iziToast-icon.brown { + color: #795548; +} +.fa.blue-grey, +.fas.blue-grey, +.far.blue-grey, +.fad.blue-grey, +.fal.blue-grey, +.fa-solid.blue-grey, +.fa-regular.blue-grey, +.fa-duotone.blue-grey, +.fa-light.blue-grey, +.fa-thin.blue-grey, +.iziToast>.iziToast-body .iziToast-icon.blue-grey { + color: #607d8b; +} +.fa.yellow, +.fas.yellow, +.far.yellow, +.fad.yellow, +.fal.yellow, +.fa-solid.yellow, +.fa-regular.yellow, +.fa-duotone.yellow, +.fa-light.yellow, +.fa-thin.yellow, +.iziToast>.iziToast-body .iziToast-icon.yellow { + color: #fcec60; +} +.fa.TURQUOISE, +.fas.TURQUOISE, +.far.TURQUOISE, +.fad.TURQUOISE, +.fal.TURQUOISE, +.fa-solid.TURQUOISE, +.fa-regular.TURQUOISE, +.fa-duotone.TURQUOISE, +.fa-light.TURQUOISE, +.fa-thin.TURQUOISE, +.iziToast>.iziToast-body .iziToast-icon.TURQUOISE { + color: #1abc9c; +} +.fa.EMERALD, +.fas.EMERALD, +.far.EMERALD, +.fad.EMERALD, +.fal.EMERALD, +.fa-solid.EMERALD, +.fa-regular.EMERALD, +.fa-duotone.EMERALD, +.fa-light.EMERALD, +.fa-thin.EMERALD, +.iziToast>.iziToast-body .iziToast-icon.EMERALD { + color: #2ecc71; +} +.fa.PETERRIVE, +.fas.PETERRIVE, +.far.PETERRIVE, +.fad.PETERRIVE, +.fal.PETERRIVE, +.fa-solid.PETERRIVE, +.fa-regular.PETERRIVE, +.fa-duotone.PETERRIVE, +.fa-light.PETERRIVE, +.fa-thin.PETERRIVE, +.iziToast>.iziToast-body .iziToast-icon.PETERRIVE { + color: #3498db; +} +.fa.AMETHYST, +.fas.AMETHYST, +.far.AMETHYST, +.fad.AMETHYST, +.fal.AMETHYST, +.fa-solid.AMETHYST, +.fa-regular.AMETHYST, +.fa-duotone.AMETHYST, +.fa-light.AMETHYST, +.fa-thin.AMETHYST, +.iziToast>.iziToast-body .iziToast-icon.AMETHYST { + color: #9b59b6; +} +.fa.WETASPHALT, +.fas.WETASPHALT, +.far.WETASPHALT, +.fad.WETASPHALT, +.fal.WETASPHALT, +.fa-solid.WETASPHALT, +.fa-regular.WETASPHALT, +.fa-duotone.WETASPHALT, +.fa-light.WETASPHALT, +.fa-thin.WETASPHALT, +.iziToast>.iziToast-body .iziToast-icon.WETASPHALT { + color: #34495e; +} +.fa.GREENSEA, +.fas.GREENSEA, +.far.GREENSEA, +.fad.GREENSEA, +.fal.GREENSEA, +.fa-solid.GREENSEA, +.fa-regular.GREENSEA, +.fa-duotone.GREENSEA, +.fa-light.GREENSEA, +.fa-thin.GREENSEA, +.iziToast>.iziToast-body .iziToast-icon.GREENSEA { + color: #16a085; +} +.fa.NEPHRITIS, +.fas.NEPHRITIS, +.far.NEPHRITIS, +.fad.NEPHRITIS, +.fal.NEPHRITIS, +.fa-solid.NEPHRITIS, +.fa-regular.NEPHRITIS, +.fa-duotone.NEPHRITIS, +.fa-light.NEPHRITIS, +.fa-thin.NEPHRITIS, +.iziToast>.iziToast-body .iziToast-icon.NEPHRITIS { + color: #27ae60; +} +.fa.BELIZEHOLE, +.fas.BELIZEHOLE, +.far.BELIZEHOLE, +.fad.BELIZEHOLE, +.fal.BELIZEHOLE, +.fa-solid.BELIZEHOLE, +.fa-regular.BELIZEHOLE, +.fa-duotone.BELIZEHOLE, +.fa-light.BELIZEHOLE, +.fa-thin.BELIZEHOLE, +.iziToast>.iziToast-body .iziToast-icon.BELIZEHOLE { + color: #2980b9; +} +.fa.WISTERIA, +.fas.WISTERIA, +.far.WISTERIA, +.fad.WISTERIA, +.fal.WISTERIA, +.fa-solid.WISTERIA, +.fa-regular.WISTERIA, +.fa-duotone.WISTERIA, +.fa-light.WISTERIA, +.fa-thin.WISTERIA, +.iziToast>.iziToast-body .iziToast-icon.WISTERIA { + color: #8e44ad; +} +.fa.MIDNIGHTBLUE, +.fas.MIDNIGHTBLUE, +.far.MIDNIGHTBLUE, +.fad.MIDNIGHTBLUE, +.fal.MIDNIGHTBLUE, +.fa-solid.MIDNIGHTBLUE, +.fa-regular.MIDNIGHTBLUE, +.fa-duotone.MIDNIGHTBLUE, +.fa-light.MIDNIGHTBLUE, +.fa-thin.MIDNIGHTBLUE, +.iziToast>.iziToast-body .iziToast-icon.MIDNIGHTBLUE { + color: #2c3e50; +} +.fa.SUNFLOWER, +.fas.SUNFLOWER, +.far.SUNFLOWER, +.fad.SUNFLOWER, +.fal.SUNFLOWER, +.fa-solid.SUNFLOWER, +.fa-regular.SUNFLOWER, +.fa-duotone.SUNFLOWER, +.fa-light.SUNFLOWER, +.fa-thin.SUNFLOWER, +.iziToast>.iziToast-body .iziToast-icon.SUNFLOWER { + color: #f1c40f; +} +.fa.CARROT, +.fas.CARROT, +.far.CARROT, +.fad.CARROT, +.fal.CARROT, +.fa-solid.CARROT, +.fa-regular.CARROT, +.fa-duotone.CARROT, +.fa-light.CARROT, +.fa-thin.CARROT, +.iziToast>.iziToast-body .iziToast-icon.CARROT { + color: #e67e22; +} +.fa.ALIZARIN, +.fas.ALIZARIN, +.far.ALIZARIN, +.fad.ALIZARIN, +.fal.ALIZARIN, +.fa-solid.ALIZARIN, +.fa-regular.ALIZARIN, +.fa-duotone.ALIZARIN, +.fa-light.ALIZARIN, +.fa-thin.ALIZARIN, +.iziToast>.iziToast-body .iziToast-icon.ALIZARIN { + color: #e74c3c; +} +.fa.CLOUDS, +.fas.CLOUDS, +.far.CLOUDS, +.fad.CLOUDS, +.fal.CLOUDS, +.fa-solid.CLOUDS, +.fa-regular.CLOUDS, +.fa-duotone.CLOUDS, +.fa-light.CLOUDS, +.fa-thin.CLOUDS, +.iziToast>.iziToast-body .iziToast-icon.CLOUDS { + color: #ecf0f1; +} +.fa.CONCRETE, +.fas.CONCRETE, +.far.CONCRETE, +.fad.CONCRETE, +.fal.CONCRETE, +.fa-solid.CONCRETE, +.fa-regular.CONCRETE, +.fa-duotone.CONCRETE, +.fa-light.CONCRETE, +.fa-thin.CONCRETE, +.iziToast>.iziToast-body .iziToast-icon.CONCRETE { + color: #95a5a6; +} +.fa.ORANGE, +.fas.ORANGE, +.far.ORANGE, +.fad.ORANGE, +.fal.ORANGE, +.fa-solid.ORANGE, +.fa-regular.ORANGE, +.fa-duotone.ORANGE, +.fa-light.ORANGE, +.fa-thin.ORANGE, +.iziToast>.iziToast-body .iziToast-icon.ORANGE { + color: #f39c12; +} +.fa.PUMPKIN, +.fas.PUMPKIN, +.far.PUMPKIN, +.fad.PUMPKIN, +.fal.PUMPKIN, +.fa-solid.PUMPKIN, +.fa-regular.PUMPKIN, +.fa-duotone.PUMPKIN, +.fa-light.PUMPKIN, +.fa-thin.PUMPKIN, +.iziToast>.iziToast-body .iziToast-icon.PUMPKIN { + color: #d35400; +} +.fa.POMEGRANATE, +.fas.POMEGRANATE, +.far.POMEGRANATE, +.fad.POMEGRANATE, +.fal.POMEGRANATE, +.fa-solid.POMEGRANATE, +.fa-regular.POMEGRANATE, +.fa-duotone.POMEGRANATE, +.fa-light.POMEGRANATE, +.fa-thin.POMEGRANATE, +.iziToast>.iziToast-body .iziToast-icon.POMEGRANATE { + color: #c0392b; +} +.fa.SILVER, +.fas.SILVER, +.far.SILVER, +.fad.SILVER, +.fal.SILVER, +.fa-solid.SILVER, +.fa-regular.SILVER, +.fa-duotone.SILVER, +.fa-light.SILVER, +.fa-thin.SILVER, +.iziToast>.iziToast-body .iziToast-icon.SILVER { + color: #bdc3c7; +} +.fa.ASBESTOS, +.fas.ASBESTOS, +.far.ASBESTOS, +.fad.ASBESTOS, +.fal.ASBESTOS, +.fa-solid.ASBESTOS, +.fa-regular.ASBESTOS, +.fa-duotone.ASBESTOS, +.fa-light.ASBESTOS, +.fa-thin.ASBESTOS, +.iziToast>.iziToast-body .iziToast-icon.ASBESTOS { + color: #7f8c8d; +} +.highlight { + position: relative; +} +.btn-copy { + z-index: 1; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: inline-block; + cursor: pointer; + border: none; + user-select: none; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + -webkit-appearance: none; + font-family: Menlo, JetbrainsMono, "PingFang SC", "Microsoft YaHei", Helvetica, Arial, monospace, courier, sans-serif; + font-size: 11px; + font-weight: bold; + padding: 4px 8px; + color: var(--color-meta); + background: var(--color-block); + border-radius: 3px; + -webkit-border-radius: 3px; + box-shadow: 0 1px 2px 0px rgba(0,0,0,0.1); + -webkit-box-shadow: 0 1px 2px 0px rgba(0,0,0,0.1); + position: absolute; + top: 1px; + right: 1px; + opacity: 0; + -webkit-opacity: 0; + -moz-opacity: 0; + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; +} +.btn-copy >i { + margin-right: 4px; +} +.btn-copy:hover { + color: #ff5722; + background: #ffeee8; +} +.highlight:hover .btn-copy { + opacity: 1; + -webkit-opacity: 1; + -moz-opacity: 1; +} +.article pre:hover .btn-copy { + opacity: 1; + -webkit-opacity: 1; + -moz-opacity: 1; +} +.hljs:before, +.highlight:before { + position: absolute; + top: 0; + right: 0; + color: var(--color-meta); + font-size: 13px; + padding: 4px 8px; +} +.hljs.md:before, +.highlight.md:before, +.hljs.markdown:before, +.highlight.markdown:before { + content: "md"; +} +.hljs.yaml:before, +.highlight.yaml:before { + content: "YAML"; +} +.hljs.json:before, +.highlight.json:before { + content: "JSON"; +} +.hljs.html:before, +.highlight.html:before { + content: "HTML"; +} +.hljs.js:before, +.highlight.js:before, +.hljs.javascript:before, +.highlight.javascript:before { + content: "JS"; +} +.hljs.css:before, +.highlight.css:before { + content: "CSS"; +} +.hljs.less:before, +.highlight.less:before { + content: "Less"; +} +.hljs.stylus:before, +.highlight.stylus:before { + content: "Stylus"; +} +.hljs.bash:before, +.highlight.bash:before { + content: "bash"; +} +.hljs.shell:before, +.highlight.shell:before { + content: "shell"; +} +.hljs.sh:before, +.highlight.sh:before { + content: "sh"; +} +.hljs.ini:before, +.highlight.ini:before { + content: "ini"; +} +.hljs.c:before, +.highlight.c:before { + content: "C"; +} +.hljs.cpp:before, +.highlight.cpp:before { + content: "C++"; +} +.hljs.objc:before, +.highlight.objc:before, +.hljs.objectivec:before, +.highlight.objectivec:before { + content: "Objective-C"; +} +.hljs.swift:before, +.highlight.swift:before { + content: "Swift"; +} +.hljs.java:before, +.highlight.java:before { + content: "Java"; +} +.hljs.python:before, +.highlight.python:before { + content: "Python"; +} +.hljs.php:before, +.highlight.php:before { + content: "PHP"; +} +.hljs.rust:before, +.highlight.rust:before { + content: "Rust"; +} +.hljs.sql:before, +.highlight.sql:before { + content: "SQL"; +} +.hljs.ruby:before, +.highlight.ruby:before { + content: "Ruby"; +} +.hljs.makefile:before, +.highlight.makefile:before { + content: "Makefile"; +} +.hljs.go:before, +.highlight.go:before { + content: "Go"; +} +.hljs.typescript:before, +.highlight.typescript:before { + content: "TypeScript"; +} +.highlight pre .line, +.highlight pre .params { + color: rgba(68,68,68,0.9); +} +.highlight pre .line .addition { + color: #3fa33f; +} +.highlight pre .line .deletion { + color: #ee2b29; +} +.highlight pre .marked { + background-color: rgba(254,213,66,0.4); + padding: 2px 8px 2px 0; + border-radius: 2px; + -webkit-border-radius: 2px; + width: 100%; +} +.highlight pre .title, +.highlight pre .attr, +.highlight pre .attribute { + color: #3f51b5; +} +.highlight pre .comment { + color: var(--color-meta); +} +.highlight pre .keyword, +.highlight pre .meta-keyword, +.highlight pre .javascript .function { + color: #9c27b0; +} +.highlight pre .type, +.highlight pre .built_in, +.highlight pre .tag .name { + color: #4ba7ee; +} +.highlight pre .variable, +.highlight pre .regexp, +.highlight pre .ruby .constant, +.highlight pre .xml .tag .title, +.highlight pre .xml .pi, +.highlight pre .xml .doctype, +.highlight pre .html .doctype, +.highlight pre .css .id, +.highlight pre .css .class, +.highlight pre .css .pseudo { + color: #fd8607; +} +.highlight pre .number, +.highlight pre .preprocessor, +.highlight pre .literal, +.highlight pre .constant { + color: #fd8607; +} +.highlight pre .class, +.highlight pre .ruby .class .title, +.highlight pre .css .rules .attribute { + color: #ff9800; +} +.highlight pre .string, +.highlight pre .meta-string { + color: #449e48; +} +.highlight pre .value, +.highlight pre .inheritance, +.highlight pre .header, +.highlight pre .ruby .symbol, +.highlight pre .xml .cdata { + color: #4caf50; +} +.highlight pre .css .hexcolor { + color: #6cc; +} +.highlight pre .function, +.highlight pre .python .decorator, +.highlight pre .python .title, +.highlight pre .ruby .function .title, +.highlight pre .ruby .title .keyword, +.highlight pre .perl .sub, +.highlight pre .javascript .title, +.highlight pre .coffeescript .title { + color: #69c; +} +.highlight.html .line .tag .name, +.highlight.css .line .tag .name, +.highlight.less .line .tag .name, +.highlight.stylus .line .tag .name, +.highlight.html .line .selector-tag, +.highlight.css .line .selector-tag, +.highlight.less .line .selector-tag, +.highlight.stylus .line .selector-tag { + color: #ee2b29; +} +.highlight.html .line .selector-class, +.highlight.css .line .selector-class, +.highlight.less .line .selector-class, +.highlight.stylus .line .selector-class, +.highlight.html .line .selector-attr, +.highlight.css .line .selector-attr, +.highlight.less .line .selector-attr, +.highlight.stylus .line .selector-attr { + color: #fd8607; +} +.highlight.html .line .attribute, +.highlight.css .line .attribute, +.highlight.less .line .attribute, +.highlight.stylus .line .attribute { + color: #3f51b5; +} +.highlight.html .line .number, +.highlight.css .line .number, +.highlight.less .line .number, +.highlight.stylus .line .number { + color: #17afca; +} +.highlight.objc .line .meta, +.highlight.objectivec .line .meta, +.highlight.swift .line .meta, +.highlight.c .line .meta { + color: #9c27b0; +} +.highlight.objc .line .meta-string, +.highlight.objectivec .line .meta-string, +.highlight.swift .line .meta-string, +.highlight.c .line .meta-string, +.highlight.objc .line .string, +.highlight.objectivec .line .string, +.highlight.swift .line .string, +.highlight.c .line .string { + color: #fb3f1b; +} +.highlight.objc .line .class, +.highlight.objectivec .line .class, +.highlight.swift .line .class, +.highlight.c .line .class { + color: rgba(68,68,68,0.9); +} +.highlight.objc .line .class .title, +.highlight.objectivec .line .class .title, +.highlight.swift .line .class .title, +.highlight.c .line .class .title { + color: #1e80f0; +} +.highlight.objc .line .comment, +.highlight.objectivec .line .comment, +.highlight.swift .line .comment, +.highlight.c .line .comment { + color: #3fa33f; +} +.highlight.json .line .attr { + color: #e24f5a; +} +.highlight.json .line .literal { + color: #3f51b5; +} +.highlight.yaml .line .attr { + color: #e24f5a; +} +pre { + position: relative; +} +.hljs { + margin: -16px !important; + padding: 16px !important; + -webkit-font-smoothing: auto; + -moz-osx-font-smoothing: auto; +} +.hljs::-webkit-scrollbar { + height: 4px; + width: 4px; +} +.hljs::-webkit-scrollbar-track-piece { + background: transparent; +} +.hljs::-webkit-scrollbar-thumb { + background: #3dd9b6; + cursor: pointer; + border-radius: 2px; + -webkit-border-radius: 2px; +} +.hljs::-webkit-scrollbar-thumb:hover { + background: #ff5722; +} +.highlight { + position: relative; + width: 100%; + margin: 1em 0; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + background: var(--color-block); + font-size: 0.8125rem; + font-family: JetbrainsMono, "PingFang SC", "Microsoft YaHei", Helvetica, Arial, monospace, courier, sans-serif; + border-radius: 4px; + -webkit-border-radius: 4px; + line-height: 1.5; + -webkit-font-smoothing: auto; + -moz-osx-font-smoothing: auto; + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; +} +.highlight:hover { + background: var(--color-codeblock); +} +.highlight:hover figcaption { + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; + background: #ffeed2; +} +.highlight:hover .gutter { + background: #ffedd0; +} +.highlight figcaption { + font-size: 13px; + position: sticky; + left: 0; + padding: 4px 8px 4px 8px; + background: #eaeaea; + border-top-left-radius: calc(4px - 1px); + border-top-right-radius: calc(4px - 1px); +} +.highlight >table { + overflow: auto; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + margin: 0; + background-color: transparent; + border: none; +} +.highlight >table::-webkit-scrollbar { + height: 4px; + width: 4px; +} +.highlight >table::-webkit-scrollbar-track-piece { + background: transparent; +} +.highlight >table::-webkit-scrollbar-thumb { + background: transparent; + cursor: pointer; + border-radius: 4px; + -webkit-border-radius: 4px; +} +.highlight >table:hover::-webkit-scrollbar-thumb { + background: rgba(68,68,68,0.5); +} +.highlight >table:hover::-webkit-scrollbar-thumb:hover { + background: #ff5722; +} +.highlight >table td, +.highlight >table th { + padding: 0; + border: none; + line-height: 1.5; +} +.highlight >table tr { + background-color: transparent; +} +.highlight >table tr:hover { + background-color: transparent; +} +.highlight >table pre { + overflow-y: hidden; +} +.highlight >table .gutter { + user-select: none; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + padding: 0 12px; + text-align: right; + border-width: 0; + margin-left: 0; + position: sticky; + left: 0; + z-index: 1; + background: #e9e9e9; +} +.highlight >table .gutter pre { + color: var(--color-meta); +} +.highlight >table pre { + background: transparent; + margin: 0; + padding: 0; + border: none; +} +.highlight >table pre .code:before { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: none; +} +.highlight >table .code { + padding: 20px 16px; + vertical-align: top; + background-color: transparent; +} +.highlight >table .code:before { + content: ""; + position: absolute; + top: 0; + right: 0; + color: var(--color-meta); + font-size: 13px; + padding: 4px 8px; +} +.iziToast-texts { + max-width: 300px !important; + min-width: 200px !important; +} +@media screen and (max-width: 500px) { + .iziToast-texts { + max-width: unset !important; + min-width: unset !important; + } +} +.iziToast-title { + margin-bottom: 6px !important; + font-size: 1rem !important; +} +.iziToast-message { + word-break: break-all !important; +} +@media screen and (max-width: 500px) { + .l_header .list-v .aplayer, + .l_header .list-v .aplayer-pic { + border-radius: 4px; + -webkit-border-radius: 4px; + width: 64px; + height: 64px; + } +} +.aplayer-container { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + justify-content: center; + -webkit-justify-content: center; + -khtml-justify-content: center; + -moz-justify-content: center; + -o-justify-content: center; + -ms-justify-content: center; + min-height: 100px; +} +.aplayer-container meting-js { + max-width: 100%; +} +.aplayer { + max-width: 500px; + border-radius: 4px; + -webkit-border-radius: 4px; + color: var(--color-text); + font-family: HYJiangJunJ, "PingFang SC", "Microsoft YaHei", Helvetica, Arial, Menlo, Monaco, monospace, sans-serif; +} +.aplayer .aplayer-list { + text-align: left; +} +@media screen and (max-width: 500px) { + .aplayer { + border-radius: 8px; + -webkit-border-radius: 8px; + } +} +.l_header .aplayer-volume-wrap { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: none !important; +} +.aplayer.aplayer-fixed.aplayer-narrow .aplayer-body { + left: -66px !important; +} +.aplayer.aplayer-fixed.aplayer-narrow .aplayer-body:hover { + left: 0px !important; +} +p, +input, +pre>span, +textarea { + cursor: url("https://unpkg.com/volantis-static@0.0.1660614606622/media/cursor/text.png"), text; +} +.fancybox-container .fancybox-stage, +.fancybox__carousel .is-draggable { + cursor: url("https://unpkg.com/volantis-static@0.0.1660614606622/media/cursor/zoom-out.png"), zoom-out; +} +.fancybox a, +.fancybox-can-zoomIn .fancybox-content, +.fancybox__carousel .fancybox__slide.can-zoom_in .fancybox__content { + cursor: url("https://unpkg.com/volantis-static@0.0.1660614606622/media/cursor/zoom-in.png"), zoom-in; +} +span.btn>a:not([href]):hover, +.fancybox-button[disabled], +.fancybox-button[disabled]:hover, +.gt-container .gt-btn.is--disable, +span.not-select { + cursor: url("https://unpkg.com/volantis-static@0.0.1660614606622/media/cursor/circle.png"), not-allowed; +} +html, +a:not([href]), +a:not([href]) p, +button[disabled], +html input[disabled], +.article .widget, +#l_body .post section.meta .new-meta-box .new-meta-item .notlink, +ul.list-v.rightmenu a, +span.btn a:not([href]), +div.tabs ul.nav-tabs li.tab.active a, +kbd, +.a > p, +.not-select, +.not-select p, +.aplayer .aplayer-info .aplayer-music, +.gt-container a.is--active, +.iziToast, +.iziToast p, +.iframe, +.embed-show, +p > img, +p > svg, +.fix-cursor-default { + cursor: url("https://unpkg.com/volantis-static@0.0.1660614606622/media/cursor/left_ptr.png"), default; +} +a, +psw, +button, +html input[type=button], +input[type=reset], +input[type=submit], +table::-webkit-scrollbar-thumb, +scrollbar::-webkit-scrollbar-thumb, +#scroll-down, +ul.list-v.rightmenu li.music a.nav.volume .aplayer-volume-bar, +#u-search .modal .modal-header .btn-close, +#u-search .modal .modal-footer .nav, +article .checkbox input, +details summary, +.article a.link-card, +div.tabs ul.nav-tabs li.tab a, +.btn-copy, +.fancybox-can-pan .fancybox-content, +.fancybox-can-swipe .fancybox-content, +.waves-effect, +a.result.search-result-fix, +.tag > p, +.prev > p, +.next > p, +.author > p, +.list-h > a > p, +.category > a > p, +.friend-right p, +.v[data-class=v] a, +.v[data-class=v] .vbtn, +.v[data-class=v] .vicon, +.v[data-class=v] .vcards .vcard .vhead .vnick, +.v[data-class=v] .vcards .vcard .vh .vmeta .vat, +.v[data-class=v] .vwrap .vemojis i, +.v[data-class=v] .vcards .vcard .vcontent.expand, +.aplayer .aplayer-pic, +.aplayer .aplayer-info .aplayer-controller .aplayer-time .aplayer-icon, +.aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap, +.aplayer .aplayer-list ol li, +.aplayer .aplayer-list ol li .aplayer-list-author, +.aplayer .aplayer-list ol li .aplayer-list-index, +.waves-button, +.waves-button-input, +.waves-button:hover, +.waves-button:visited, +.fancybox-button, +.gt-container .gt-btn, +.gt-container .gt-user-inner, +.gt-container .gt-avatar-github, +.gt-container .gt-popup .gt-action, +.gt-container .gt-comment-like:hover, +.gt-container .gt-comment-edit:hover, +.gt-container .gt-comment-reply:hover, +.tk-icon, +.tk-avatar img, +.tk-meta a, +.tk-action-icon, +.fancybox, +.fix-cursor-pointer { + cursor: url("https://unpkg.com/volantis-static@0.0.1660614606622/media/cursor/pointer.png"), pointer; +} +.cur-default { + cursor: url("https://unpkg.com/volantis-static@0.0.1660614606622/media/cursor/left_ptr.png"), default !important; +} +.cur-pointer, +.carousel__button, +.fancybox__slide { + cursor: url("https://unpkg.com/volantis-static@0.0.1660614606622/media/cursor/pointer.png"), pointer !important; +} +.cur-not-allowed { + cursor: url("https://unpkg.com/volantis-static@0.0.1660614606622/media/cursor/circle.png"), not-allowed !important; +} +.cur-zoom-in, +.fancybox__carousel .fancybox__slide.can-zoom_in .fancybox__content, +.has-image[data-image-fit=contain].can-zoom_in .fancybox__image { + cursor: url("https://unpkg.com/volantis-static@0.0.1660614606622/media/cursor/zoom-in.png"), zoom-in !important; +} +.cur-zoom-out, +.fancybox__carousel .is-draggable, +.has-image[data-image-fit=contain].is-draggable .fancybox__image { + cursor: url("https://unpkg.com/volantis-static@0.0.1660614606622/media/cursor/zoom-out.png"), zoom-out !important; +} +.cur-text { + cursor: url("https://unpkg.com/volantis-static@0.0.1660614606622/media/cursor/text.png"), text !important; +} +.common_read { + z-index: auto !important; + opacity: 1 !important; + -webkit-opacity: 1 !important; + -moz-opacity: 1 !important; + overflow: visible !important; + transform: none !important; + -webkit-transform: none !important; + -khtml-transform: none !important; + -moz-transform: none !important; + -o-transform: none !important; + -ms-transform: none !important; + animation: none !important; + -webkit-animation: none !important; + -khtml-animation: none !important; + -moz-animation: none !important; + -o-animation: none !important; + -ms-animation: none !important; + position: relative !important; +} +.body-wrapper.common_read { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; +} +#safearea.common_read { + padding-bottom: 16px; +} +@media screen and (max-width: 900px) { + #safearea.common_read { + padding: 0; + margin: 0; + } +} +#l_body.common_read { + z-index: 2147483646 !important; +} +.read_cover { + min-height: 10px !important; +} +@media screen and (max-width: 900px) { + .read_cover { + min-height: 0 !important; + } +} +.common_read_bkg { + background-color: var(--color-read-bkg) !important; + opacity: 1 !important; + -webkit-opacity: 1 !important; + -moz-opacity: 1 !important; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block !important; + position: fixed !important; + top: 0 !important; + left: 0 !important; + right: 0 !important; + bottom: 0 !important; + z-index: 2147483645 !important; + transition: opacity 1s cubic-bezier(0.23, 1, 0.32, 1) 0ms !important; + -webkit-transition: opacity 1s cubic-bezier(0.23, 1, 0.32, 1) 0ms !important; + -khtml-transition: opacity 1s cubic-bezier(0.23, 1, 0.32, 1) 0ms !important; + -moz-transition: opacity 1s cubic-bezier(0.23, 1, 0.32, 1) 0ms !important; + -o-transition: opacity 1s cubic-bezier(0.23, 1, 0.32, 1) 0ms !important; + -ms-transition: opacity 1s cubic-bezier(0.23, 1, 0.32, 1) 0ms !important; +} +.common_read_hide { + opacity: 0 !important; + -webkit-opacity: 0 !important; + -moz-opacity: 0 !important; + z-index: -2147483645 !important; +} +.common_read_main { + width: 840px !important; + padding: 0 !important; + margin: 0 auto; + float: initial !important; +} +@media screen and (max-width: 900px) { + .common_read_main { + width: auto !important; + } +} +.post_read { + background-color: var(--color-read-post) !important; + z-index: 2147483646 !important; + overflow: visible !important; + font-size: 1.15rem !important; + border-radius: 0 !important; + -webkit-border-radius: 0 !important; + box-shadow: 0 6px 12px 3px rgba(0,0,0,0.2); + -webkit-box-shadow: 0 6px 12px 3px rgba(0,0,0,0.2); +} +div#rightmenu-wrapper { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: none; + position: fixed; + z-index: 2147483648; + user-select: none; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; +} +ul.list-v.rightmenu { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + max-width: 240px; + overflow: hidden; +} +ul.list-v.rightmenu.left { + right: 0; +} +ul.list-v.rightmenu.top { + bottom: 0; +} +ul.list-v.rightmenu a { + cursor: default; +} +ul.list-v.rightmenu a.vlts-menu { + text-overflow: ellipsis; + overflow: hidden; + line-height: 32px; + font-weight: normal; +} +ul.list-v.rightmenu >li>span { + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: block; + color: var(--color-list); + font-size: 0.875rem; + line-height: 36px; + padding: 0 20px 0 16px; + text-overflow: ellipsis; + margin: 0 4px; + border-radius: 4px; + -webkit-border-radius: 4px; +} +@media screen and (max-width: 1024px) { + ul.list-v.rightmenu >li>span { + line-height: 40px; + } +} +ul.list-v.rightmenu >li>span >i { + margin-right: 8px; +} +ul.list-v.rightmenu >li>span:active, +ul.list-v.rightmenu >li>span.active { + color: var(--color-list-hl); +} +ul.list-v.rightmenu >li>span:hover { + color: var(--color-list-hl); + background: var(--color-site-bg); +} +ul.list-v.rightmenu li.navigation, +ul.list-v.rightmenu li.music { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + justify-content: space-between; + -webkit-justify-content: space-between; + -khtml-justify-content: space-between; + -moz-justify-content: space-between; + -o-justify-content: space-between; + -ms-justify-content: space-between; +} +ul.list-v.rightmenu li.navigation a.icon-only, +ul.list-v.rightmenu li.music a.icon-only { + line-height: 0; + margin: 0; + padding: 0; + border-radius: 32px; + -webkit-border-radius: 32px; + overflow: hidden; + width: 32px; + height: 32px; +} +ul.list-v.rightmenu li.navigation a.nav i, +ul.list-v.rightmenu li.music a.nav i { + margin: 0; + width: 32px; + line-height: 32px; +} +ul.list-v.rightmenu li.navigation a.nav:first-child, +ul.list-v.rightmenu li.music a.nav:first-child { + margin-left: 10px; +} +ul.list-v.rightmenu li.navigation a.nav:last-child, +ul.list-v.rightmenu li.music a.nav:last-child { + margin-right: 10px; +} +ul.list-v.rightmenu li.music.name { + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: -ms-flexbox /* TWEENER - IE 10 */; + display: -webkit-flex /* NEW - Chrome */; + display: flex /* NEW, Spec - Opera 12.1, Firefox 20+ */; + display: flex; + -webkit-box-direction: normal; + -moz-box-direction: normal; + -webkit-box-orient: vertical; + -moz-box-orient: vertical; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + align-items: center; +} +ul.list-v.rightmenu li.music.name p.nav.music-title { + color: #696969; + font-size: 0.875rem; + max-width: 128px; + margin: 0 20px; + overflow: hidden; +} +ul.list-v.rightmenu li.music.name p.nav.music-title:hover { + background: none; +} +ul.list-v.rightmenu li.music .nav.volume { + width: 100%; + padding: 0 8px; +} +ul.list-v.rightmenu li.music .nav.volume:hover { + background: transparent; +} +ul.list-v.rightmenu li.music .nav.volume .aplayer-volume-bar { + margin: 4px 0 8px; + position: relative; + height: 8px; + width: 100%; + background: #ededed; + border-radius: 32px; + -webkit-border-radius: 32px; + overflow: hidden; + cursor: pointer; + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; +} +ul.list-v.rightmenu li.music .nav.volume .aplayer-volume-bar i.left, +ul.list-v.rightmenu li.music .nav.volume .aplayer-volume-bar i.right { + color: #696969; + position: absolute; + top: 0; + width: 28px; + line-height: 28px; + transition: all 0.28s ease; + -webkit-transition: all 0.28s ease; + -khtml-transition: all 0.28s ease; + -moz-transition: all 0.28s ease; + -o-transition: all 0.28s ease; + -ms-transition: all 0.28s ease; + opacity: 0; + -webkit-opacity: 0; + -moz-opacity: 0; + transform: scale(0.5) translateY(-18px); + -webkit-transform: scale(0.5) translateY(-18px); + -khtml-transform: scale(0.5) translateY(-18px); + -moz-transform: scale(0.5) translateY(-18px); + -o-transform: scale(0.5) translateY(-18px); + -ms-transform: scale(0.5) translateY(-18px); +} +ul.list-v.rightmenu li.music .nav.volume .aplayer-volume-bar i.left { + left: 0; +} +ul.list-v.rightmenu li.music .nav.volume .aplayer-volume-bar i.right { + right: 0; +} +ul.list-v.rightmenu li.music .nav.volume .aplayer-volume-bar:hover { + height: 28px; +} +ul.list-v.rightmenu li.music .nav.volume .aplayer-volume-bar:hover i { + opacity: 1; + -webkit-opacity: 1; + -moz-opacity: 1; + transform: scale(1) translateY(0); + -webkit-transform: scale(1) translateY(0); + -khtml-transform: scale(1) translateY(0); + -moz-transform: scale(1) translateY(0); + -o-transform: scale(1) translateY(0); + -ms-transform: scale(1) translateY(0); +} +ul.list-v.rightmenu li.music .nav.volume .aplayer-volume-bar .aplayer-volume { + background: #3dd9b6; + height: 100%; + width: 100%; +} +@media (prefers-color-scheme: dark) { + :root { + --color-mode: 'dark'; + } + :root:not([color-scheme]) { + --block-hover: #1c1c1c; + --text-p1: #fff; + --text-p3: #777; + --card: #fff; + } + :root:not([color-scheme]) fa-solid, + :root:not([color-scheme]) fa-regular, + :root:not([color-scheme]) fa-duotone, + :root:not([color-scheme]) fa-light, + :root:not([color-scheme]) fa-thin, + :root:not([color-scheme]) fal, + :root:not([color-scheme]) fad, + :root:not([color-scheme]) fa, + :root:not([color-scheme]) svg.iconfont, + :root:not([color-scheme]) img, + :root:not([color-scheme]) .lazyload { + filter: brightness(70%) !important; + } + :root:not([color-scheme]) .widget.blogger .content .social-wrapper a.social:hover { + background: var(--color-card); + } + :root:not([color-scheme]) .widget >.content ul.entry a .badge, + :root:not([color-scheme]) .widget >.content ul.popular-posts a .badge { + color: unset !important; + } + :root:not([color-scheme]) .content { + color: var(--color-p); + } + :root:not([color-scheme]) .widget >.content a { + color: var(--color-p) !important; + } + :root:not([color-scheme]) .widget >.content a:hover { + color: var(--color-list-hl) !important; + } + :root:not([color-scheme]) .note { + background: var(--color-block) !important; + } + :root:not([color-scheme]) div.tabs ul.nav-tabs li.tab.active a { + color: var(--color-p); + background: var(--color-card); + } + :root:not([color-scheme]) kbd { + background: var(--color-block) !important; + } + :root:not([color-scheme]) .cover-wrapper.dock .menu .list-h a:hover, + :root:not([color-scheme]) .cover-wrapper.featured .menu .list-h a:hover, + :root:not([color-scheme]) .cover-wrapper.focus .menu .list-h a:hover { + color: var(--color-text) !important; + } + :root:not([color-scheme]) .gutter { + background: var(--color-card) !important; + background-color: var(--color-card) !important; + } + :root:not([color-scheme]) .highlight figcaption { + background-color: #14161a; + } + :root:not([color-scheme]) .highlight pre .line, + :root:not([color-scheme]) .highlight pre .params { + color: rgba(158,142,142,0.9); + } + :root:not([color-scheme]) *:not(.highlight) >table tr { + background-color: var(--color-card); + } + :root:not([color-scheme]) *:not(.highlight) >table th { + background: var(--color-site-bg); + } + :root:not([color-scheme]) *:not(.highlight) table td, + :root:not([color-scheme]) *:not(.highlight) table th { + border-color: var(--color-site-bg); + } + :root:not([color-scheme]) *:not(.highlight) >table tr:hover { + background: var(--color-codeblock); + } + :root:not([color-scheme]) .timenode .highlight { + border-color: var(--color-site-bg) !important; + } + :root:not([color-scheme]) blockquote p { + color: var(--color-p); + } + :root:not([color-scheme]) #archive-page .archive .all-tags ul li span { + color: var(--color-text); + background: #6f6f72; + } + :root:not([color-scheme]) .btn-copy:hover { + background: var(--color-site-body); + } + :root:not([color-scheme]) .aplayer { + background: var(--color-site-bg); + } + :root:not([color-scheme]) .aplayer .aplayer-list ol li:hover { + background: rgba(61,217,182,0.2); + } + :root:not([color-scheme]) .aplayer .aplayer-list ol li.aplayer-list-light { + background: var(--color-block); + } + :root:not([color-scheme]) .aplayer-info { + background: var(--color-site-bg) !important; + } + :root:not([color-scheme]) .aplayer .aplayer-lrc:before { + background: linear-gradient(180deg, #282c34 0, rgba(255,255,255,0)); + } + :root:not([color-scheme]) .aplayer .aplayer-lrc:after { + background: linear-gradient(180deg, rgba(0,0,0,0) 0, rgba(33,33,33,0.8)); + } + :root:not([color-scheme]) .aplayer-pic { + filter: brightness(70%); + } + :root:not([color-scheme]) .aplayer .aplayer-list ol li { + border-top: 1px solid var(--color-card); + } + :root:not([color-scheme]) .aplayer.aplayer-withlist .aplayer-info { + border-bottom: 1px solid var(--color-block); + } + :root:not([color-scheme]) .aplayer .aplayer-notice { + background-color: var(--color-site-bg) !important; + } +} +[color-scheme='dark'] { + --block-hover: #1c1c1c; + --text-p1: #fff; + --text-p3: #777; + --card: #fff; +} +[color-scheme='dark'] fa-solid, +[color-scheme='dark'] fa-regular, +[color-scheme='dark'] fa-duotone, +[color-scheme='dark'] fa-light, +[color-scheme='dark'] fa-thin, +[color-scheme='dark'] fal, +[color-scheme='dark'] fad, +[color-scheme='dark'] fa, +[color-scheme='dark'] svg.iconfont, +[color-scheme='dark'] img, +[color-scheme='dark'] .lazyload { + filter: brightness(70%) !important; +} +[color-scheme='dark'] .widget.blogger .content .social-wrapper a.social:hover { + background: var(--color-card); +} +[color-scheme='dark'] .widget >.content ul.entry a .badge, +[color-scheme='dark'] .widget >.content ul.popular-posts a .badge { + color: unset !important; +} +[color-scheme='dark'] .content { + color: var(--color-p); +} +[color-scheme='dark'] .widget >.content a { + color: var(--color-p) !important; +} +[color-scheme='dark'] .widget >.content a:hover { + color: var(--color-list-hl) !important; +} +[color-scheme='dark'] .note { + background: var(--color-block) !important; +} +[color-scheme='dark'] div.tabs ul.nav-tabs li.tab.active a { + color: var(--color-p); + background: var(--color-card); +} +[color-scheme='dark'] kbd { + background: var(--color-block) !important; +} +[color-scheme='dark'] .cover-wrapper.dock .menu .list-h a:hover, +[color-scheme='dark'] .cover-wrapper.featured .menu .list-h a:hover, +[color-scheme='dark'] .cover-wrapper.focus .menu .list-h a:hover { + color: var(--color-text) !important; +} +[color-scheme='dark'] .gutter { + background: var(--color-card) !important; + background-color: var(--color-card) !important; +} +[color-scheme='dark'] .highlight figcaption { + background-color: #14161a; +} +[color-scheme='dark'] .highlight pre .line, +[color-scheme='dark'] .highlight pre .params { + color: rgba(158,142,142,0.9); +} +[color-scheme='dark'] *:not(.highlight) >table tr { + background-color: var(--color-card); +} +[color-scheme='dark'] *:not(.highlight) >table th { + background: var(--color-site-bg); +} +[color-scheme='dark'] *:not(.highlight) table td, +[color-scheme='dark'] *:not(.highlight) table th { + border-color: var(--color-site-bg); +} +[color-scheme='dark'] *:not(.highlight) >table tr:hover { + background: var(--color-codeblock); +} +[color-scheme='dark'] .timenode .highlight { + border-color: var(--color-site-bg) !important; +} +[color-scheme='dark'] blockquote p { + color: var(--color-p); +} +[color-scheme='dark'] #archive-page .archive .all-tags ul li span { + color: var(--color-text); + background: #6f6f72; +} +[color-scheme='dark'] .btn-copy:hover { + background: var(--color-site-body); +} +[color-scheme='dark'] .aplayer { + background: var(--color-site-bg); +} +[color-scheme='dark'] .aplayer .aplayer-list ol li:hover { + background: rgba(61,217,182,0.2); +} +[color-scheme='dark'] .aplayer .aplayer-list ol li.aplayer-list-light { + background: var(--color-block); +} +[color-scheme='dark'] .aplayer-info { + background: var(--color-site-bg) !important; +} +[color-scheme='dark'] .aplayer .aplayer-lrc:before { + background: linear-gradient(180deg, #282c34 0, rgba(255,255,255,0)); +} +[color-scheme='dark'] .aplayer .aplayer-lrc:after { + background: linear-gradient(180deg, rgba(0,0,0,0) 0, rgba(33,33,33,0.8)); +} +[color-scheme='dark'] .aplayer-pic { + filter: brightness(70%); +} +[color-scheme='dark'] .aplayer .aplayer-list ol li { + border-top: 1px solid var(--color-card); +} +[color-scheme='dark'] .aplayer.aplayer-withlist .aplayer-info { + border-bottom: 1px solid var(--color-block); +} +[color-scheme='dark'] .aplayer .aplayer-notice { + background-color: var(--color-site-bg) !important; +} +article#post > h1, +article#post h2, +article#post h3 { + font-weight: 700; + background: linear-gradient(to bottom, transparent 60%, rgba(189,202,219,0.3) 0) no-repeat; + display: -webkit-box /* OLD - iOS 6-, Safari 3.1-6 */; + display: -moz-box /* OLD - Firefox 19- (buggy but mostly works) */; + display: initial; + width: auto; + border-bottom: none; +} +article#post > h3 { + font-weight: 500; + position: initial; +} +.post.post-v3.white-box { + text-align: center; +} +.post.post-v3.white-box a { + font-weight: 600 !important; +} +.post.post-v3.white-box p { + text-align: left; + text-indent: 2em; +} +#l_main > article.cus-indent p { + text-indent: 2em; +} +#l_main > article.cus-indent p.p { + text-indent: initial; +} +#l_main > article.cus-indent details p, +#l_main > article.cus-indent blockquote p, +#l_main > article.cus-indent section p, +#l_main > article.cus-indent .prev-next p, +#l_main > article.cus-indent .new-meta-box p, +#l_main > article.cus-indent .note p, +#l_main > article.cus-indent .tag p { + text-indent: initial; +} +.article a:not([class]):not([data-fancybox]), +.content > a { + position: relative; + text-decoration: none; +} +.article a:not([class]):not([data-fancybox]):before, +.content > a:before { + content: ""; + position: absolute; + left: 0; + bottom: -1px; + height: 1px; + width: 100%; + background: #ff5722; + transform: scale(0); + -webkit-transform: scale(0); + -khtml-transform: scale(0); + -moz-transform: scale(0); + -o-transform: scale(0); + -ms-transform: scale(0); + transition: all 0.5s; + -webkit-transition: all 0.5s; + -khtml-transition: all 0.5s; + -moz-transition: all 0.5s; + -o-transition: all 0.5s; + -ms-transition: all 0.5s; +} +.article a:not([class]):not([data-fancybox]):hover:before, +.content > a:hover:before { + transform: scale(1); + -webkit-transform: scale(1); + -khtml-transform: scale(1); + -moz-transform: scale(1); + -o-transform: scale(1); + -ms-transform: scale(1); +} diff --git a/dcd2023ep1-trailer/index.html b/dcd2023ep1-trailer/index.html new file mode 100644 index 0000000000..9d03cb9d8e --- /dev/null +++ b/dcd2023ep1-trailer/index.html @@ -0,0 +1,4317 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +DC Doujin +2023,点击访问。
+DC Doujin将在11月带来他的第一部视频作品“一触即发 A Cusp Before It +Rings”。这个视频,对日常学校干饭的情景进行真实再现。其中由木稿比你铁饰演的受伤学生受到热烈关注,其原型是初中部的一位学生,我们将其镜头化,力求最真实地表现出其强烈的反差感。
+禁止用于商业用途,转载请注明出处 DC +Doujin。
+Copyright © 2023 DC Doujin, JustPureH2O. All Rights +Reserved.
+ + +Phigros玩得太烂了(确信)
啊作为一名中学生最重要的还得是学习!学习为重是吧。想着开发一个C#窗口程序练练手,顺便涉足一下OpenGL图像渲染的领域。挺重要的一点是感觉自己还是太闲了,再加上PC端音游实在太少喽。就萌生了这个想法。
+整体基于C#的.NET窗体程序,搭配OpenGL进行图形渲染和绘制。OpenGL本身调用起来比较麻烦,涉及很多底层操作(类似于C/C++的窗体程序开发,代码里全是底层调用),所幸还是有能人志士对繁琐的过程做了简化,对底层的OpenGL进行了一定的函数封装,推出了稳定高效简洁的OpenGL支持库。这里主要有以下几种:
+这里选用OpenTK,综合来讲它的功能够用、开发文档也比较充足最重要我不喜欢C风格的库。若想将OpenTK部署到项目里,新建.NET窗体工程,在NuGet包管理器中搜索OpenTK,点击安装OpenTK.GLControl,这是OpenGL对应的控件包,其中包含了OpenTK库。安装完毕后就可以看到OpenTK控件了。
这天月假,当我正为即将到来的水神池子疯狂做任务屯原石时,在列表里看到了一个悬赏整整30原石的世界任务。本着不放过任何一个给原石的任务的宗旨,我来到了秋分山西侧,白淞镇东北方向的海边房屋处。只见一位男子全身掩埋在海沙之下、动弹不得,面前摆放着一只散发香味的甜甜花酿鸡。我看他精神失常,满嘴都是“新型美容方式”的胡话又哭又闹,呜呜呜呜,好可怜呀。于是我决定帮他一把……找出了幕后黑手,此时他举起一个木牌,只见上面用老米祖传的架空文字写了一些东西,随着剧情推进,我们得知这是“抗议”(protest)。枫丹作为两个月前才开放的新国家,其文学文化充满乐子的xxs神明固然吸引了我。于是我决定用手头上有限的图片资料,整理出一份类似于枫丹语言图鉴的资料来。以便后期深入探究枫丹的风土人情。
这是在上一部分中提到的,写有“抗议”(protest)的木牌,其中各个字母的对应关系已经标注出来了(相信不用标注也看得出来)。不难发现,最后一个字母与倒数第四个字母是相同的,恰巧对应上protest中字母t的位置。某种方面上证明了这一猜测的正确性,但是鉴于这抽象到与原英文字母完全不搭边的枫丹字体(很水体)实在是太过亮眼,我的内心还是有一点怀疑和否定的。那么我们将这七个字母挨个抽取出来,放到别的语境中去转译,不就可以验证它的准确性了吗?
其实也无需这么麻烦,读完前面的大佬对提瓦特通用语的解析。我们惊奇地发现,这很水体居然与提瓦特通用语的字母如出一辙:
+图片来源于:哔哩哔哩,语颂源,【原神考据】提瓦特通用文
+当然也有一些变化,比如哪里可能突然多出来一横、又或者是将圆弧形的笔画变得棱角分明。图中的S和E就是两个典型例子。考虑到可能是手写体带来的美化、钝化等,我接下来去到了枫丹的主城区中,分别在蒸汽鸟报社、卡郎代沙龙前拍下了这几张图片(因为他们离锚点非常的近,不需要跑图)。
我们根据已经解译出来的提瓦特通用语字母进行对拍,发现蒸汽鸟报社的招牌上写着:LOISEAU DE VAPEUR。明显是法语,但是其中的VAPEUR和英语的VAPOR(蒸气)非常相似,因此对拍基本无误。但是由于我本人不懂法语,解释不了第一个词,只能求助于度娘。度娘也是给我甩了一个解释:鸟。并纠正了一个小错误:LOISEAU应为L'OISEAU。完美契合蒸汽鸟报社的招牌。
+同理,卡郎代沙龙的门牌上写着:CARITAT。推测其原型是18世纪的姓氏德·卡里塔,孔多塞侯爵(Nicolas +de Caritat)的妻子便是18世纪的一位著名沙龙主人。
+最后放出蒸汽鸟报社门前牌子上的翻译:
+Exploring the manufacture of security machinery +探秘发条机关(守卫机器)的制造流程
+Joyous tour through the aquatic workshop +水下工坊快乐一日游游记
+Exclusive compilation of the past top duellists +旧时顶级决斗代理人的独家专访合集
+Interview with the deboard restaurant artists +采访德波饭店的艺术家们
+Iridescene tour and the new trend of music +虹彩巡游之旅,以及新派音乐
+ + +——By 国祯
+曾茂华是中国当代著名的科学家和教育家,他以“慈父”、“良师”、“学者”等称号闻名于世。
+1:曾茂华的蠢行为
+曾茂华的蠢行为: +他在大学期间参加了一个乐队,并担任主唱。然而,不幸的是,由于自己的疏忽,他犯下了一件愚蠢的事情——用刀砍掉了对方的手指头。这件事让他成了学校里的头号人物之一。从那以后,他再也不敢做任何愚蠢的事情了。这是因为他害怕自己会被开除出乐队或者成为众矢之的的对象。如果他继续做出这些错误的举动,那么他会失去自己的乐队成员资格,甚至还会遭到开除。所以,为了避免发生这样的悲剧,他必须要记住:永远不要犯错!
+2:为什么他会做出这种愚蠢的事情?
+曾茂华的蠢行为发生在他身上,是因为他自己没有意识到他自己的愚蠢。他不知道怎么做才能让事情变得更好,他只想走捷径,而不是去努力做好事情。这种心态会导致他做出错误的决定,因为他会忽略一些重要的信息,或者选择性地记住某些信息。当我们看到一个人犯了下述三种类型的罪时,我们通常就能预测到这个人会再犯同样的问题:1. +根本不会思考问题2. 一味追求便利3. 盲目模仿别人
+3: 该如何面对这个问题?
+要想解决问题,首先要认识到自己的行为是愚蠢的。只有当你明白自己做了什么蠢事时,才能够改变你的行为来避免这种错误。其次,不要让别人知道你所犯下的错误。这并不是因为你不想坦白自己所犯错误,而是因为这样会给别人带来困扰。最后,如果你真的想要解决这个问题,可以尝试通过一些有趣的方式来实现它。例如,你可以去找一位专业人士帮助你分析一下这件事情,或者试着去找到一个愿意与你分享观点和建议的人。总之,如果你认为自己的行为很蠢,那么就要大胆地承认出来。只有敢于直面自己的无知,才能真正地改善自己的生活。
+曾茂华先生不仅对科学领域做出了巨大贡献,而且为国家培养出一批优秀的人才。这些人中不乏有牛顿这样伟大的人物,也有王选这样杰出的人物。
+ +题目传送门:P10178
+受到了题面的启发,我才想起那个早已死去的算法——SPFA
题面总结成一句话就是:最短路只能有一条。
+那么我们用最短路算法:如果有最短路,先选择最短路。如果在更新最短值时出现了冲突——即某两种方案路径长度相等时,让后来者考虑加上一个
+退出奖牌争夺)就好了。
对于加上的正整数值,不妨从 No
。反之将试加的值记录到ans
数组中去,在每组数据结束后输出即可。
同时请注意多测清空!
+代码,但是
1 |
|
这段代码居然一反常态的在第一组测试点处TLE了???于是重新看到数据范围——memset
出了问题!当你定义了一个大小为
+memset
的结果就是对这整个
解决方案就是从
代码
1 |
|
发现第一组数据跑得飞快,完全不见了方才TLE时的拖沓!
本蒟蒻第一篇题解,害怕~
+ + +JustPureH2O
+ + +深水里摸大鱼
+ ++ 1 / 3 +
+ + +又名:《第一次考就被小学生薄纱的一集》
本次考场:绵阳东辰国际学校
+插一句:CSP-J +2023没有设置赛前试机环节(包括CSP-S,成都绵阳都这样),个人推测可能是由于开放自选Windows和Linux系统带来的结果。如果你听见诸如:不要操作电脑,违者将作作弊处理 +的话时,请将你按捺不住的双手安稳的放在双腿上,避免出现意料之外的事来。
+ 然而赛前试机仍然是必要的一环(但是如果考场纪律有要求那就算了),因为这样可以让选手对机器有一个初步的了解。因为我本人习惯使用Win+E
打开文件系统管理器,用Win+V
记录剪切板数据,可是这些功能在考场电脑上都无法使用,进行赛前试机不仅可以避免因赛时临时发现无法使用某些功能而带来的苦恼心态爆炸点+1,而且还可以将IDE环境调整到个人喜欢的状态(例如缺省源代码,相当于每次新建代码不用重新打头文件)。选手可以不占用正式比赛时间完成一些个性化操作,方便赛时操作,其重要性不言而喻。
当然,开赛前乱猜试题PDF密码是极其无意义且几乎不可能成功的一件事,更不要使用暴力破解密码工具破解文件(相信守规矩的你也不会将这种工具带进考场里来),这么做不仅会被当做作弊者处理,而且造成的数据丢失也只能由你自己负责。
考场下发的PDF文件带有密码保护,输入时请务必瞪大眼睛区分大小写字母O、o与数字0;小写字母l、大写字母I与数字1,并且将其中的特殊字符认真核对一遍。本次考试,我有幸将密码中的数字0写成了小写字母o,于是浪费了宝贵的2分钟时间改正密码(真实情况是监考老师在黑板上书写密码时字迹不规范导致的混淆)。因此需要认真看好你的密码。
+ 就我认为:在一开始就仔细写好文件重定向输入输出是极其重要的,因为随着考试时间的推进,你的思考重点将从细节性问题变为如何拿到更多的分数上骗分。你就会忽略重新写上两行重定向IO的代码,因而可能Au->Cu,光荣AFO。为了引起你的注意,使用极长的注释双斜线是可行的,我本人习惯打上断点。例如:
1 | //////////////////////////////////////////////// freopen("uqe.in", "r", stdin); |
将比
+1 | //freopen("uqe.in", "r", stdin); |
显眼得多——尤其是当你喜欢为每行代码写上包含心血的易懂注释时。事后你可以通过长按Ctrl+逗号
(Dev-C++)的方式快速且安全的删除这些斜线。
不仅如此,看好输入输出文件名也是一个非常重要的细节,建议直接复制粘贴。对于标准样例,直接选中PDF文字再复制一般都不是一个明智的做法,手动输入也是可行的,但是对拍有时会比较繁琐(例如普及组T3的样例)。这边传授一个方便的做法:选中代码左侧序号,在WPS中直接右键菜单点击消除文字即可(本次考试我就是使用的这个方便技巧快捷复制样例数据)。最好找张纸记下来,后面会讲到原因。
+顺利解锁了PDF文件,你要做的第一件事就是将四道题全部读熟。对整场比赛的题目有大致的规划,有可能你先前做题时做过与T4极其相似的题目,那么放弃显然是一个很不划算的决策。将题目读熟,大概判断一下算法实现,评估自己哪些题能做好,哪些题要放一放/完全放弃。知己知彼方能百战百胜。
+赛初的状态基本上决定了你整场比赛的表现,因此在赛初就做好一切细节方面的完全准备,对你的信心增长是非常重要的!
+那么你现在拿到了第一题(信心题)。一般来说,CSP的复赛,算法很少裸露地出现在题目之中,前两题近似看作数学题。保证你的数学思维在线,因为第一题的思路可能千奇百怪,如果你一段时间没有思路(对于第一题大概是5~15分钟),可以考虑先做其他题目。刷新一下思维定势,有可能T1的灵感就乍现于其他题目之中。
+在符合时间规划的前提下尽可能多去造hack数据,写出一段代码(尤其是T3放大模拟时)后,千万保证没有任何逻辑问题。当然,不是所有人都能只看代码就能检查的出其中的逻辑漏洞。因此你需要多造hack数据。hack数据多数情况下包括这几个要素:方程的特殊解、极端值/边界值、大数据(int越界)。在规划好的时间内想尽办法为你的代码多挑几根刺出来,你的代码才能更加趋近于满分解。
+ 千万不要看你旁边的人!!!
+除非S组巨佬闯进了J组蒟蒻区,否则千万不要在比赛中途去看任何人的任何行为。一方面,你的行为可能被视作交谈作弊喜提CCF全国通报、禁赛3年大礼包;另一方面,如果你抱着嘲笑别人的心态去观察别人,那么你的脸很可能就会被你自己打烂。我在考试时因为瞧不起隔壁的一位小学生,当他开始疯狂敲代码时,我自己的心态就爆炸了——把所有人,不分男女、年龄高低,都当作你的敌人,轻视则死。同时这也给你带来一部分紧张感,会使你的发挥更佳。
给自己适当的放松与勉励,要相信,上天不是无故给你这个周末不用冒着风雨大太阳上补习班的珍贵机会(对于高中生,则是周六不用坐在教室里上正课的机会)。当你完全确认你的代码已经完美无瑕时,告诉自己:同学们都还在悲催的上着课,我却在外边快乐的敲着代码。如此一来可以起到调整心态的作用。
+别激动到顺手关了PDF文件。如果你还记得或者是在草稿纸上写了密码,那无所谓;但是如果你没写,你的处境就非常尴尬,这时你可以举手找老师再要,但这绝对对你的心态是一个不小的打击。
+经历三个半小时的不懈奋斗,比赛终于迎来最后的半小时。无论你的完成情况如何,一定要用这最后的时间好好检查一下你的代码。瞄一眼你是否有与下面类似的代码:
+1 | freopen("uqe2.in", "r", stdin); // 危 |
这段代码的主人是个懒人无疑了,如果你把CCF提供的附加样例复制了出来。切记最后把文件名里的序号删除,否则你就可以AFO了。
+或者以下的代码:
+1 | #include <Windows.h> |
这位同学也是个Windows爱好者受害者无疑了,CCF明文规定了测试用系统为NOI
+Linux。因此不存在Windows.h
这个头文件,如果你忘记删除了,那一定是个大大滴CE。正式比赛时,用bits/stdc++.h
万能头即可(Windows和Linux通用)。我有一个考S组的朋友,因为忘记删除这个对拍头文件而喜提一个0分,直接亏大发。
不要忘记将你的重定向取消注释。你连读入输出都没有了,属实是可以AFO了。最后三分钟,请将你的蹄子挪开键盘鼠标。否则可能会越改越慌,不妨好好回想一下这周老师留了什么作业,你缺了哪些课需要去补,总之不要再动你的鼠标键盘了!如果实在是不放心编译问题,按一下F11
,通过即可。保证你的工作目录下只留.cpp
文件,所以将你复制的样例文件和编译的exe文件全部删除。
请你千万保持冷静,不要习惯性地把机器关机了。CCF明文规定:由关机造成的数据损失,责任由考生自负。只需要把你的IDE关闭就好。
+回家后,把周一要交的作业补好。别再谈考试的事情了,让你自己有个好心情。毕竟不管你的表现怎么样,它都过去了不是吗?
+ +${volantis.GLOBAL_CONFIG.languages.search.hits_empty.replace(/\$\{query}/, data.query)}
${volantis.GLOBAL_CONFIG.languages.search.hits_empty.replace(/\$\{query}/, fn.queryText)}
${volantis.GLOBAL_CONFIG.languages.search.hits_empty.replace(/\$\{query}/, data.query)}
加号:
减号:
乘号(叉乘): \times
乘号(数量积/点乘):\cdot
除号:\div
开方/N次方根:\sqrt[N]{ABC}
乘方/N次幂:A^N
下标:A_N
分数:\frac{A}{B}
等于号:
约等号:\approx
加粗 \thickapprox
不等号:\neq
恒等号/定义为:\equiv
大于号:\gt
小于号:\lt
大于等于:\geq
小于等于:\leq
远大于:\gg
远小于:\ll
正负:\pm
负正:\mp
垂直:\perp
平行:\parallel
角/无标记角:\angle
角/标记角:\measuredangle
一般全等:\cong
相似:\sim
,加粗 \thicksim
三角形:\triangle
正方形:\square
圆:\odot
向量:\vec_{AB}
或 \overrightarrow{AB}
属于:\in
不属于:\notin
子集:\subseteqq
真子集:\varsubseteqq
或 \subsetneqq
真子集/直线在平面上:\subset
正整数集:N^*
+或 N_+
并集:\cup
交集:\cap
补集:\complement{_U^A}
因为:
所以:
存在:\exists
不存在:\nexists
任意/对于所有:\forall
空集:\varnothing
逻辑或:\cup
+或 \lor
逻辑与:\cap
+或 \land
逻辑非:\lnot
充分条件/右双箭头:\Rightarrow
大小写敏感
必要条件/左双箭头:\Leftarrow
大小写敏感
充要条件/双向双箭头:\Leftrightarrow
大小写敏感
成正比:\propto
定积分:\int_{a}^{b}
多重积分:\iint_{a}^{b}
及 \iiint_{a}^{b}
导函数/上撇号:\prime
求和:\sum_{i=1}^{n}
求积:\prod_{i=1}^{n}
字母数位/平均数:\overline{ABCD}
整除符号:\mid
新定义运算符:\oplus
及 \otimes
及 \ominus
扰动值:\tilde{K}
高德纳箭头/上箭头:3\uparrow \uparrow 2
无穷大/无限:\infty
圆周率:\pi
普朗克常数:\hbar
或 \hslash
一声:\bar{e}
二声/法语闭音符:\acute{e}
三声:\check{e}
四声/法语重音符:\grave{e}
字母双点/德语特殊字母/特殊拼音:\ddot{u}
特殊发音符:\tilde{a}
抑扬符:\hat{a}
小写希腊字母
+\alpha
\beta
\chi
\delta
\epsilon
\eta
\gamma
\iota
\kappa
\lambda
\mu
\nu
o
\omega
\phi
\pi
\psi
\rho
\sigma
\tau
\theta
\upsilon
\xi
\zeta
变量希腊字母
+\digamma
+\varepsilon
\varkappa
+\varphi
\varpi
\varrho
\varsigma
+\vartheta
大写希腊字母(仅展示大小写字母样式有差别者)
+\Delta
\Gamma
\Lambda
+\Omega
+\Phi
+\Pi
\Psi
\Sigma
\Theta
\Upsilon
+\Xi
希伯来文字母
+\aleph
\beth
\daleth
+\gimel
pandoc测试自动部署
+ + +我个人认为我自己与线性代数的渊源是极深的。差不多整一年之前,初三上册的寒假,我在启动某二字二次元风格开放世界游戏时偶然做到了一个世界解谜。与平常无脑过的难度不同,这次的解谜可谓是充满血和汗水的教训——看攻略前千万要搞清楚站位和朝向……于是一步错步步错,耗费了整整半个小时才碰巧还原到原始的状态。自此便有了用严格的数学论证来解决这种世界解谜的想法,然而苦于当时数学功底不够、那些线上线下的教程又对我这种“跳级生”极其的不友好,最终还是将它抛到脑后去了。
+但是我最开始想做关于线性代数的内容却是在高一上期末那会,刚好我的竞赛内容推进到了高斯消元相关内容,因而我对线性代数的内容有了一定了解。正巧年末购书有优惠,买了一本Steven +J. +Leon的《线性代数》(原书第十版)自己学习。深谙零基础学生自学的痛苦的我随即就想要上一篇全网最简明易懂的线性代数教程出来,这篇教程旨在让零基础初学者也能吸收学会线性代数的相关知识点。你可以将它理解成上述《线性代数》著作的一个口语版理解和集注,我所做的就是将书中的晦涩的知识自己吸收后转化为易于读者消化的简明概述。也正是因为其趣味性的必需特点,部分科学定义可能在本教程转述时出现细微的偏颇,还请指出,但在编写过程中我会尽量将原书的科学性与本教程的趣味性、通俗性有机融合起来,从而让读者毫不费力地学习线性代数的知识内容,快乐学习。
+ + +重置了有关
不得不说Hexo搞这个LaTeX是真的让人头疼…… +
+ + +假设我们有一个方程组:
如此得到的矩阵叫做系数矩阵,顾名思义,它只表示了原方程组的系数,而忽略了常数项。它同时也是一个
此时,如果我们加上等号右侧的常数项,原先的
当矩阵元素不明时(通常是为了举例),我们为了简便表示矩阵本身,采用右下角元素+括号的方式。例如一个
1. 矩阵加法
+仅限构造相同的矩阵,也就是说进行加法运算的两个矩阵行列数必须相同,这样的两个矩阵是同型的。相加时同一行同一列的元素相加即可(增广矩阵同理)。
+例如:
矩阵加法满足:结合律、交换律
+2. 矩阵减法
+矩阵减法是矩阵加法的逆运算,因此对于两个矩阵的形式要求同上,只是相同位置的元素相减而已。
+矩阵减法满足:结合律、交换律
+3. 标量乘法/矩阵数乘
+矩阵的数乘也很简单,让矩阵中每个元素乘以这个数就可以了。
+例如:
矩阵数乘满足:交换律、结合律、分配律
+4. 矩阵转置
+矩阵转置就是将原矩阵的行变成新矩阵的列,直观理解就是顺时针旋转90度后再水平镜像过去。转置用上标
例如:
矩阵的主对角线(左上-右下)元素转置前后不变,且具有可逆性[
有一类特殊矩阵,它转置后恰好就是它自身。这类矩阵被称为对称矩阵,它是自转置的,即
5. 矩阵乘法
+该内容将在第二章涉及。
+按照一般思路(就是我们在小学学的方法),我们会选择通过方程互相加减各自的倍数,达到消去未知数的目的。这种方法在矩阵上同样适用,而且它有一个贼高坤的名称:高斯消元法(Gaussian +Elimination)。
+回忆一下我们从出生就会用的消元原理,我们的目标就是让每个未知数都对应一个常数项,那么它的值就可以直接用常数除以系数的方式求出。矩阵中也是如此,为了能够化简出可直接求解的矩阵,我们在此引入初等行变换的概念:
+这三条很容易理解。第一条:相当于交换方程组顺序,不影响计算;第二条:相当于对某一行方程放缩某倍,它等价于原方程;第三条:相当于前两条的融合,也是消元的关键一招。这三条规则在之后的初等矩阵内容中会再次出现。
+首先从一个例子讲起,让读者感受一下初等行变换的魅力:
+考虑这个方程组:
+按照如上所述,将它转写成增广矩阵的形式:
+我们总结一下常用的消元原理,应用到矩阵上就是:
+令矩阵
枚举第一列,
第二步,自乘并标记有序,因此第一行除以
第三步,将无序组的第
枚举第二列,此时
最终的最终,第三行减
为什么把矩阵化简成这种金字塔型的形式呢?你会发现:最后一行仅有一个带系数的未知数
一般地,对于一个矩阵,如果它的非零系数呈阶梯形分布,则称这类矩阵为行阶梯形矩阵。将非零系数挑出来,它们组成的是一个上三角形矩阵;对应地,零项就会组成下三角矩阵。上三角矩阵通常以
原方程组有唯一解:
+类比一元二次方程的根存在性判别法——
答案是有的,而且不止一种,这意味着“矩阵是否有解”这样的问题会有多种解决方案。现在介绍的是最为简单常用的一种——秩。
+在线性代数中,一个矩阵A的列秩是A的线性独立的纵列的极大数目。类似地,行秩是A的线性无关的横行的极大数目。即如果把矩阵看成一个个行向量或者列向量,秩就是这些行向量或者列向量的秩,也就是极大无关组中所含向量的个数。
+……咱们抛掉这种看也看不懂的高级语文句法,听我给你总结:
+通俗来讲,把一个矩阵化成最简形式(特指行阶梯形)后,非零行的个数就是矩阵的秩。这其实是秩的最大线性无关组的定义。再次白话总结:如果存在三个行向量(列向量一样的,保证所有向量都是行/列向量即可):
矩阵
现在明白了吧,如果一个矩阵的某两行线性相关,它们都会被初等行变换第三条狠狠薄纱——在乘/除一个非零数后相减,其中一行就会被全部消成0,从方程组角度来看就是
当然上边这一段也有表述不准确之处,假设有一个增广矩阵
第二行不乐意了,它还存留这最后一点倔强,好像在说:“你总结的不对呢~真是雑鱼~”。但是明眼人都看得出来,
再考虑有无穷解的情况:无非就是出现了
最后就是有唯一解:如果一切进行顺利的话,既没有全零行,也没有无解行。那么此时系数矩阵和增广矩阵的秩会相同,且等于未知数个数,即
总结,假设一个由
例1.1.1 Delivery Mathematics 快递员的数学题
+++「稻妻狛荷屋的人气跨国快递员绮良良在送货途中遇到了一个难题,你作为无所不知无所不晓的旅行者自然是乐意地接下了她的委托。当你来到委托地点时,你发现这是一道解谜题目……」
+稻妻号称最难的方块解谜是一组由
+个正方体可旋转方块组成的阵列,击打其中的某个方块会使得与之相关联的其他方块共同旋转一个特定角度。在这个谜题中,每个方块每次仅能水平顺时针旋转90度,传动方式在下图给出。问若要使所有方块同时朝向北方,需要如何击打方块?给出任意可行解,但需要保证每个方块旋转的次数不超过4(不击打也可以,相当于次数为0)。 由于钟离先生远在海那一头的璃月喝茶听评书、宵宫也正忙着制作夏日祭的烟花而无法抽身、香菱在万民堂做饭、安柏在侦察蒙德郊区、芙宁娜忙着吃蛋糕……总之没有其他人
+召唤物能帮你解决这个问题,你只能凭借自己的力量解开这个谜题。
问题分析:首先我们要搞清楚传动规则,我们会发现当你击打了一个方块,包括它在内、再按顺时针方向数两个方块都在旋转相同的角度。这也是这道题被称作难题的原因之一,只用想象力是很难想象的出来的……于是为了用代数方法解决该问题,我们选择用四个未知数、四个方程表示每个方块操作后的状态,问题解决的标志既为四个方块的状态均为
算法设计:考虑到单个方块每旋转四次就相当于一次循环,因此我们重定义方向标,从北开始,顺时针方向将方位标记为
解:设方块1-4的击打次数分别为
根据传动规则,有如下线性方程组:
+增广矩阵形式为:
+(化简过程略),行阶梯形式为:
+因为系数矩阵的秩与增广矩阵的秩相同且都等于未知数个数
因此,最佳方案是暴击击打2号和3号方块各两次。
后日谈:有些读者可能会问,这个难道不是有无穷解吗?为什么上边说这个矩阵只有唯一解?其实这个矩阵确实只有唯一解,因为
洛谷习题:
+ +你经常能在各种线性代数的书上看到这样一串定义式:比如说我自己)其实是非常不友好的。他们在举例计算时很容易被
将左边的矩阵的每一行看作每个未知数都代了确定值的方程、右边的矩阵每一列看作是前者方程的未知数系数。二者相乘本质上就是让未知数和系数匹配上,并计算出结果放入结果矩阵的特定位置。这个特定位置也有讲究——计算时我们需要固定一个行/列,相对应地我们需要遍历另一个矩阵的列/行,遍历的方向就是这个“特定位置”的排布方向,当遍历完一轮,开始下一轮时,这个“特定位置”的起始点将移到下一行/列,若固定一列则右移一列;反之下移一行。看以下例子来加深理解:
+这是固定特定列求值的例子,固定行求值留给读者自行实操。不想再做图了,我太懒了
那么什么样的矩阵才能进行乘法运算呢?答案是一个矩阵乘法国不养闲人,这种单身汉显然是不可以光天化日下大摇大摆出来遛弯的。因此保证其中一个矩阵的行数等于另一个矩阵的列数后方可相乘。
类比四则运算的乘法,矩阵乘法是否也有结合律、分配律和交换律呢?很遗憾,不完全是,前二者是矩阵乘法运算所具备的性质、但最后那个交换律不是。不是所有的矩阵相乘都满足乘法交换律,举几个特例:同型零矩阵相乘、一个矩阵(可逆)和它的逆矩阵相乘,矩阵乘法满足交换律的充要条件证明过于复杂烧脑,此处不做陈述主要是我也不会证qwq……。
证明:一般矩阵不满足乘法交换律
+假设一般矩阵
假设
矩阵和数字一样,也有幂次方的计算。特殊地,任意
例2.1.1 Akasha Browser with Irminsul Kernel +世界树搜索引擎
+++你作为刚刚清除了须弥世界树痼疾的英雄旅行者,突然对虚空终端的运作方式有了兴趣。你从大贤者那里了解
+逼问到,虚空终端实质上是一个仅显示搜索结果的前端程序,但关键词搜索功能却是基于须弥地下空间的世界树。带着这个疑问,你再次来到了世界树前,见到了小吉祥草王大人,希望能让她告诉你世界树的运作方式……
背景知识: +一般浏览器的结果返回功能大多数依赖于矩阵运算,这里属于最简单的一种——我们只需要矩阵的乘法运算(某些情况下会用到转置)。然而随着科技的快步发展,数据量的快速增加,这种方式如今只在很小的范围内被使用(由于码量小思维简单,它有时会在个人博客的关键词搜索功能中被用到);目前广泛使用的一种是向量相似性搜索,它本质上是在一定范围内搜索与目标向量辐角最为接近的已有向量,在“矩阵的几何表示”章节中会涉及到。这里介绍的是简单匹配搜索。
+问题分析:因为矩阵乘法本质上是未知数和系数的配对求值,我们需要构造一个方法来使得“搜索内容”和“已有内容”配对。并且搜索引擎总会返回与你搜索的内容最为相似的结果,搜索“比尔·盖茨”,第一条肯定是关于他个人的介绍,而绝对不可能是一则寻狗启示……因此,我们设计的矩阵必须能在经历一轮运算后能够正确返回每个关键词出现的频率(简单点说就是出现次数),这样虚空终端才能对频率进行排序,并返回频率最大的那个结果。
+算法设计:不妨考虑这样几个矩阵——其中一个存储关键词、另一个存储搜索内容。比如我需要将几篇论文(为方便使用英文表示,并且假设词根相同的单词为同一个单词,即不考虑词汇变形)《Basic
+Structure of Elemental Monuments》(元素方碑的底层构造)、《Junior
+Elemental Reaction》(初等元素反应)、《Advanced Elemental
+Theory》(高等元素论)、《Architectural Structure in the Mausoleum of
+King Deshret》(赤王陵的建筑结构)以及《Advanced Sumeru Linguistic
+Analysis》(高等须弥语音学解析)。我们在此次挑选一些关键词存储(方便读者观察):Structure
、Element
、Junior
和Advanced
。为每篇论文编号1-5,矩阵如下图:
假如热爱学习的艾尔海森来到了教令院的大图书馆,它想测试一下这全新开发的文献查询系统,输入了Advanced
一词。假设已录入数据库就是以上形式,我们如何构造一个“查询矩阵”来和数据库矩阵进行运算呢?
首先根据矩阵乘法的前提要求,这个查询矩阵必须是四行。不妨让每行代表我们的词库词语,艾尔海森输入的是Advanced
——即对应数据库矩阵的第四列(未知数),我们要配对它的系数,因此它必须在第四行,才能保证系数正确匹配未知数。同理,查询矩阵的第一行对应Structure
、第二行Element
、第三行Junior
。他输入了一个Advanced
,因此我们的查询矩阵如下图:
乘法的目的是将二者匹配起来,得到的结果如下图:
+返回矩阵的数字代表关键词在对应数据库项中的出现次数,也就是说,如果此时再加入一篇论文《Advanced
+Usage of the Word
+Advanced》(“Advanced”一词的进阶用法),返回矩阵的最后一行(第六行)会出现一个
后日谈:可靠情报称——愚人众第二席执行官“博士”伙同教令院高层贤者向世界树中加入了大量带有重复词语标题的、正文中充满了强烈心理暗示的催眠文献,须弥民众所佩戴的虚空终端中写入的关键词查询算法自动按关键词出现频率返回结果、其内置的播放功能在结果返回后自动激活,播放其中内容,导致须弥大范围民众出现意识不清、报告称出现“重复经历同一天”、“既视感”等异常现象。后续调查正持续跟进中……——《蒸汽鸟报》记者
+夏洛蒂
+须弥的大范围“失控”已被证明是须弥民众针对教令院的一次毫无意义的武装暴动,目前已被教令院大贤者和“博士”联合镇压。主要组织者纳西妲、旅行者已被尽数羁押等候问讯。——教令院
例2.1.2 Light Novel Query 轻小说查询
+++八重堂的主编八重神子最近在为轻小说的事情发愁……并不是因为销量不够,正相反:八重堂最近推出了一项跨国销售项目,各种经典作品被远销往了枫丹廷。这就牵涉出一个问题——枫丹的市民们不想远离枫丹城区、横穿须弥沙漠、翻越璃月高山、躲避稻妻雷暴就为了看一看有哪些轻小说符合自己的独特口味……于是八重神子找到了见多识广的你,希望你能帮她做出一套轻小说内容检索系统。当然作为报酬给你的原石和摩拉是肯定是不会少的……
+当然,这套系统有一定要求。因为有很多轻小说为了吸引读者,取的标题和内容是完全对不上号的,神子的想法是做一套正文内容检索——每本轻小说的总字数在出版时就统计好了,但是苦于稻妻的信息存储技术不是很发达,神子希望存储在数据库矩阵里的数据尽可能小。请问该如何设计符合要求的存储算法?
+
问题分析:每本书中特定的词可能重复出现成百上千次(同样用英文单词表示,且同词根不同词形的两个词算作同一个单词参与计数),我们的要求是让数据尽可能小,既然总字数都已经给出了,我们不妨使用指定词出现的频率来表示这个词的出现次数(单词出现次数=全书总词数×出现频率)。这样的搜索方法叫做相对频率搜索。
+算法设计:大致原理和例2.1.1里的一模一样,只是数据库矩阵存储的不再是出现总次数,而是对应词的相对频率。因而图例2.1.3可以变化为如下形式:
+明显一看,第三篇文章出现Advanced
的频率最高,应该优先返回。但是这个例子并不是很好(明明说了按内容搜索你还在这搜索标题),但是当加入大量的正文内容时,这个方法的优势也就体现出来了。这里由于篇幅图太大耗我洛谷高级图床空间,我也懒得写那么多字原因就不举过长的例子,本例仅作对相对频率搜索的原理的理解。
后日谈:八重堂轻小说搜索引擎被教令院照搬去做了论文的查询系统……
+假设存在一个
仅交换了两行的单位矩阵称作第I类初等矩阵(只进行了初等行变换第一条),将它左乘到一个矩阵前,可以进行相应的行运算;右乘到一个矩阵后可以进行相应的列运算。比如,一个第I类初等矩阵
仅将某一行乘以一个非零倍数的矩阵叫做第II类初等矩阵(只进行了初等行变换第二条),左乘行运算、右乘列运算。例如一个第II类初等矩阵
仅将某一行的非零倍加到另一行上的矩阵叫做第III类初等矩阵(只进行了初等行变换第三条),同样是左乘行运算、右乘列运算,但是有一点点小不同,不要根据思维定势随便写答案!例如一个第III类初等矩阵
因此我们可以不必使用高斯消元,仅使用初等矩阵乘法也可以达到将普通矩阵消元变成最简行阶梯形矩阵!而且它可以进行列运算,甚至比高斯消元法更高级一点。
+接下来是我们的矩阵递推。大家都知道斐波那契数列,它的前两项均为1,此后的每一项都是前两项之和,即
1 |
|
这段代码其实就是照搬了上面的通项公式,但是递归有个弊端就是效率和内存,当
首先我们将通项公式变成我们想要求的形式,为了便于输出,要求结果矩阵的第一个元素就是答案,因此结果矩阵就是:
那么求数列第
1 |
|
它的时间复杂度可以做到
例2.2.1 Lost Control! Blubberbeast's Reproduction +膨膨兽泛滥危机
+++由于枫丹水质的大幅改善,膨膨兽的天敌数量锐减,枫丹城区近海的膨膨兽也得到了更多的食物,进而开始大量地繁殖。水质改善的第一年,已登记的膨膨兽数量是6765头,恰好是斐波那契数列的第20项。第二年,膨膨兽数量没有变化,之后的每一年,膨膨兽数量都是前两年之和的
+,已知膨膨兽的平均寿命是15年、枫丹廷近海能承载的最大膨膨兽数量是90万只。那么请问15年后近海的膨膨兽数量是多少?这15年内枫丹廷是否需要向近海投放膨膨兽的天敌以遏制后者疯狂繁殖?(结果出现出现小数则向上取整)
问题分析:这是一道标准的矩阵快速幂递推问题,它基于斐波那契数列递推、却比它更高级。首先,它的初始值不再是
算法设计: 已知初始矩阵
对于前项和的问题,前面已经给出了,因而我们的递推矩阵变成了
代码实现上,仅需将
最终结果:875076
。结果小于90万,因此不需要投放天敌。
后日谈:那如果将系数改变为977427
,接近100万了。因此但凡枫丹水质再好那么一点点,使得这个系数升高了0.1,那么枫丹廷说不定都会变成膨膨兽的第二家园了!
洛谷例题:
+ +“逆”这个词相信你早已听说过:同余意义下存在乘法逆元,大多数矩阵也存在逆矩阵。“逆”普遍用来描述不同意义下的“倒数”的概念,倒数一般满足
如果对于一个矩阵
行列式是一种函数,写出来有点像矩阵的绝对值。它可以用来判断一个矩阵是否有解、也可以定量分析线性变换对原向量的影响。矩阵
那我们在上边只提到了两种方阵,那对于
我们拿出祖传的
像上边这样,将
我们要计算整个
日常做题时,通常选取
第一节解释清楚了逆矩阵的概念,那么如何求逆矩阵呢?首先是前提——判断矩阵是否可逆!我们引入矩阵行等价的概念:
+如果一个矩阵还挺押韵)。联系到第二节的初等矩阵知识,初等行变换可以转化为矩阵左乘初等矩阵,定义可以转换为如下的数学语言:如果存在矩阵
矩阵行等价有反身性、传递性。例如:
相应的,若有方程组,使得
当且仅当
证明:根据初等矩阵的定义,它是由单位矩阵
第一种,
第二种,
第三种,
定理得证。
+两个非奇异矩阵等价的条件是:假设
在矩阵运算中,(因为实在是太显而易见了所以很平凡)
证明:首先证第一条可以导出第二条。假设
再证第二条可以导出第三条。
最后证第三条可以导出第一条。根据行等价的定义,必有
证毕
+根据第三条,我们就可以知道一个求逆矩阵的方法了:既然
例3.4.1 How Aranaras Measure Timeflow +兰那罗的时间观念
+++你在须弥冒险时,遇到了森林可爱的孩子们——兰那罗。这些小小的生物有着与世无争的纯净心灵、以及大大的胸怀。你们一同冒险,击败了桓那兰那故土的污秽化身,拯救了须弥森林。然而,在和兰那罗对话期间,除开他们奇妙的比喻之外,还有一件事情是你久久无法忘怀的——他们的时间单位。你听过最多的是“种子长成大树”、“太阳升起又落下”、“落落梅从出生到长大”、“大树长成雨林”……
+假如你们经过很长一段时间的交谈,你渐渐明确了各种时间描述词之间的数学关系,关系如下表。请你求出每个描述词所对应的时间间隔
+
已知大树长成雨林的时间是种子长成大树的50倍;树木从种子长成大树的期间,落落莓已经生长过整整15次了(由种子出生到果实成熟和从成熟到下一颗种子扎根生长的时间相同);兰那罗从种子长成大树期间,普通人已从黑发少年变为白发苍苍的老人了;普通人从青年到老年的时间足够让三颗种子先后成长为大树;一片树木生长成为雨林,不仅足够让
问题分析:既然各个描述词对应时长的倍数关系都已给出,我们可以两两列出方程组求解。这里我们用到矩阵的逆来方便求出方程的解。
+算法设计:首先将各个描述词用未知数表示出来,再用数学关系表示出题干中各个描述词的关系,如此得到的5个方程恰好能使矩阵有唯一解。因为一般的方程
解:设“大树长成雨林”、“树木从种子长成大树”、“兰那罗从种子变成大树”、“落落莓从扎根到成熟”以及“普通人从少年到老年”的时间分别为
整理得:
+对应系数矩阵
两侧同时乘以
高斯消元后,将
根据方程
即
因此,“大树长成雨林”的时间是
最后,森林会记住一切。
+感谢初等矩阵的加持,我们需要记背的知识点又多了不少呢……
我们在第三节说了,用余子式计算矩阵行列式时,需要按照同一列或者是同一行展开。为什么不能沿对角线或者是其他花里胡哨的顺序算余子式呢?下面有个引理告诉你原因:
+设
不难发现,
假如
假如
推广到
根据
因此对于
洛谷例题:
+ +简称欧氏空间,
如果仅把
事实不然,我们发现,无论这个向量的起点如何变化,它们的方向(辐角)、长度(模长)相同,它们可以经过平移变换成同一个向量。只要确定以上这两项的值,一个
(向量
根据勾股定理可以计算出向量的长度,这叫做向量的模长,
高中数学教材在虚数那一章还有一个选学知识(2023版)——辐角。尽管它标成“选学”,其实我们早在三角函数的几何表示里就接触过辐角了:一个起点是原点的向量可以看作是它从
我们定义向量的数乘运算:辐角不变,模长相乘。图示:
+(
我们定义向量的加法,参见高中物理合力与分力的知识。矢量(既有方向又有大小的量)的加法遵循平行四边形法则,平行四边形法则如下图:
+即以要进行加法的两个共起点向量为平行四边形的相邻边,做出完整的平行四边形,它们的和向量的起点与前两个向量起点相同,终点是平行四边形的对角顶点。上图中
和平行四边形法则等价的还有三角形法则:
+即将其中一个向量的起点平移到另一个向量的终点处,和向量的起点是后者的起点,终点是前者的终点。上图中
在向量表示中:
减法则是坐标相减,将减数向量做反向同模长的反向量再进行加法运算即可。
+由于矩阵可以拆分成一个个列向量和行向量,而且矩阵的加法与数乘均与刚刚介绍的向量的加法与数乘规则相同。因此矩阵具备表示向量组的条件,称之为向量空间。向量空间中定义的加法和数乘需要满足如下几条(假设
好多啊ccc,其实就是需要把“加法”定义成正统的加法(满足交换律、结合律);“数乘”定义为正规的数乘(满足结合律、分配律,没有交换律)。可以发现矩阵的加法和数乘和它完美匹配!因此矩阵可以作为一个向量空间。
于是,向量空间
当然有时我们并不需要那么多空间,好比一个人住一个城市……先不提城市各项环节能否正常运作,如果只是用来溜达的,那也是太过巨大了,有些地方可能你一辈子也取不到,还不如开始就不要。向量空间其实也可以像这样压缩范围,并且压缩后的向量空间也必须是全集
在矩阵中,也存在零空间。它表现为矩阵方程
例4.1.1 Merusea Village Portal 海露村传送门
+++自从你来到枫丹,知晓了水仙十字结社的秘密之后,奇怪的事情开始在你身边上演……
+你在海露村遇见了抽象派美露莘大画师玛梅赫、以及一只发条机关狗西摩尔。很不巧,玛梅赫的作画颜料用完了,于是你们前去收集更加纯净的矿物颜料,期间玛梅赫邀请你们进入一个粉色的漩涡虫洞。或许是因为你前一天冒险到深夜,在这个温暖且舒适的环境下来了困意。一闭眼,再一睁眼,迎接你的不是如同往常一般的新地下区域——而是一片温暖的、舒适的粉色幻境——你被一个人丢在这个传送通道里了!
+为了不让派蒙着急,同时也为了你能尽快在下一次困意席卷前逃出这个空间,你需要确定这个传送门是否为“同维度空间卷曲型”——即传送过程中不发生维度的变化。你需要证明你身处的空间是一个三维空间的子空间,这样才能使用正确的方法逃出生天。你发现你的身高和体宽的比值是原来的一半、但是体宽不变。请证明你所在的空间是是三维空间的子空间。
+
问题分析:首先要根据已有的信息判断该向量空间是否为三维向量空间的子集,然后再验证加法与数乘的封闭性,只有当二者均成立时才能够证明该空间是三维空间的子空间。
+算法设计:根据题干最后一句话,我们不妨将主人公设为三维坐标系原点,按照
解:根据变换关系,得到该向量空间的集合形式
因此,所在空间
后日谈:其实是你网卡了渲染出错了……和什么三维不三维空间没啥关系……
+假设
我们都知道,
如果
对于第一条,因为你怎么拟合平面,都不可能让你的平面比整个空间的维度更高,而且无论以什么系数搭配向量,它们所得的新向量都在整体空间内,第一条就能很简明的证明了。第二条性质,首先空间内向量的张成必为整个空间的子空间,毕竟用的都是数乘和加法,用的向量也都在空间内,总不能算一下加法向量就跑到空间外边去了吧,此外,因为数乘和加法的封闭性,任何经过这两个向量的空间都包含其张成,因此它是最小的。
+和张成相对,如果
基底,大家在高中立体几何部分学过了。当时的定义是:平面内不共线的两个向量叫做这个平面的一组基底。然而这段话可以用线性代数的语言原原本本描述出来:“在
例4.2.1 Al-Ahmar's Trial 赤王的试炼
+++你和婕德一行人在圣显厅前击败了图谋不轨的镀金旅团,并在他们搭起的营帐里发现了一封密信。上面写着若想进入圣显厅,需先过三关试炼。为了能够一探黄金梦乡的秘密,你接下了完成三重试炼的任务,然而当你真正进入到第一重试炼时,却发现事情并没有这么简单……
+你进入了试炼场地,却发现整个世界天旋地转。最终安定下来,你发现赤王的神奇科技把你带入了一个
+维空间内。这还没完,四周又有整齐排列的空气墙阻挡了你的通路。经过好一顿摸索,你终于发现这是一个 维空间,于是你开始建立空间坐标系,五个坐标轴分别是 ,假设你现在所在的地方是原点 ,通关点 。四周的空气墙限制了你仅能沿着与向量 平行的方向行动。请问如何安排前进方向使得你能够从起点 到达终点 ?
问题分析:这个问题明显是让我们用
解:明显地,题中五个向量互相线性无关,因此可以作为该平面的一组基。由于向量加法和数乘运算的封闭性,且路径向量
设
因此,应在
因此一旦选定了平面的基底,该平面上所有的向量都可以用这组基底唯一表示出来,具体操作是使待求向量
基底可以表示平面内所有的向量,故
第二节里我们讲了向量空间的基底,基底其实还有一个名称叫线性基。平面中所有向量唯一对应一种基底的线性组合。在OI中常常被用于求第
一组值的异或和可以看做该空间内异或线性基的向量的异或组合,由于基底表示向量的唯一性:原集合中的数可以通过异或线性基里的基向量唯一确定。它有如下几个性质,事实上,它和普通平面内的实数线性基有相似之处:
+异或运算也有一个特殊性质,若
根据以上性质构造计算方法:
+1 | void insert(ll x) { |
由于一般题目中数据范围是1e18
,而转换为二进制位就有unsigned long long
,线性基p
数组至少需要60
位。
有时并不是所有的插入操作都会成功,因为要保证异或线性基里的向量互相线性无关。存储操作本质上是拆分二进制位,然后将它尽量表示为已有基向量的异或和,好像除去每个人身上的共同特征,只保留人的独特个性一般。如果拆到最后再也拆不了了,证明它是独特的,可以加入其中。反之,这个数就可以被其他数通过异或运算代替,没必要加它,返回插入失败。可以有下面的代码:
+1 | bool insert(ll x) { |
如果是求一个数能否被这个异或线性基表示出来,将最后一行改为return !x;
即可(能表示即不可插入,不能表示即可以插入)。若某次插入失败,证明flag = false
,在插入失败后设为true
表示需要特判
线性基用于求解一组数的异或和最值问题,有下面求最值的三个例子。它们无一例外使用了贪心法:
+1. 求最大值
+1 | ll xorMax() { |
为什么从高位开始遍历?我们都知道如果一个数字的某位数大于另一个数字相同位置的数(两数数量级相同,即十进制下位数相同),那么前者是大于后者的。根据异或的运算法则:“不同为ans
的高位此时是0
,若进行异或运算的同位数字是0
,即二者相同,结果为0
,不会变得更小;反之若异或运算的对应二进制位为1
,当前位异或结果是1
,变大了,因此ans
高位为1
,运算数对应位为0
,结果为1
,不会变得更大;若运算数当前位是1
异或结果为0
,变小了,所以
2. 求最小值
+1 | ll xorMin() { |
我们知道,可以通过任意组合(异或运算)异或线性基中的元素来得出各种新的元素,若
3. 求第
这才是异或线性基的高级玩法
为了求第rebuild
。
1 | void rebuild() { |
接着我们需要特判
1 | ll queryKMax(ll k) { |
除了求值,异或线性基还可以合并,甚至于求它和另一个异或线性基的交集与并集。所以异或线性基是一种数据结构。封装在一个结构体XorBase
里:
1 | struct XorBase { |
4. 并集
+思路就是枚举异或线性基
1 | XorBase Union(XorBase A, XorBase B) { |
5. 交集
+如果一个异或线性基里的元素插入到另一个异或线性基里会失败,则将它插入到交集异或线性基中。
+1 | XorBase Intersect(XorBase A, XorBase B) { |
例4.3.1 DMG Bonus 核爆
+++作为一名资深神原玩家,你希望能在新限定五星角色初进卡池时尽快拿下全网首个999w核爆记录,以此证明自己的实力。现在你已经在游戏里做好了很多伤害加成型的食物,准备在boss战时一展身手。战斗开始时,你首先给角色吃下了基础食物(每局开始前必吃的食物),它的效果是在300秒内单角色爆发伤害增加
+,但是同时它有一个副作用…… 基础食物生效期内,如果角色吃下其他伤害加成型的食物,总伤害加成的百分比数值将是各种食物的伤害百分比数值的异或之和,即
+, 表示 , 为异或符号。各种食物的伤害加成在下边给出,如果不吃任何加成型食品(也不吃基础食品),爆发伤害期望值为 。吃完所有食物后,如果你用增伤角色施加了 的爆发增伤。请问你的最大爆发伤害能否达到 ,即 ?若不能,最高伤害是多少?(令每种食物只有一份,且食物效果均可叠加,结果四舍五入到万位)
编号 | +加成效果 | +
---|---|
1 | +270% | +
2 | +200% | +
3 | +280% | +
4 | +200% | +
5 | +180% | +
6 | +150% | +
7 | +75% | +
问题分析:题干信息已经很明显了,这是一道异或线性基的最大和问题。根据上文所述程序计算即可。
+算法实现:这里使用的是结构体封装版本的异或线性基计算代码:
+1 |
|
运行代码,在输入框输入:
+1 | 7 |
结果输出:8162000.000
。小于所给的816
万。
洛谷例题:
+ +(操作没成功の尴尬,图片来自知乎)
+这篇文章从数学方面推导刘谦2024年央视春晚上表演的第二个魔术的秘密、分析尼格买提错误之处,并在已知信息的加持下尝试推测尼格买提手上所剩的两张半面扑克牌的牌型。有一说一撒贝宁是真的会测假
对应魔术节目:《守岁共此时》的回看请戳这里,在一小时十分整处。
+先不管你拿了哪几张牌,也不管打乱前它们的先后顺序如何——因为它们都跟魔术本身、也和我们的推导无关。我们只着眼于打乱后的牌,将它们按照上下依次编号为1~4。如下图:
+1234
沿折痕撕开,假设第1号牌撕成的两张半牌编号为1和A(数字在上字母在下),八张半牌叠在一起,得到的牌堆是这样的:
+1234ABCD
接下来的推导就围绕上面这个牌堆开展。
+对应第三步——从上边拿出和自己名字字数相同的牌,放到最下边。假如我拿出三张,也就是编号为1、2、3的三张牌,放到最下边。牌堆变成这样:
+4ABCD123
第四步——再拿出最上边三张牌,卡到中间去:
+CD4AB123
第五步——藏起最上边的牌,也就是编号为C的牌。
+第六步——根据南北方人拿牌。因为我祖籍北方出生在南方,我这里就拿三张牌插入到中间位置(B和1之间):
ABCD4123
我是男生,丢最上边的一张牌,也就是说丢出编号为A的那张(此时内心默默丢掉了两张牌):
+男:BCD4123
女:CD4123
然后是见证奇迹的时刻。此时男生手里剩下7张牌、女生则是6张。这里其实无需说出那句咒语:如果你是男生,就不做操作;如果是女生,就将最上边的牌放到最下边。
+男:BCD4123
女:D4123C
最后是好运留下来、烦恼丢出去。按照规则,我们要轮流进行两个操作:移动最上边的牌到最下边、丢掉最上边的牌。如此操作直到只剩下一张牌。这其中涉及到一个知识点——约瑟夫环问题
+简而言之,就是从特定编号出发,每经过
也就是说,七个人围成一圈,“1、2、1、2……”的报数,最后剩下的是几号。这里有一个巧算的方法,适用于“1、2、1、2……”报数模型。首先找出不大于人数7的最大的2的整数幂,因为
对于男生,最后剩下的牌就是最下边的那一个,编号3
。
对于女生,剩下的是第3
。
拿出藏起来的牌C,我们开头就知道了:第三张牌被分成了3和C。也就是说它们可以拼合成同一张牌!魔术成功了!
+不妨从一开始就观察3
和C
的变换规律,可以发现3
号牌自从第三步结束后被移动到最下边以来就几乎没改变过位置;而前四步则是合力将C
拉到了最前边好让它被顺利地挑出去。然而最为精妙的还是对“1、2、1、2……”报数约瑟夫环模型的应用。那么为什么尼格买提的操作会失败呢?看下图:
如果你是罕见的“第三性别”,想要在第七步里面丢三张牌,也是可以的,因为这样并不会改变最后一张牌3
。事实上,这个魔术最多可以在第七步丢掉七张牌,这样下来就只会剩下一张牌3
,全部完成之后还是可以和C
配对成功的。
右上角是他的操作:他在“南方人和北方人”的操作里拿了三张牌,但是插入的时候错误将其中两张牌插到了最下边并且这两张牌和另外的那一张牌分开了(原规则是一起插到中间)。
+因此这堆牌的底端变成了黑桃Q,不久之前,他藏起了一张黑桃A。所以,他最后拿出的牌是对不上的,一张是黑桃A,一张是黑桃Q。
+下面是从班级群里偷的几张图,以实际证明这个理论是成功的:
+当然,如果就某位“客串见证人”的失误而大做文章的话,显然是极其招人嫌恶的。刘谦本人的魔术并没有什么问题,尼格买提可能也只是太过关注自己接下来在春晚上的表现而有些分神罢了。如果这个失误真的导致2025年春晚刘谦不被总导演邀请上台的话,这种毫无底线夸大其词的舆论只会是雪上加霜,让所有人更不好过而已……事后小尼本人也道了歉,因此已经没有必要再抓住谁人的过错不放,只是从科学的角度出发,论证这个魔术的成功之处。毕竟少有节目能如此调动起屏幕内外所有人的互动热情,如此看来,刘谦的魔术也是非常成功的了。
+ + +九月初的某节语文课,当语文老师问及苏轼的个人形象时,国祯和小又肥同时说出了“优雅”二字,国祯更是以一个屁总结了自己的观点。此后不久,国祯和冰正在激烈地讨论老八秘制小汉堡的事情,正当所有人因为思考语文老师提出的问题而陷入短暂沉寂时,冰向后一靠,把手垫在脑后,说了一句:“吃饱啦!”。便如此得名。
+国祯表示历史老师长得很像电饭煲,于是得名
+9月4日,一班真正意义上进行了一次以教室为起点的干饭行动,基本上一分钟内能够到达食堂。
+张伟水课的新型套路——不讲正课天天喊我们拿出Global +Reading来看,久而久之成为英语课和扣分的代名词。
+9月28日周四晚,东辰组织制作月饼,有人在月饼里放狠料咖啡粉、硬币、长尾夹(后被取出)。事后国祯将此事传开,被茂华得知,被张伟处分。
张伟最爱罚背的几篇Global +Reading上的文章,国庆放假前被总结为这句口头禅
+张伟扣分前的口头禅,后演变为罚背的代名词
+ + +文中提到的核心程序代码及食用方法在文章末尾处,或者访问我的云剪贴板来复制代码
+注意,极域由C/C++语言开发。对于极域的反编译工作可以基本认定为徒劳且耗费大量时间的。
+开始的开始,我的脱控方式还仅限于最原始的taskkill
和ntsd
。这种做法不仅有时会失效,而且一旦老师发现你的机子的监控屏幕是纯黑一片、且无法控制,他就会气急败坏地冲向你对你进行一顿输出,结果自然是被班主任教训一顿、这学期的信息课停上。
令人欣慰的是:这种低级脱控方式已经在学子之间渐渐隐没不见,取而代之的是层出不穷的脱控软件,例如JYTrainer
、还有本人开发的ClassX(doge)等等……
因为本人不会那些所谓的网络IP、频道更改之类的高科技东西,另一方面实现如上的功能多半需要辅助程序(容易被反脱软件检测到进程名)。本着精简实现、不易查封的原则,我从非exe
层面出发,编写了一套脱控程序供大家伙们免费使用,毕竟人生苦短,及时行乐嘛(doge)。
你知道明明U盘里装着几个G的学习资料却无法在计算机课上给周边的同学炫耀是怎么样一种感觉吗?你知道明明想要打开小破站观看最爱的coser投稿的新擦边视频却被提示“该网站已被禁止”是什么样的感觉吗?
+出于以上两种痛苦的经历,我立志要写出能够禁止极域牛马功能的脚本。就先从U盘解禁和网络解禁两个方面入手!
+Windows服务概述:打开任务管理器,选项卡里不仅有经典的“进程”选项、也有装机大佬们引以为傲的“性能”选项,可是我们今天的主角:“服务”选项却几乎无人问津。
+类似于cmd
的打开方式,服务管理器则需要在Win+R
后输入services.msc
来使用;你也可以通过任务管理器“服务”选项卡进入。那么什么是服务呢?
Windows服务是指系统自动完成的,不需要和用户交互的过程,可长时间运行的可执行应用程序。这些服务可以在计算机启动时自动启动,可以暂停和重新启动而且不显示任何用户界面。一个词概括就是:“幕后黑手”。开头立的flag就需要通过这种方式巧妙解决。
+定位到极域安装目录:会发现下面有好多TD
打头的文件,而当你在服务里面搜索时,你会发现一个惊人的巧合:TDNetFilter
和TDFileFilter
早已在你的机器上悄然运行了很久。看到它的名字,容易知道前者禁掉了你的网络、后者ban掉了你的U盘。如何终止服务呢?这也非常的简单:
在Windows系统中,与服务有关的命令是sc
。要想停止某个服务,只需安装如下模式输入指令:sc stop [NAME]
(NAME
是服务名称)。于是我在ClassX
的开头加入了如下的指令:
1 | sc stop tdnetfilter |
这样就结束了吗?然而并没有……
+上一节里遗留了一个小问题:停止了服务后他就真的解禁了吗?事实并非如此:没过几秒,你的网络又会恢复到先前的状态、U盘再次被封杀。一切的一切都是因为两个不起眼的可疑程序……
+ProcHelper64.exe
和MasterHelper.exe
——《我们俩》
有人问我当时是怎么发现的。首先需要知道,每个版本的Windows系统几乎都有一套特别的图标主题(图标存放在Shell32.dll
中),现如今大部分机房电脑使用的是Win10系统,然而上述两个进程使用的是WinXP风格的图标,直接一眼丁真掏出taskkill
秒了。真是实力坑队友。
因此ClassX
里面还有这一段代码:
1 | :a |
:a
定义了一个函数a
,中间是函数体,最后一行的goto a
则是调用这个函数,注意goto a
写在了a
函数内部,起到了while (true) {...}
的死循环作用。你也可以在空行出添加一段TIMEOUT /T 1
,即延时一秒,因为这两个程序的复活时间大概在1秒左右(终止后一秒就会重启)。
如果你是Win7及以下的系统,且直接使用任务管理器结束进程,那么很有可能会出现像标题这样的提示。这是因为极域启动了一个系统钩子(四川人莫笑,Hook
翻译过来的确是钩子的意思)。
Windows钩子概述:类似于游戏(以及Scratch)的消息机制,Windows中存在一种事件系统,Win+R
弹出运行、输入eventvwr.exe
/eventvwr.msc
打开事件管理器,你会看到本机所有事件的发生时间及概况。把Windows系统的事件系统比作一条河流,最上游是系统,负责抛出事件,事件信息顺流而下;把应用程序比作渔夫,它们在河岸两侧用网捞特定类型的事件,大多数情况下自行处理后再放回到河中。
对于极域来说,它在一个名叫NtTerminateProcess
的系统函数上下钩,检测这个函数的传入信息,即终止对象的进程名,是否是StudentMain.exe
(极域主程序),若是,就返回false
,也就是失败。因而导致开头所说拒绝访问的情况,而把钩子钩在此处的,就是我们的TD
圈大佬LibTDProcHook.dll
。因为本人使用Win10系统,这个钩子对于Win7以后的系统都会失效,因此Win8/10/11用户可以直接用任务管理器。对于Win7系统用户,在这里使用WinAPI终止这个TD模块。
1 |
|
自从学校机房的极域从2014版更新到了2020版,上述朴素解决方案已经不见效了。我也不知道从哪一年的版本开始,它给自己的服务加了一层防护,普通地运行bat
脚本还木有用。但是它解决起来也简单,右键文件“以管理员模式运行”即可。
除此之外,你还可以在脚本开头加入:
+1 | >nul 2>&1 "%SYSTEMROOT%\System32\cacls.exe" "%SYSTEMROOT%\System32\config\system" |
来实现UAC自动提权管理员!
+有一天我的同学给我推荐了这个方法,说是用一个命令行程序Suspend
来命令层面挂起极域进程实现随意脱控,亲测有效。如果使用性能监视器也可以达到相同效果。
大家可能有过这样的经历:当你用WPS做PPT或者正在用WPS演示PPT时,有时它会莫名其妙地卡掉,尤其是你画了太多墨迹注释时,看着永不停歇转动的“繁忙”鼠标图标,你也许会耐不住性子直接任务管理器结束进程,并发誓要下载一个破解版的微软Office全家桶来用。像这样,程序的卡死就是挂起的一个形式,当然,当CPU面临有限的内存分配问题时,它会优先分配运存给那些需要内存的重要程序而把不那么重要的进程挂起,表现为对用户操作无响应等。
那么你可能已经猜到了这一方法的逻辑了:我们挂起极域主进程。这样当教师端发送指令(黑屏安静、全屏广播等)时,你这边的极域接收端(学生端)就无法对指令作出响应,自然也就不会被控制。桌面监控同理,也会被影响,不同的是,教师端的监控小窗只会定格在你挂起极域前传输过来的最后一帧画面,总之瞒天过海是基本上没问题的了……
+根据上述原理,我们有两种方式来挂起一个进程(其实本来还有Win32API这种方法,留给读者自行研究):
+你可以打开任务管理器,在“性能”一栏的左下角可以看到“性能监视器”选项(Win10),对于Win11用户,则需点击“性能”栏右上角三个点,然后选中“性能监视器”;也可以Win+R
输入perfmon.exe /res
直接打开(万能)。还有几种方法见百度百科。
在性能监视器中,我们在最上面“进程”列表中找到StudentMain.exe
(一般来说有两个同样的进程),接着挨个右键点击“暂停进程(S)”即可。
但是这样的话,你在教师端那边的小窗口上就会显示出一个性能监视器的窗口,感觉不太完美,怎么能优化一下呢?
+下载后的压缩文件里面有一个.cmd
文件,用记事本打开:
1 | chcp 65001 |
其实我们真正需要修改的内容是第二行:它使用bat
批处理脚本设置变量suspend_targets
,传入需要挂起进程的进程名称话说DDLC是真的生草……。这里我们修改参数值为StudentMain.exe
:
1 | chcp 65001 |
pause
之后的那一行是解除挂起的代码,因为bat
执行到pause
语句后会等待用户输入任意字符后才继续进行,因此如果遇到紧急情况需要解除挂起,只需在命令行窗口点击任意键即可。
需要注意的是,一定要把下载好的压缩包里面的所有文件放到同一个目录下,否则缺失任何文件这个工具都是无法正常运行的。
+那天我在思考如何一劳永逸的结束极域进程,我打开了服务列表,在里面看到两个纯大写拼成的服务名GATESRV
和STUDSRV
。可惜的是那天放学,我没能来得及探究清楚这两个服务与极域的关系,目前已知的信息就是它们绝对是极域自己启动的两个服务。
这个问题就留给2024的我解决吧
+// TODO
+在本人印象中,红蜘蛛似乎就仅仅只是一个吉祥物,只有在开机后那么几秒,它拖着上世纪复古风的“高清”启动界面在我的眼前一闪而过,然后静静地躲在任务栏的小图标里,践行它大隐隐于市的人生信条……
+说实话要不是同学提醒我还真忘了机房里还有这位叫红蜘蛛的朋友,于是我着手开始破解它。红蜘蛛:我吃柠檬
知道2345全家桶的同学们肯定对它恨之入骨,尤其是那些下载了2345的同学们。2345号称天朝第一大流氓软件,在无数人的电脑中如同鬼魂一般挥之不去。捆绑安装、弹窗广告、强制修改系统文件、浏览器劫持……无奇不有,关键是它的公司甚至推出极其出生的“推广包”机制来诱惑不良商户分发2345毒瘤软件。这篇文章介绍了清除2345的一种方案。
+回到本节主题上来,为什么会取这样一种怨气十足的标题呢?是因为它和2345伪装成系统文件类似,红蜘蛛属于是反向利用了系统文件来给自己加上一层保护网。
+打开任务管理器,除了霸占后台程序第一行的红蜘蛛本体,下面还有两个附属程序,名叫“3000soft通用组件”,如果直接终止进程,它很快会再次冒出来。将它们展开后发现叫做checkrs.exe
和rscheck.exe
的程序。那么运用上边经常用到的服务搜查法,我们发现了两个命名规则极其相似的服务:appcheck2
和checkapp2
。
然而我事后才发现红蜘蛛官网早已自报家门了……血亏!
常规思想:我们使用sc
命令结束这两个服务,然而……
// TODO
+显示无法停止,那怎么办呢?
+考虑到这两个进程是红蜘蛛死掉后无限重启的命根,并且这两个进程也跟红蜘蛛主程序一样杀了就会重启……很明显,根本原因就是那两个服务,但是sc
命令不管用了,咋办呢?(抠头)
这时我们就需要绕道而行,既然命令不行,我们转战注册表!打开注册表管理器,定位到HKEY_LOCAL_MACHINE\SYSTEM\CurrentControlSet\Services
文件夹,它有很多个子文件夹,在下面定位到appcheck2
和checkapp2
,它的文件结构类似于这样(这里用别的服务替代一下):
(注意,这个并不是红蜘蛛的服务,是我临时找别的替代的,它们的文件名相同,只是数据不同而已)
+容易发现:ImagePath
项指向了服务的根文件地址,也就是俗称的万恶之源,既然每次终止组件后它会自动重启服务,那我们为何不破坏这个ImagePath
,让它指向一个不存在的地址,这样它就启动不了任何东西了。在我的绿蜘蛛inf
文件里如此写到:
1 | [Version] |
然后你就可以用任务管理器终止两个通用组件,紧接着就可以终止红蜘蛛了!
+由于本人目前对红蜘蛛知之甚少,可以看这篇文章了解更多!
+其实一开始我以为它和极域一样是基于C++/C开发的因此无法反编译,直到回家之后我自己下载了一个。杀毒软件报毒删除了set.exe
,打开main.exe
主入口程序时它突然弹出了一条C#式的通知框提示set.exe
未找到。于是果断打开dnSpy开启后面的破解,反编译破解的内容将在后面涉及到。
首先看到他的文件目录↓
+其中zy
文件夹中存放的是各种浏览器的exe
可执行文件,猜测是覆盖现有的高版本浏览器,以便它操作注册表禁止各种功能。
有一定经验的同学想必会一眼看到可疑的yl.reg
注册表文件,但是先别急着合并注册表。首先,你的机器可能已经被禁用了注册表和任务管理器;第二,这个文件里也不是你心心念念的破解注册表(虽然后面我们会利用它破解机房管理助手)。对于未知的事物,最好还是保持谨慎勿近的态度为好……
除此之外,一个名叫jfglzs.exe
的程序吸引了我,根据我多年混迹于首拼梗圈的我一秒钟就反应过来,知道它就是“机房管理助手”的首拼。我们之后的破解也围绕着这个东西进行。
本人Win11系统,正常情况下任务栏设置上端会有一个任务管理器选项。
如果你稍微懂一点高级知识,你也许会使用Win+R
,并输入taskmgr
试图使用任务管理器。然而这不可能奏效,因为你会接到一则提示:
输入regedit
(注册表)和gpedit.msc
(组策略管理器)也是一样的道理。很少很少的高材生会使用mmc
试图加载组策略,但是这样也不可能奏效。搜索资料发现,修改注册表的某些键值可以实现禁用组策略、注册表、任务管理器的功能。深度分析yl.reg
时就会发现这些东西:
第一行翻译过来就是:“禁用任务管理器”,它的值被设置成了1
,也就是true
。这一块还有禁止更改密码、禁止切换用户的设置等等。对于组策略,它的两个值则是存放在注册表:HKEY_CURRENT_USER\Software\Policies\Microsoft\MMC
中的RestrictToPermittedSnapins
;和它的子目录HKEY_CURRENT_USER\Software\Policies\Microsoft\MMC\{8FC0B734-A0E1-11D1-A7D30000F87571E3}
中的Restrict_Run
。如果不出意外,它们的值都是非零的,意味着组策略被禁用了。要想破解,我们就需要用一个不直接调用注册表的方式来添加/更改注册表值,这也就是下面将要提出的inf
安装文件法。
INF安装文件的机制
+提起绿色版软件,大家应该不会陌生,它省去了冗杂的dll
等库文件,仅仅一个exe
文件驱动整个程序。在绿色版软件安装时,有时就是用的inf
文件安装法。一个可运行的inf
文件包含几个项:
1 | [Version] |
Version
段包含inf
文件的基本信息,其中Signature
指定了文件的适用系统,常见的值有MS
、WindowsNT
等,这里我们使用CHICAGO
获得最广泛的支持(注意美元符号和引号的书写)。
1 | [DefaultInstall] |
这一段声明了安装时所需的函数,DelReg
负责删除注册表,AddReg
负责创建/修改注册表。基本语法如下:
DelReg
:[ROOT] [PATH] [NAME]
,ROOT
就是注册表中HKEY
开头的那些,你可以写全称,也可以写缩写形式(HK
+后两个单词的首字母,HKEY_LOCAL_MACHINE=HKLM
);PATH
是包含指定键值的文件夹路径;NAME
就是键值的名字。
AddReg
:[ROOT] [PATH] [NAME] [TYPE] [VALUE]
,TYPE
指定了注册表值的类型(0
相当于缺省,默认字符串;1
为DWORD
值,设置十六进制值时只需两个数字一组,中间逗号分隔开,一定保证输入的十六进制为8位,一定记得写前导0!);VALUE
即为键值,值为字符串时需要在前后打上半角双引号。
等号右侧的值相当于C++中的typedef
,用来重命名函数,因此,在后续的安装代码中,我们的字段标识符都要与等号右侧的值相符才可,在我们的inf
中,它表现为这样(inf
文件的注释用分号表示):
1 | [Delete] |
在记事本里编辑即可,记得保存为.inf
文件,而后右键“安装”,或者在cmd
里运行:InfDefaultInstall + inf文件地址
(前提是你的cmd
没被禁止)。
除此之外,我们发现了一些好玩的东西:yl.reg
的最后几十行,将常用浏览器的起始界面通过注册表的方式修改成了它的官网,学有余力的娃们可以通过刚才介绍的AddReg
函数把它的值改成你想要的值,在这里我换成了我精心制作的嘲讽页面:
1 | [Add] |
yl.reg
——队友坑害全队的典型例子。
当一切完成之后,你就可以自由使用任务管理器了,被锁定了cmd
的同学们也可以尽情使用taskkill
了!诶等等,事情好像有点不对劲……
可是我的taskkill还好好地躺在System32
文件夹里啊
机房管理助手一启动,所有使用taskkill
的脚本/程序都会失效,属于是老阴B了。如果不逆向破解,我还真不清楚这是怎么做到的。总之你可以在网站上下载一个taskkill
(对上网下载一个下来),或者顶住巨大的学习难度学习WinAPI
(TerminateProcess
函数)写出一个拔山盖世的C++程序来。这一节就不多赘述其他内容了……
其实最扎眼的就是它里面写的宣(补)战(贴)名单各种脱控工具箱,说实话那些工具箱软件我基本上一个都没见过……
这些注册表项有一个很普遍的特征,它们无一例外指向了注册表HKEY_LOCAL_MACHINE\SOFTWARE\Policies\Microsoft\Windows\safer\codeidentifiers\0\Hashes
下很多以GUID
形式命名的文件夹,那么这些文件夹具体起什么作用呢?
这其实是组策略管理器的黑名单,具体见此,没错,组策略可以限制指定软件的运行。但是很遗憾,这些配置全部存放在上述的注册表里面。你可以把注册表看做系统的配置文件,操作系统几乎所有配置信息、甚至包括大部分软件程序的配置都存放在注册表中。这么看来除了BIOS没别的安全地方了
如果想要禁用这些项,并不需要挨个将每个文件删去,而是看到他的其中一个父文件夹codeidentifiers
。它里面有一个二进制值authenticodeenabled
,它指定组策略黑名单的ID标识符,也就是codeidentifier
文件夹下以数字命名的文件夹,只有当子文件夹的名称与ID标识符相同时才会启用该文件夹下的配置。因此我们釜底抽薪,直接更改authenticodeenabled
的值:
1 | [Add] |
正如开头所说,学生机房管理助手由C#开发,因此可以用dnSpy
反编译它的可执行文件,得到源码。那么我们就开始吧!
正如大多数软件那样,机房管理助手对它的源代码进行了一轮套壳,也就是代码混淆。为了让代码变成我们都容易看的形式。我们使用C#脱壳软件NET +Reactor Slayer进行反混淆(代码混淆工具为NET Reactor)。
+1 | using System; |
同时,机房管理助手的密码MD5文件存放在注册表HKEY_CURRENT_USER\Software
下的字符串值n
里面。更改即生效!
使用方法:另存为.bat
文件直接运行
1 | @echo off |
使用方法:另存为.inf
文件→右键安装;任务管理器先结束进程3000soft通用组件,再结束红蜘蛛软件
1 | [Version] |
使用方法:另存为.inf
文件→右键安装
1 | [Version] |
如果说数论是数学体系中专门用来研究数字性质的一个分支,那么初等数论则是对整数的性质进行系统性的探讨与研究。千万不要因为其中的“初等”二字小瞧这初等数论尽管名称和学习难度上都没有高等数论那么有逼格,就像初等数学之于高数,数论的所有内容均筑基于此。其中欧几里得证明的算数基本定理(一切合数都可被分解为有限个质数的乘积)在质数筛、GCD(以及LCA)计算、无理数证明等问题上均有用武之地。可以说高等数论奠基于初等数论。它同时也是初学者接触数论的必经之路。
算术基本定理:每一个合数都可以被分解为有限个质数的乘积。即对于任意合数
推论一:正整数
推论二:正整数
推论三:正整数
质数分布定理:区间
费马小定理: 若
欧拉定理(费马小定理扩展): 若
同余,顾名思义,两个数分别除以一个正整数
同余具有以下三种基本性质:
+当然,它可以延申到计算机的模运算(毕竟出现了
还有两个推论:
+同余消去原则:
+++若同余号两端的项相等,且都与模
+互质,则可以同时消去
举例:
质数的判断:除了它自身
试除法:
+这是三种方法中,唯一一种能做到100%正确的质数判断方法。对于给定数
1 | bool isPrime(int n) { |
复杂度:
适用范围:普及、提高
+试除法の大胜利!
费马素性检验:
+是上述费马小定理的实际运用,它与常规算法思想有所不同:它主张在
1 | bool isPrime(int n) { |
复杂度:
适用范围:提高T2及以下(慎用)
+为什么用该方法判断的质数 大概率
+是个质数呢?不妨测试一下561
(3)、1105
(5)、1729
(7)(括号内为它的最小因子),你会发现函数的返回值均为true
,即都为质数。可见这个算法不是100%正确的,这些“漏网之鱼”被称为“Carmichael数”。它们极其罕见,一亿范围内仅255个。也因如此,你可以通过打表特判的方式抠掉这些特例(你保证记得住就行)。2016年中国物流工人余建春给出了一个Carmichael数的判断准则,这个标准目前在国际上得到了广泛认同。
对于优化,你可以在函数起始点加入类似于if (n % 2 == 0 || n % 3 == 0) return false;
的特判,进一步降低复杂度。
Miller-Rabin算法: +该算法同样无法保证结果100%准确,慎用!
+MB算法实质上是对费马素性检验算法的效率和准确度优化。算法流程如下:
+当然,它同样有特例,称为强伪质数,如2047
(23)、3277
(29)、4033
(39)等(括号内为它的最小因子)。
常见的质数筛法有:试除法、埃氏筛、线性筛。
+试除法:从质数定义出发,即存在一个正整数
1 | bool isPrime(int n) { |
复杂度:
适用范围:普及T2及以下
+这里所展示的试除法代码实际上经过一轮优化。若严格根据质数定义,第二行的循环上限应为
埃氏筛:全称叫埃拉托斯特尼筛法,老哥生活在2200年前的古希腊,不借助望远镜就计算出了地球的周长(与真实值偏差仅0.96%)、同时他也是第一位根据经纬线绘制出世界地图的人、也是最先提出将地球根据南北回归线分为“五带”的大人物。他提出的筛法核心思想如下:
+第一步:列出从2开始的一列连续数字;第二步:选出第一个质数(本例中为2),将该质数标记,将数列中它的的所有倍数划去;第三步:若数列中的末项小于它前一项的平方,则质数已全部筛出;否则返回第二步。
+1 | void get(int n) { |
其中,prime
数组存储质数,vis
数组用于标记(即上文中“划去数字”),变量cnt
则存储
复杂度:
适用范围:普及T2及以下
+但是继续观察算法发现:我们其实无需将所有
1 | void get(int n) { |
优化复杂度:
适用范围:普及T3及以下
+线性筛/欧拉筛:实质是埃氏筛的线性优化。因为在埃氏筛中,有些数字被重复筛了多次(例如30会被2、3、5筛到)。本着线性优化的原则,我们需要找到一个方法,使得每个合数仅被筛选一次。主要思想如下:
+我们发现,线性筛和埃氏筛均使用了质数的
1 | void get(int n) { |
复杂度:
适用范围:普及、提高
+例题:
+ +因数定义: 对于一个数
试除法:万能暴力解法。即遍历
1 | vector<int> get(int n) { |
复杂度:
适用范围:普及T1
+辗转相除法: +又是我们大名鼎鼎的欧几里得老先生提出的一套公约数算法,整个算极其简洁:核心只有一行,即:
+++两个数的最大公约数等于其中较小的数字和二者之间余数的最大公约数
+
可以写出:
+1 | int gcd(int a, int b) { |
但是为什么
假设如下关系:
首先证明充分性:令
代入初始除法算式得:
接着由于加减乘法的封闭性,即一个整数进行加减乘运算得到的结果同样是一个整数。可以得出:
接下来证必要性。令
Stein算法:
+上一个方法的明显缺点在于,它处理大质数的效率并不好(但总体来说是很好的),因为它使用了取余运算,这会减慢一些速度。可以理解,生在2000多年前——一个没有电脑和OI的古希腊社会,这个算法已经足够兼顾常规效率和手推难度了。但是步入21世纪,加快的生活节奏毒瘤数据使得人们对更快算法的需求空前高涨。Stein算法便应运而生。
算法流程如下:
+1 | int gcd(int a, int b) { |
这个算法的优点在于:它大大优化了大质数的运算。但可惜的是,它的代码量膨胀了8倍,因此不太建议赛时使用。毕竟C++都给你内置了__gcd()
函数嘛,干嘛不偷个懒?
我们可以简单概括成一句话:
+++两个数的最小公倍数等于这两个数的乘积与这两个数最大公约数的商
+
即:
凭啥呀?
我们假设两个数
由乘法交换律,可知:
消去
例题:
+问:论牧师欧拉有多么的高产
答:平均每年800页数学论文你说高不高产嘛
欧拉函数,记作
欧拉函数有如下计算公式:若
推导思想即为用
因此我们离解出欧拉函数就进了一步了,我们的过渡式子就是
好耶
别急着好耶,我们可以发现一个小小的推导谬误(可能并不是很容易发现)。当我们用
易知
那么对于
回到欧拉函数推导上来:过渡公式
当然这又有一个小问题没完没了了是不是?:对于
又是如上的容斥判断,这里我们省去讨论。将最终的产物合并得到:
终于可以好耶了……
主要是如果压成一个Div会非常的长,因此这里新开一个Div2
我们明确了欧拉函数的推导,接下来就是整理思路写代码的时间了!我们也只需跟着原始思路走就可以了。再次回忆一下:首先我们需要筛出质因数,除去它的所有倍数,再用公式
1 | long long eular(int n) { |
时间复杂度:
适用范围:All Clear
++++
+- 若
+为质数,则
让我们回到欧拉函数的定义上去:
很显然,答案是
+++
+- 假设
+是一个质数, (或 ),且 的值已知,那么
凭啥呀?
因为
那么函数值多乘了一个
我们发现:(2)式中包含了(1)式,只是头上乘以了
+++
+- 假设
+是一个质数, (或 ),且 的值已知,那么
这东西长得和性质2很相似,唯一不同的是
因为
这三个性质将作为重点性质出现在欧拉函数筛法中。
+我们已经接触了简单的欧拉函数计算方法,那么又该如何解决形如:“给定一个正整数
考虑继续使用上面的朴素算法,时间复杂度将会是
欧拉函数涉及到质因子的拆分,我们又需要在线性时间内求各种质数。自然而然想到了先前所学的线性筛:
+1 | int primes[N]; |
我们运用这段代码可以得出st[N]
数组可以筛出所有的合数。也就是说对于筛出的合数,我们能够得知组成它的质因子是什么,比如st[primes[j]*i]=true;
这一行代码。接着套用上述三种性质,我们可以得出
此时我们就需要新建一个phi[N]
数组来存储每个数的
1 | typedef long long ll; |
没错我开了long long
防止爆int
时间复杂度:
适用范围:普及&提高
+对于开头提出的求和问题,遍历phi[1]
到phi[n]
的所有值求和即可。
++若正整数
+与 互质,则有
对于它的证明,百度百科中如此写到:
+++取
+的缩系 ,故 也为 的缩系。有
通俗来讲就是这样:
+真不知道明明可以写得通俗点为什么非得省那点空间写看起来那么高深莫测的专业术语,真的是只写给自己看的。
尤其对于绿题以上的题目,题面中可能出现“答案可能很大,请对大质数
快速幂:快速幂思想如下:
+我们将指数
1 | typedef long long ll; |
时间复杂度:
适用范围:基本All Clear
+欧拉降幂:上面方法一个缺点在于无法处理过大的指数,在处理类似于
欧拉降幂核心公式:
也就是说:我们只需要算出long long
,因此可以选择使用字符串进行高精度计算。
1 | typedef long long ll; |
其中eular(int n)
函数用于计算欧拉函数的值、edp(int a, string k, int p)
用于计算降幂后的指数、qpow(int a, int k, int p)
是快速幂算法。
时间复杂度:
适用范围:所有
+扩展欧拉定理可谓是欧拉定理的一般形式,它的定义如下:对于任意正整数
$
+其中第二个式子就是欧拉降幂的核心公式。
+扩展欧拉定理的证明见这里。因为太复杂了我不会证
例题:
+这里会涉及到一元线性同余方程,一元线性同余方程组和高次同余方程的算法解法。
+很多人会把他读成裴除(chú)(比如我的某位好友),这个名词正确的读法是裴蜀(shǔ)。或者可以直接改称作“贝祖定理”,它的提出者艾蒂安·裴蜀估计怎么也没想到后人居然连他的名字都读不对(想想如果这种事情发生到你身上会怎么样)。你也可以读他名字的法语发音
切入正题,裴蜀定理表述为:对于任意正整数
首先可以知道
加了“扩展”二字是不是感觉逼格上来了?
扩展欧几里得算法用于求出线性同余方程的解。线性同余方程,即形如
回忆一下欧几里得算法的核心思路:
再看看刚刚讲到的裴蜀定理,发现
那么我们的任务就是求出这里的
既然我们设计的是一个递归算法,我们就必须明确它的递归出口。根据欧几里得算法,当
最后,因为这本质上还是一个欧几里得算法,所以返回
1 | int exgcd(int a, int b, int &x, int &y) { |
时间复杂度:
但是,题目中一般不会给出裴蜀定理那样的形式,而是形如
1. 同余—等式互转(自己起的名字):
+在上面的介绍中,我们遇到了一个问题:如何将
考虑到同余方程的定义(或者你可以把以下关系死记住),得到exgcd
求解
2. 最值解问题:
+ +又称孙子定理(但我认为还是中国剩余定理听起来更有实力一些),最早见于《孙子算经》中“物不知数”问题,首次提出了有关一元线性同余方程的问题与解法。
+对于一元线性同余方程:
首先,令
然后,令
接着,令
所以,
这个算法用于解决一元高次同余方程问题,模意义下的对数也可以求。又称“北上广深算法”(想出这种名字的人真是人才)。
高次同余方程长成这个样子:
+发现真是变态呢。这种问题显然没公式解,于是苦恼的人们只得选择一条略显暴力的求解道路,即搜索。严格来说,BSGS所使用的是双搜索,其中的一个变量的搜索步长会长于另一个变量的搜索步长,因而得名“大步小步算法”。或者叫北上广深/拔山盖世算法!
朴素BSGS(
接下来我们对同余号右侧的部分求值,再任命一个固定的
关于哈希表冲突,我们希望找到
对于
1 | ll bsgs(ll a, ll b, ll m) { |
时间复杂度:
扩展BSGS(
例题:
+乘法逆元定义如下(注意和矩阵求逆不是一个东西):
+++若
+,且 与 互质,则 是 在模 条件下的乘法逆元,记作
简单来说乘法逆元
费马小定理求逆元:大部分题目会给出一个质数模数,因而互质是可以保证的。此时我们的乘法逆元就是使式子
得到
1 | int inv(int a, int p) { |
扩展欧几里得求逆元:这是万能的方法,对任意模数均成立。它不像上面费马小定理那样限制模数必须是质数,因而只要时间充裕,都建议使用这种求逆元的方式。
+因为exgcd
的形式。
1 | int exgcd(int a, int b, int &x, int &y) { |
递推求逆元:
+例题:
+来张弔图
矩阵,是一个按照长方排列的实数或复数集合。它最早用来表示方程组中的系数和常数,简单理解就是它将
考虑这个方程组:
+按照如上所述,将它转换为系数矩阵(只有
你也可以写成增广矩阵(与系数矩阵相比多了一列常数,即等号右边的常数,这里用竖线隔开)的形式:
+不难看出第一列代表了
假设我们有一个
顾名思义,系数排列看起来像一个三角形的矩阵,叫做三角矩阵。分为上三角矩阵和下三角矩阵。前者的非零系数均分布在对角线的右上方、后者都在左下方,例如矩阵:
那么如何将一个一般矩阵转换为上三角矩阵呢?答案是前面介绍过的初等行变换!步骤如下:
+文字还是太抽象,我们来举个例子:
+令矩阵
枚举第一列,
第二步,自乘并标记有序,因此第一行除以
第三步,将无序组的第
枚举第二列,此时
最终的最终,第三行减
我们假设从左到右,分别为
根据最后一行,显然
然而心细的你估计发现了疏漏之处:“求一元二次方程时都要先检验根是否存在(
事实上,矩阵的解的分布确实不止一种情况,这里是矩阵有唯一解的情况。类比高中立体几何求平面法向量的情景,我们通常都要令某个坐标为
在上一节中我们通过初等行变换求出了矩阵的解,然而并不是所有矩阵都能轻而易举求出唯一解,因为它可能无解、也有可能无唯一解(默认最高次数为一)。类比一元二次方程中的
答案是:有滴!在矩阵运算中,我们使用秩来描述矩阵的一些关于解的个数的关系。秩被定义为:将矩阵通过初等行变换后形成的梯形矩阵中非零行的个数。试看如下例子:
+定义一个
经过初等行变换后出现了这样的情况:
+第二行变成了纯
它有无数组解,原因是:矩阵的秩与矩阵增广矩阵的秩相等且小于了它的阶。简单来说就是你用两个方程去求三个未知数的值(初一内容),当然是有无数多组解。
+规定对于矩阵
看第二个例子:
+定义增广矩阵:
增广矩阵变换后:
根据定义,得到
加上第一节里面的结论,我们总结出了矩阵解分布的三种情况(方程组的增广矩阵为
因此就有了一套组合算法:
+1 |
|
时间复杂度:
以后上大学解高次线性方程就可以用这段程序秒了。
1. 加法:
+注意类比
可以知道,四则运算的加法交换律和结合律仍然适用于矩阵加法。
+2. 减法:
+加法的逆运算,让矩阵同一位置的元素相减即可。也是仅限于同型矩阵之间才可做减法。
+3. 数乘:
+即矩阵中每个元素都跟数字相乘。符合乘法交换律和结合律
+矩阵的加法、减法和数乘合称为矩阵的线性运算
+4. 转置:
+矩阵
直观来讲就是将原矩阵旋转一下(行和列互换)。满足如下性质:
+5. 共轭:
+矩阵
类比共轭复数的定义:实部不变、虚部取相反数。矩阵共轭变换就是将矩阵中的所有复数变为其共轭形式。
+6. 共轭转置:
+矩阵
字面意思,先取共轭,再转置。它具备转置矩阵的三条性质。
+只有一个矩阵的行数和另一个矩阵的列数相等时才可进行乘法运算。
+例如一个
因此
它满足结合律、分配律,但是大多数情况下不满足交换律。交换律不成立可以看到下面这个例子:
+首先根据定义,
对于结果是正方形矩阵的,可以自己随便设置两个矩阵进行计算。但是部分矩阵仍然可以进行交换律运算:矩阵乘一个单位矩阵/数量矩阵[
1. 零矩阵:顾名思义,由
2. 单位矩阵:形如
3. 数量矩阵:形如
4. 逆矩阵:如果存在一个矩阵
5.
+对称矩阵:转置矩阵与自身相等的矩阵叫做对称矩阵,特征是所有元素关于对角线对称,例如:
平面直角坐标系上,一个向量
计算机中,用两个不共线向量
假设我们常规想法中的平面直角坐标系是
如果在最开始的坐标系中有一个向量
抽象之后变成:
+例题:
+阶乘,数学中用
特殊地,
1. 排列数:数学中用
为啥呢?,有弔图为证↓
2. 组合数:假设有
弔图×2↓
+GZ表示就凭这几张图他能速通整个组合数的内容
学过初中的大家都知道:
二项式定理定义式如下:
+这里出现的但是这一章并不会用它,只是作补充知识的说……
有这三条就够了,接下来进入组合计数的内容。
+一个小栗子:
+宇宙榜一大学阿福大学的榜一博士后导师黑虎阿福给你出了一道难题:
+++给你两个正整数
+和 ( ),让你求出 的值。
你:“这还不简单?”
+阿福: “好的,我这里将
你: “WTF?”
+于是你决定用程序来代替人脑,阿福教授也做出了一定让步,让你求出而不是妄想着用2077年的赛博机器运行暴力计算,来解决这个问题。
一旦你的运行时间超过一秒,阿福教授就会使用战技“乌鸦坐飞机”对你造成大量阶乘伤害。已经学习了阶乘的你想必已了解了它的威力,所以还是老老实实推导公式吧!
+递推版:
+组合数递推公式:
分析思路类似于动态规划问题:我们要从
上图中,若包含这个红色物体,那么我们只需再从剩下的
1 |
|
时间复杂度:
适用于
预处理版:
+但是众所周知,递归有两大痛点:对于主观思维来说,是边界问题;对于客观条件来说,是内存。递归过程中CPU里储存了大量的未运行或者待返回的函数实例,当
1 |
|
时间复杂度:
适用范围,int
范围内的大部分情况。
Lucas定理优化版:
+1 | typedef long long ll; |
时间复杂度:
其本质是套用
适用范围,long long
范围内的大部分情况。
高精度版(选修):
+什么?你厌倦了组合数后面挂着的模虽然前面几种也可以,毕竟手算的题数据很小取不取模都一样)是不是心动了呢?
常规思路来说,我们的组合数公式经过一轮分式化简可以得到:
我们看到了Part1里面讲的算术基本定理,将组合数转化为
用它可以计算出
1 |
|
时间复杂度:
适用范围,int
范围内。
有了这段代码,我们就可以完成开头阿福教授的原问题了(不模不限数据)!
+当你翻开Catalan数的介绍文章,并大学特学了一番,感觉自己完全掌握了这神奇的数列,正当你兴致勃勃地打开题库搜索到一道Catalan数的题目正准备大展身手时,你会发现,面对这神奇的题干,不同于往常秒模板题的你,你甚至完全看不出来它和Catalan数有任何的关系,而且很有可能,你其实连Catalan数究竟是什么东西都不知道!
+苏子愀然,正襟危坐而问客曰:“何为其然也?”
+其实还真不能让那些博客背上黑锅,这种现象与Catalan数本身的应用有很大的关系。
Catalan数,或者习惯叫卡特兰数、明安图数,是组合数学中常用的特殊数列。数列如下:“
用最经典的例子写出来就是:
+++给你一个
+的网格,你将从原点 开始移动。对于每次移动,你只能向上/向右一格( 坐标/ 坐标加一),但是需要保证你总向右走的次数不少于向上走的次数,问从原点到 有多少种不同的合法路径?
假设你某时刻走到了点
终点
那么如何来计算合法和不合法路径的条数呢?直接求出合法路径不好求,规律不好找,因此我们计算出总路径数量,减去不合法数量即是合法路径数量。
+可以看到,无论选择什么样的路径,在不左移、不下移的前提下,到达
因为所有路径,包括合法的和不合法的路径都最终抵达了
(至于为什么用右移次数而不是上移次数,是因为上移受到限制,这意味着你可以一直右移到
扩展:如果题干中指明向右走的次数不少于向上走的次数
那这些又和宇宙第一IDE有什么关系呢
应用场景一:括号匹配
+将向右走转化为左括号“(”,向上走转化为右括号“)”。对于每一次输入,检查一下左括号输入次数是否永不小于右括号输入次数。若是,当输入最后一个右括号,使左右括号数量相同时,即为匹配成功;若不是,且左括号个数大于右括号个数,则表明括号等待补全;若不是,且左括号个数小于右括号个数,即立即宣布失配。
+应用场景二:合法进出栈序列计数问题
+假设一个初始为空的栈,有
答案就是Catalan数,自行套公式计算。
+应用场景三:圆的不相交弦计数问题
+假设一个圆周上分布着偶数个点,对这些点两两连线,使相连的线不相交的所有方案数。其中一个合法解如下图:
+聪明如你,答案还是Catalan数!那么如何转化为已知问题求解呢?
+我们将出发点标记为左括号“(”,从出发点引出去的线与其他线/点的所有交点标记为右括号“)”。当所有点两两连接完毕时,根据场景一的模型,一旦左右括号失配即代表不合法,否则合法。因此这个问题也就变成了:给定
例题:
+分块,正如其名,将一个整区间分为若干小区间进行操作。分块拥有比线段树更强的泛用性,但是时间复杂度略输一筹;分块代码更加直观、减少理解难度,但是时间复杂度稍逊风骚;分块的代码比线段树更短,但是时间复杂度惜败后者……线段树所上下传递的操作计算必须满足结合律,区间平均数、方差还行,像计算区间众数、中位数这样的问题,线段树就只能被薄纱了……
+考虑到树状数组理解难度较大、较难调试,一般都选用泛用性强、码量折中、效率及格、调试简便的分块算法求解。
+不同于线段树的二分存储,分块所使用的块状数组本质上只是一个带有块起始下标和块末尾下标的普通数组,就像在一列数中间插上分割线分出区块。对于区间修改操作,只需要进行以下几步就可以:
+l
和右端点r
所在的区块l
所在区块内,从l
开始循环至该区块结束,暴力更新值,相应的从r
开始,往回循环至该区块起始处,暴力更新值,最后将二者中间整块的区块打上更新标记我们会发现,分块其实就是将完全暴力的操作拆分成部分暴力的操作和部分取巧的操作。尽管看起来还是在使用暴力算法,但实际上优化了不少东西,而优化的效率还得取决于每个区块的长度。那么我们如何选择区块的长度呢?
+最坏情况下,指定的左右端点就是整个数组的左右端点。假设总长度为
既然已经知道了st
和ed
分别记录每个区块的起点下标和终点下标;加上一个查询数组bel
,用于查找第
这是求解区间和的一段代码,init()
函数中,我们把每个区块的和存在sum
对应下标处
1 |
|
按照如上所述的修改原理:
+1 | void update(int l, int r, int x) { |
询问区间和的原理比较相似,同样是分l
和r
所在区块进行讨论。只是当进行整体区块操作时,用与线段树相似的方法——将标记乘到总和中并累加即可。
1 | ll askSum(int l, int r) { |
以上求区间和的代码可以提交到洛谷 P3372 线段树模板 +一里。与线段树相比,分块的速度慢了大约40ms,在300ms左右,还是可以接受的。
+ + +++诗曰:
+“高数第一杀手,考试一考就寄。复数知识一用,
+算成正一。朴素演算善后,死磕公式何必?考场信心十足,全错当场暴毙。”
前置知识:复数、位运算
+FFT的前身是DFT,可以简单看作是一堆OIer争先恐后对DFT算法进行优化的结果。美苏冷战期间,双方都对自己的核实力有所隐瞒,就等着某一天用自己的核导弹打对方个措手不及……在一次科学议会上,有人提出在苏联国境周边安装大量地震波传感器,将传感器的数据回收处理,分析是否出现了类似于核试验产生的震波从而判断苏联是否在进行秘密核试验。但是在当时用于频谱分析的DFT算法效率太过低下,传感器又必须在短时间内分析大量的频谱数据,因此逆境出人才——当时参与会议的其中一位科学家Tukey后来找到了程序员Cooley,后者在当时是一名操作ENIAC的程序员。二者分工明确,在1965年他们提出了FFT算法(当时叫做Cooley-Tukey算法),这个算法在后来被IEEE列入他们主编的“20世纪十大程序算法”之中。
+FFT在信号处理领域受到了广泛的应用,直至今日它仍然被集成在大多数波谱分析仪器中作为底层算法之一。然而在信息学竞赛中,它被广大的OIer看中,拿去优化了高精度乘法的计算。它可以将朴素的高精度乘法的
我们在初中时期学过一元二次方程的函数图像。一般情况下,我们都会用形如:
系数表示法可以直接通过
假如我们让一个三次函数那还不如不优化
为了减少这里的复杂度,我们借助一点高一所学的奇偶函数的内容~(没学过/没学懂没关系,奇函数相当于关于原点对称、偶函数相当于关于
假如该函数是一个偶次的幂函数,幂函数的定义是
函数
经过一轮拆分:
这张图可以直观看出原函数(绿线)被拆分成偶项(红线)、奇项(蓝线)和常数项(橙线)后的样子。
+对于奇项,代任意
令
首先花一些篇幅来介绍复数的概念。我们学过:形如
而复数就像是实数和虚数的一次友好会面,复数域用字母
紧接着,我们的FFT之旅就要来到下一个目的地——复平面。复平面类似于平面直角坐标系,只不过
比如说上一节遗留的式子,递归继续深入一层时,递归函数会变成
每次递归,函数括号中的参数的幂就会乘2。幂在数值上就是
引入单位根的概念:满足
点
如果是八次(
其中
假如我们按逆时针方向,起始点
特殊地,
这下终于可以开始从一般例子出手推了。令
按照奇偶项分为两组(这里可以直接通过
函数的自变量来到了
如果此时
正因此,当
IFFT的中文名称是快速傅里叶逆变换。有些人比如刚开始接触FFT的我认为只要敲出FFT的代码,就可以解决任何函数卷积的问题了……错了,FFT主要是将系数表示法转换为点值表示法,相当于数学考试解析式求解题题干里给你的已知点坐标!卷积之路才刚刚过半,接下来介绍如何将相乘后得到的点值表示法重新转化为系数表示法。由于FFT是系数到点值的转换、这种方式是点值到系数的转换,因而称之快速傅里叶逆变换——IFFT。
我们的FFT算法已经将两个函数的卷积
假设一个函数的系数形式
简记为:根倒求和、
再加上,复数的乘积在复平面上有个奇妙的性质:复平面上一个向量可以看作是从实轴正半轴逆时针旋转特定的角度后得到的,这个角度称作向量的辐角,复数相乘时,得到的结果的辐角将是这两个向量的辐角之和、模长将是两个向量模长的乘积。简称辐角相加、模长相乘。除法作为乘法的逆运算,它在复平面上操作的结果是辐角相减、模长相除。因而单位根的倒数
对于代码的设计,尽管C++STL库提供了Complex<>
复数类,但还是建议手写Complex。因为STL库的运行效率有时会很慢,会被卡掉,而且它的码量也不大,手写难度不高。强烈推荐手写结构体Complex。
递归Version:
+1 |
|
时间复杂度:
这个代码足够通过模板题有些人说不行,只需把数组开大一点点(5e6起步)就可以了……但是这个代码其实还可以继续优化,但是这下就很棘手了,本来推来推去已经够烧脑了你还要让我优化?,考虑到递归算法有些低效,浪费了一些空间和执行效率。那么我们如何把它变成一个非递归版本呢?答案是迭代!
我们按照奇偶下标将原多项式分为了偶项和奇项,这样做的复杂度是
递归之前,系数下标:
递归一层,系数下标:
递归两层,系数下标:
递归三层,系数下标:
既然称作二进制优化,我们来看看第三层的数字写成二进制形式是怎样的:000 100 010 110 001 101 011
没有规律……别急,我们把数字倒过来念:000 001 010 011 100 101 110
。诶?他们是单调递增的,再写成十进制就是:0 1 2 3 4 5 6
。我们就找到规律了:递归结束时系数下标的二进制值等于原多项式的系数下标的颠倒二进制值
常规操作,我们使用进制转换来实现二进制逆序,这样的时间复杂度是
1 | int rev(int n) { |
借鉴了这篇题解的逆序思路,逆序的时间复杂度是
1 | int l,r[MAXN]; |
以及r
数组的读入:
1 | for(int i=0;i<limit;i++) |
当然,提高组不考,如果考到,基本上那个递归版本也够用了……
+ 3 / 3 +
+ +在开始之前,首先你需要有一个自己的域名(github.io
不算在内,你必须能够亲自更改DNS解析设置),并在博客仓库设置的Pages选项卡中绑定自己的域名。
官方提供了四种方式来部署Qexo环境,其中一种允许你在本地进行部署,另外三种各自使用了不同网站提供的免费数据库服务。综合考虑操作便捷性和成功率,这里选用Vercel提供的免费PostgreSQL服务进行部署。
+首先点击这里进入Vercel的仓库克隆界面。建议新建一个私有仓库进行Qexo仓库的克隆工作,第一次操作时你需要授权Vercel登录你的Github账号,在新跳出的浏览器窗口里按顺序授权即可。
+设置好仓库名称后,点击Create
创建,下边会有一个Deploy
界面。Vercel在创建和更改仓库时会自动进行一次部署,因此创建完毕后部署将会自动启动,并且这第一次部署是一定会失败的。因为Qexo所依赖的数据库还没有配置。因此点击网页左上角的三角形符号,或者点这里快捷进入你的项目管理页面。不出意外的话,界面将是这个样子:
(我这里是已经配置好了Qexo)
+然后我们开始配置PostgreSQL数据库,在Storage界面可以申请,点击右上角Create Database
并选择Postgres
,Vercel的免费Postgre数据库仅限创建一个,如果你先前没有配置过——点击Continue
进入数据库连接配置,在Connect
界面选择地区为Washington DC
或者USA (east)
。创建完毕后,在Storage
选项卡里选择进入你创建的数据库配置界面。在左侧边栏点击Project
,接着点击Connect Project
:
选择自己想要部署Qexo的仓库即可,接着回到项目管理界面,点击部署用的仓库。在Settings
里面选择Domains
域名选项,添加自己购买的域名。注意不要将域名指向到主页地址,如果你购买的主域名是abcd.xyz,此处建议绑定到它的子域名admin.abcd.xyz,而不能直接绑定到abcd.xyz!。
当你添加了一个目标域名后,Vercel会自动对填入的域名进行DNS检查,若第一次配置,大概率会出现以下情况:
+此时你需要打开自己域名的DNS解析设置,添加一个A解析:主机记录为@
,记录值为76.76.21.21
。补充一句,这个IP地址指向vercel.app
的域名服务器,然而这个域名已经处于DNS污染的状态,无法访问。Vercel的临时备用方案是将IP改成76.223.126.88
,事实证明到现在这个方案还是有效的。
配置完部署域名后,转到顶端选项卡Deployment
中点击Redeploy
开始二次部署。一般等待一分钟左右无报错信息即可完成部署。
如果你使用的是MongoDB
,有可能在二次部署开始三到四分钟后接收到部署失败的信息。如果失败信息里出现了类似于handshake failed
的握手失败信息时,建议放弃该方法(很可能是国内墙掉了MongoDB的连接接口导致部署时无法访问)并转而使用上边介绍的PostgreSQL法重新部署。
查看其他部署具体步骤,见官方文档——部署;若部署时遇到报错,可以进入官方文档——常见问题排错。
+部署完毕后,切换到绑定的域名,本例中我们转到admin.abcd.xyz
。如果没有出现Qexo的初始化配置界面,试着转到admin.abcd.xyz/init/
。如果你使用Hexo,并在Github上托管,在Github的配置界面,你会看到这几项:
(这是已经配置好的Qexo的设置界面,只是我将填写的内容删去了,但是项目是完全一致的)
+Github密钥这一项,你需要在Github设置中申请。右上角选择Generate New Token
,有两个选项,选择classic
。接着完成身份验证。改变如下几项:
Note
必填,作为这个token的使用目的;Expiration
是生效期限,安全起见建议设置一个较短的期限,然后定时重置,重新配置Qexo设置,这里我选择的是永久有效;在下边的生效条目里,保证repo
下的复选框全部勾选,建议同时勾选workflow
,但官方不建议给出所有权限。这么做的目的是保证Qexo有足够权限访问Github
+API从而在线修改Github博客源码的内容。
申请完毕后复制下来,出于安全,Github仅在token初次创建完毕后给出复制选项,所以尽快保存,并填入初始化界面的“Github +密钥”文本框中。
+然后在Github里新建仓库,用于存放博客源码。接着在本地转到你的博客源码文件夹中(就是你执行hexo clean & hexo g & hexo d
的文件夹),右键点击git bash here
,依次键入以下的代码:
.git
的文件夹,有则跳过该步骤)git init
https://github.com/<username>/<repo>
git remote add <name> https://github.com/<username>/<repo>.git
(这里的<name>
任取,但保证先前未创建过,且不与已经存在的<name>
重复,否则将可能不会上传当前的文件夹)git pull <name> master
,master
可更改,但保证和新建仓库的主branch同名git add .
(注意有个点)git commit -m "Commit内容"
(内容可更改,但需要用半角双引号包裹起来)git push <name> master
(master
保持前后一致即可)如果是第一次上传,按顺序执行以下七步操作;如果已经上传过了,想要提交一些个人的更改,执行第四到第七步即可。“Github
+仓库”这一项就填刚刚创建并上传的源码仓库,格式是<username>/<repo>
(例:mynameisabcd/BlogSourceCode
)。
“项目分支”填源代码仓库的主要分支,一般是master
;“博客路径”留空即可。
若使用Gitlab,或者想要通过本地进行初始化,见官方文档。
+“VERCEL_TOKEN”一项,需要在这里生成。
+同样是填写token名称、生效范围(这里选择xxx's projetcs
)和生效期限(建议期限短些)。完毕后点击Create
生成密钥,也是需要尽快复制下来,粘贴到“VERCEL_TOKEN”里。
“PROJECT_ID”则需要回到Vercel对应的项目的Settings
里,在General
选项卡中向下翻到Project ID
并复制内容,粘贴到PROJECT_ID
中就完成Vercel配置了。
接下来你还需要设置管理员账号密码,设置完毕后就可以从admin.abcd.xyz
快捷进入管理界面了。
在博客源码目录里打开命令行,输入hexo new page links
创建友链页面,打开source/links/index.md
,将front-matter
修改成如下格式:
1 | --- |
并且在front-matter
后的正文部分直接粘贴:
1 | <div id="qexo-friends"></div> |
需要更改“Qexo部署的网址”为你方才Vercel设置里填写的域名。
+部分主题有专门的主题适配选项,详情见这里。
+在Hexo源代码根目录里新建页面hexo new page talks
。
在source/talks/index.md
中正文部分加入:
1 | <div id="qexot"></div> |
同样是更改“Qexo部署的网址”,网址后的数字代表每页展示的说说个数,可根据需要自行调整。还可以美化样式。
+ + +本博客中“闫氏DP”指的是2011年NOI金牌保送北京大学计算机系的算法选手闫学灿(yxc/y总)在教授动态规划时提出的“从集合角度分析DP问题的思维方式”。并非指代某类动态规划题型、也不是某种求解动态规划的固定算法。该文章仅作“闫氏DP”的学习笔记,一并附上例题的个人理解。为了使文章生动有趣,后文使用“yxc”或“y总”指代闫学灿本人。
+代码均经过本人实际测试AC后才给出,代码总耗时也会给出,以AC记录的时间为准。代码由CLion格式化。
+了解DP的大佬可以直接看到下一节~
+动态规划(Dynamic +Programming,简称DP)是运筹学的一个分支,用于求解多决策过程的最优解,最初由Bellman等人提出。当一个过程存在多个决策,且每个决策之间都会互相影响(最终影响到结果)时,就可以考虑使用动态规划。动态规划建立在递推关系之上,主张用已有的状态去表示未知的状态。正因如此,找出各个决策所产生的状态之间的关系是至关重要的(这个重要信息后期会被转译为状态转移方程求解DP)。
+常见的动态规划根据问题的特点,分别被称作:线性DP,背包,树上DP,区间DP,数位DP,插头DP……
+ + +DP自诞生之初就用来解决多决策过程问题,解决多决策问题就需要考虑如下性质,这些也是传统动态规划所考虑的角度:
+dp[i][j]
所表示的意义,各个状态之间有内在的联系这样的传统方法看起来比较抽象,但这种方法的确是DP问题的标准解法,因为上述几种性质组成一个完整的动态规划问题。自然针对其组成部分提出的解决方案是最为标准的。
+这张图(讲课板书)很清晰的阐明了闫氏DP分析法的内核,其中动态规划问题的求解依赖于状态的表示和计算,而搞清楚状态表示又需要读题分析需要规划的总集合、以及问题的属性。这个基本框架在求解DP问题中发挥了极其重要的作用。
+状态计算里有一个非常重要的地方——搞清楚“前驱状态的转移”。就是需要解释清楚当前的状态是怎么由前面一个状态得到的。虽然说起来用不了几个字,但是这也是DP问题的难点,毕竟转移方程是DP问题的灵魂,得到了方程整个问题也就解决了。
+难度:普及-
+++观察下面的数字金字塔。
+写一个程序来查找从最高点到底部任意处结束的路径,使路径经过数字的和最大。每一步可以走到左下方的点也可以到达右下方的点。
++
在上面的样例中,从
+的路径产生了最大权值。
这个题似乎连读入都要好好想一想
定义一个二维 map
数组,map[i][j]
表示第
1 | 7 |
我们需要解决的问题的总集合就是从第一层走到第五层的可能路径,而属性就是
+max
(最大值)。这些都是读题能找出来的东西。
接着思考状态表示:摸清楚前驱状态。如果按照正向思维,从上往下遍历(第一次在第一层、第二次在第二层),会有一个问题——不知道前驱状态。那我们就反着来,由最下层向最上层遍历!
+既然向上遍历,我们就脑补一下——把题图里面所有的箭头反向。这样一来上层的总和就可以用下边的点之和来转移了。例如倒数第二层的dp[4][2]
;它可以用下层的dp[5][2]
和
+dp[5][3]
。推广一下就是 dp[i][j]
可以由
+dp[i + 1][j]
和
+dp[i + 1][j + 1]
得来,结合先前所述的状态表示,得出状态转移方程:dp[i][j] = max(dp[i + 1][j], dp[i + 1][j + 1]) + map[i][j]
。那么这个最大和从下边一路推到最上边,到达点dp[1][1]
即可。
最后是初始化:明显地,dp
数组的最后一层应该全部赋值为
+map
数组的最后一层,这样才能让整个算法基于金字塔的最底端进行递推,得到正确答案(或者可以直接用
+map
数组计算)。
1 |
|
由于命名冲突,原文中 map
数组实为
+mp
数组。
总用时:
原题地址:AcWing1015(原AcWing1017)
+难度:简单
+不知道为什么听课的时候y总说是1017现在变成1015了(但网址还是1017)……可能是题库变动,前面少了两道题吧……
++Hello Kitty想摘点花生送给她喜欢的米老鼠。
+她来到一片有
+行 列的网格状道路的矩形花生地(如下图),从西北角进去,东南角出来。 地里每个道路的交叉点上都有种着一株花生苗,上面有若干颗花生,经过一株花生苗就能摘走该它上面所有的花生。
+Hello Kitty只能向东或向南走,不能向西或向北走。
+问Hello Kitty最多能够摘到多少颗花生。
++ ++ +
这道题属于经典的“走方格最值型线性DP”(自己瞎起的名字),很多DP题目里都有它的影子。例如洛谷 P1176
+路径计数2、洛谷
+P1958 上学路线和AcWing 1018
+最低通行费。
首先读入整个地图,用数组w
存储每个点的花生数(点权)。
接下来解题:状态表示,读题——总集合是从点max
。
接下来是状态计算,既然全集是所有合法路径,那我们如何划分这个“合法路径集”呢?
+再读题,它说:“只能向东或向南走”。对应到方向标(上北下南左西右东),那就是只能向右或向下走(不走回头路)一直到右下角。假如她某次移动到了点max
,不就是整道题的答案吗?因而,状态转移方程就是dp[i][j] = max(dp[i - 1][j] + w[i][j], dp[i][j - 1] + w[i][j])
,等价于dp[i][j] = max(dp[i - 1][j], dp[i][j - 1]) + w[i][j]
。由于递推是正向的,到点dp[r][c]
。
当我们高高兴兴写代码的时候就会发现一些问题:如果我在第一列(最左边那一列),按照转移方程,左侧的点将会汇入计算,但第一列左侧的点并不存在;同理,第一行(最上边那一行)的上侧的点也不存在。那么该怎么样处理这样的特殊情况呢?
+一般来说,OIer在开数组存值时,会从下标w
数组中设为-INF
(
1 | // 给地图外部的行/列赋特殊值 |
当然,这道题也可以不填充特殊值,因为全局定义的数组在内存中的默认值就是0
,但为了保险这里还是加上了负无穷的填充。
总用时:
难度:普及+/提高
+来源:NOIp 提高组 2000
+2008年NOIP官方送来的双倍经验,请注意查收:P1006 传纸条
++设有
+的方格图 ,我们将其中的某些方格中填入正整数,而其他的方格中则放入数字 + 。如下图所示(见样例): +
某人从图的左上角的
++点出发,可以向下行走,也可以向右走,直到到达右下角的 +点。在走过的路上,他可以取走方格中的数(取走后的方格中将变为数字 )。 此人从 点到 点共走两次,试找出 +条这样的路径,使得取得的数之和为最大。 输入的第一行为一个整数
+(表示 + +的方格图),接下来的每行有三个整数,前两个表示位置,第三个数为该位置上所放的数。一行单独的 + 表示输入结束。 数据范围:
+。
好家伙,两次DP???我们就选择用一个DP数组记录两条路径,同时遍历寻找最优解,最后输出即可。
+状态表示就很明朗了,全集是两条从点max
。在状态计算方面,我们选用dp[i1][j1][i2][j2]
表示第一条路线从失手了口牙。这里,y总引入了一个新变量dp
数组的dp[k][i1][i2]
表示,移项可得
然后考虑状态之间的转移,就需要找到当前状态和上一个状态之间的联系。dp
数组存储了两条路径,第一条路径可能从左侧过来、同时第二条路径也可能从左边过来;第一条从左边来、第二条从上边来;第一条从上边来、第二条从左边来;最后是两条都从上边来的情况。我们显然需要计算出这四种情况的状态后对所有状态联合取最大值,以第一种情况为例:两条都从左边来,那么dp[k][i1][i2] = max(dp[k][i1][i2], dp[k - 1][i1][i2] + w[i1][j1] + w[i2][j2])
。
最后是重合路径的问题,当w[i1][j1] + w[i2][j2]
加和而是需要按w[i1][j1]
进行累加。注意判断
1 |
|
总用时:
来都来了,顺便放一下传纸条的代码,两道题思路是相同的(状态转移方程都不需要改!),但是读入有点恶心,一定注意读入问题!
+1 |
|
总用时:
子序列指在原序列中,在不改变元素之间的相对顺序的前提下,从中抽取出的元素组成的序列。例如数列1 4 5 6 7 8
,1 5 7 8
就是原序列的一个长度为
线性DP可以用于求解符合以上特点的子序列的最长长度,在
题目传送门:B3637 +最长上升子序列
+难度:普及-
+来源:NOIp 提高组 2004
+++这是一个简单的动规板子题。
+给出一个由
+个不超过 + +的正整数组成的序列。请输出这个序列的最长上升子序列的长度。 最长上升子序列是指,从原序列中按顺序取出一些数字排在一起,这些数字是逐渐增大的。
+
甚至你有可能都没见过B开头的洛谷题……在题库上端的“入门与面试”选项卡里,你可以找到B开头的题
在子序列DP的思考中,通常对DP的全集有一个比较跳脱常理的思维,通常让dp[i]
作为以a[i]
结尾的某类型子序列的最长长度。而子序列问题的状态集合属性也自然而然就是max
了。
那么假设此时DP进行到了第dp[i]
的前一项,也就是dp[i - 1]
。搞明白在什么情况下dp[i - 1]
才能转化为dp[i]
。不难发现,解决LIS问题,核心就是保证后一项的数严格大于前一项的数。于是当dp[i] = dp[i - 1] + 1
。
对于dp
数组初始化,因为每个元素本身就是原序列的一个长度为1的上升子序列,所以必须让dp
数组的每个位置都初始化成
1 |
|
总用时:
题目传送门:这里
+难度:普及/提高-
++++
+位同学站成一排,音乐老师要请其中的 位同学出列,使得剩下的 位同学排成合唱队形。 合唱队形是指这样的一种队形:设
++位同学从左到右依次编号为 … + ,他们的身高分别为 … ,则他们的身高满足 … + 。 你的任务是,已知所有
++位同学的身高,计算最少需要几位同学出列,可以使得剩下的同学排成合唱队形。 输入共二行。
+第一行是一个整数
+( ),表示同学的总数。 第二行有
++个整数,用空格分隔,第 个整数 + ( )是第 位同学的身高(厘米)。 对于全部的数据,保证有
+。 样例输入
++
1
2 8
186 186 150 200 160 130 197 200样例输出
++
4
要想出列的人最少,留下的人必须最多!废话
那么如何保证留下的人最多呢?读题,要求是让整个队形变成先升后降的形式。我们不妨将样例输入进行一次可视化:
+题目想让我们把这张图变成左边上升右边下降的样子,形状酷似山峰,因此我称之为山峰模型。联系到刚才所说,需要让留下的人最多。我们在选择C位同学时就需要注意一下,让他左侧留下的人最多、而不是一定要让最高的站中间。这下就很明朗了,我们先正向(从左至右)做一遍LIS问题,就知道让哪个人站C位可以使得Ta左边的人出列最少。那么还差右边的人,怎么办呢?我们会发现如果将整个序列倒序一下(水平翻转),那么原先的右侧就变为现在的左侧,原先让右侧单调下降,现在就变成了左侧单调上升,也就是和处理左侧同样的思路。于是我们就对原序列跑一遍LIS,再对反向的序列跑一遍LIS。最后
最后有一点小细节,是关于最终结果的。样例输入的原理是将中间那个身高两米(176cm小矮个瑟瑟发抖)的设为C位,让左侧150cm和任意一个186cm、右侧197cm和200cm的人出列(注意是保证严格上升,因此若连续二者身高相等则不计入LIS计数)。答案就是
代码如下:
+1 |
|
总用时:
题目传送门:这里
+难度:普及/提高-
+++有一条横贯东西的大河,河有笔直的南北两岸,岸上各有位置各不相同的 +
++个城市。北岸的每个城市有且仅有一个友好城市在南岸,而且不同城市的友好城市不相同。每对友好城市都向政府申请在河上开辟一条直线航道连接两个城市,但是由于河上雾太大,政府决定避免任意两条航道交叉,以避免事故。编程帮助政府做出一些批准和拒绝申请的决定,使得在保证任意两条航道不相交的情况下,被批准的申请尽量多。 输入第一行,一个整数
+,表示城市数。 输入第二行到第
++行,每行两个整数,中间用一个空格隔开,分别表示南岸和北岸的一对友好城市的坐标。 输出仅一行,一个整数,表示政府所能批准的最多申请数。
+样例输入
++
1
2
3
4
5
6
7
8 7
22 4
2 6
10 3
15 12
9 8
17 17
4 2样例输出
++
1 4数据范围
++
+- 对于
+的数据, , 。 - 对于
+的数据, , 。
样例看起来不是那么直观,考试时可以考虑用画图软件增强样例可读性,样例画成图就是下边这样:
+样例输出为
我将北岸城市所连接的南岸城市的编号以深蓝色字体标在了对应北岸城市的下方,这下就可以看出端倪了:北岸城市从左至右,当底部蓝色数字单调上升时,航线不会交叉;反之若出现破坏单调性的蓝色数字,就代表航线交叉。但这个不完全归纳出来的结论还是欠缺证据支撑,对于北岸城市,编号单调递增,也就是说若航线以北岸城市为起点,那么起点处航线是绝对不会相交的;但是对于整条航线,它在整条河上是连续不断的——比如上图中蓝色数字
这里介绍一下C++的pair
:pair
是一个二元组,在定义时传入第一参数和第二参数的数据类型,类似于vector
的定义,它们也用一对尖括号包裹。特定类型的pair
,例如pair<int, int>
、pair<double, double>
、pair<float, float>
等,在sort
函数中可以自动按第一参数排序。这里我们选择双int
型pair
来存储南北城市的对应关系。代码如下:
1 |
|
总用时:TLE 记录
+注意到这里的数据范围:前50%没有问题,重点是后50%,它们的画大饼画大饼
题目传送门:这里
+难度:简单
+最大上升子序列和,又称MASS(Maxiumum Ascending
+Subsequence
+Sum)问题。是LIS问题的一种变式,它不再是只局限于上升子序列的最长长度、而是开始关注选定子序列的元素之和。MASS问题其实可以拆分为两个子问题求解,其一是上升子序列问题、其二是最大和问题。上升子序列无需多言,其本质是在循环内加上判断a[j] < a[i]
来累加合法解个数。因此,如果想要再融合进最大值问题,我们就需要在状态转移那里改一下代码:考虑到LIS问题的dp
数组记录的是合法解的个数,而每次找到一组合法解,答案只会累加dp[i]
设置成a[i]
才对。
代码:
+1 |
|
总用时:
题目传送门:这里
+难度:简单
+来源:NOIp 提高组 1999
+++某国为了防御敌国的导弹袭击,发展出一种导弹拦截系统。但是这种导弹拦截系统有一个缺陷:虽然它的第一发炮弹能够到达任意的高度,但是以后每一发炮弹都不能高于前一发的高度。某天,雷达捕捉到敌国的导弹来袭。由于该系统还在试用阶段,所以只有一套系统,因此有可能不能拦截所有的导弹。
+输入导弹依次飞来的高度,计算这套系统最多能拦截多少导弹,如果要拦截所有导弹最少要配备多少套这种导弹拦截系统。
+输入仅一行,若干个整数,中间由空格隔开。
+输出包含两行,每行一个整数,第一个数字表示这套系统最多能拦截多少导弹,第二个数字表示如果要拦截所有导弹最少要配备多少套这种导弹拦截系统。
+样例输入
++
1 389 207 155 300 299 170 158 65样例输出
++
1
2 6
2保证导弹数量不超过
+
同样画图理解样例抽象派画师又要登场喽!
那么怎么做才是样例输出的解呢?很明显,把207
和155
单独提出来作为一个新系统;剩下的作为一个系统。也就是说最多能拦截除开207
和155
的其他六枚导弹,而新开了一个系统,所以总共是两个系统。
乍一看这很像一个求解最长单调不上升子序列的问题,但是它居然让我们求出系统的数量,这就很棘手了……所以我们需要一个两头兼顾的方法来解题:
+当我们拿到这个序列,之后只会进行两种操作:第一种是将某个数接到已有的子序列之后、第二种是新开一个子序列。考虑到我们的目标之一是让新开的子序列尽量小,那我们就需要尽可能缩减第二种操作的执行次数——让尽可能多的数被归入子序列中,这样的话我们就需要让插入的数和插入前队尾的数尽可能接近才是,如此会让系统的利用率最大化(如果你是舰长总司令,拿到这种系统,你肯定不会轻易地让它拦截很低的导弹,这样只会降低系统利用率)。当然,我们也希望打头的元素尽量大一些,这样才会容纳进更多的元素。诶?这不就是贪心的思路吗?为了方便阅读,做归纳如下:
贪心过程:从前到后扫描每个数,并且:
+代码:
+1 |
|
总用时:
正常做子序列问题的时候,由于要枚举每一个可能的状态,因此需要循环
有些时候,就算是贪心也不能解决某些DP的决策问题。转而寻找与普通DP时间复杂度
题目传送门:这里
+难度:简单
+++为了对抗附近恶意国家的威胁,
+国更新了他们的导弹防御系统。 一套防御系统的导弹拦截高度要么一直 严格单调 +上升要么一直 严格单调 下降。
+例如,一套系统先后拦截了高度为
+和高度为 的两发导弹,那么接下来该系统就只能拦截高度大于 的导弹。 给定即将袭来的一系列导弹的高度,请你求出至少需要多少套防御系统,就可以将它们全部击落。
+
+输入包含多组测试用例。
+对于每个测试用例,第一行包含整数
+,表示来袭导弹数量。 第二行包含
+个不同的整数,表示每个导弹的高度。 当输入测试用例
+时,表示输入终止,且该用例无需处理。
+对于每个测试用例,输出一个占据一行的整数,表示所需的防御系统数量。
+
+样例输入
++
1
2
3 5
3 5 2 4 1
0样例输出
++
1 2样例解释
+对于给出样例,最少需要两套防御系统。
+一套击落高度为
+的导弹,另一套击落高度为 的导弹。 数据范围
++
样例已经解释过了,就不画图了……您的抽象派画师先生已下线
要么上升要么下降……其实在导弹拦截这里已经介绍过贪心的思路。这道题只是在那道题的基础上,在贪心的外部再加入一个选择上升还是下降的贪心。哦豁,不太好搞了——开局要做一个单选,每个选项下又有选项脑袋抓破,此时试着用高雅的暴戾算法DFS搜索来解决这个DP问题。
我们的目标是让系统数尽可能少节约开支,在DFS的处理过程中也要贯彻最小值的思想,但正如开头所说,DFS毕竟是不撞南墙不回头的搜索方式,怎么做才能让DFS具备BFS的最小值处理能力呢?有两种方法:记录全局最小值和迭代加深。
设计DFS函数时,引入三个参数:当前点的下标(DFS必备)、以该点结尾最长上升子序列的长度、以该点结尾最长下降子序列的长度。函数签名就像这样:void dfs(int idx, int lis, int lds)
(LDS