@jx3box/jx3box-ui 0.0.1

package/assets/css/module/buff.less

@@ -0,0 +1,78 @@
+.w-buff {
+    padding: 1px;
+    border: 1px solid #0f2222;
+    .w-buff-wrapper {
+        @max-width: 345px;
+        @min-width: 200px;
+        max-width: @max-width;
+        min-width: @min-width;
+        padding: 9px 10px 10px;
+        background-color: rgba(15, 34, 34, 0.88);
+        box-sizing: border-box;
+        display: flex;
+    }
+
+    .w-buff-icon {
+        .size(48px);
+        border:none;
+        padding:0;
+        margin:0 10px 0 0;
+    }
+
+    .w-buff-content {
+        font-weight: normal;
+        flex-grow: 1;
+        text-shadow: 1px 1px 1px #0f2222;
+        line-height: 20px;
+    }
+
+    .w-buff-name {
+        color: #ff0;
+        .db;
+        .fz(13px);
+    }
+
+    .w-buff-type{
+        .db;
+        color: #77ecff;
+        letter-spacing: 0.5px;
+        .mb(5px);
+        .fz(12px, 20px);
+    }
+
+    .w-buff-desc {
+        color: #ffffff;
+        letter-spacing: 0.5px;
+        .fz(12px, 20px);
+    }
+
+    .w-buff-meta {
+        .db;
+        .fz(12px, 20px);
+        color: #5df9eb;
+    }
+}
+
+.c-article .e-jx3-buff {
+    // img {
+    //     border: none;
+    //     margin: 0 5px 0 0;
+    //     width: 36px;
+    //     vertical-align: middle;
+    // }
+    // span {
+    //     font-size: 14px;
+    //     line-height: 36px;
+    // }
+
+    // &.isBuff {
+    //     color: #37a900;
+    // }
+    // &.isDebuff {
+    //     color: #900;
+    // }
+    text-decoration: underline;
+    &:hover {
+        box-shadow: none !important;
+    }
+}

package/assets/css/module/directory.less

@@ -0,0 +1,143 @@
+.c-article-directory {
+    h1,
+    h2,
+    h3,
+    h4,
+    h5,
+    h6 {
+        margin: 0;
+        padding: 0;
+        cursor: pointer;
+        font-weight: normal;
+        white-space: nowrap;
+        word-wrap: normal;
+        word-break: keep-all;
+        text-overflow: ellipsis;
+        overflow: hidden;
+        letter-spacing: 0.2px;
+        line-height: 20px;
+        padding: 8px 0;
+        &:hover {
+            // font-weight: 600;
+            color: #0366d6;
+        }
+        font-size: 12px;
+    }
+    a {
+        color: @color;
+    }
+
+    h1,
+    h2,
+    h3,
+    h4,
+    h5,
+    h6 {
+        &::before {
+            content: "";
+            background-image: url("../../img/single/ticket.svg");
+            display: inline-block;
+            margin-right: 5px;
+            width: 14px;
+            height: 14px;
+            display: inline-block;
+            background-size: cover;
+            position: relative;
+            top: 2px;
+        }
+    }
+
+    // .hasChild {
+    //     font-size: 14px;
+    //     &::before {
+    //         content: "\e784";
+    //     }
+    // }
+
+    // h2,h3,h4,h5,h6{
+    //     margin-left: 20px;
+    // }
+    // .hasChild{
+    //     margin-left: 0;
+    // }
+
+    // h3 + h2,h4 + h3,h5 + h4,h6 + h5{
+    //     margin-left: 0;
+    // }
+
+    .lv2 {
+        padding-left: 20px;
+    }
+
+    .lv3 {
+        padding-left: 40px;
+    }
+
+    .lv0 {
+        display: none;
+    }
+}
+
+.c-article-directory-title {
+    margin-bottom: 5px;
+    .c-article-directory-title-label {
+        font-weight: 300;
+        font-size: 20px;
+        // cursor: pointer;
+        // &:hover {
+        //     color: #f39;
+        // }
+    }
+    .c-article-directory-title-skip,
+    .c-article-directory-title-folder {
+        font-size: 14px;
+        float: right;
+        padding: 0 5px;
+        line-height: 25px;
+        color: darken(#dcdfe6, 5%);
+        cursor: pointer;
+        &:hover {
+            color: darken(#dcdfe6, 20%);
+        }
+    }
+}
+.c-article-directory-title-icon {
+    &::before {
+        content: "";
+        background-image: url("../../img/single/directory-header.svg");
+        display: inline-block;
+        // margin-right: 5px;
+        width: 20px;
+        height: 20px;
+        display: inline-block;
+        background-size: cover;
+        position: relative;
+        top: 1px;
+    }
+}
+.c-article-directory-content {
+    padding: 10px 15px;
+}
+
+@keyframes focusFade {
+    from {
+        background-color: #c3fcff;
+    }
+    to {
+        background-color: transparent;
+    }
+}
+
+.c-article .isScrollFocus {
+    animation: focusFade 0.5s ease-in-out;
+}
+
+.w-directory-anchor {
+    .fz(16px);
+    .pointer;
+    // color:@color !important;
+    &:hover {
+        box-shadow: none !important;
+        color: #c00 !important;
+    }
+}

package/assets/css/module/icon.less

@@ -0,0 +1,21 @@
+.c-article {
+    .e-jx3-icon {
+        padding: 0;
+        width: 48px;
+        height: 48px;
+        border-radius: 6px;
+        box-shadow: 0 0 1px inset rgba(0, 0, 0, 0.2);
+        //border: 1px solid #d2d2d2;
+        vertical-align: middle;
+    }
+
+    .e-jx3-emotion {
+        
+        max-width: 320px;
+        vertical-align: middle;
+        &:hover{
+            box-shadow:none !important;
+        }
+        .e-jx3-emotion-img{border:none !important}
+    }
+}

package/assets/css/module/item.less

@@ -0,0 +1,229 @@
+.c-article {
+    .e-jx3-item {
+        .pointer;
+    }
+    .e-jx3-item-q0 {
+        color: rgb(167, 167, 167);
+        box-shadow: 0 1px 0 rgb(167, 167, 167);
+        &:hover {
+            color: rgb(167, 167, 167, 0.88);
+            box-shadow: 0 1px 0 rgba(167, 167, 167, 0.88);
+        }
+    }
+    .e-jx3-item-q1 {
+        color: rgb(6, 191, 204);
+        box-shadow: 0 1px 0 rgb(6, 191, 204);
+        &:hover {
+            color: rgba(6, 191, 204, 0.88);
+            box-shadow: 0 1px 0 rgba(6, 191, 204, 0.88);
+        }
+    }
+    .e-jx3-item-q2 {
+        color: rgb(0, 210, 75);
+        box-shadow: 0 1px 0 rgb(0, 210, 75);
+        &:hover {
+            color: rgba(0, 210, 75, 0.88);
+            box-shadow: 0 1px 0 rgba(0, 210, 75, 0.88);
+        }
+    }
+    .e-jx3-item-q3 {
+        color: rgb(0, 126, 255);
+        box-shadow: 0 1px 0 rgb(0, 126, 255);
+        &:hover {
+            color: rgba(0, 126, 255, 0.88);
+            box-shadow: 0 1px 0 rgba(0, 126, 255, 0.88);
+        }
+    }
+    .e-jx3-item-q4 {
+        color: rgb(254, 45, 254);
+        box-shadow: 0 1px 0 rgb(254, 45, 254);
+        &:hover {
+            color: rgba(254, 45, 254, 0.88);
+            box-shadow: 0 1px 0 rgba(254, 45, 254, 0.88);
+        }
+    }
+    .e-jx3-item-q5 {
+        color: rgb(255, 165, 0);
+        box-shadow: 0 1px 0 rgb(255, 165, 0);
+        &:hover {
+            color: rgba(255, 165, 0, 0.88);
+            box-shadow: 0 1px 0 rgba(255, 165, 0, 0.88);
+        }
+    }
+}
+
+.c-item {
+    @max-width: 345px;
+    @field-padding-right: 0px;
+
+    .pr;
+    .dbi;
+    padding: 2px;
+    font-family: "SimHei", "STHeiti", "Microsoft YaHei";
+
+    &.c-item-equipment {
+        width: @max-width;
+    }
+
+    &.c-item-furniture {
+        min-width: 200px;
+    }
+
+    * {
+        box-sizing: border-box;
+    }
+
+    ul {
+        margin: 0;
+        padding: 0;
+        list-style: none;
+    }
+
+    .c-item-wrapper {
+        max-width: @max-width;
+        padding: 9px 10px 10px;
+        background-color: rgba(15, 34, 34, 0.88);
+        // background-color: #0f2222;
+        color: #ffffff;
+
+        *{
+            font-weight: normal;
+            font-size: 13.6px;
+            line-height: 1.5em;
+            text-shadow: 1px 1px 1px #0f2222;
+        }
+
+        &:before {
+            content: "";
+            .pa;
+            top: 0;
+            left: 0;
+            .w(100%);
+            .h(100%);
+            border: 1px solid #0f2222;
+            box-sizing: border-box;
+            pointer-events: none;
+        }
+
+        .u-title {
+            font-weight: normal;
+        }
+
+        .u-desc {
+            padding-right: @field-padding-right;
+        }
+
+        .u-title,
+        .u-desc {
+            margin: 0;
+        }
+
+        .u-orange {
+            color: #ffa500;
+        }
+
+        .u-yellow {
+            color: #ffff00;
+        }
+
+        .u-green {
+            color: #00d24b;
+        }
+
+        .u-white {
+            color: #ffffff;
+        }
+
+        .u-gray {
+            color: #adadad;
+        }
+
+        .u-max-strength-level {
+            .pr;
+            color: #7ee3a3;
+
+            span {
+                .pa;
+                top: 0;
+                right: 0;
+            }
+        }
+
+        .u-max-exist-time {
+            color: #cfcfcf;
+        }
+
+        .u-weapon-type-label {
+            & + .u-type-label {
+                .fr;
+                transform: translateY(-100%);
+            }
+        }
+
+        .u-attributes {
+            .pr;
+            padding-right: @field-padding-right;
+
+            .u-orange {
+                color: #ff9600;
+            }
+
+            .u-green {
+                color: #00c848;
+            }
+
+            .u-speed {
+                .pa;
+                top: 0;
+                right: 0;
+            }
+
+            .u-horse-attribute {
+                .u-horse-icon {
+                    float: left;
+                    .w(22px);
+                    .mt(3px);
+
+                    & + .u-horse-desc {
+                        .ml(22px);
+                    }
+                }
+            }
+        }
+
+        .u-diamonds {
+            margin: 0;
+            padding: 0;
+            list-style: none;
+
+            .u-diamond {
+                .u-square,
+                .u-text {
+                    display: inline-block;
+                    vertical-align: middle;
+                }
+
+                .u-square {
+                    width: 1.1em;
+                    height: 1.1em;
+                    margin-right: 3px;
+                    border: 1px solid #999999;
+                }
+
+                .u-text {
+                    margin-top: -1px;
+                }
+            }
+        }
+
+        .u-can-shared {
+            color: #4fff6c;
+        }
+
+        .u-furniture-can {
+            span {
+                .pr(10px);
+            }
+        }
+    }
+}

package/assets/css/module/item_simple.less

@@ -0,0 +1,51 @@
+.m-simple-item {
+    .mb(2px);
+    padding: 4px 10px 4px 4px;
+    line-height: initial;
+    font-size: 13px;
+    background-color: #0f2222;
+    text-shadow: 1px 1px 1px #000000;
+    border-radius: 4px;
+    overflow: hidden;
+
+    .m-icon,
+    .u-name {
+        .dbi;
+        vertical-align: middle;
+    }
+
+    .m-icon {
+        .pr;
+        .mr(8px);
+
+        .u-border,
+        .u-border-quest {
+            .pa;
+            top: 0;
+            left: 0;
+            .w(100%);
+            .h(100%);
+            box-sizing: border-box;
+            background-size: contain;
+            .z(20);
+        }
+
+        .u-border-quest {
+            .z(30);
+        }
+
+        .u-icon {
+            .pr;
+            .db;
+            .w(24px);
+            .h(auto);
+            .z(10);
+        }
+    }
+
+    .u-uiid {
+        .mt(3px);
+        font-size: 12px;
+        color: lightgreen;
+    }
+}

package/assets/css/module/jx3_element.less

@@ -0,0 +1,4 @@
+.w-jx3-element-pop {
+    position: fixed;
+    .z(2000);
+}

package/assets/css/module/macro.less

@@ -0,0 +1,72 @@
+// 文章输出样式
+.w-jx3macro {
+    .fz(15px,24px);
+    font-family: Monaco, Consolas, "Lucida Console", "Courier New", serif;
+    ol {
+        padding: 0 0 0 40px;
+        border-radius: 4px;
+        background: #f6f8fa;
+        border: 1px solid #eee;
+    }
+    li {
+        margin: 0 !important;
+        background: #fafbfc;
+        border-bottom: 1px solid #e1e4e8;
+        border-left: 1px solid #e1e4e8;
+        &:last-child {
+            border-bottom: none;
+        }
+        list-style: decimal;
+        &:hover {
+            background-color: #fff;
+        }
+    }
+    pre {
+        background: none;
+        border: none;
+        padding: 6px 10px !important;
+        margin: 0;
+        .lh(24px);
+        border: none !important;
+        font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
+        white-space: normal;
+    }
+}
+@media print {
+    .w-jx3macro {
+        page-break-inside: avoid !important;
+        ol {
+            padding-left: 0;
+        }
+        li {
+            list-style: none;
+            border-left: none;
+        }
+    }
+}
+
+//注释
+.jx3macro-comment {
+    color: #22863a;
+}
+//条件
+.jx3macro-condition {
+    color: #6f42c1;
+}
+//符号
+.jx3macro-key {
+    color: #d73a49;
+}
+//命令
+.jx3macro-keyword-cast {
+    color: #005cc5;
+}
+.jx3macro-keyword-fcast {
+    color: #e6a11d;
+}
+.jx3macro-keyword-msg {
+    color: #666;
+}
+//技能
+.jx3macro-skill-name {
+}