update meter tracker

This commit is contained in:
Darel
2018-03-29 10:06:07 +08:00
parent 9e3ea3f2e7
commit ce9d1714e2
5 changed files with 148 additions and 91 deletions
+81 -56
View File
@@ -793,8 +793,8 @@ section.container{
.meter-container{
position: relative;
width: 90%;
margin-left: 5%;
width: 100%;
padding: 10px;
}
/*end of part 8----------------------------------------------------*/
@@ -2827,90 +2827,115 @@ input[type=text]:disabled {
height: 100px;
}
.meter-tracker-bar {
width: 80%;
margin-left: 13.5%;
height: 10px;
width: 96%;
height: 4px;
background-color: #a9a9a9;
display: inline-block;
-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.1);
-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.1);
box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.1);
position: relative;
float: left;
}
.meter-tracker-bar .update-btn-first-back{
.meter-tracker-bar .update-txt-first{
position: absolute;
display: block;
width: 80px;
width: 25%;
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%;
bottom: -100%;
text-align: center;
line-height: 32px;
line-height: 10px;
right: 75%;
}
.meter-tracker-bar .update-txt-second{
position: absolute;
width: 25%;
height: 32px;
bottom: -100%;
text-align: center;
line-height: 10px;
right: 50%;
}
.meter-tracker-bar .update-txt-third{
position: absolute;
width: 25%;
height: 32px;
bottom: -100%;
text-align: center;
line-height: 10px;
right: 25%;
}
.meter-tracker-bar .update-txt-fourth{
position: absolute;
width: 25%;
height: 32px;
bottom: -100%;
text-align: center;
line-height: 10px;
right: 0%;
}
.meter-tracker-bar .update-txt-fixwall{
position: absolute;
width: 5%;
height: 32px;
bottom: -100%;
text-align: center;
line-height: 10px;
right: -5%;
}
.meter-tracker-bar .update-btn-first{
position: absolute;
display: block;
width: 32px;
height: 32px;
border-radius: 50%;
-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);
width: 15px;
height: 15px;
bottom: 0%;
background-color: #069;
right: 99%;
bottom: -100%;
border-radius: 100%;
text-align: center;
line-height: 32px;
line-height: 10px;
z-index: 1;
}
.meter-tracker-bar .update-btn-second{
position: absolute;
display: block;
width: 32px;
height: 32px;
border-radius: 50%;
-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);
width: 15px;
height: 15px;
bottom: 0%;
background-color: #069;
right: 67%;
bottom: -100%;
border-radius: 100%;
text-align: center;
line-height: 32px;
line-height: 10px;
z-index: 1;
}
.meter-tracker-bar .update-btn-third{
position: absolute;
display: block;
width: 32px;
height: 32px;
border-radius: 50%;
-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);
width: 15px;
height: 15px;
bottom: 0%;
background-color: #069;
right: 33%;
bottom: -100%;
border-radius: 100%;
text-align: center;
line-height: 32px;
line-height: 10px;
z-index: 1;
}
.meter-tracker-bar .update-btn-fourth{
position: absolute;
display: block;
width: 32px;
height: 32px;
border-radius: 50%;
-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);
width: 15px;
height: 15px;
bottom: 0%;
background-color: #069;
right: -1%;
bottom: -100%;
border-radius: 100%;
text-align: center;
line-height: 32px;
line-height: 10px;
z-index: 1;
}
.meter-tracker-bar .update-btn-completed{
position: absolute;
width: 15px;
height: 15px;
bottom: -100%;
background-color: #069;
border-radius: 100%;
text-align: center;
line-height: 10px;
right: 0%;
z-index: 1;
}
/*end of part 31----------------------------------------------------*/