forked from Gitlink/forgeplus-react
85 lines
2.0 KiB
SCSS
85 lines
2.0 KiB
SCSS
.projectListBox{
|
||
width: 1200px;
|
||
margin: 0 auto;
|
||
position: relative;
|
||
z-index: 1;
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
// justify-content: space-between;
|
||
.projectItem{
|
||
position: relative;
|
||
width: 30%;
|
||
background-image: linear-gradient(180deg,rgba(232, 237, 255, 0.85) 0%,rgba(255, 255, 255, 0.85) 100%);
|
||
border: 1px solid;
|
||
border-color: #ffffff;
|
||
border-radius: 4px;
|
||
box-shadow:0px 0px 8px rgba(93, 131, 255, 0.26);
|
||
text-align: center;
|
||
margin-bottom: 50px;
|
||
background-image: url('../../img/projectBg.png');
|
||
background-size: 100% 100%;
|
||
margin-left: 5%;
|
||
&.firstBox{
|
||
margin-left: 0;
|
||
}
|
||
&:hover{
|
||
cursor: pointer;
|
||
background-image: none;
|
||
// #E8EDFF—#FFFFFF（85%）
|
||
background-image: linear-gradient(180deg,rgba(232, 237, 255, 0.85) 0%,rgba(255, 255, 255, 0.85) 100%);
|
||
}
|
||
.border{
|
||
height: 5px;
|
||
background-color:#657edf;
|
||
border-radius:2px 2px 0px 0px;
|
||
}
|
||
.projectLogoStar{
|
||
position: absolute;
|
||
top:30px;
|
||
right: 130px;
|
||
width: 28px;
|
||
z-index: 10;
|
||
transform: rotate(46deg);
|
||
}
|
||
.projectLogo{
|
||
position: relative;
|
||
width: 100px;
|
||
height: 100px;
|
||
border: 1px solid #fff;
|
||
background-color: #fff;
|
||
border-radius: 50%;
|
||
text-align: center;
|
||
overflow: hidden;
|
||
margin: 25px auto 10px;
|
||
line-height: 95px;
|
||
.projectLogoImg{
|
||
width: 100%;
|
||
// height: 100%;
|
||
// display: block;
|
||
}
|
||
|
||
}
|
||
.title{
|
||
color:#2a51bf;
|
||
font-size:17px;
|
||
line-height:30px;
|
||
margin-bottom: 15px;
|
||
padding: 0 50px;
|
||
white-space: nowrap;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
}
|
||
.intro{
|
||
color:#4f5d84;
|
||
font-size:15px;
|
||
margin-bottom: 15px;
|
||
display: -webkit-box;
|
||
overflow: hidden;
|
||
-webkit-line-clamp: 2;
|
||
-webkit-box-orient: vertical;
|
||
text-overflow: ellipsis;
|
||
text-align: left;
|
||
padding: 0 14px;
|
||
}
|
||
}
|
||
} |