Docker/portainer
Docker/portainer
1
0
Fork 0
mirror of https://github.com/portainer/portainer.git synced 2025-07-25 00:09:40 +02:00
Code Issues Releases Activity

feat(ui): portainer wizard ui change for ce EE-3576 (#7405)

Browse source 
* ui change for wizard
This commit is contained in:
Richard Wei 2022-08-12 08:43:01 +12:00 • committed by GitHub
parent a7ab0a5662
commit ee1ee633d7
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
33 changed files with 272 additions and 77 deletions
Download patch file Download diff file Expand all files Collapse all files

30
app/react/components/Stepper/Stepper.module.css
View file

@ -18,18 +18,18 @@
position: absolute;
content: '';
width: 100%;
top: 20px;
top: 15px;
left: -100%;
z-index: 2;
border-bottom: 5px solid var(--bg-stepper-item-counter);
border-bottom: 3px solid var(--border-stepper-color);
}
.step-wrapper::after {
position: absolute;
content: '';
border-bottom: 5px solid var(--bg-stepper-item-counter);
border-bottom: 3px solid var(--border-stepper-color);
width: 100%;
top: 20px;
top: 15px;
left: 0;
z-index: 2;
}
@ -46,11 +46,13 @@
display: flex;
justify-content: center;
align-items: center;
width: 40px;
height: 40px;
width: 30px;
height: 30px;
border-radius: 50%;
background: var(--bg-stepper-item-counter);
/* background: var(--ui-white); */
background: var(--bg-stepper-color);
margin-bottom: 6px;
border: 1px solid var(--ui-gray-6);
}
.step-wrapper.active {
@ -59,27 +61,29 @@
}
.step-wrapper.active .step {
background: #337ab7;
background: var(--bg-stepper-active-color);
border: 2px solid var(--ui-blue-8);
}
.step-wrapper.active .step-counter {
color: #fff;
color: var(--text-stepper-active-color);
}
.step-wrapper.completed .step {
background-color: #48b400;
background: var(--bg-stepper-active-color);
border: 2px solid var(--ui-blue-8);
}
.step-wrapper.completed .step-counter {
color: #fff;
color: var(--text-stepper-active-color);
}
.step-wrapper.completed::after {
position: absolute;
content: '';
border-bottom: 5px solid #48b400;
border-bottom: 3px solid var(--ui-blue-8);
width: 100%;
top: 20px;
top: 15px;
left: 0;
z-index: 3;
}