forgeplus-react/src/softbot/softBotList/index.scss

150 lines
3.1 KiB
SCSS

.botListBox, .botList, .oneItemHead{
display: flex;
}
.softheadContent, .botListBox, .botListPagination{
width: 1200px;
margin: 0 auto;
}
.softbotBox{
background-color:#f5f7fa;
padding-bottom: 70px;
}
.softbotHead{
height:460px;
background-image:linear-gradient(94.79deg,rgba(63, 65, 88, 0.52) 0%,#3d404f 100%);
.bigTit{
color: white;
font-size: 38px;
text-align: center;
}
.softheadContent{
padding: 50px 0 100px;
}
.gotoRegister{
display: block;
margin: 40px auto 0;
border-radius: 0;
&:hover{
border: none;
}
}
}
.botListBox{
margin-top: 50px;
}
.botListNav{
width:218px;
background-image:linear-gradient(180deg,#f4f5f8 0%,#fbfcfd 100%);
border:2px solid #ffffff;
.navItem{
cursor: pointer;
color:#4c5b76;
padding: 15px 0 15px 35px;
&:first-child{
color:#000000;
}
&.active{
background-color:rgba(70, 106, 255, 0.09);
color: $primary-color;
position: relative;
&::before{
content: '';
width: 4px;
height: 35px;
background-color: $primary-color;
display: inline-block;
position: absolute;
left: 0;
}
}
}
}
.botListCont{
width: 100%;
padding: 30px 22px 80px 0px;
background-image:linear-gradient(180deg,#f3f5f8 0%,#ffffff 100%);
box-shadow:8px 6px 18px rgba(171, 202, 255, 0.24) inset;
.botListSearch{
.ant-input, .ant-input-search-button{
height: 42px;
}
.ant-input{
border-color: white;
background-color:#f8fbff !important;
&:hover{
border-color: $primary-color;
}
}
.ant-input-search-button{
width: 60px;
}
}
.oneBotItem{
cursor: pointer;
width: 297px;
background-color:#f4f5f8;
border:1px solid #ffffff;
border-radius:2px;
box-shadow:0px 0px 12px rgba(82, 101, 223, 0.09);
margin-left: 33px;
.oneItemHead{
align-items: center;
background-image: url('../image/botOneBg.png');
color:rgba(13, 22, 71, 0.65);
padding: 15px 0 16px 12px;
.oneBotName{
color:#151d40;
}
.oneBotImgBox{
width: 50px;
height: 50px;
line-height: 42px;
border-radius: 50%;
border:1px solid #ffffff;
margin-right: 15px;
overflow: hidden;
img{
max-width: 100%;
}
}
}
.botIntro{
margin: 14px 17px 10px 14px;
color:#8893af;
text-overflow: -o-ellipsis-lastline;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
line-clamp: 2;
-webkit-box-orient: vertical;
min-height: 56px;
}
.degreeBox{
color:#151d40;
padding: 0 0 12px 12px;
&>.icon-a-zu1404{
color: #4c5b76;
}
}
}
.botList{
flex-wrap: wrap;
justify-content: flex-start;
&>.none_panels{
margin: 0 auto;
}
.botLoading{
margin: 200px auto;
}
}
}
.botListPagination{
text-align: right;
}
.oneBotLine{
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
flex: 0.8;
}