更新 'templates/optim.html'

templates/optim.html

@@ -133,6 +133,18 @@ tr:nth-child(even) {
       $('.progress-fill span').each(function(){
         var percent = $(this).html();
         $(this).parent().css('width', percent);
+      });
+       $('.progress-fill2 span').each(function(){
+        var percent = $(this).html();
+        $(this).parent().css('width', percent);
+      });
+        $('.progress-fill3 span').each(function(){
+        var percent = $(this).html();
+        $(this).parent().css('width', percent);
+      });
+         $('.progress-fill4 span').each(function(){
+        var percent = $(this).html();
+        $(this).parent().css('width', percent);
       });
         });</script>
     <style>
@@ -161,10 +173,46 @@ tr:nth-child(even) {
 
 .horizontal .progress-fill {
   position: relative;
-  background: #666;
+  background:  #2883fa;
+  height: 20px;
+  width: 50%;
+  color: #080707;
+  text-align: center;
+  font-family: "Lato","Verdana",sans-serif;
+  font-size: 12px;
+  line-height: 20px;
+}
+
+.horizontal .progress-fill2 {
+  position: relative;
+  background: #ba711e;
+  height: 20px;
+  width: 50%;
+  color: #080707;
+  text-align: center;
+  font-family: "Lato","Verdana",sans-serif;
+  font-size: 12px;
+  line-height: 20px;
+}
+
+.horizontal .progress-fill3 {
+  position: relative;
+  background: #3dba1e;
+  height: 20px;
+  width: 50%;
+  color: #080707;
+  text-align: center;
+  font-family: "Lato","Verdana",sans-serif;
+  font-size: 12px;
+  line-height: 20px;
+}
+
+.horizontal .progress-fill4 {
+  position: relative;
+  background: #f0ff1f;
   height: 20px;
   width: 50%;
-  color: #fff;
+  color: #080707;
   text-align: center;
   font-family: "Lato","Verdana",sans-serif;
   font-size: 12px;
@@ -187,22 +235,12 @@ tr:nth-child(even) {
     </style>>
 <div class="container horizontal flat">
   <h2>測試驗證</h2>
-  <div class="progress-group">
-    <div class="progress-label">測試</div>
-    <div class="progress-bar horizontal">
-      <div class="progress-track">
-        <div class="progress-fill">
-          <span>100%</span>
-        </div>
-      </div>
-    </div>
-  </div>
   <div class="progress-group">
     <div class="progress-label">水流量</div>
     <div class="progress-bar horizontal">
       <div class="progress-track">
         <div class="progress-fill">
-          <span>75%</span>
+          <span>100%</span>
         </div>
       </div>
     </div>
@@ -211,8 +249,8 @@ tr:nth-child(even) {
     <div class="progress-label">風扇數</div>
     <div class="progress-bar horizontal">
       <div class="progress-track">
-        <div class="progress-fill">
-          <span>60%</span>
+        <div class="progress-fill2">
+          <span>75%</span>
         </div>
       </div>
     </div>
@@ -221,8 +259,8 @@ tr:nth-child(even) {
     <div class="progress-label">濕求溫度</div>
     <div class="progress-bar horizontal">
       <div class="progress-track">
-        <div class="progress-fill">
-          <span>20%</span>
+        <div class="progress-fill3">
+          <span>60%</span>
         </div>
       </div>
     </div>
@@ -231,11 +269,10 @@ tr:nth-child(even) {
     <div class="progress-label">熱水溫度</div>
     <div class="progress-bar horizontal">
       <div class="progress-track">
-        <div class="progress-fill">
-          <span>34%</span>
+        <div class="progress-fill4">
+          <span>20%</span>
         </div>
       </div>
     </div>
   </div>
-
 {% endblock %}