@jx3box/jx3box-ui 2.0.2 → 2.0.4

package/README.md

@@ -1,4 +1,103 @@
 # 概述
 
-1. App.vue用于平时做组件开发临时预览
-2. Storybook用于协作开发共享，注意编写好props注释
+1. App.vue 用于平时做组件开发临时预览
+2. Storybook 用于协作开发共享，注意编写好 props 注释
+
+## 模块
+
+### 个人模块 author
+
+一般用于文章详情的左侧边栏
+
+-   AuthorFans 粉丝榜
+-   AuthorFollow 关注用户（区分rss，此处用户更新不会收到消息）
+-   AuthorGift 打赏用户
+-   AuthorHonor 用户称号
+-   AuthorInfo 用户基础信息
+-   AuthorLink 用户绑定平台账号（微博，github，直播间）
+-   AuthorMedals 用户勋章
+-   AuthorPosts 用户作品
+-   AuthorRss 订阅用户
+-   AuthorTeams 所在团队
+-   Avatar 头像
+-   UserPop 搜索用户弹窗
+-   
+
+### 管理员模块 bread
+
+一般用于文章详情的右上角管理按钮
+
+- AdminDrop 管理模块触发器
+- Admin 文章管理模块（管理员）
+- AdminDirectMessage 管理员私信
+- Crumb 栏目动态
+- DesignTask 设计任务
+
+
+### 评论模块 comment
+
+文章评论模块，用途包括反馈中心，文章详情评论
+
+### 筛选模块 filters
+
+主要用于各栏目的列表筛选
+
+- clientBy 客户端筛选
+- markBy 标记筛选
+- menuBy 通用筛选
+- orderBy 排序筛选
+- tagBy 
+- topicBy 主题筛选
+- versionBy 版本筛选
+- zlpBy 资料片筛选
+
+
+### 顶部模块
+
+主要是header的模块
+
+- alternate 马甲切换
+- asset 用户资产
+- box 魔盒矩阵（移动端）
+- box2 魔盒矩阵（PC）
+- client 客户端切换
+- lang 语言切换
+- logo
+- manage 后台管理入口
+- message 消息中心入口
+- nav 导航栏
+- publish 创作中心入口
+- search 搜索框
+- shop 商城入口
+- user 用户头像+信息pop
+- 会员中心入口
+
+### 交互模块
+
+主要是文章详情中用于用户交互的组件，包含打赏，分享，收藏等等
+
+- BoxcoinAdmin 管理员品鉴
+- BoxcoinRecords 品鉴+打赏记录
+- BoxcoinUser 用户打赏
+- Contributors 多人合作文章中打赏目标选择
+- Fav 收藏
+- Like 点赞
+- Rss 订阅
+- Share 分享
+- WatchLater 稍后再看
+
+
+### 单页
+
+主要是用于详情页的展示内容
+
+- Author 侧边栏作者信息
+- CmsSingle 单页框架
+- Collection 小册
+- Comment 评论
+- Creators 联合创作
+- PostDirectory 目录
+- PostHeader 创作信息
+- PostTopic 右侧边栏头条
+- SimpleThx 简单交互组件集合
+- Thx 交互组件

package/assets/css/bread/admin.less

@@ -1,4 +1,5 @@
 .c-admin {
+    /* assets/css/bread/admin.less */
     top: 0;
     position: fixed;
     right: 0;
@@ -6,61 +7,77 @@
     margin: 0;
 
     *:focus {
+        /* assets/css/bread/admin.less */
         outline: none !important;
         box-shadow: none !important;
     }
 
     .el-drawer {
+        /* assets/css/bread/admin.less */
         .size(100%);
         overflow-y: auto;
     }
     .el-drawer__header{
+        /* assets/css/bread/admin.less */
         .mb(10px);
     }
     .el-drawer__body{
+        /* assets/css/bread/admin.less */
         padding:0 20px;
     }
 }
 
 .c-admin-mark {
+    /* assets/css/bread/admin.less */
     .el-radio {
+        /* assets/css/bread/admin.less */
         .mb(10px);
     }
 }
 
 .c-admin-wrapper {
+    /* assets/css/bread/admin.less */
     box-sizing: border-box;
 
     .u-refresh-btn {
+        /* assets/css/bread/admin.less */
         margin-left: 10px;;
     }
 }
 
 .c-admin-highlight-checkbox {
+    /* assets/css/bread/admin.less */
     .mr(10px) !important;
 }
 .c-admin-highlight-block {
+    /* assets/css/bread/admin.less */
     .y;
 }
 .c-admin-highlight-preview {
+    /* assets/css/bread/admin.less */
     .fz(14px);
     .bold;
     .ml(10px);
 }
 
 .c-admin-banner {
+    /* assets/css/bread/admin.less */
     .u-banner {
+        /* assets/css/bread/admin.less */
         .mt(5px);
     }
     .u-btn {
+        /* assets/css/bread/admin.less */
         .pointer;
     }
 }
 .c-admin-upload {
+    /* assets/css/bread/admin.less */
     .w(100%) !important;
     .x;
 
     .el-upload {
+        /* assets/css/bread/admin.less */
         .size(100%);
         box-sizing: border-box;
     }
@@ -68,14 +85,17 @@
 }
 
 .c-admin-info {
+    /* assets/css/bread/admin.less */
     display: flex;
 }
 
 .w-select {
+    /* assets/css/bread/admin.less */
     position: relative;
     .flex;
     align-items: center;
     .u-select-label {
+        /* assets/css/bread/admin.less */
         background-color: #f5f7fa;
         color: #909399;
         position: relative;
@@ -95,7 +115,9 @@
         box-sizing: border-box;
     }
     .el-select {
+        /* assets/css/bread/admin.less */
         .el-input__wrapper {
+            /* assets/css/bread/admin.less */
             border-top-left-radius: 0;
             border-bottom-left-radius: 0;
             box-shadow: 0 1px 0 0 #dcdfe6 inset, 0 -1px 0 0 #dcdfe6 inset, 0 0 0 1px #dcdfe6 inset;
@@ -104,27 +126,37 @@
 }
 
 .c-admin-type {
+    /* assets/css/bread/admin.less */
     .w(50%);
     min-width: 200px;
     .mr(10px);
     .u-select-label {
+        /* assets/css/bread/admin.less */
         height: 32px;
         line-height: 32px;
     }
 }
 .c-admin-author {
+    /* assets/css/bread/admin.less */
+    /* /Users/lijiawei/Desktop/jx3box/jx3box-ui/assets/css/bread/admin.less */
     .w(50%);
     flex: 1;
 }
 
 .c-admin-buttons {
+    /* assets/css/bread/admin.less */
+    /* /Users/lijiawei/Desktop/jx3box/jx3box-ui/assets/css/bread/admin.less */
     .mt(20px);
     .x;
 }
 
 @media screen and (max-width: @ipad) {
+    /* assets/css/bread/admin.less */
     .c-admin {
+        /* assets/css/bread/admin.less */
+        /* /Users/lijiawei/Desktop/jx3box/jx3box-ui/assets/css/bread/admin.less */
         .el-drawer {
+            /* assets/css/bread/admin.less */
             .w(100%) !important;
         }
     }

package/assets/css/bread/breadcrumb.less

@@ -1,4 +1,5 @@
 .c-breadcrumb {
+    /* assets/css/bread/breadcrumb.less */
     .pf;
     top: @header-height;
     .z(499);
@@ -12,8 +13,10 @@
     transition: 0.5s ease-in-out;
 
     .u-channel {
+        /* assets/css/bread/breadcrumb.less */
         .fl;
         span {
+            /* assets/css/bread/breadcrumb.less */
             .bold;
             color: @color;
         }
@@ -21,11 +24,13 @@
         // padding:10px;
     }
     .u-channel-logo {
+        /* assets/css/bread/breadcrumb.less */
         .fl;
         .size(28px);
         .mr(10px);
         box-sizing: border-box;
         svg {
+            /* assets/css/bread/breadcrumb.less */
             .size(100%);
             fill: @bg-black;
             box-sizing: border-box;
@@ -33,20 +38,25 @@
     }
 
     .u-channel:hover {
+        /* assets/css/bread/breadcrumb.less */
         .u-title {
+            /* assets/css/bread/breadcrumb.less */
             color: @darkblue;
         }
         .u-channel-logo svg {
+            /* assets/css/bread/breadcrumb.less */
             fill: @darkblue;
         }
     }
 
     .c-crumb {
+        /* assets/css/bread/breadcrumb.less */
         .fl;
         .mr(20px);
     }
 
     .el-tabs {
+        /* assets/css/bread/breadcrumb.less */
         position: absolute;
         left: 140px;
         top: 0;
@@ -54,15 +64,18 @@
         bottom: 0;
 
         .el-tabs__header {
+            /* assets/css/bread/breadcrumb.less */
             margin: 0;
         }
 
         .el-tabs__item {
+            /* assets/css/bread/breadcrumb.less */
             .h(48px);
             .lh(48px);
         }
 
         .el-tabs__nav-wrap::after {
+            /* assets/css/bread/breadcrumb.less */
             .none;
         }
     }
@@ -70,6 +83,7 @@
     .u-publish,
     .u-admin,
     .u-feedback {
+        /* assets/css/bread/breadcrumb.less */
         .fr;
         // .pa;.rt(8px,8px);
         padding: 8px 18px;
@@ -78,11 +92,13 @@
 
     .u-admin,
     .u-feedback {
+        /* assets/css/bread/breadcrumb.less */
         .mr(10px);
         .ml(0);
     }
 
     .u-menu {
+        /* assets/css/bread/breadcrumb.less */
         .pa;
         .lt(0);
         .h(28px);
@@ -91,49 +107,63 @@
         .pointer;
 
         svg {
+            /* assets/css/bread/breadcrumb.less */
             .h(29px);
             fill: @color;
         }
 
         .on {
+            /* assets/css/bread/breadcrumb.less */
             fill: @primary;
         }
     }
 
     .u-op {
+        /* assets/css/bread/breadcrumb.less */
         .pa;
         .rt(10px);
     }
 }
 .c-breadcrumb.isOverlay {
+    /* assets/css/bread/breadcrumb.less */
     background-color: rgba(255, 255, 255, 0.85);
 }
 
 @media screen and (max-width: @ipad) {
+    /* assets/css/bread/breadcrumb.less */
     .c-breadcrumb {
+        /* assets/css/bread/breadcrumb.less */
         padding-left: 40px;
 
         &.withoutLeft {
+            /* assets/css/bread/breadcrumb.less */
             padding-left: 10px;
         }
         .u-menu {
+            /* assets/css/bread/breadcrumb.less */
             .db;
         }
         .u-channel-logo {
+            /* assets/css/bread/breadcrumb.less */
             .none;
         }
         .u-channel.on {
+            /* assets/css/bread/breadcrumb.less */
             .u-channel-logo {
+                /* assets/css/bread/breadcrumb.less */
                 .db;
             }
         }
         .u-op-public {
+            /* assets/css/bread/breadcrumb.less */
             .none;
         }
         .el-tabs {
+            /* assets/css/bread/breadcrumb.less */
             right: 0;
         }
         .c-crumb {
+            /* assets/css/bread/breadcrumb.less */
             float: none;
             white-space: nowrap;
             overflow: auto;
@@ -141,21 +171,29 @@
     }
 }
 @media print {
+    /* assets/css/bread/breadcrumb.less */
     .c-breadcrumb {
+        /* assets/css/bread/breadcrumb.less */
         .none;
     }
 }
 
 @media screen and (max-width: @phone) {
+    /* assets/css/bread/breadcrumb.less */
     .env-app {
+        /* assets/css/bread/breadcrumb.less */
         .c-breadcrumb {
+            /* assets/css/bread/breadcrumb.less */
             .none;
         }
     }
 
     .wechat-miniprogram{
+        /* assets/css/bread/breadcrumb.less */
         .c-breadcrumb{
+            /* assets/css/bread/breadcrumb.less */
             .u-op {
+                /* assets/css/bread/breadcrumb.less */
                 .none;
             }
         }

package/assets/css/bread/crumb.less

@@ -1,17 +1,23 @@
 .c-crumb {
+    /* assets/css/bread/crumb.less */
     font-size: 12px;
 
     p {
+        /* assets/css/bread/crumb.less */
         margin: 0;
     }
     a {
+        /* assets/css/bread/crumb.less */
         &:hover {
+            /* assets/css/bread/crumb.less */
             box-shadow: 0 1px 0 @color-link;
         }
     }
 }
 @media screen and (max-width: @phone) {
+    /* assets/css/bread/crumb.less */
     .c-crumb {
+        /* assets/css/bread/crumb.less */
         .none;
     }
 }

package/assets/css/comment/quick-reply.less

@@ -1,5 +1,7 @@
 .c-jx3box-reply {
+    /* assets/css/comment/quick-reply.less */
     .u-reference {
+        /* assets/css/comment/quick-reply.less */
         cursor: pointer;
         position: relative;
         top: 8px;
@@ -7,18 +9,22 @@
     }
 }
 .c-jx3box-reply-pop {
+    /* assets/css/comment/quick-reply.less */
     padding: 0;
     width: 280px;
 }
 
 .c-jx3box-reply-pop__content {
+    /* assets/css/comment/quick-reply.less */
     position: relative;
 
     .u-title {
+        /* assets/css/comment/quick-reply.less */
         font-size: 14px;
         padding: 10px;
     }
     .u-close {
+        /* assets/css/comment/quick-reply.less */
         position: absolute;
         top: 10px;
         right: 10px;
@@ -27,30 +33,35 @@
     }
 
     .m-reply-list {
+        /* assets/css/comment/quick-reply.less */
         padding: 0 10px 10px 10px;
         max-height: 300px;
         overflow-y: auto;
     }
     .m-reply-list__item {
+        /* assets/css/comment/quick-reply.less */
         cursor: pointer;
         padding: 5px;
         border: 1px solid #eee;
         border-radius: 4px;
         margin-bottom: 5px;
         .u-name {
+            /* assets/css/comment/quick-reply.less */
             font-size: 12px;
             color: #999;
         }
         .u-content {
+            /* assets/css/comment/quick-reply.less */
             font-size: 14px;
             margin-top: 5px;
         }
 
         &:hover {
+            /* assets/css/comment/quick-reply.less */
             color: #fff;
             background-color: #409eff;
             border-color: #409eff;
             transition: all 0.3s;
         }
     }
-}
+}

package/assets/css/common/bottom.less

@@ -3,19 +3,23 @@
 @pink: #f39;
 
 .m-bottom {
+    /* assets/css/common/bottom.less */
     font-size: 12px;
     color: @gray;
     margin-top: @space;
     font-family: verdana, "Trebuchet MS", Tahoma;
 
     a {
+        /* assets/css/common/bottom.less */
         color: @gray;
         &:hover {
+            /* assets/css/common/bottom.less */
             color: @pink;
         }
     }
 
     .u-feedback {
+        /* assets/css/common/bottom.less */
         float: right;
     }
 }

package/assets/css/common/footer.less

@@ -1,23 +1,29 @@
 .c-footer {
+    /* assets/css/common/footer.less */
     padding: 20px;
 
     .fz(13px);
     color: #999;
     a {
+        /* assets/css/common/footer.less */
         transition: 0.03s ease-in-out;
         color: #999;
         box-shadow: 0 1px transparent;
 
         &:hover {
+            /* assets/css/common/footer.less */
             color: @color-link;
             box-shadow: 0 1px @color-link;
         }
     }
 
     &.is--dark {
+        /* assets/css/common/footer.less */
         background-color: @bg-black;
         a {
+            /* assets/css/common/footer.less */
             &:hover {
+                /* assets/css/common/footer.less */
                 color: #eee;
                 box-shadow: 0 1px #eee;
             }
@@ -25,53 +31,70 @@
     }
 }
 .c-footer-inner {
+    /* assets/css/common/footer.less */
     .flex;
     justify-content: space-between;
 }
 .c-footer-left {
+    /* assets/css/common/footer.less */
     .u-flag {
+        /* assets/css/common/footer.less */
         .size(18px);
         .y(-3px);
         .mr(5px);
     }
     .u-beian {
+        /* assets/css/common/footer.less */
         .italic;
     }
 }
 .c-footer-right {
+    /* assets/css/common/footer.less */
     em {
+        /* assets/css/common/footer.less */
         margin: 0 10px;
     }
 }
 @media screen and (max-width: @phone) {
+    /* assets/css/common/footer.less */
     .c-footer {
+        /* assets/css/common/footer.less */
         padding-left: 0 !important;
         padding-right: 0 !important;
     }
     .c-footer-left {
+        /* assets/css/common/footer.less */
         .none;
     }
     .c-footer-right {
+        /* assets/css/common/footer.less */
         flex: 1;
         .x;
     }
 }
 
 @media print {
+    /* assets/css/common/footer.less */
     .c-footer {
+        /* assets/css/common/footer.less */
         .none;
     }
 }
 
 @media screen and (max-width: @phone) {
+    /* assets/css/common/footer.less */
     .env-app {
+        /* assets/css/common/footer.less */
         .c-footer {
+            /* assets/css/common/footer.less */
             .none;
         }
     }
 
     .wechat-miniprogram {
+        /* assets/css/common/footer.less */
         .c-footer {
+            /* assets/css/common/footer.less */
             .none;
         }
     }