style: 调整聊天侧边栏样式

This commit is contained in:
RockYang 2023-06-23 18:31:50 +08:00
parent d03ed6570b
commit 063b5655f7
4 changed files with 58 additions and 6 deletions

48
web/package-lock.json generated
View File

@ -21,6 +21,7 @@
"pinia": "^2.1.4",
"qs": "^6.11.1",
"sortablejs": "^1.15.0",
"vant": "^4.5.0",
"vue": "^3.2.13",
"vue-router": "^4.0.15"
},
@ -2260,6 +2261,19 @@
"@types/node": "*"
}
},
"node_modules/@vant/popperjs": {
"version": "1.3.0",
"resolved": "https://registry.npmmirror.com/@vant/popperjs/-/popperjs-1.3.0.tgz",
"integrity": "sha512-hB+czUG+aHtjhaEmCJDuXOep0YTZjdlRR+4MSmIFnkCQIxJaXLQdSsR90XWvAI2yvKUI7TCGqR8pQg2RtvkMHw=="
},
"node_modules/@vant/use": {
"version": "1.5.2",
"resolved": "https://registry.npmmirror.com/@vant/use/-/use-1.5.2.tgz",
"integrity": "sha512-CBK61iT568dCHUwFFsErGbW6/5tmrPnZJKGtcSy7Tjcrmws8Ku+YZo7IUFD9Xkj9MfSJ4pfhQ7pU2KouP5Cojg==",
"peerDependencies": {
"vue": "^3.0.0"
}
},
"node_modules/@vue/babel-helper-vue-jsx-merge-props": {
"version": "1.2.1",
"resolved": "https://registry.npmmirror.com/@vue/babel-helper-vue-jsx-merge-props/-/babel-helper-vue-jsx-merge-props-1.2.1.tgz",
@ -10429,6 +10443,19 @@
"spdx-expression-parse": "^3.0.0"
}
},
"node_modules/vant": {
"version": "4.5.0",
"resolved": "https://registry.npmmirror.com/vant/-/vant-4.5.0.tgz",
"integrity": "sha512-MK7TlTvp+n0HRFAi7SoRZwTt1pquJ2aUa8nQ899Mf+x9gi8OLYrMFqEQX+l1e4Cl4RO0vD1Q5w9rs4+Wehesog==",
"dependencies": {
"@vant/popperjs": "^1.3.0",
"@vant/use": "^1.5.1",
"@vue/shared": "^3.0.0"
},
"peerDependencies": {
"vue": "^3.0.0"
}
},
"node_modules/vary": {
"version": "1.1.2",
"resolved": "https://registry.npmmirror.com/vary/-/vary-1.1.2.tgz",
@ -13000,6 +13027,17 @@
"@types/node": "*"
}
},
"@vant/popperjs": {
"version": "1.3.0",
"resolved": "https://registry.npmmirror.com/@vant/popperjs/-/popperjs-1.3.0.tgz",
"integrity": "sha512-hB+czUG+aHtjhaEmCJDuXOep0YTZjdlRR+4MSmIFnkCQIxJaXLQdSsR90XWvAI2yvKUI7TCGqR8pQg2RtvkMHw=="
},
"@vant/use": {
"version": "1.5.2",
"resolved": "https://registry.npmmirror.com/@vant/use/-/use-1.5.2.tgz",
"integrity": "sha512-CBK61iT568dCHUwFFsErGbW6/5tmrPnZJKGtcSy7Tjcrmws8Ku+YZo7IUFD9Xkj9MfSJ4pfhQ7pU2KouP5Cojg==",
"requires": {}
},
"@vue/babel-helper-vue-jsx-merge-props": {
"version": "1.2.1",
"resolved": "https://registry.npmmirror.com/@vue/babel-helper-vue-jsx-merge-props/-/babel-helper-vue-jsx-merge-props-1.2.1.tgz",
@ -19428,6 +19466,16 @@
"spdx-expression-parse": "^3.0.0"
}
},
"vant": {
"version": "4.5.0",
"resolved": "https://registry.npmmirror.com/vant/-/vant-4.5.0.tgz",
"integrity": "sha512-MK7TlTvp+n0HRFAi7SoRZwTt1pquJ2aUa8nQ899Mf+x9gi8OLYrMFqEQX+l1e4Cl4RO0vD1Q5w9rs4+Wehesog==",
"requires": {
"@vant/popperjs": "^1.3.0",
"@vant/use": "^1.5.1",
"@vue/shared": "^3.0.0"
}
},
"vary": {
"version": "1.1.2",
"resolved": "https://registry.npmmirror.com/vary/-/vary-1.1.2.tgz",

View File

@ -21,6 +21,7 @@
"pinia": "^2.1.4",
"qs": "^6.11.1",
"sortablejs": "^1.15.0",
"vant": "^4.5.0",
"vue": "^3.2.13",
"vue-router": "^4.0.15"
},

View File

@ -81,8 +81,8 @@ const showDialog = computed(() => {
})
const form = ref({})
const top = computed(() => {
if (window.innerHeight < 768) {
return '1vh';
if (window.innerHeight < 1024) {
return '5vh';
} else {
return '15vh';
}

View File

@ -304,7 +304,7 @@ const getRoleById = function (rid) {
const resizeElement = function () {
chatBoxHeight.value = window.innerHeight - 51 - 82 - 38;
mainWinHeight.value = window.innerHeight - 51;
leftBoxHeight.value = window.innerHeight - 51 - 100;
leftBoxHeight.value = window.innerHeight - 43 - 47 - 44;
};
//
@ -782,9 +782,12 @@ $borderColor = #4676d0;
width: 100%
justify-content: flex-start
padding: 8px 12px
border-bottom: 1px solid #3c3c3c
//border-bottom: 1px solid #3c3c3c
cursor: pointer
&:hover {
background-color #343540
}
.avatar {
width: 28px;
@ -826,7 +829,7 @@ $borderColor = #4676d0;
}
.chat-list-item.active {
background-color: #363535;
background-color: #343540;
.btn {
display inline
@ -840,7 +843,7 @@ $borderColor = #4676d0;
display: flex;
justify-content: flex-end;
align-items: center;
padding 5px 20px;
padding 0 20px 10px 20px;
border-top 1px solid #3c3c3c;
.user-info {