bk-magic-vue/lib/ui/message.min.css.map

基于蓝鲸 Magicbox 和 Vue 的前端组件库

{"version":3,"sources":["message.css"],"names":[],"mappings":"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","file":"message.min.css","sourcesContent":["@import './variable.css';\n\n.bk-message {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    position: fixed;\n    left: 50%;\n    padding: 10px 15px;\n    background: $newMainColor5;\n    border: 1px solid $newMainColor3;\n    border-radius: 2px;\n    box-shadow: 0px 2px 4px 0px rgba(16, 37, 74, 0.1);\n    z-index: $messageZIndex;\n    transform: translateX(-50%);\n    transition: top .3s linear;\n}\n.bk-message-primary {\n    background: $newMainColor5;\n    border-color: $newMainColor3;\n    .bk-message-icon .bk-icon {\n        color: $newMainColor;\n    }\n    .bk-message-close .icon-close {\n        color: $newMainColor2;\n    }\n}\n.bk-message-error {\n    background: $newRedColor5;\n    border-color: $newRedColor3;\n    box-shadow: 0px 2px 4px 0px rgba(86, 34, 34, 0.1);\n    .bk-message-icon .bk-icon {\n        color: $newRedColor;\n    }\n    .bk-message-close .icon-close {\n        color: $newRedColor2;\n    }\n}\n.bk-message-warning {\n    background: $newOrangeColor5;\n    border-color: $newOrangeColor3;\n    box-shadow: 0px 2px 4px 0px rgba(75, 51, 13, 0.1);\n    .bk-message-icon .bk-icon {\n        color: $newOrangeColor;\n    }\n    .bk-message-close .icon-close {\n        color: $newOrangeColor2;\n    }\n}\n.bk-message-success {\n    background: #f2fff4;\n    border-color: $newGreenColor3;\n    box-shadow: 0px 2px 4px 0px rgba(16, 68, 29, 0.1);\n    .bk-message-icon .bk-icon {\n        color: $newGreenColor;\n    }\n    .bk-message-close .icon-close {\n        color: $newGreenColor2;\n    }\n}\n\n.bk-message-icon {\n    align-self: flex-start;\n    flex-shrink: 0;\n    margin-top: 1px;\n    margin-right: 10px;\n    color: #ffffff;\n    .bk-icon {\n        display: block;\n        width: 18px;\n        height: 18px;\n        line-height: 18px;\n        font-size: $iconSmallerSize;\n        text-align: center;\n        color: #ffffff;\n        border-radius: 50%;\n    }\n}\n\n.bk-message-content {\n    box-flex: 1;\n    flex-grow: 1;\n    flex: 1;\n    min-width: 230px;\n    /* max-width: 538px; */\n    line-height: 20px;\n    font-size: 14px;\n    text-align: left;\n    color: $newBlackColor2;\n    word-break: break-all;\n    &.ellipsis {\n        overflow: hidden;\n        white-space: nowrap;\n        text-overflow: ellipsis;\n    }\n    &.multi-ellipsis {\n        overflow: hidden;\n        text-overflow: ellipsis;\n        display: -webkit-box;\n        -webkit-line-clamp: var(--line);\n        -webkit-box-orient: vertical;\n    }\n}\n\n.bk-message-close {\n    align-self: flex-start;\n    flex-shrink: 0;\n    text-align: center;\n    .bk-icon {\n        display: block;\n        margin-left: 30px;\n        width: 20px;\n        height: 20px;\n        line-height: 20px;\n        color: $newBlackColor3;\n        font-size: 18px;\n        font-weight: bold;\n        border-radius: 50%;\n        cursor: pointer;\n        &:hover {\n            background-color: $newGreyColor2;\n        }\n    }\n}\n\n.bk-message-copy {\n    font-size: 14px;\n    align-self: flex-end;\n    color: $newMainColor;\n    cursor: pointer;\n    margin-left: 5px;\n    line-height: 20px;\n}\n\n.bk-message-copy.copied {\n    color: $newBlackColor3;\n    cursor: default;\n}\n\n.vertical-move-enter,\n.vertical-move-leave-to {\n    opacity: 0;\n    margin-top: -50px;\n}\n.vertical-move-enter-active,\n.vertical-move-leava-active {\n    transition: margin .2s linear;\n}\n\n.bk-message-content {\n    display: flex;\n    width: 100%;\n    word-break: break-all;\n\n    &.multi {\n      flex-direction: column;\n      position: relative;\n\n      .overview {\n        display: flex;\n        justify-content: space-between;\n        align-items: self-start;\n\n        .left-content {\n          display: flex;\n\n          .describe {\n            display: -webkit-box;\n            max-width: 560px;\n            max-height: 60px;\n            overflow: hidden;\n            text-overflow: ellipsis;\n            -webkit-box-orient: vertical;\n            -webkit-line-clamp: 3;\n          }\n        }\n\n        .tools {\n          display: flex;\n          align-items: center;\n\n          .tool {\n            display: flex;\n            padding: 0 5px;\n            font-size: 14px;\n            cursor: pointer;\n            align-items: center;\n\n            .bk-message-close {\n              padding-left: 0;\n\n\n              &:hover {\n                color: #979ba5;\n                i {\n                   color: #979ba5;\n                }\n              }\n\n              i {\n                margin-left: 0;\n                color: #c4c6cc;\n              }\n            }\n\n            .message-action-text {\n              padding-left: 4px;\n              overflow: hidden;\n              text-overflow: ellipsis;\n              white-space: nowrap;\n            }\n\n            &:not(.fix) {\n              span {\n                color: #3a84ff;\n              }\n            }\n\n            &.fix {\n              &.fixed {\n                span {\n                  color: #3a84ff;\n                }\n              }\n\n              span {\n                color: #979ba5;\n              }\n\n              &:hover {\n                span {\n                  color: #3a84ff;\n                }\n              }\n            }\n\n            &.close {\n              span {\n                color: #c4c6cc;\n\n                &:hover {\n                  color: #979ba5;\n                }\n              }\n            }\n          }\n        }\n      }\n\n      .message-detail {\n        position: relative;\n        margin-top: 10px;\n\n        .message-tree {\n          max-height: 480px;\n          min-height: 300px;\n          padding: 14px 24px;\n          overflow: auto;\n          background: #fff;\n          border-radius: 2px;\n\n          .message-row {\n            display: inline-flex;\n            font-size: 14px;\n            line-height: 34px;\n            color: #313238;\n\n            label {\n              display: inline-block;\n              width: 94px;\n              min-width: 94px;\n              margin-right: 8px;\n              overflow: hidden;\n              color: #63656e;\n              text-align: right;\n              text-overflow: ellipsis;\n              white-space: nowrap;\n\n              &::after {\n                content: ':';\n              }\n            }\n\n            .copy-value {\n              padding-left: 4px;\n\n              &:hover {\n                background: rgba(186, 188, 192, 0.2);\n                cursor: pointer;\n                border-radius: 2px;\n              }\n            }\n          }\n        }\n\n        .message-copy {\n          position: absolute;\n          top: 0px;\n          right: 0px;\n          font-size: 18px;\n          width: 24px;\n          height: 24px;\n          display: flex;\n          align-items: center;\n          border-radius: 0 2px 0 6px;\n          cursor: pointer;\n          justify-content: center;\n          background: #F5F7FA;\n          color: #9FA3AE;\n\n          &:hover {\n            background: #F0F5FF;\n            span {\n              color: #3a84ff;\n\n            }\n          }\n        }\n\n        .copy-status {\n          display: none;\n          padding-bottom: 4px;\n\n          .inner {\n            position: relative;\n            display: flex;\n            padding: 6px 8px;\n            font-size: 12px;\n            line-height: 20px;\n            color: #63656e;\n            background: #fff;\n            border: 1px solid #dcdee5;\n            box-shadow: 0 2px 6px 0 #0000001a;\n            align-items: center;\n\n            span {\n              margin-right: 4px;\n            }\n\n            &::after {\n              position: absolute;\n              bottom: 0;\n              left: 50%;\n              width: 8px;\n              height: 8px;\n              background: #fff;\n              border-color: #dcdee5;\n              border-style: solid;\n              border-width: 0px 1px 1px 0px;\n              content: '';\n              transform: translate(0, 4px) rotate(45deg);\n              box-shadow: 5px 3px 6px 0 #0000001a;\n              box-sizing: border-box;\n            }\n          }\n\n          &.success {\n            .inner {\n              span {\n                color: #2dcb9d;\n              }\n            }\n          }\n\n          &.error {\n            .inner {\n              span {\n                color: #ea3636;\n              }\n            }\n          }\n\n          &.is-show {\n            position: absolute;\n            top: 0;\n            left: 0;\n            display: inline-flex;\n            white-space: nowrap;\n          }\n\n          &.is-hidden {\n            top: -9999;\n            left: -9999;\n          }\n        }\n      }\n    }\n  }\n"]}