wt/msgs
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update ui

Browse Source
This commit is contained in:
wt
2026-08-14 15:02:45 +07:00
parent fe918433e8
commit 97d170e10a
2 changed files with 61 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/css/index.css
+35 -20
View File
@@ -241,9 +241,11 @@ body {
color: var(--text-primary);
display: flex;
flex-direction: column;
height: 100vh;
height: calc(100vh-20px);
transition: transform 0.3s ease;
border-right: 1px solid var(--border-color);
border-radius: 20px;
margin: 10px;
}
.chats-header {
@@ -310,11 +312,13 @@ body {
.chat-item {
padding: 12px 15px;
border-bottom: 1px solid var(--border-color);
/*border-bottom: 1px solid var(--border-color);*/
cursor: pointer;
transition: all 0.3s ease;
display: flex;
align-items: center;
border-radius: 15px;
margin: 5px;
}
.chat-item:hover {
@@ -364,13 +368,13 @@ body {
.chat-phone {
font-size: 11px;
color: var(--text-secondary);
/*color: var(--text-secondary);*/
margin-bottom: 3px;
}
.chat-last-message {
font-size: 12px;
color: var(--text-secondary);
/*color: var(--text-secondary);*/
opacity: 0.8;
white-space: nowrap;
overflow: hidden;
@@ -387,7 +391,7 @@ body {
.chat-time {
font-size: 10px;
color: var(--text-secondary);
/*color: var(--text-secondary);*/
margin-bottom: 5px;
}
@@ -411,6 +415,7 @@ body {
background: var(--bg-primary);
height: 100vh;
position: relative;
margin-right: 10px;
}
.chat-header {
@@ -566,10 +571,14 @@ body {
.chat-input-container {
position: sticky;
bottom: 0;
background: var(--bg-primary);
border-top: 1px solid var(--border-color);
padding: 15px;
/*background: var(--bg-primary);*/
/*border-top: 1px solid var(--border-color);*/
/*padding: 15px;*/
z-index: 10;
background: #212121;
padding: 2px;
border-radius: 25px;
margin-bottom: 10px;
}
.chat-input-area {
@@ -577,17 +586,20 @@ body {
gap: 10px;
align-items: flex-end;
max-height: 120px;
/*background: #212121;*/
}
.message-input {
flex: 1;
border: none;
padding: 12px 15px;
border: 2px solid var(--border-color);
/*border: 2px solid var(--border-color);*/
border-radius: 25px;
outline: none;
font-size: 14px;
transition: border-color 0.3s ease;
background: var(--bg-primary);
/*background: var(--bg-primary);*/
background: #212121;
color: var(--text-primary);
resize: none;
min-height: 44px;
@@ -597,16 +609,13 @@ body {
}
.message-input:focus {
border-color: var(--primary-color);
/*border-color: var(--primary-color);*/
}
.send-button {
padding: 12px 20px;
background: linear-gradient(
135deg,
var(--primary-color),
var(--primary-hover)
);
position: relative;
padding: 0 28px;
background: var(--primary-color);
color: white;
border: none;
border-radius: 25px;
@@ -619,8 +628,13 @@ body {
}
.send-button:hover:not(:disabled) {
transform: translateY(-2px);
box-shadow: 0 5px 15px rgba(52, 152, 219, 0.4);
/*background: hsl(
from var(--primary-color) calc(h - 2%) calc(s - 2%) calc(l - 2%)
);*/
/*transform: translateY(-2px);*/
/*box-shadow: 0 5px 15px rgba(52, 152, 219, 0.4);*/
/*background-opacity: 0.8;*/
background: color-mix(in srgb, var(--primary-color) 70%, transparent);
}
.send-button:disabled {
@@ -1064,6 +1078,7 @@ body {
.chat-panel {
width: 100%;
height: 100vh;
margin-right: 10px;
}
.mobile-header {
@@ -1217,7 +1232,7 @@ body {
/* Safe area support for notches */
@supports (padding: max(0px)) {
.chat-input-container {
padding-bottom: max(15px, env(safe-area-inset-bottom));
/*padding-bottom: max(15px, env(safe-area-inset-bottom));*/
}
@media (max-width: 768px) {
web/index.html
+26 -2
View File
@@ -202,7 +202,9 @@
/>
<button
class="add-button"
onclick="document.getElementById('fileInput').click()"
onclick="
document.getElementById('fileInput').click()
"
>
&plus;
</button>
@@ -228,7 +230,29 @@
id="sendButton"
disabled
>
Send
<svg
style="
position: absolute;
left: 0;
right: 0;
top: 6px;
/*bottom: 5px;*/
"
xmlns="http://www.w3.org/2000/svg"
width="55"
height="34"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
>
<path d="M10 14l11 -11" />
<path
d="M21 3l-6.5 18a.55 .55 0 0 1 -1 0l-3.5 -7l-7 -3.5a.55 .55 0 0 1 0 -1l18 -6.5"
/>
</svg>
</button>
</div>
</div>