Justin Edmund
2d368c32cc
We added a (...) button next to each editable job skill that opens a context menu that will allow the user to remove the job skill. An alert is presented to make sure the user is sure before proceeding. As part of this change, some minor restyling of JobSkillItem was necessary
64 lines
1 KiB
SCSS
64 lines
1 KiB
SCSS
#Job {
|
|
box-sizing: border-box;
|
|
display: flex;
|
|
margin-bottom: $unit-3x;
|
|
width: 100%;
|
|
|
|
// prettier-ignore
|
|
@media only screen
|
|
and (max-width: 800px)
|
|
and (max-height: 920px)
|
|
and (-webkit-min-device-pixel-ratio: 2) {
|
|
align-items: center;
|
|
flex-direction: column;
|
|
gap: $unit;
|
|
justify-content: center;
|
|
width: 100%;
|
|
// max-width: 447px;
|
|
}
|
|
|
|
select {
|
|
flex-grow: 1;
|
|
width: auto;
|
|
}
|
|
|
|
.JobDetails {
|
|
box-sizing: border-box;
|
|
display: flex;
|
|
flex-direction: column;
|
|
width: 100%;
|
|
|
|
.JobName {
|
|
align-items: center;
|
|
display: flex;
|
|
gap: $unit-half;
|
|
padding: $unit 0 $unit * 2;
|
|
|
|
h3 {
|
|
font-size: $font-medium;
|
|
font-weight: $medium;
|
|
}
|
|
|
|
img {
|
|
width: $unit-4x;
|
|
}
|
|
}
|
|
|
|
select {
|
|
flex-grow: 0;
|
|
}
|
|
|
|
.JobSkills {
|
|
flex-grow: 2;
|
|
}
|
|
}
|
|
|
|
.JobSkills {
|
|
display: flex;
|
|
flex-direction: column;
|
|
|
|
&:not(.editable) {
|
|
gap: $unit;
|
|
}
|
|
}
|
|
}
|