Files
guild_front/src/components/VacancyItem/vacancyItem.scss
2024-07-21 16:37:39 +03:00

113 lines
1.9 KiB
SCSS

.vacancy__item {
display: flex;
flex-direction: column;
max-width: 325px;
width: 100%;
position: relative;
&__head {
display: flex;
flex-direction: column;
background: white;
border: 1px solid #DDDFE4;
border-radius: 8px;
padding: 24px 20px 8px;
z-index: 2;
}
&__title {
display: flex;
align-items: center;
column-gap: 18px;
h4 {
font-weight: 500;
color: #2E3A59;
font-size: 20px;
margin-bottom: 0;
}
}
&__img {
background: #52B709;
border-radius: 4px;
width: 24px;
height: 24px;
display: flex;
justify-content: center;
align-items: center;
}
&__description {
margin-top: 10px;
color: #2E3A59;
font-size: 14px;
line-height: 17.5px;
}
&__block {
display: flex;
position: relative;
top: -12px;
z-index: 1;
&--left {
background: #EBEBEB;
border: 1px solid #DDDFE4;
border-radius: 8px;
display: flex;
flex-direction: column;
width: 100%;
padding: 20px 20px 12px;
row-gap: 14px;
}
&--right {
background: #EBEBEB;
border: 1px solid #DDDFE4;
border-radius: 8px;
display: flex;
flex-direction: column;
width: 100%;
padding: 20px 20px 12px;
row-gap: 14px;
height: 70%;
}
}
&__info {
color: #000000;
font-size: 14px;
span {
font-weight: 700;
}
}
&__more {
font-size: 12px;
text-decoration: underline;
max-width: 97px;
cursor: pointer;
color: #000000;
&:hover {
color: #000000;
}
}
&__btn {
position: absolute;
max-width: 150px;
width: 100%;
border: none;
background: #52B709;
border-radius: 44px;
right: 5px;
padding: 10px 0;
font-size: 14px;
color: #FFFFFF;
bottom: 17px;
cursor: pointer;
z-index: 3;
}
}