Fix project steps layout
This commit is contained in:
parent
129b60f0b8
commit
fc8bda1667
1 changed files with 6 additions and 2 deletions
|
|
@ -45,11 +45,12 @@ const { stepsLabels, setStatus } = useProjectStore();
|
||||||
<style scoped>
|
<style scoped>
|
||||||
.project-item {
|
.project-item {
|
||||||
background: var(--color-background);
|
background: var(--color-background);
|
||||||
|
row-gap: 2.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.project-item hgroup {
|
.project-item hgroup {
|
||||||
flex: 1 1 0%;
|
flex: 1 1 0%;
|
||||||
min-width: 15rem;
|
min-width: 20rem;
|
||||||
}
|
}
|
||||||
.project-item h3 {
|
.project-item h3 {
|
||||||
font-family: var(--font-serif);
|
font-family: var(--font-serif);
|
||||||
|
|
@ -74,12 +75,14 @@ const { stepsLabels, setStatus } = useProjectStore();
|
||||||
.project-steps {
|
.project-steps {
|
||||||
--color: var(--color-primary-100);
|
--color: var(--color-primary-100);
|
||||||
--gap: var(--space-16);
|
--gap: var(--space-16);
|
||||||
flex: 0 1 0%;
|
flex: 1 1 0%;
|
||||||
display: flex;
|
display: flex;
|
||||||
gap: var(--gap);
|
gap: var(--gap);
|
||||||
margin-top: -2.75rem;
|
margin-top: -2.75rem;
|
||||||
position: relative;
|
position: relative;
|
||||||
min-width: max(55%, 45rem);
|
min-width: max(55%, 45rem);
|
||||||
|
width: 100%;
|
||||||
|
padding: 2rem 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.project-step {
|
.project-step {
|
||||||
|
|
@ -184,6 +187,7 @@ const { stepsLabels, setStatus } = useProjectStore();
|
||||||
--background: transparent;
|
--background: transparent;
|
||||||
color: transparent;
|
color: transparent;
|
||||||
}
|
}
|
||||||
|
|
||||||
.project-step[data-status="done"] .pill::after {
|
.project-step[data-status="done"] .pill::after {
|
||||||
mask-image: var(--icon-check-3);
|
mask-image: var(--icon-check-3);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue