增加多图上传样式，微调标签插件

README.md

@@ -70,7 +70,9 @@
 - perfect-scrollbar
 
 ### 更新记录
-2019.04.21 新增步骤条和向导插件，修改消息方法（新增自定义消失时间），增加错误页面
+2019.04.24 新增文档示例页面增加多图上传样式（只有样式），调整标签插件样式和js的默认提示
+
+2019.04.21 新增步骤条和向导插件，修改消息方法（新增自定义消失时间），增加错误页面，增加通知消息页面说明，调整设置页样式
 
 2019.03.31 新增暗黑、半透明 两种主题样，所有页面都增加切换html
 

css/style.min.css

@@ -2848,6 +2848,7 @@ dd, dt {
 .card .tab-content {
     padding: 10px 24px;
 }
+/* page-tabs */
 .page-tabs.nav-tabs {
     padding: 0px 10px;
 }
@@ -3085,6 +3086,95 @@ dd, dt {
     border-left: 30px solid #33cabb!important;
 }
 
+/* 多图上传 */
+.lyear-uploads-pic {
+    display: -webkit-flex;
+    display: flex;
+    -webkit-align-items: stretch;
+    align-items: stretch;
+    margin-bottom: 0px;
+}
+.lyear-uploads-pic figure  {
+    position: relative;
+    background: #4d5259;
+    overflow: hidden;
+    text-align: center;
+    cursor: pointer;
+}
+.lyear-uploads-pic figure img {
+    position: relative;
+    display: block;
+    min-height: 100%;
+    max-width: 100%;
+    width: 100%;
+    opacity: 1;
+    backface-visibility: hidden;
+    -webkit-backface-visibility: hidden;
+    -webkit-transition: opacity 0.5s;
+    transition: opacity 0.5s;
+}
+.lyear-uploads-pic figure:hover img {
+    opacity: 0.5;
+}
+.lyear-uploads-pic figure figcaption,
+.lyear-uploads-pic figure figcaption > a:not(.btn) {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+}
+.lyear-uploads-pic figure figcaption {
+    display: -webkit-box;
+    display: flex;
+    -webkit-box-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    justify-content: center;
+    text-transform: none;
+    padding: 2em;
+    color: #fff;
+    -webkit-transform: scale(0);
+    transform: scale(0);
+    -webkit-transition: .35s;
+    transition: .35s;
+}
+.lyear-uploads-pic figure figcaption > a {
+    position: static;
+    z-index: auto;
+    text-indent: 0;
+    white-space: nowrap;
+    opacity: 1;
+	margin-left: 2px;
+	margin-right: 2px
+}
+.lyear-uploads-pic figure figcaption > *:first-child {
+    margin-left: 0;
+}
+.lyear-uploads-pic figure:hover figcaption {
+	-webkit-transform: scale(1);
+	transform: scale(1)
+}
+.lyear-uploads-pic .pic-add {
+    display: -webkit-flex;
+    justify-content: center;
+    align-items: center;
+    height: 100%;
+    border: 1px dashed #ebebeb;
+    font-family: "Material Design Icons";
+    font-size: 2.875rem;
+    color: #8b95a5;
+    -webkit-transition: .35s;
+    transition: .35s;
+}
+.lyear-uploads-pic .pic-add:before {
+    content: "\f415";
+}
+.lyear-uploads-pic .pic-add:hover {
+    border-color: #33cabb;
+    color: #33cabb;
+}
+
 /** ----------------------------------
  * 响应式处理
  -------------------------------------- */

lyear_pages_add_doc.html

@@ -293,6 +293,44 @@
                     <textarea class="form-control" id="seo_description" name="seo_description" rows="5" value="" placeholder="描述"></textarea>
                   </div>
                   <div class="form-group col-md-12">
+                    <label>多图上传</label>
+                    <div class="form-controls">
+                      
+                      <ul class="list-inline clearfix lyear-uploads-pic">
+                        <li class="col-xs-4 col-sm-3 col-md-2">
+                          <figure>
+                            <img src="images/gallery/15.jpg" alt="图片一">
+                            <figcaption>
+                              <a class="btn btn-round btn-square btn-primary" href="#!"><i class="mdi mdi-eye"></i></a>
+                              <a class="btn btn-round btn-square btn-danger" href="#!"><i class="mdi mdi-delete"></i></a>
+                            </figcaption>
+                          </figure>
+                        </li>
+                        <li class="col-xs-4 col-sm-3 col-md-2">
+                          <figure>
+                            <img src="images/gallery/16.jpg" alt="图片二">
+                            <figcaption>
+                              <a class="btn btn-round btn-square btn-primary" href="#!"><i class="mdi mdi-eye"></i></a>
+                              <a class="btn btn-round btn-square btn-danger" href="#!"><i class="mdi mdi-delete"></i></a>
+                            </figcaption>
+                          </figure>
+                        </li>
+                        <li class="col-xs-4 col-sm-3 col-md-2">
+                          <figure>
+                            <img src="images/gallery/17.jpg" alt="图片三">
+                            <figcaption>
+                              <a class="btn btn-round btn-square btn-primary" href="#!"><i class="mdi mdi-eye"></i></a>
+                              <a class="btn btn-round btn-square btn-danger" href="#!"><i class="mdi mdi-delete"></i></a>
+                            </figcaption>
+                          </figure>
+                        </li>
+                        <li class="col-xs-4 col-sm-3 col-md-2">
+                          <a class="pic-add" id="add-pic-btn" href="#!" title="点击上传"></a>
+                        </li>
+                      </ul>
+                    </div>
+                  </div>
+                  <div class="form-group col-md-12">
                     <label for="content">内容</label>
                     <p>HTML编辑器这里就不做演示了</p>
                   </div>