更更更更好的脚注

我和我的小伙伴们都惊呆了！！

此页为于此维基内部使用的组件页。

在未经同意的情况下
请不要动这页里面的东西

---

这是什么？

一个组件。这个组件更改了hovertip的样式，使其会在画面右下角平滑的出现¹。嗯²。

在您的页面中添加如下代码以应用此组件：

[[include :fendsfox:component:betterbetterfootnote]]

可以通过修改:root中的变量值以自定义其外观（仅限颜色/字体）。

Footnotes

1. 大概可以解决某些黑色标记笔版式hovertip收不回去的bug。

2. 比betterfootnotes更better！更waaaaaaaaaaaagh！！！！！！！

源代码：

@font-face {
    font-family: Jost;
    font-weight: 400;
    font-style: normal;
    font-display: swap;
    src: url('https://cdn.scpwiki.com/theme/en/basalt/fonts/Jost-Book.woff2') format('woff2')
}
@font-face {
    font-family: Jost;
    font-weight: 700;
    font-style: normal;
    font-display: swap;
    src: url('https://cdn.scpwiki.com/theme/en/basalt/fonts/Jost-Bold.woff2') format('woff2')
}
 
:root {
    --bg_color1: 153, 0, 17;
    --bg_color2: 46, 46, 46;
    --bg_color3: var(--text_color1);
    --text_color1: 255, 255, 255;
    --text_color2: 0, 0, 0;
    --shadow_color: var(--text_color2);
    --font1: 'Jost';
}
 
div.hovertip {
    border-radius: 0;
    box-shadow: 0 0 .25em rgba(var(--shadow_color),0.3);
    box-sizing: border-box;
    background-color: rgb(var(--bg_color3))!important;
    border: none!important;
    color: rgb(var(--text_color2));
    padding: 1em;
    width: min(25em, 30em)!important;
    top: initial!important;
    left: initial!important;
    position: fixed!important;
    display: block!important;
    bottom: 2em;
    right: -26em;
    transition: right .45s cubic-bezier(.6,.18,.27,.88);
    transition-delay: 0.5s;
    z-index: 29;
}
div.hovertip:not(:has(div[class*="-heading"])) {
    border-bottom: rgb(var(--bg_color2)) 0.25em solid !important;
}
div.hovertip::before {
    content: "";
    display: block;
    background-color: rgb(var(--bg_color2));
    height: 0.25em;
    width: 100%;
    position: absolute;
    left: 0;
    top: -0.125em;
}
div.hovertip:not(:has(div[class*="-heading"]))::before {
    display: none;
}
div.hovertip:is(:hover, [style*="display: block"]) {
    z-index: 30;
    right: 1em;
    transition-delay: 0s;
}
div.hovertip div.content {
    padding: 0;
}
div.hovertip div.content div[class] div[class*="-heading"] {
    background-color: rgb(var(--bg_color1));
    color: rgb(var(--text_color1));
    font-family: var(--font1);
    font-size: 1em;
    line-height: 1.5em;
    height: 1.5em;
    inset-block-start: -1.5em;
    inset-inline-start: 0;
    margin-block-end: -1em;
    padding: 0 0.5em;
    position: absolute;
    width: max-content;
    z-index: -1;
}
div.hovertip div.content div[class] div[class*="-content"] {
    margin: 0;
    padding: 0;
}
div.hovertip div[class*="-footer"] {
    display: none;
}
 
@media (max-width: 30em) {
    div.hovertip {
        width: min(20em, 25em)!important;
    }
}