@devchitchat/chat 4.2.1 → 4.2.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +1 -1
- package/pages/public/themes/base.css +45 -2
package/package.json
CHANGED
|
@@ -85,6 +85,7 @@ details summary {
|
|
|
85
85
|
align-items: center;
|
|
86
86
|
border-bottom: solid 2px transparent;
|
|
87
87
|
border-top: solid 2px transparent;
|
|
88
|
+
position: relative;
|
|
88
89
|
}
|
|
89
90
|
|
|
90
91
|
.channel-item a {
|
|
@@ -95,9 +96,11 @@ details summary {
|
|
|
95
96
|
display: flex;
|
|
96
97
|
align-items: center;
|
|
97
98
|
padding-left: .7rem;
|
|
99
|
+
padding-right: .7rem;
|
|
98
100
|
user-select: none;
|
|
99
101
|
-webkit-user-select: none;
|
|
100
102
|
-webkit-touch-callout: none;
|
|
103
|
+
transition: color var(--transition), background var(--transition);
|
|
101
104
|
}
|
|
102
105
|
|
|
103
106
|
.channel-item a:hover {
|
|
@@ -106,6 +109,22 @@ details summary {
|
|
|
106
109
|
|
|
107
110
|
.channel-item.active a {
|
|
108
111
|
color: var(--text-primary);
|
|
112
|
+
background: var(--bg-active);
|
|
113
|
+
font-weight: 600;
|
|
114
|
+
border-radius: var(--radius-sm);
|
|
115
|
+
}
|
|
116
|
+
|
|
117
|
+
/* Left accent bar on selected channel */
|
|
118
|
+
.channel-item.active::before {
|
|
119
|
+
content: '';
|
|
120
|
+
position: absolute;
|
|
121
|
+
left: 0;
|
|
122
|
+
top: 50%;
|
|
123
|
+
transform: translateY(-50%);
|
|
124
|
+
width: 3px;
|
|
125
|
+
height: 1.4rem;
|
|
126
|
+
background: var(--accent);
|
|
127
|
+
border-radius: 0 2px 2px 0;
|
|
109
128
|
}
|
|
110
129
|
|
|
111
130
|
/* ── Channel + hub drag-and-drop reordering (desktop) ───────────────────── */
|
|
@@ -174,6 +193,7 @@ details summary {
|
|
|
174
193
|
.dm-item {
|
|
175
194
|
display: flex;
|
|
176
195
|
align-items: center;
|
|
196
|
+
position: relative;
|
|
177
197
|
}
|
|
178
198
|
|
|
179
199
|
.dm-link {
|
|
@@ -203,6 +223,19 @@ details summary {
|
|
|
203
223
|
font-weight: 600;
|
|
204
224
|
}
|
|
205
225
|
|
|
226
|
+
/* Left accent bar on selected DM — mirrors selected channel */
|
|
227
|
+
.dm-item.dm-selected::before {
|
|
228
|
+
content: '';
|
|
229
|
+
position: absolute;
|
|
230
|
+
left: 0;
|
|
231
|
+
top: 50%;
|
|
232
|
+
transform: translateY(-50%);
|
|
233
|
+
width: 3px;
|
|
234
|
+
height: 1.4rem;
|
|
235
|
+
background: var(--accent);
|
|
236
|
+
border-radius: 0 2px 2px 0;
|
|
237
|
+
}
|
|
238
|
+
|
|
206
239
|
.dm-name {
|
|
207
240
|
flex: 1;
|
|
208
241
|
overflow: hidden;
|
|
@@ -212,7 +245,16 @@ details summary {
|
|
|
212
245
|
|
|
213
246
|
/* Unread dot on DM/channel items — blue for normal mentions, red for urgent.
|
|
214
247
|
Uses data attributes instead of classes so rdbljs className re-renders
|
|
215
|
-
(which only touch el.className) never wipe the dot state.
|
|
248
|
+
(which only touch el.className) never wipe the dot state.
|
|
249
|
+
Text is also brightened and bolded so the indicator is hard to miss. */
|
|
250
|
+
.channel-item[data-mention] .channel-link,
|
|
251
|
+
.channel-item[data-urgent] .channel-link,
|
|
252
|
+
.dm-item[data-mention] .dm-link,
|
|
253
|
+
.dm-item[data-urgent] .dm-link {
|
|
254
|
+
color: var(--text-primary);
|
|
255
|
+
font-weight: 600;
|
|
256
|
+
}
|
|
257
|
+
|
|
216
258
|
.dm-item[data-mention] .dm-link::after,
|
|
217
259
|
.channel-item[data-mention] .channel-link::after {
|
|
218
260
|
content: '';
|
|
@@ -543,7 +585,8 @@ details summary {
|
|
|
543
585
|
.message-text { grid-column: 1 / -1; grid-row: 2; line-height: 1.5; color: var(--text-primary); word-break: break-word; overflow-wrap: anywhere; }
|
|
544
586
|
.message-text p { white-space: pre-wrap; margin: 0 0 4px; }
|
|
545
587
|
.message-text p:last-child { margin-bottom: 0; }
|
|
546
|
-
.message-text a { word-break: break-all; }
|
|
588
|
+
.message-text a { word-break: break-all; color: var(--accent); text-decoration: underline; }
|
|
589
|
+
.message-text a:hover { opacity: 0.8; }
|
|
547
590
|
.message-text h1,.message-text h2,.message-text h3,.message-text h4 { margin: 8px 0 4px; font-weight: 600; line-height: 1.3; }
|
|
548
591
|
.message-text h1 { font-size: 1.3em; }
|
|
549
592
|
.message-text h2 { font-size: 1.15em; }
|