etan39
/
cloudstack
mirror of https://github.com/apache/cloudstack.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Instance wizard: style progress state

This commit is contained in:
Brian Federle 2013-10-08 15:10:14 -07:00
parent 0555a5241f
commit b1cac7a133
2 changed files with 38 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
ui/scripts/ui-custom/instanceWizard.js
View File

@ -850,9 +850,13 @@
// Update progress bar
var $targetProgress = $progress.removeClass('active').filter(function() {
return $(this).index() <= targetIndex;
return $(this).index() === targetIndex;
}).toggleClass('active');
$progress.removeClass('done').filter(function() {
return $(this).index() < $targetProgress.index();
}).toggleClass('done');
// Update diagram; show/hide as necessary
$diagramParts.filter(function() {
return $(this).index() <= targetIndex;

42
ui/stylesheets/csui/_wizard.scss
View File

@ -24,24 +24,48 @@
.progress {
@include span-columns(3);
border: 1px solid #ccc;
border-radius: 6px;
box-shadow: inset 0px 0px 20px #ccc;
border-right: 1px solid #ccc;
box-shadow: 2px -1px 5px #ccc;
ul {
padding: 5px 0 0 20px;
li {
list-style: none;
margin-top: 10px;
&.active {
font-weight: bold;
}
color: gray;
.number {
font-size: 18px;
padding: 0 6px;
border-radius: 100%;
font-size: 14px;
margin-right: 10px;
color: lighten(black, 25%);
text-shadow: 0px 0px 1px black;
color: white;
background: #ccc;
}
&.active {
color: black;
.number {
@include radial-gradient(circle at 90% 10%, darken(#ccc, 15%), darken(#ccc, 45%));
}
}
&.done {
color: black;
&:before {
@include icon($ok);
margin: 0 10px 0px 5px;
font-size: 14px;
color: green;
}
.number {
display: none;
}
}
}
}