聊天框完成

This commit is contained in:
luyuan 2020-11-20 09:56:35 +08:00
parent 2fb1fc2031
commit f0494d4de3
Signed by: theluyuan
GPG Key ID: A7972FD973317FF3
3 changed files with 99 additions and 2 deletions

BIN
public/img/fasong.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.4 KiB

1
public/js/tim-js.js Normal file

File diff suppressed because one or more lines are too long

View File

@ -18,9 +18,61 @@
margin-top: 28px; margin-top: 28px;
height: 240px; height: 240px;
margin-left: 10px; margin-left: 10px;
width: ceil(100% - 10px); width: 98%;
background-color: #fff; background-color: #fff;
border-radius: 17px;
padding: 24px 28px 14px 28px !important;
display: flex;
flex-direction: column;
} }
.wenzi{
width: 100%;
display: flex;
flex-direction: column;
height: 100%;
overflow-y: auto;
}
.wenzi > div{
width: 100%;
font-size: 11px;
}
.wenzi > div >p:first-child {
margin-right: 33px;
}
.wenzi > div >p span{
color: #08AE98;
}
.fasongkuang{
width: 100%;
height: 47px;
display: flex;
align-items: flex-end;
justify-content: space-between;
flex-shrink: 0;
border-top: 1px solid #DCDFE0;
}
.fasongkuang input{
font-size: 11px;
color: #333;
width: 600px;
border: none;
}
.fasonganniu{
display: flex;
font-size: 11px;
color: #08AE98;
align-items: center;
}
.fasonganniu img{
width: 15px;
height: 12px;
}
.fasongkuang input::placeholder{
font-size: 11px;
}
.fasongkuang input:focus{ border: none; background: #fff; outline: none;}
</style> </style>
</head> </head>
@ -324,7 +376,51 @@
</div> </div>
</div> </div>
<div class="liaotian"> <div class="liaotian">
<div class="wenzi">
<div>
<p>00:00:00</p>
<p><span>andy:</span>asdhjfhujaksdhfjkasdjhhjasjhfhjkas</p>
</div>
<div>
<p>00:00:00</p>
<p><span>andy:</span>asdhjfhujaksdhfjkasdjhhjasjhfhjkas</p>
</div>
<div>
<p>00:00:00</p>
<p><span>andy:</span>asdhjfhujaksdhfjkasdjhhjasjhfhjkas</p>
</div>
<div>
<p>00:00:00</p>
<p><span>andy:</span>asdhjfhujaksdhfjkasdjhhjasjhfhjkas</p>
</div>
<div>
<p>00:00:00</p>
<p><span>andy:</span>asdhjfhujaksdhfjkasdjhhjasjhfhjkas</p>
</div>
<div>
<p>00:00:00</p>
<p><span>andy:</span>asdhjfhujaksdhfjkasdjhhjasjhfhjkas</p>
</div>
<div>
<p>00:00:00</p>
<p><span>andy:</span>asdhjfhujaksdhfjkasdjhhjasjhfhjkas</p>
</div>
<div>
<p>00:00:00</p>
<p><span>andy:</span>asdhjfhujaksdhfjkasdjhhjasjhfhjkas</p>
</div>
<div>
<p>00:00:00</p>
<p><span>andy:</span>asdhjfhujaksdhfjkasdjhhjasjhfhjkas</p>
</div>
</div>
<div class="fasongkuang">
<input type="text" placeholder="直播说点什么吧" >
<div class="fasonganniu">
发送
<img src="./img/fasong.png" alt="">
</div>
</div>
</div> </div>
<!-- 小视频 --> <!-- 小视频 -->
</div> </div>