13

public/stylesheets/project.css

@@ -403,6 +403,81 @@
   cursor: pointer;
 }
 /* .modal-box end */
+/* .modal-box-success start */
+.modal-box-success {
+  display: none;
+  top: 0;
+  left: 0;
+  bottom: 0;
+  right: 0;
+  background: rgba(0, 0, 0, 0.3);
+  z-index: 999;
+  position: fixed;
+}
+.modal-box-success .modal-dialog {
+  position: fixed;
+  left: 50%;
+  top: 50%;
+  margin-top: -200px;
+  margin-left: -250px;
+  width: 500px;
+  height: 400px;
+  background: #fff;
+  border-radius: 10px;
+  overflow: hidden;
+}
+.modal-box-success .modal-dialog div:nth-child(1) {
+  width: 100%;
+  height: 80px;
+  background: #ff4a4b;
+  position: relative;
+}
+.modal-box-success .modal-dialog div:nth-child(1) h4 {
+  line-height: 80px;
+  font-size: 30px;
+  color: #fff;
+  padding-left: 50px;
+}
+.modal-box-success .modal-dialog div:nth-child(1) a {
+  display: inline-block;
+  width: 46px;
+  height: 46px;
+  line-height: 46px;
+  text-align: center;
+  border-radius: 50%;
+  border: 3px solid #fff;
+  font-size: 42px;
+  position: absolute;
+  right: 27px;
+  top: 15px;
+  cursor: pointer;
+  color: #fff;
+}
+.modal-box-success .modal-dialog div:nth-child(2) {
+  position: relative;
+}
+.modal-box-success .modal-dialog div:nth-child(2) i {
+  display: inline-block;
+  width: 69px;
+  height: 69px;
+  background: url(https://res.fudou6.com/c/4/20160730/e86YXBwb2ludG1lbnQtc3VjY2VzcyA=_69x69.png) no-repeat;
+  position: absolute;
+  left: 90px;
+  top: 8px;
+}
+.modal-box-success .modal-dialog div:nth-child(2) h3 {
+  font-size: 50px;
+  font-weight: bold;
+  color: #ff4a4a;
+  margin: 43px 0;
+  padding-left: 180px;
+}
+.modal-box-success .modal-dialog p {
+  font-size: 24px;
+  line-height: 28px;
+  text-align: center;
+}
+/* .modal-box-success end */
 @media screen and (min-width: 769px) {
   body .hot-project-introducer {
     width: 990px;

public/stylesheets/project.less

@@ -505,6 +505,88 @@
 
 /* .modal-box end */
 
+/* .modal-box-success start */
+
+.modal-box-success {
+  display: none;
+  top: 0;
+  left: 0;
+  bottom: 0;
+  right: 0;
+  background: rgba(0, 0, 0, 0.3);
+  z-index: 999;
+  position: fixed;
+  .modal-dialog {
+    position: fixed;
+    left: 50%;
+    top: 50%;
+    margin-top: -200px;
+    margin-left: -250px;
+    width: 500px;
+    height: 400px;
+    background: #fff;
+    border-radius: 10px;
+    overflow: hidden;
+    div {
+      &:nth-child(1) {
+        width: 100%;
+        height: 80px;
+        background: #ff4a4b;
+        position: relative;
+        h4 {
+          line-height: 80px;
+          font-size: 30px;
+          color: #fff;
+          padding-left: 50px;
+        }
+        a {
+          display: inline-block;
+          width: 46px;
+          height: 46px;
+          line-height: 46px;
+          text-align: center;
+          border-radius: 50%;
+          border: 3px solid #fff;
+          font-size: 42px;
+          position: absolute;
+          right: 27px;
+          top: 15px;
+          cursor: pointer;
+          color: #fff;
+        }
+      }
+      &:nth-child(2) {
+        position: relative;
+        i {
+          display: inline-block;
+          width: 69px;
+          height: 69px;
+          background: url(https://res.fudou6.com/c/4/20160730/e86YXBwb2ludG1lbnQtc3VjY2VzcyA=_69x69.png) no-repeat;
+          position: absolute;
+          left: 90px;
+          top: 8px;
+        }
+        h3 {
+          font-size: 50px;
+          font-weight: bold;
+          color: #ff4a4a;
+          margin: 43px 0;
+          padding-left: 180px;
+        }
+      }
+    }
+
+    p {
+      font-size: 24px;
+      line-height: 28px;
+      text-align: center;
+    }
+
+  }
+}
+
+/* .modal-box-success end */
+
 .screen() {
   .media(@screen-width-small, @container-width-small);
   .media(@screen-width, @container-width);

views/product.hbs

@@ -159,7 +159,7 @@
         </div>
         <div>
             <i></i>
-            <h3>恭喜你预约成功</h3>
+            <h3>恭喜你预约成功!</h3>
         </div>
         <p>富豆工作人员将第一时间与您取得联系!</p>
     </div>

views/project.hbs

@@ -111,4 +111,18 @@
         <img src="/images/hot_project/success.jpg">
         <a href="javascript:void('close');" class="modal-dialog-close">&times;</a>
     </div>
+</div>
+<div class="modal-box-success">
+    <div class="modal-dialog">
+        <div>
+            <h4>优质项目介绍</h4>
+            <a href="javascript:void('close');" class="modal-dialog-close">&times;</a>
+        </div>
+        <div>
+            <i></i>
+            <h3>提交成功!</h3>
+        </div>
+        <p>富豆工作人员将第一时间与您取得联系!</p>
+
+    </div>
 </div>
\ No newline at end of file