blender/flamenco
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Setup Assistant: Style adjustments

Browse Source 
Style current and done step indicators slightly different.
Also on hover scale the indicator a bit, on non-disabled items.
This commit is contained in:
Pablo Vazquez 2022-07-21 19:55:07 +02:00 committed by Francesco Siddi
parent e11c73c798
commit c039a117fd
1 changed files with 7 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
web/app/src/views/FirstTimeWizardView.vue
View File

@ -456,8 +456,8 @@ export default {
position: absolute; position: absolute;
top: calc(50% - calc(var(--setup-progress-indicator-border-width) / 2)); top: calc(50% - calc(var(--setup-progress-indicator-border-width) / 2));
transform: translateY(-50%); transform: translateY(-50%);
background-color: var(--color-accent); background-image: linear-gradient(to right, var(--color-accent) 85%, var(--color-accent-text));
height: var(--wiz-progress-indicator-border-width); border-radius: 999rem;
height: var(--setup-progress-indicator-border-width); height: var(--setup-progress-indicator-border-width);
position: absolute; position: absolute;
transition: width 500ms ease-out; transition: width 500ms ease-out;
@ -467,7 +467,7 @@ export default {
/* Progress indicator dot. */ /* Progress indicator dot. */
.progress li span { .progress li span {
background-color: var(--color-background-column); background-color: var(--color-background);
border-radius: 50%; border-radius: 50%;
border: var(--setup-progress-indicator-border-width) solid var(--color-background); border: var(--setup-progress-indicator-border-width) solid var(--color-background);
box-shadow: 0 0 0 var(--setup-progress-indicator-border-width) var(--setup-progress-indicator-color); box-shadow: 0 0 0 var(--setup-progress-indicator-border-width) var(--setup-progress-indicator-color);
@ -487,6 +487,10 @@ export default {
cursor: not-allowed; cursor: not-allowed;
} }
.progress li:not(.disabled):hover span {
transform: scale(1.1);
}
.progress li.done span { .progress li.done span {
background-color: var(--setup-progress-indicator-color-done); background-color: var(--setup-progress-indicator-color-done);
box-shadow: 0 0 0 var(--setup-progress-indicator-border-width) var(--setup-progress-indicator-color-done); box-shadow: 0 0 0 var(--setup-progress-indicator-border-width) var(--setup-progress-indicator-color-done);