first commit

项目合集/聊天室/chat_fontend/.pydio

@@ -0,0 +1 @@
+c857a816-a71e-4dd2-a923-e802fd34bd65

项目合集/聊天室/chat_fontend/css/.pydio

@@ -0,0 +1 @@
+c5aef08e-feed-4b98-a160-6b5a7e140d0c

项目合集/聊天室/chat_fontend/css/clear.css

@@ -0,0 +1,13 @@
+body,p,h1,h2,h3,h4,h5,h6,ul,li {
+    margin: 0;
+    padding: 0;
+    list-style: none;
+}
+
+a {
+    text-decoration: none;
+}
+
+input {
+    outline: none;
+}

项目合集/聊天室/chat_fontend/css/index.css

@@ -0,0 +1,222 @@
+.main {
+    width: 900px;
+    height: 650px;
+    position: absolute;
+    left: 50%;
+    top: 50%;
+    transform: translate(-50%,-50%);
+    border-radius: 10px;
+    box-shadow: 0px 0px 17px #e7e5e5;
+    background: #fff;
+}
+.main_header {
+    height: 55px;
+    background: #e7e6e6;
+    width: 100%;
+    border-top-left-radius: 10px;
+    border-top-right-radius: 10px;
+    display: flex;
+    align-items: center;
+    justify-content: flex-end;
+    padding: 0 15px;
+}
+.main_header img{
+    width: 35px;
+    height: 35px;
+    border-radius: 100%;
+    margin-left: 10px;
+}
+.main_header span{}
+
+.main_header {}
+.main_content {
+    display: flex;
+    height: calc(650px - 55px - 100px);
+}
+.left_chat {
+    width: 80%;
+    padding: 10px 15px 0 10px;
+    overflow-y: scroll;
+}
+.left_chat li {
+    display: flex;
+    width: 100%;
+    margin-bottom: 30px;
+}
+.left_chat li .tx{
+    width: 40px;
+    height: 40px;
+    border-radius: 100%;
+    margin-right: 10px;
+}
+.c_text img {
+    max-width: 100%;
+}
+
+.left_chat li .r_text p{
+    color: #777;
+    margin-bottom: 8px;
+}
+.c_text {
+    font-size: #000;
+    background: #f3f3f3;
+    padding: 10px;
+    border-radius: 10px;
+}
+
+.right_list {
+    width: 20%;
+    background: #f6f7f9;
+    display: flex;
+    flex-direction: column;
+    padding: 10px;
+    overflow-y: scroll;
+    padding-bottom: 0;
+}
+
+.right_list li {
+    width: 100%;
+    margin-bottom: 12px;
+}
+.right_list li span{
+    color: #777;
+}
+.right_list img {
+    width: 30px;
+    height: 30px;
+    border-radius: 100%;
+}
+.main_input {
+    height: calc(100% - 55px - 495px);
+    display: flex;
+    flex-direction: column;
+}
+.tools {
+    height: 30px;
+    background: white;
+    border-top: 1px solid #f3eded;
+    display: flex;
+    align-items: center;
+    padding: 0 11px;
+    justify-content: flex-start;
+}
+.tools i {
+    margin-right: 15px;
+    position: relative;
+}
+.icon-smile .emoji,
+.gif {
+    position: absolute;
+    width: 0;
+    height: 0;
+    background: #fff;
+    top: -213px;
+    left: 0;
+    overflow-y: scroll;
+    padding: 5px;
+    padding-right: 0;
+    display: flex;
+    flex-wrap: wrap;
+    box-shadow: 0px 0px 17px #e7e5e5;
+    border-radius: 4px;
+}
+.gif {
+    width: 0;
+    height: 0;
+    display: inline-block !important;
+    font-size: 0;
+}
+.gif img {
+    width: 50px;
+    height: 50px;
+}
+.emoji span {
+    width: 22px;
+    height: 22px;
+    line-height: 22px;
+    text-align: center;
+}
+.font,
+.qipao{
+    line-height: 40px;
+    position: absolute;
+    width: 710px;
+    left: -71px;
+    top: -49px;
+    background: #f5f4f4;
+    height: 40px;
+    align-items: center;
+    padding-left: 7px;
+    display: none;
+}
+.qipao {
+    left: -129px;
+    top: -48px;
+}
+.font select {
+    height: 23px;
+    margin-right: 10px;
+    font-size: 12px;
+}
+.tools .icon-zhendong {
+    font-size: 14px;
+}
+.main_input textarea {
+    flex: 1;
+    resize: none;
+    border: none;
+    border-bottom-left-radius: 10px;
+    border-bottom-right-radius: 10px;
+    outline: none;
+    padding-left: 10px;
+    font-size: 14px;
+}
+
+.system p {
+    margin: 0 auto;
+    padding: 3px 10px;
+    background: #f3f3f3;
+    border-radius: 3px;
+    font-size: 12px;
+    color: #a9a5a5;
+}
+.me_message {
+    justify-content: flex-end !important;
+}
+.me_message img {
+    order: 1
+}
+.me_message .r_text {
+    order: -1
+}
+.me_message .r_text p{
+    text-align: right;
+}
+.me_message .c_text{
+    background: #dff3fd;
+}
+
+.startAn {
+    animation: doudong 0.01s infinite reverse;
+}
+@keyframes doudong
+{
+    0%   {
+        left: 50%;
+    }
+    25%  {
+        left: 45%;
+    }
+    50%  {
+        left: 50%;
+    }
+    100% {
+        left: 55%;
+    }
+}
+.clearQiPao {
+    background: rgb(223 243 253 / 0%) !important;
+}
+.qipao_select {
+    display: none;
+}

项目合集/聊天室/chat_fontend/css/login.css

@@ -0,0 +1,52 @@
+.login {
+    width: 251px;
+    height: 320px;
+    background: #fff;
+    border-radius: 10px;
+    box-shadow: 0px 0px 17px #e7e5e5;
+    position: absolute;
+    left: 50%;
+    top: 50%;
+    transform: translate(-50%,-50%);
+    text-align: center;
+}
+.login img{
+    width: 100px;
+    height: 100px;
+    border-radius: 100%;
+    margin-bottom: 50px;
+    margin-top: 30px;
+}
+.login input{
+    width: 185px;
+    border: none;
+    border-bottom: 1px solid #f1f1f1;
+    padding-bottom: 8px;
+    font-size: 12px;
+    color: #929090;
+    margin-bottom: 10px;
+}
+.username {
+    margin-bottom: 8px;
+}
+.login i{
+    font-size: 35px;
+    color: #b7b1b1;
+}
+.chiooseUserImg {
+    display: flex;
+    justify-content: flex-start;
+    flex-wrap: wrap;
+}
+.chiooseUserImg li{
+    width: 18%;
+    margin-right: 10px;
+    margin-bottom: 10px;
+}
+.chiooseUserImg img{
+    width: 100px;
+    height: 100px;
+}
+.active {
+    border: 1px solid red;
+}

项目合集/聊天室/chat_fontend/fonts/.pydio

@@ -0,0 +1 @@
+45820f5d-b06f-485e-b201-9d7a6800aa01

项目合集/聊天室/chat_fontend/img/.pydio

@@ -0,0 +1 @@
+60e63591-313b-4a76-b636-fd6d0f52ca25

项目合集/聊天室/chat_fontend/img/gif/.pydio

@@ -0,0 +1 @@
+930af87b-8f49-4b30-b42d-f86d645e7507

项目合集/聊天室/chat_fontend/img/icon/.pydio

@@ -0,0 +1 @@
+bcac2244-9b34-47bc-8d24-a966962e3316