index.scss

.tip{
	flex: 1;
}

#center-view{
	height: 100vh;
  /* #ifdef H5 */
  height: calc(100vh - 44px);
  /* #endif */
	background-color: #f5f5f5 !important;
}

/* #ifdef H5 */
@media screen and (min-device-width:960px){
  .pointer {
  	cursor: pointer;
  }
	#page {
		flex-direction: row;
		justify-content: center;
		align-items: center;
		height: 100vh;
		width: 100vw;
		background-color: #2e2e3e;
		min-width:960px;
    
    #left-view,
    #center-view,
    #right-view {
    	height: 95vh;
    	position: relative;
    	top: -2vh;
    	background-color: #FFFFFF;
    }
    
    #center-view {
      #conversation-list-box ::v-deep .conversation-list{
      	max-height: calc(95vh - 70px);
        .conversation-list-item{
          margin: 5px;
        }
      }
    }
    #left-view {
      & > *{
        cursor: pointer;
        margin-top: 36px;
      }
      & > *:hover{
        /* border: 1px solid #fefefe; */
        box-shadow: 0 0 20px 2px #fefefe;
        border-radius: 10px;
      }
      width:60px;
      align-items: center;
      padding-top: 100px;
      background-color: #ececec;
      border-radius: 20px 0 0 20px;
    }
    #center-view{
    	width:300px;
      #search-bar-box {
      	flex-direction: row;
      	align-items: center;
      	height: 70px;
        padding:0 10px;
      }
      #search-bar {
      	flex: 1;
      }
      #uni-im-contacts-box {
      	z-index: 10;
      	height: 95vh;
        width: 100%;
      	position: absolute;
        background-color: #f5f5f5;
        /* pc端隐藏删除好友的按钮，后续改成长按（右键）可见 */
        ::v-deep .delete-btn{
        	display: none;
        }
      }
    }
    
    #right-view {
      width: calc(100% - 370px);
      border-radius: 0 20px 20px 0;
      overflow: hidden;
      position: relative;
      #chat-view-box {
        #ccid-is-null-tip{
        	height: 95vh;
        	padding-top: 30vh;
        	align-items: center;
        	background-color: #efefef;
          .img {
            width: 130px;
            margin-bottom: 15px;
          }
          .text {
            color: #999;
          }
        }
      }
      #chat-header{
      	height: 70px;
      	padding:0 20px;
      	flex-direction: row;
      	justify-content: end;
      	align-items: center;
        .more{
        	cursor: pointer;
        }
      }
      #chat-view {
        max-height:calc(95vh - 70px);
      }
      #chat-view ::v-deep #uni-im-chat{
        #web-pc-chat-title
        {
          position: absolute;
          z-index: 9;
          top: -45px;
          left: 15px;
        }
        .unread_count {
          display: none;
        }
        .msg-list .uni-im-list .uni-im-msg{
          padding:0 10px;
        }
      }
      .chatInfoBox {
        z-index: 999;
        position: absolute;
        right:0;
        top: 70px;
        background-color: rgba(0,0,0,0.2);
        height: calc(95vh - 70px);
        align-items: flex-end;
        width: 100%;
        ::v-deep .group-info-text{
          max-width: 250px !important;
          text-align: left;
          word-break: break-all;
        }
      }
      #dynamic-component-box {
        z-index: 9;
        width: 100%;
        height: 95vh;
        background-color: #fff;
        position: absolute;
        right: 0;
        .dynamic-component-title{
          padding-left: 15px;
          height: 70px;
          justify-content: center;
          border: 1px solid #efefef;
        }
        .system-notice-box{
          width: 100%;
        }
        .create-group-box .header-box{
          width: 100%;
          .uni-searchbar {
            width: 100%;
          }
        }
      }
    }
	}
	
	#foot {
		position: fixed;
		bottom: 10px;
		flex-direction: row;
		color: #FFFFFF;
    .uni-link:hover{
    	color: #00aa55 !important;
    }
    .item {
      flex-direction: row;
      margin:0 50px;
      align-items: center;
      .icon {
        width: 20px;
        height: 20px;
        margin-right: 5px;
      }
      .link {
        margin-left: 5px;
      }
    }
	}
	

  .windows {
    #center-view #conversation-list-box ::v-deep .conversation-list-item .uni-list-chat__container{
      padding-right: 10px;
    }
  } 
}
/* #endif */