add waterfall pic wall

This commit is contained in:
Jianqi Jin
2023-09-26 19:42:02 -05:00
5 changed files with 109 additions and 162 deletions

View File

@ -33,7 +33,7 @@
justify-content: start;
}
.projects__title {
margin: 20px 0 0 20px;
margin: 20px 0 20px 20px;
font-family: itrFontMedium;
color: #fff;
text-align: center;
@ -49,8 +49,10 @@
width: 100vw;
height: auto;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
padding-top: 24px;
}
.project__content__main__container {
@ -58,7 +60,6 @@
border-radius: 10px;
background-color: rgb(66, 66, 66);
box-sizing: border-box;
height: auto;
display: flex;
flex-direction: column;
transition: 0.3s;

View File

@ -1,20 +1,7 @@
#react-waterfall-comps li > div {
transition: all 0.5s;
position: relative;
border-radius: 10px;
background-color: rgb(66, 66, 66);
padding: 10px;
.waterfallContainer {
display: flex;
flex-direction: column;
transition: 0.3s;
cursor: pointer;
}
#react-waterfall-comps li > div:hover {
transform: translateY(-6px);
box-shadow: 0 30px 50px rgba(0, 0, 0, 0.3);
transition: all 0.3s;
background-color: #666666;
}
#react-waterfall-comps li > div > img {
width: 100%;
}
flex-wrap: wrap;
.waterfallItem {
margin: 3px;
}
}