From 84e64f06f1b75abd72eb2f380d07a40396826a9a Mon Sep 17 00:00:00 2001
From: Darel <fedrickdarel@gmail.com>
Date: Wed, 28 Mar 2018 15:53:49 +0800
Subject: [PATCH] up

---
 .vs/slnx.sqlite              | Bin 94208 -> 94208 bytes
 css/global.style.css         |  14 ++++++++++++++
 meter-progress-trackers.html |  24 ++++++++++++++++++++----
 3 files changed, 34 insertions(+), 4 deletions(-)

diff --git a/.vs/slnx.sqlite b/.vs/slnx.sqlite
index b60d22fae6c98fbc361c13b7028854b822074a93..1fc71b9e0cc4e05c0cc5a0094c329f78894b9282 100644
GIT binary patch
delta 558
zcmZp8z}oPDb%GQVhr~n~Cm^{o!CIe5>i_1s`qI9vH6K&C94GIs`NLWz(`%l*d0(xY
z6LTt?;b!&&CzzNmfDA=}c;?CW$5@S}{<ASNG6hQggHV4V)E@}-8$$hpP(LBmkIk9K
zW_L1Yun13Q4`4jY!J^M1%)r2EKHboXQF8m&07g0HddaQzTnwDz;*1=OOpIwoiMgp@
zf-{ieh?w%$I-s1QB3RBXzqF_%Be*2B0Ko#PIv^yuwHAj7+r<>O)&S+?<-sO|WMmel
zfDC{$I0Ka!HUkZ)#$muJpcAU5ZwX;kR9psBR*6H|TruU1xs&<VsZ5s&WvpS^S}}b_
zD5E^vOd;8gkzCXJ(io+-Uk_!}<zimU-aDN=fzgk12KyymX7&|8Zd3x}2VfX)V&0a@
z*vk~p#VpPQ4gjhD{LG3>2(L>0LrDGQW0q%vdqV0DNM&h3N@7WBNNPoi#9M^QpCFZP
nnMK7VAb(5!*#0J+@dOK#)UU}|JG^-r7!WFdZ|BQp{KNzR@#dp@

delta 515
zcmZp8z}oPDb%GQVd+9_OCm^{o!CIe5GI#S_eQ96T=-wJO-N}1v{;)>0pH2F=d0(xY
z6LT_~{bu$9Czu%RH!BL{Gi$LiGcpBA=0d0(2$c<?vLI9@gv!{Qd2Dtka~ezNboKzo
zvm9281`-Smtme}Vofsvze+^)iW1e2`!YItNsB*es5TjJR9G}pl3N8jlett#{MkYoU
z70FGKn{v4rIK{=m0%=8wxv5}+Gmv46nBt}!pq#usSS}<ZvnVCFB((s}0IJy_B)KUY
zhyLYa%A2x)a*B#z{lTfp(+`F)iYP7y>dC~RXO@`q#@xyL>r|#og)-JKZOWKFBa~5|
zZJLnm#z?N|eQAtR+pmW*>T)qJWM46zJ%Q1W^%5^LkQtZ2_<@O25*U74n75@e_A*UB
z5W&b5%EiSj&II<4q&E8{2Kf*KKbMbLo(b+1$sB%WMW)h%l*E$MkkpD2iMI%qnIM&J
mnMK7VAm2-7Y=4u^c!GsVGHY_y4sTut287D&?R>e6pO^pwHHxnQ

diff --git a/css/global.style.css b/css/global.style.css
index 6888b67..267dcc1 100644
--- a/css/global.style.css
+++ b/css/global.style.css
@@ -2838,6 +2838,20 @@ input[type=text]:disabled {
     position: relative;
     float: left;
 }
+.meter-tracker-bar .update-btn-first-back{
+    position: absolute;
+	display: block;
+	width: 80px;
+	height: 32px;
+	-webkit-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);
+	-moz-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);
+	box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);
+	background-color: #069;
+	right: 89%;
+	bottom: -400%;
+	text-align: center;
+	line-height: 32px;
+}
 .meter-tracker-bar .update-btn-first{
     position: absolute;
 	display: block;
diff --git a/meter-progress-trackers.html b/meter-progress-trackers.html
index 720816d..7dbc872 100644
--- a/meter-progress-trackers.html
+++ b/meter-progress-trackers.html
@@ -78,6 +78,9 @@
             <div class="form-row txt-center">
                 <div class="meter-tracker-bar">
                     <div id="meter-bar" style="background-color:#069; width:0; height:100%"></div>
+                    <label class="update-btn-first-back" style="display:none">
+                        <a>Order Date</a>
+                    </label>
                     <label class="update-btn-first fix">
                         <input id="firststep" type="submit" onclick="FirstStep()" style="display:none" />
                     </label>
@@ -85,10 +88,10 @@
                         <input id="secondstep" type="submit" onclick="SecondStep()" style="display:none" />
                     </label>
                     <label class="update-btn-third fix">
-                        <input id="secondstep" type="submit" onclick="ThirdStep()" style="display:none" />
+                        <input id="thirdstep" type="submit" onclick="ThirdStep()" style="display:none" />
                     </label>
                     <label class="update-btn-fourth fix">
-                        <input id="secondstep" type="submit" style="display:none" />
+                        <input id="fourthstep" type="submit" onclick="FourthStep()" style="display:none" />
                     </label>
                 </div>
             </div>
@@ -148,6 +151,19 @@
 
     <script>
         function FirstStep() {
+            var elem = document.getElementById("meter-bar");
+            var width = 30;
+            var id = setInterval(frame, 10);
+            function frame() {
+                if (width >= 0) {
+                    clearInterval(id);
+                } else {
+                    width--;
+                    elem.style.width = width + '%';
+                }
+            }
+        }
+        function SecondStep() {
             var elem = document.getElementById("meter-bar");
             var width = 0;
             var id = setInterval(frame, 10);
@@ -160,7 +176,7 @@
                 }
             }
         }
-        function SecondStep() {
+        function ThirdStep() {
             var elem = document.getElementById("meter-bar");
             var width = 30;
             var id = setInterval(frame, 10);
@@ -173,7 +189,7 @@
                 }
             }
         }
-        function ThirdStep() {
+        function FourthStep() {
             var elem = document.getElementById("meter-bar");
             var width = 60;
             var id = setInterval(frame, 10);