From 8ac9d54b3f2a70300416f979a20825463c5cbfc2 Mon Sep 17 00:00:00 2001
From: 15008401624 <597081433@qq.com>
Date: Fri, 4 Dec 2020 13:51:55 +0800
Subject: [PATCH] =?UTF-8?q?=E6=A0=B7=E5=BC=8F=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 public/static/css/style.css | 20 +++++++++++---------
 view/article/products.html  | 11 ++++++++---
 2 files changed, 19 insertions(+), 12 deletions(-)

diff --git a/public/static/css/style.css b/public/static/css/style.css
index e0af9db..3d5fd8d 100644
--- a/public/static/css/style.css
+++ b/public/static/css/style.css
@@ -263,9 +263,9 @@ input,select,textarea{outline:medium none; resize: none;}
 .marketing-box2 .center-block ul li .top-box .pull-right{ font-size: 1rem; padding-right: 3.4375rem; position: relative; color: #999;}
 .marketing-box2 .center-block ul li .top-box .pull-right::after{ content: ''; width: 2.5rem; height: 2.5rem; background: url(../image/icon_jt3.png) no-repeat center; background-size: 100%; position: absolute; right: 0; top: 0; transition: all .6s;}
 .marketing-box2 .center-block ul li .lower-box{ padding: 0 1.875rem 1.875rem; display: none;}
-.marketing-box2 .center-block ul li .lower-box .table{ margin: auto;}
-.marketing-box2 .center-block ul li .lower-box .table td,.marketing-box2 .center-block ul li .lower-box .table th{ vertical-align: middle; border-width: 0.125rem; text-align: center;}
-.marketing-box2 .center-block ul li .lower-box .table th{ padding: 1.5rem 8px;}
+.marketing-box2 .center-block ul li .lower-box table{ width: 100%; margin: auto;}
+.marketing-box2 .center-block ul li .lower-box table td,.marketing-box2 .center-block ul li .lower-box table th{ vertical-align: middle; border-width: 0.125rem; text-align: center; border: 1px solid #d9d9d9;}
+.marketing-box2 .center-block ul li .lower-box  th{ padding: 1.5rem 8px;}
 .marketing-box2 .center-block ul li.active{ box-shadow: 5px 5px 10px rgba(0,0,0,0.2);}
 .marketing-box2 .center-block ul li.active .top-box .pull-right::after{ transform: rotate(90deg);}
 
@@ -342,8 +342,10 @@ input,select,textarea{outline:medium none; resize: none;}
 
 .pager{ margin: 3rem 0 0;}
 
-
-
+.product-box .layui-form{ padding: 0 20%;}
+.product-box .layui-form .layui-input,.product-box .layui-form .layui-form-select{ width: 100%; margin: 0 15px;}
+.product-box .layui-form .layui-btn{ width: 30%;}
+.layui-form-select dl dd.layui-this{ background: #1E9FFF;}
 
 
 
@@ -474,7 +476,7 @@ input,select,textarea{outline:medium none; resize: none;}
     .marketing-box2 .center-block ul li .top-box{ padding: 1rem 0;}
     .marketing-box2 .center-block ul li .top-box .pull-left i{ width: 3rem;}
     .marketing-box2 .center-block ul li .lower-box{ padding: 0 0 1rem; overflow: auto;}
-    .marketing-box2 .center-block ul li .lower-box .table td,.marketing-box2 .center-block ul li .lower-box .table th{ white-space: nowrap; padding: 1rem;}
+    .marketing-box2 .center-block ul li .lower-box table td,.marketing-box2 .center-block ul li .lower-box table th{ white-space: nowrap; padding: 1rem;}
     
     .news-box1{ padding: 2rem 0;}
     .news-box1 .center-block ul li a{ margin-top: 1.5rem; padding: 1rem;}
@@ -512,9 +514,9 @@ input,select,textarea{outline:medium none; resize: none;}
     .product-box .center-block ul li:nth-child(2n){ float: right;}
     .product-box .center-block ul li a span{ height: 12rem;}
     
-    
-    
-    
+    .product-box .layui-form{ display: block; padding: 0;}
+    .product-box .layui-form .layui-input, .product-box .layui-form .layui-form-select{ margin: 0 0 0.8rem;}
+    .product-box .layui-form .layui-btn{ width: 100%;}
     
 }
 @media screen and (max-width:768px){
diff --git a/view/article/products.html b/view/article/products.html
index 92acf52..4370fdf 100644
--- a/view/article/products.html
+++ b/view/article/products.html
@@ -13,7 +13,7 @@
 <div class="all-center-box">
     <div class="product-box w-100">
         <div class="w-1200">
-            <form action="{:url('products')}" method="get">
+            <form action="{:url('products')}" class="layui-form between-center w-100" method="get">
                 <select name="category_id">
                     <option value="{$topCategory.id}">产品选择</option>
                     {if isset($categoryChildren) && count($categoryChildren) >0}
@@ -22,9 +22,14 @@
                     {/foreach}
                     {/if}
                 </select>
-                <input name="keyword" placeholder="关键词查询..."/>
-                <button type="submit">查询</button>
+                <input name="keyword" class="layui-input" placeholder="关键词查询..."/>
+                <button type="submit" class="layui-btn layui-btn-normal">查询</button>
             </form>
+            <script type="text/javascript">
+                 layui.use(['layer', 'form', 'element'], function(){
+                      var layer = layui.layer,form = layui.form,element = layui.element;
+                    });
+            </script>
         </div>
         <div class="w-1200">
             {if isset($items)}