/*代码块*/ [data-theme=light] { --rl-code-bar-shadow: 0 5px 10px 0 rgba(144, 164, 174, 0.4); } [data-theme=dark] { --rl-code-bar-shadow: 0 0 6px 2px #272727; } #article-container .code-toolbar { margin: 18px 0; overflow: hidden; -webkit-box-shadow: var(--rl-code-bar-shadow); box-shadow: var(--rl-code-bar-shadow); border-radius: 7px } #article-container .code-toolbar:before { content: ""; position: absolute; top: 11px; left: 12px; z-index: 1; width: 12px; height: 12px; border-radius: 50%; background-color: #fc625d; -webkit-box-shadow: 20px 0 #fdbc40,40px 0 #35cd4b; box-shadow: 20px 0 #fdbc40,40px 0 #35cd4b } #article-container .code-toolbar .toolbar { position: absolute; pointer-events: none; opacity: 1; left: 0; right: 0; top: 0; z-index: unset; height: 35px; line-height: 32px; text-align: center } #article-container .code-toolbar .toolbar-item:first-child { display: none } #article-container .code-toolbar .toolbar-item:first-child span { background-color: transparent; -webkit-box-shadow: none; box-shadow: none; font-weight: 700; font-size: 0.9em; } #article-container .code-toolbar .toolbar .custom-item { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; font-size: 1rem; right: 12px; color: #999; pointer-events: all } #article-container .code-toolbar .toolbar .custom-item>i { cursor: pointer; margin-left: 8px; -webkit-transition: -webkit-transform .2s; transition: transform .2s; transition: transform .2s,-webkit-transform .2s } #article-container .code-toolbar .toolbar .custom-item>i:hover { -webkit-filter: brightness(1.2); filter: brightness(1.2) } #article-container .toolbar .copy-button:hover, #article-container .toolbar .code-expander:hover{ color: var(--heo-main); } #article-container .code-toolbar .toolbar.c-expander i.code-expander { -webkit-transform: rotate(90deg); transform: rotate(90deg) } #article-container .code-toolbar .toolbar.c-title .toolbar-item:first-child { display: block } #article-container .code-toolbar .toolbar.c-hr { border-bottom: 1px solid #b2a8a84d } #article-container .code-toolbar pre[class*=language-] { position: relative; margin: 0; padding: 35px 0 0; overflow: hidden; white-space: pre; text-shadow: none; border-radius: 5px } #article-container .code-toolbar pre[class*=language-] .line-numbers-rows { border-right: none; left: 0; top: 0; bottom: 0; padding-top: 12px; width: 2.7em; } #article-container .code-toolbar pre[class*=language-] code[class*=language-] { display: block; margin-bottom: 0; overflow-x: auto; padding: 5px 18px 10px; border-radius: 0 0 8px 8px; text-shadow: none } #article-container .code-toolbar pre[class*=language-] code[class*=language-]::-webkit-scrollbar { width: 5px; height: 5px } #article-container .code-toolbar pre[class*=language-] code[class*=language-] .style .token.string,#article-container .code-toolbar pre[class*=language-] code[class*=language-] .token.entity,#article-container .code-toolbar pre[class*=language-] code[class*=language-] .token.operator,#article-container .code-toolbar pre[class*=language-] code[class*=language-] .token.string,#article-container .code-toolbar pre[class*=language-] code[class*=language-] .token.url { background-color: transparent } #article-container .code-toolbar pre[class*=language-].line-numbers code[class*=language-] { padding: 10px 20px 10px 48px; } .absolute { position: absolute; } .top-0 { top: 0; } #article-container .code-toolbar pre[class*=language-] code[class*=language-].c-toggle{ display: none; } /* 代码展开图标 */ #article-container .code-expand-btn { transition: 0.3s; backdrop-filter: saturate(180%) blur(500px); -webkit-backdrop-filter: blur(20px); transform: translateZ(0); position: absolute; bottom: 0px; z-index: 10; width: 100%; text-align: center; font-size: var(--global-font-size); cursor: pointer; display: flex; align-items: center; justify-content: center; height: 32px; } #article-container .code-expand-btn:hover i { color: var(--heo-white); } #article-container .code-expand-btn i { color: var(--hlnumber-color); font-size: 14px; line-height: 1; } #article-container .code-expand-btn.expand-done { -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -o-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); } #article-container pre{ border:0px; } #article-container .code-expand-btn:hover { background: var(--heo-main); } #article-container .code-expand-btn:hover i { color: var(--heo-white); } #article-container .code-toolbar pre.close.expand-done{ height: 100%; } #article-container .code-toolbar pre.close.expand-done-expander{ height: 100%; } @-moz-keyframes code-expand-key { 0% { opacity: .6; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; filter: alpha(opacity=60) } 50% { opacity: .1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=10)"; filter: alpha(opacity=10) } 100% { opacity: .6; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; filter: alpha(opacity=60) } } @-webkit-keyframes code-expand-key { 0% { opacity: .6; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; filter: alpha(opacity=60) } 50% { opacity: .1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=10)"; filter: alpha(opacity=10) } 100% { opacity: .6; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; filter: alpha(opacity=60) } } @-o-keyframes code-expand-key { 0% { opacity: .6; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; filter: alpha(opacity=60) } 50% { opacity: .1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=10)"; filter: alpha(opacity=10) } 100% { opacity: .6; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; filter: alpha(opacity=60) } } @keyframes code-expand-key { 0% { opacity: .6; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; filter: alpha(opacity=60) } 50% { opacity: .1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=10)"; filter: alpha(opacity=10) } 100% { opacity: .6; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; filter: alpha(opacity=60) } } /*代码块*/