nutui/sites/doc/asset/css/common.scss

@charset "utf-8";
html,
body,
div,
span,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
em,
img,
s,
strong,
b,
u,
i,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
section,
time,
audio,
video {
    margin: 0;
    padding: 0;
    border: 0;
    font: inherit;
}

ol,
ul {
    list-style: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

html,
body {
    font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
}

.qrcode {
    position: relative;
    display: inline-block;
    margin-left: 30px;
    line-height: 0;
    width: 22px;
    height: 22px;
    opacity: .6;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='64 64 896 896' data-icon='qrcode' width='1em' height='1em' fill='#666666' aria-hidden='true'%3E %3Cpath d='M468 128H160c-17.7 0-32 14.3-32 32v308c0 4.4 3.6 8 8 8h332c4.4 0 8-3.6 8-8V136c0-4.4-3.6-8-8-8zm-56 284H192V192h220v220zm-138-74h56c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8zm194 210H136c-4.4 0-8 3.6-8 8v308c0 17.7 14.3 32 32 32h308c4.4 0 8-3.6 8-8V556c0-4.4-3.6-8-8-8zm-56 284H192V612h220v220zm-138-74h56c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8zm590-630H556c-4.4 0-8 3.6-8 8v332c0 4.4 3.6 8 8 8h332c4.4 0 8-3.6 8-8V160c0-17.7-14.3-32-32-32zm-32 284H612V192h220v220zm-138-74h56c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8zm194 210h-48c-4.4 0-8 3.6-8 8v134h-78V556c0-4.4-3.6-8-8-8H556c-4.4 0-8 3.6-8 8v332c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V644h78v102c0 4.4 3.6 8 8 8h190c4.4 0 8-3.6 8-8V556c0-4.4-3.6-8-8-8zM746 832h-48c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8zm142 0h-48c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8z'/%3E %3C/svg%3E") no-repeat 1px 1px;
    background-size: cover;
    z-index: 9;
    a {
        position: absolute; //display: none;
        top: 24px;
        width: 200px;
        height: 230px;
        opacity: 0;
        transform: scale(0.5);
        transform-origin: 50% top 0;
        transition: all 100ms ease-in-out 50ms;
        background: url('./i/kuang.png') no-repeat;
        background-size: 200px;
        text-decoration: none;
        font-style: normal;
        text-align: center;
        left: -88px;
        overflow: hidden;
        pointer-events: none;
        span {
            display: block;
            overflow: hidden;
            color: #666;
            font-size: 15px;
            text-align: center;
            height: 47px;
            width: 100%;
            line-height: 74px;
        }
        img {
            width: 170px;
            height: 170px;
        }
    }
    &:hover {
        opacity: 1;
        a {
            display: inline-block;
            opacity: 1;
            transform: scale(1);
        }
    } // img{
    //     width: 100%;
    //     height: 100%;
    // }
    // &:hover{
    //     transform: scale(2);
    // }
}

pre {
    position: relative;
    max-width: 100%;
    overflow: auto;
    .code-wrapper {
        width: 100%;
        overflow: auto;
    }
    [toast="toast"],
    [copy="copy"] {
        cursor: pointer;
        position: absolute;
        top: 10px;
        width: 16px;
        height: 16px;
        background-repeat: no-repeat;
        background-size: cover;
        opacity: .8;
        &:hover {
            opacity: 1;
        }
    }
    [toast="toast"] {
        right: 10px;
        background-image: url(./i/all.png);
        &:hover {
            background-color: #D5E5FF;
        }
    }
    [copy="copy"] {
        right: 40px;
        background-image: url(./i/cp.png);
        &:hover {
            background-color: #D5E5FF;
        }
    }
}

.nut-dialog-content {
    text-align: left !important;
    [toast="toast"],
    [copy="copy"] {
        display: none;
    }
} // 代码显示
pre {
    position: relative;
    background: #F2F4F5;
    border-radius: 4px;
    border: none;
    padding: 20px;
    margin: 0;
    &>span {
        position: absolute;
        right: 5px;
        bottom: 5px;
        font-style: italic;
        font-size: 12px;
        color: #999;
        text-shadow: 1px 1px #FFF;
        user-select: none;
    }
}

.kwd {
    color: #005cc5;
}

.pln {
    color: #a74a4a;
}

.tag {
    color: #288cff;
}

.atn {
    color: #0dade4;
}

.pun {
    color: #8276ff;
}

.atv {
    color: #005cc5;
}

.com {
    color: #055a2a;
}

.layer {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    min-height: 100%;
    background: #F2F4F5;
    z-index: 9999;
    .close-box {
        color: #fff;
        font-size: 24px;
        position: absolute;
        top: 10px;
        right: 14px;
        z-index: 30;
        width: 16px;
        height: 16px;
        background: url(../css/i/close.png) no-repeat center;
        background-size: cover;
        cursor: pointer;
        &:hover {
            background-color: #D5E5FF;
            background-image: url(../css/i/close.png);
        }
    }
    [toast="toast"] {
        display: none;
    }
    pre {
        background: none;
        padding: 0 30px;
        max-width: 100%;
        max-height: 800px;
        overflow: auto;
        &>i,
        .lang {
            display: none;
        }
    }
}

pre.prettyprint {
    code {
        font: 13px/24px "SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace;
    }
}

// 书签样式
.markList {
    position: fixed;
    right: 10px;
    top: 100px;
    background: #fff;
    border-left: 1px solid #efefef;
    padding: 0 10px 0 20px !important;
    li:before {
        display: none !important;
    }
}