供应商

src/main/resources/static/css/supplier-center/shop/release.css

@@ -8,25 +8,23 @@ input[type="number"]{
 div{box-sizing: border-box;}
 @media screen and (min-width:768px) {
 .container{width: 100%;height: auto;box-sizing: border-box;background-color: #FFFFFF;padding: 0 16px;}
-.release-stepbox{width: 100%;height: 70px;padding: 10px 100px;box-sizing: border-box;}
-.release-stepbox .stepSpan{float: left;width:94px;padding: 0 15px;margin-right: 80px;position: relative;}
+.release-stepbox{width: 100%;box-sizing: border-box;    line-height: 60px; padding-left: 80px}
+.release-stepbox .stepSpan{float: left;padding: 0 15px;margin-right: 80px;position: relative;}
 .release-stepbox .stepSpan:last-child{margin-right: 0;}
-.release-stepbox .stepSpan .line{width: 80px;height: 2px;background: #999999;position: absolute;right:-80px;top: 50%;}
-.release-stepbox .stepSpan p{font-size: 16px;line-height: 24px;color: #999999;text-align: center;}
-.release-stepbox .stepSpan p span{display: inline-block;width: 24px;height: 24px;font-size: 14px;text-align: center;line-height: 24px;background: #999999;color: #FFFFFF;border-radius: 40px;margin-top: 5px;}
-.release-stepbox .stepSpan.active .line{background: #E15616;}
+.release-stepbox .stepSpan p{font-size: 16px;line-height: 24px;color: #9aa5b5;text-align: center;display: inline-block}
+.release-stepbox .stepSpan p span{display: inline-block;width: 24px;height: 24px;font-size: 14px;text-align: center;line-height: 24px;background: #9aa5b5;color: #FFFFFF;border-radius: 40px;margin-top: 5px;}
 .release-stepbox .stepSpan.active  p{color:#E15616 ;}
 .release-stepbox .stepSpan.active p span{background: #E15616;}
-.release-container{width: 100%;height: auto;border-top: 2px solid #F5F5F5;padding:20px 0;opacity: 0;}
+.release-container{width: 100%;height: auto;border-top: 1px solid #e2e7ef;padding:20px 0;opacity: 0;}
 .release-container.active{opacity: 1;}
 .release-main-container{width: 100%;padding: 0 220px;box-sizing: border-box;}
 .release-from{width: 100%;height:auto;margin-bottom: 15px;line-height: 32px;font-size: 14px;color: #333;}
 .release-from.text p .em{color: #e15616;}
 .release-from.none{margin-bottom: 0;}
-.release-from .release-label{width: 100%;float: left;text-align: left;height: 32px;}
+.release-from .release-label{width: 100%;float: left;text-align: left;height: 32px;color: #627386;}
 .release-from .release-label span{color: #FF0000;}
 .release-from .release-input{width: 100%;height: auto;float: left;position: relative;}
-.release-from .release-input .input{width: 100%;height: 36px;padding: 0 10px;border-radius: 2px;border: 1px solid #EFEFEF;float: left;font-size: 13px;box-sizing: border-box;}
+.release-from .release-input .input{width: 100%;height: 36px;padding: 0 10px;border-radius: 2px;border: 1px solid #b8bfca;float: left;font-size: 13px;box-sizing: border-box;}
 .release-from .release-input .input.price{padding-left: 30px;}
 .release-from .release-input .yang{width: 30px;height: 36px;position: absolute;left: 0;top: 0;line-height: 36px;text-align: center;}
 .release-from .release-input .unit{height: 36px;padding: 0 10px;position: absolute;right: 0;top: 0;line-height: 36px;text-align: right;font-size: 14px;}
@@ -34,8 +32,8 @@ div{box-sizing: border-box;}
 .release-from .release-input .mg{margin-left: 10px;}
 .release-from .release-input .edit-btn{display: block;float: left;margin-left: 20px;color: #e15616;text-decoration: underline;}
 .release-from .release-input .input.keyword{width: 243px;margin:0 10px 10px 0;}
-.release-from .release-input .p{display: block;position: absolute;right: 0;bottom: 0;line-height: 32px;font-size: 12px;color: #FF9100;text-decoration: underline;}
-.release-from .release-input .add{display: inline-block;width: 100%;height: 20px;float: right;line-height: 20px;font-size: 14px;color: #FF9100;text-align: right;}
+.release-from .release-input .p{display: block;position: absolute;right: 0;bottom: 0;line-height: 32px;font-size: 12px;color: #e15616;text-decoration: underline;}
+.release-from .release-input .add{display: inline-block;width: 100%;height: 20px;float: right;line-height: 20px;font-size: 14px;color: #e15616;text-align: right;}
 .release-from .release-input .add span{font-size: 20px;}
 .release-from .release-input .input.keyword:nth-child(2n){margin-right: 0;}
 .release-from .release-input .release-param{width:100%;height: auto;padding: 0 10px;border: 1px solid #EFEFEF;float: left;margin-bottom: 10px;border-radius: 2px;position: relative;}
@@ -58,22 +56,22 @@ div{box-sizing: border-box;}
 .release-from  .upload-file .input-file{width: 76px;height: 76px;opacity:0;cursor: pointer;}
 .release-from  .upload-file .upload-img{width: 100%;height: 100%;display: block;border-radius: 2px;}
 .release-from .release-input .input.tags{width: 303px;}
-.release-from .release-input .add-btn{width: 107px;height: 34px;border-radius: 2px;border: 1px solid #e15616;float: left;margin-left: 10px;text-align: center;line-height: 34px;font-size: 14px;color:#e15616 ;cursor: pointer;}
-.release-from .release-input .add-btn.active{background-color: #e15616;color: #FFF;}
+.release-from .release-input .add-btn{width: 107px;height: 34px;border-radius: 2px;border: 1px solid #e15616;background:#ffe6dc;float: left;margin-left: 10px;text-align: center;line-height: 34px;font-size: 14px;color:#e15616 ;cursor: pointer;}
+.release-from .release-input .add-btn.active{background-color: #ffe6dc;color: #e15616;}
 .release-from .release-tips{width: 100%;color: #FF0000;float: left;}
 .release-from.text{height: auto;}
-.release-from .text{width: 100%;line-height: 32px;font-size: 12px;color: #999999;margin-top: 8px;}
+.release-from .text{width: 303px;line-height: 32px;font-size: 12px;color: #e15616;margin-top: 8px;}
 .release-from .tags-main{width: 100%;height: auto;}
 .release-from .tags-main .item-tags{padding: 0 10px;line-height: 28px;background: #FFF3E5;text-align: center;font-size:14px;color:  #333333;margin: 5px;border-radius: 2px;float: left;position: relative;}
 .release-from .tags-main .item-tags .del-tags{width: 16px;height: 16px;display: block;background: url("/img/base/icon.png") no-repeat;background-position: -175px -300px;position: absolute;right: -5px;top: -5px;cursor: pointer;}
 .release-from .select-main{padding: 0 10px;cursor: pointer;width: 133px;height: 32px;border: 1px solid #EFEFEF;border-radius: 2px;line-height: 32px;color: #333;font-size: 14px;margin-right: 10px;float: left;appearance: none;-webkit-appearance: none;-moz-appearance: none;position: relative;}
 .release-from .select-main:last-child{margin-right: 0;}
 .release-from .select-main.border{border: 1px solid #e15616;}
-.release-from .select-main .select{cursor: pointer;width: 113px;height: 30px;line-height: 30px;color: #606266;font-size: 12px;float: left;appearance: none;-webkit-appearance: none;-moz-appearance: none;border: none;background: url("/img/supplier/Retract.png") no-repeat scroll right 0px center transparent;}
+.release-from .select-main .select{cursor: pointer;width: 113px;height: 30px;line-height: 30px;color: #22272e;font-size: 12px;float: left;appearance: none;-webkit-appearance: none;-moz-appearance: none;border: none;background: url("/img/supplier/Retract.png") no-repeat scroll right 0px center transparent;}
 .release-from .select-main .option-main{width: 100%;min-height:50px;max-height: 200px;border: 1px solid #e4e7ed;border-radius: 2px;background-color: #fff;box-shadow: 0 2px 12px 0 rgba(0,0,0,.1);overflow: hidden;overflow-y: scroll;box-sizing: border-box;margin: 5px 0;padding: 10px 0;z-index: 88;position: absolute;top: 28px;left: 0;}
 .release-from .select-main .option {font-size: 14px;padding: 0 20px;position: relative;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;color: #606266;height: 34px;line-height: 34px;box-sizing: border-box;cursor: pointer;}
 .release-from .select-main .option:hover {background-color: #F5E7E0;color: #e15616;}
-.release-from .from-button{width: 100%;height: 70px;padding: 10px 0;}
+.release-from .from-button{width: fit-content;height: 70px;padding: 10px 0;margin: auto}
 .release-from .from-button.last{margin-left: 0;}
 .release-from .from-button.last .btn{width: 153px;}
 .release-from .from-button .btn{box-sizing: border-box;width: 232px;height: 50px;background-color: #e15616;box-shadow: 0px 3px 6px 0px rgba(249, 75, 75, 0.17);border-radius: 2px;display: block;line-height: 50px;text-align: center;float: left;margin: 0 5px;}
@@ -95,7 +93,7 @@ input[type="radio"]{opacity:0;}
 .release-from .release-input .release-props .release-radio input:checked + i{border-color:#e15616;color:#e15616}
 .release-from .release-input .release-props .release-radio input:checked + i:before{display:block}
 .release-from .release-input .release-province{width: 100%;height: auto;margin-top: 20px;}
-.release-from .release-input .release-province .province-item{line-height:26px;padding: 0 10px;text-align: center;font-size: 14px;color: #333;background: #F5F5F5;border-radius: 2px;display: block;margin: 0 10px 10px 0;float: left;}
+.release-from .release-input .release-province .province-item{line-height:26px;padding: 0 10px;text-align: center;font-size: 14px;color: #627386;background: #F0F3F7;border-radius: 2px;display: block;margin: 0 10px 10px 0;float: left;}
 .release-from .release-input .release-province .province-item.active{background: #e15616;color: #FFF;}
 /*税率弹窗*/
 .popup{width: 100%;height: 100%;background: rgba(0,0,0,0.3);position: fixed;top: 0;left: 0;z-index: 999;opacity: 0;}
@@ -110,7 +108,7 @@ input[type="radio"]{opacity:0;}
 .popup-layer .popup-content .popup-from input{width: 260px;height: 32px;border: 1px solid #EFEFEF;font-size: 14px;color: #333;padding: 0 10px;margin-left: 10px;box-sizing: border-box;}
 .popup-layer .popup-content .popup-from span{display: inline-block;height: 32px;font-size: 14px;color: #999;float: left;}
 .popup-layer .popup-content .popup-from .popup-p{width: 240px;height: 32px;font-size: 14px;color: #333;padding: 0 10px;float: left;}
-.popup-layer .popup-content .popup-from .popup-textarea{height: 78px;float: left;margin-left: 10px;width: 236px;border-radius: 2px;}
+.popup-layer .popup-content .popup-from .popup-textarea{height: 78px;float: left;margin-left: 10px;border-radius: 2px;}
 .popup-layer .popup-content .popup-from textarea{width: 100%;height: 100%;font-size: 12px;resize:none;border: 1px solid #EFEFEF;padding: 5px;}
 .popup-layer .popup-content .popup-from  .poze{width: 40px;height: 30px;text-align: center;font-size: 14px;position: absolute;right: 0;top: 0;padding: 0 10px;}
 .popup-layer .popup-content .popup-tips{color: #FF0000;float: left;margin-left: 10px;}
@@ -128,6 +126,9 @@ input[type="radio"]{opacity:0;}
 .ck-content {min-height: 500px;}
 .footTop{height: 100px;}
 .baseHeadCenter .keyword{height: 40px;line-height: 40px;}
+input::placeholder{color: #9aa5b5}
+.release-from.shili .text{width: 100%;color: #627386}
+.imgText .text{width: 100%;color: #627386}
 }
 
 /*移动*/

src/main/resources/templates/supplier-center/shop/release.html

@@ -30,23 +30,20 @@
                 <div class="container shadow" @click.stop="touchmoveFn" >
                     <div class="release-stepbox">
                         <div class="stepSpan active">
-                            <p>基本信息</p>
                             <p><span>1</span></p>
-                            <p class="line"></p>
+                            <p>基本信息</p>
                         </div>
                         <div class="stepSpan" :class="activeNum == 1 || activeNum == 2 || activeNum == 3 ? 'active':''">
-                            <p>销售信息</p>
                             <p><span>2</span></p>
-                            <p class="line"></p>
+                            <p>销售信息</p>
                         </div>
                         <div class="stepSpan" :class="activeNum == 2 || activeNum == 3 ? 'active':''">
-                            <p>上传图片</p>
                             <p><span>3</span></p>
-                            <p class="line"></p>
+                            <p>上传图片</p>
                         </div>
                         <div class="stepSpan" :class="activeNum == 3 ? 'active':''">
-                            <p>服务项目</p>
                             <p><span>4</span></p>
+                            <p>服务项目</p>
                         </div>
                     </div>
                     <div class="release-container clear"  v-show="isRequest" :class="isRequest ? 'active' : ''" >
@@ -196,7 +193,7 @@
                                     <a href="/supplier/goods/example.html" target="_blank" class="p" v-if="isPC">查看示例></a>
                                 </div>
                             </div>
-                            <div class="release-from text" style="margin-bottom: 10px;">
+                            <div class="release-from text shili" style="margin-bottom: 10px;">
                                 <P class="text" style="line-height: 24px;">{{keywordText}}</P>
                                 <a href="/supplier/goods/example.html" target="_blank" class="p" v-if="!(isPC)">查看示例</a>
                             </div>