73 lines
1.1 KiB
CSS
73 lines
1.1 KiB
CSS
.project-card {
|
|
display: flex;
|
|
flex-direction: column;
|
|
flex-wrap: wrap;
|
|
/* background-color: aqua; */
|
|
}
|
|
|
|
.project-card img {
|
|
width: 96%;
|
|
height: 50svh;
|
|
align-self: center;
|
|
padding-top: 1svh;
|
|
}
|
|
|
|
.project-title-info {
|
|
display: flex;
|
|
flex-direction: row;
|
|
|
|
border-bottom: var(--underlineTitle);
|
|
width: 80%;
|
|
margin: 0px 4svw;
|
|
padding: 0px 4svw;
|
|
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
flex-wrap: nowrap;
|
|
}
|
|
.project-title-info h3 {
|
|
margin: 0px;
|
|
text-align: start;
|
|
white-space: nowrap;
|
|
align-self: center;
|
|
}
|
|
|
|
.project-title-info img {
|
|
height: 6svh;
|
|
}
|
|
|
|
.project-title-info div {
|
|
display: flex;
|
|
gap: 1svw;
|
|
justify-content: flex-end;
|
|
border-bottom: none;
|
|
}
|
|
|
|
.project-card div p {
|
|
display: flex;
|
|
width: 90%;
|
|
justify-self: center;
|
|
text-align: start;
|
|
}
|
|
|
|
.project-tech-logos {
|
|
display: flex;
|
|
flex-direction: row;
|
|
flex-wrap: wrap;
|
|
align-items: center;
|
|
align-self: center;
|
|
width: 90%;
|
|
justify-content: flex-start;
|
|
column-gap: calc((100% - (60px * 5)) / 4);
|
|
row-gap: 1svw;
|
|
|
|
padding-bottom: 1svh;
|
|
}
|
|
|
|
.project-tech-logos img {
|
|
aspect-ratio: 1;
|
|
max-width: 60px;
|
|
max-height: 60px;
|
|
flex: 0 1 19%;
|
|
}
|