99 lines
2.1 KiB
CSS
99 lines
2.1 KiB
CSS
|
.property-card-wrapper {
|
||
|
|
width: 10.3vw;
|
||
|
|
min-height: 12.5vw;
|
||
|
|
|
||
|
|
max-height: fit-content;
|
||
|
|
|
||
|
|
margin-right: 1vw;
|
||
|
|
|
||
|
|
border-radius: 0.2vw;
|
||
|
|
box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
|
||
|
|
background-color: var(--light-border-color-2);
|
||
|
|
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
}
|
||
|
|
|
||
|
|
.property-card-wrapper:nth-child(4n) {
|
||
|
|
margin-right: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.property-card-wrapper > img {
|
||
|
|
height: 45%;
|
||
|
|
}
|
||
|
|
|
||
|
|
.property-card-wrapper > .property-card-details {
|
||
|
|
height: 55%;
|
||
|
|
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
|
||
|
|
padding: 0.3vw 0.6vw;
|
||
|
|
}
|
||
|
|
|
||
|
|
.property-card-wrapper > .property-card-details > .property-name, .property-card-wrapper > .property-card-details > .property-cost {
|
||
|
|
font-size: 0.55vw;
|
||
|
|
font-weight: 600;
|
||
|
|
color: var(--white-color);
|
||
|
|
padding: 0.08vw 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.property-card-wrapper > .property-card-details > .property-address {
|
||
|
|
font-size: 0.5vw;
|
||
|
|
font-weight: 500;
|
||
|
|
color: var(--light-border-color-8);
|
||
|
|
}
|
||
|
|
|
||
|
|
.property-card-wrapper > .property-card-details > .property-details {
|
||
|
|
margin-top: 0.3vw;
|
||
|
|
font-size: 0.38vw;
|
||
|
|
letter-spacing: 0.4px;
|
||
|
|
font-weight: 400;
|
||
|
|
color: var(--white-color);
|
||
|
|
|
||
|
|
width: 90%;
|
||
|
|
|
||
|
|
display: flex;
|
||
|
|
flex-direction: row;
|
||
|
|
flex-wrap: wrap;
|
||
|
|
|
||
|
|
row-gap: 0.3vw;
|
||
|
|
}
|
||
|
|
|
||
|
|
.property-card-wrapper > .property-card-details > .property-details > .each-tile {
|
||
|
|
border-radius: 0.1vw;
|
||
|
|
|
||
|
|
min-width: 2vw;
|
||
|
|
width: fit-content;
|
||
|
|
|
||
|
|
padding: 0.22vw 0.15vw 0.15vw 0.15vw;
|
||
|
|
margin-right: 0.2vw;
|
||
|
|
text-align: center;
|
||
|
|
|
||
|
|
background-color: var(--tile-color);
|
||
|
|
|
||
|
|
display: flex;
|
||
|
|
flex-direction: row;
|
||
|
|
}
|
||
|
|
|
||
|
|
.property-card-wrapper > .property-card-details > .property-details > .each-tile > i {
|
||
|
|
color: var(--less-light-border-color);
|
||
|
|
margin-right: 0.15vw;
|
||
|
|
padding-top: 0.08vw;
|
||
|
|
}
|
||
|
|
|
||
|
|
/** CARD HOVER BUTTON - start **/
|
||
|
|
.card-hover-button {
|
||
|
|
align-self: center;
|
||
|
|
background-color: var(--blue-color);
|
||
|
|
color: var(--white-color);
|
||
|
|
|
||
|
|
width: 100%;
|
||
|
|
padding-top: 0.05vw;
|
||
|
|
padding-bottom: 0.05vw;
|
||
|
|
border-radius: 0.2vw;
|
||
|
|
|
||
|
|
font-size: 0.6vw;
|
||
|
|
font-weight: 500;
|
||
|
|
}
|
||
|
|
/** CARD HOVER - end **/
|