Apache2-UploadProgress

 view release on metacpan or  search on metacpan

examples/css/progress_bluebar.css  view on Meta::CPAN

.progressmeter td {
    text-align: left;
}

.finished {
    color: #667799;
}

.progressmeter .meter {
    position: relative;
    background: url('data:image/gif;base64,R0lGODlhAQAUAMQAAO3t7fHx8e/v7+zs7O7u7uTk5NnZ2fv7+////+Hh4fr6+oyMjPLy8uvr6/f39/Dw8Hl5eQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAAAAAAALAAAAAABABQAAAUR4BIMAEAIwpMUTeAoBwIZTAgAOw==') repe...
    background-color: lightgrey;
    border-left: 1px solid grey;
    border-right: 1px solid grey;
    margin-top: 5px;
    margin-bottom: 5px;
    height: 18px;
    width: 300px;
}

.progressmeter .meter .amount {
    background: url('data:image/gif;base64,R0lGODlhEAAUAPcAACtBUPLy8idFZyxCUFWV41ub5WKe5rLo/yZEZyZEZvHx8fDx8l+b5dnZ2VqZ5U2L32a1+lua5ViY5C122Sx02F+e5l2c5jN9316b5FST4jaC3lWm9Ya07FGQ4V6c5TJ73VSU41Gi8keW7tbX2HK//PHx8idEZ1Ok84y67liV4tfY2Iq37Yi27FuY4zqG4m6...
    background-color: #667799;
    width: 0px;
    height: 18px
}

.progressmeter .meter .percent {
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 1000;
    height: 18px;

examples/css/progress_blueblock.css  view on Meta::CPAN

.progressmeter td {
    text-align: left;
}

.finished {
    color: #667799;
}

.progressmeter .meter {
    position: relative;
    background: url('data:image/gif;base64,R0lGODlhEwAYAIACAM7O+v///ywAAAAAEwAYAAACLoyPqcsID6N0skJqK85x8+d9ITdmpXVqxzet7OW+QNoaMhi/dJezO2y7NYbEYQEAOw==') repeat-x;
    margin-top: 5px;
    margin-bottom: 5px;
    width: 285px;
    height: 24px
}

.progressmeter .meter .amount {
    background: url('data:image/gif;base64,R0lGODlhEwAYAIACAJeX/////ywAAAAAEwAYAAACLoyPqcsID6N0skJqK85x8+d9ITdmpXVqxzet7OW+QNoaMhi/dJezO2y7NYbEYQEAOw==') repeat-x;
    width: 0px;
    height: 24px
}

.progressmeter .meter .percent {
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 1000;
    height: 24px;

extra/progress.css  view on Meta::CPAN

.progressmeter td {
    text-align: left;
}

.finished {
    color: #667799;
}

.progressmeter .meter {
    position: relative;
    background-color: lightgrey;
    border: 2px solid #667799;
    height: 20px;
    width: 380px;
}

.progressmeter .meter .amount {
    background-color: #667799;
    width: 0px;
    height: 20px
}

.progressmeter .meter .percent {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 20px;



( run in 0.862 second using v1.01-cache-2.11-cpan-f56aa216473 )