Skip to content

Commit 9ec34fe

Browse files
dimaspiritdimaspirit
committed
Added new chat files
1 parent e1796a0 commit 9ec34fe

24 files changed

+3722
-0
lines changed

‎samples/chat/css/dashboard.css

Lines changed: 666 additions & 0 deletions
Large diffs are not rendered by default.

‎samples/chat/css/dialogs.css

Lines changed: 252 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,252 @@
1+
2+
.sidebar__dilog_list {
3+
flex: 1 1 100%;
4+
overflow-y: auto;
5+
text-align: left;
6+
}
7+
8+
.sidebar__dilog_list.loading:after {
9+
content: "";
10+
display: block;
11+
background: url(../img/loader2.gif);
12+
width: 30px;
13+
height: 30px;
14+
background-size: contain;
15+
margin: 15px auto;
16+
}
17+
18+
.sidebar__dilog_list .dialog__item {
19+
display: block;
20+
width: 100%;
21+
}
22+
23+
.sidebar__dilog_list .dialog__item.selected,
24+
.sidebar__dilog_list .dialog__item:hover {
25+
background: rgba(42, 100, 150, 0.1);
26+
}
27+
28+
.dialog__item_link {
29+
padding: 16px;
30+
display: flex;
31+
flex-wrap: nowrap;
32+
text-decoration: none;
33+
}
34+
35+
.open_sidebar {
36+
border: none;
37+
width: 24px;
38+
height: 24px;
39+
background-color: #778594;
40+
-webkit-mask: url(../img/ic_arrow_back.svg) no-repeat 50% 50%;
41+
mask: url(../img/ic_arrow_back.svg) no-repeat 50% 50%;
42+
cursor: pointer;
43+
flex: 0 0 24px;
44+
padding: 0;
45+
margin: 0 16px 0 0;
46+
}
47+
.dialog__title {
48+
font-size: 15px;
49+
font-weight: 500;
50+
line-height: 18px;
51+
color: #4A4A4A;
52+
flex: 1 1 100%;
53+
white-space: nowrap;
54+
overflow: hidden;
55+
text-overflow: ellipsis
56+
57+
}
58+
59+
.dialog__item {
60+
cursor: pointer;
61+
}
62+
63+
.dialog__avatar.m-user__img_1,
64+
.message__avatar.m-user__img_1,
65+
.user__avatar.m-user__img_1 {
66+
color: #FF9600;
67+
background-color: #ffd599;
68+
}
69+
.message__avatar {
70+
transition: .3s;
71+
}
72+
73+
.dialog__avatar.m-user__img_2,
74+
.message__avatar.m-user__img_2,
75+
.user__avatar.m-user__img_2 {
76+
color: #CDDA49;
77+
background-color: #ebfcb6;
78+
}
79+
80+
.dialog__avatar.m-user__img_3,
81+
.message__avatar.m-user__img_3,
82+
.user__avatar.m-user__img_3 {
83+
color: #159588;
84+
background-color: #a1d5cf;
85+
}
86+
87+
.dialog__avatar.m-user__img_4,
88+
.message__avatar.m-user__img_4,
89+
.user__avatar.m-user__img_4 {
90+
color: #FF2D55;
91+
background-color: #ffabbb;
92+
}
93+
94+
.dialog__avatar.m-user__img_5,
95+
.message__avatar.m-user__img_5,
96+
.user__avatar.m-user__img_5 {
97+
color: #44DB5E;
98+
background-color: #b4f1bf;
99+
}
100+
101+
.dialog__avatar.m-user__img_6,
102+
.message__avatar.m-user__img_6,
103+
.user__avatar.m-user__img_6 {
104+
color: #1FBCD2;
105+
background-color: #a5e4ed;
106+
}
107+
108+
.dialog__avatar.m-user__img_7,
109+
.message__avatar.m-user__img_7,
110+
.user__avatar.m-user__img_7 {
111+
color: #007AFF;
112+
background-color: #99caff;
113+
}
114+
115+
.dialog__avatar.m-user__img_8,
116+
.message__avatar.m-user__img_8,
117+
.user__avatar.m-user__img_8 {
118+
color: #9B2FAE;
119+
background-color: #d5acdf;
120+
}
121+
122+
.dialog__avatar.m-user__img_9,
123+
.message__avatar.m-user__img_9,
124+
.user__avatar.m-user__img_9 {
125+
color: #54C7FC;
126+
background-color: #bbe9fe;
127+
}
128+
129+
.dialog__avatar.m-user__img_10,
130+
.message__avatar.m-user__img_10,
131+
.user__avatar.m-user__img_10 {
132+
color: #4054B2;
133+
background-color: #b3bbe0;
134+
}
135+
136+
.dialog__avatar.m-type_group.m-user__img_1 {
137+
color: #ffd599;
138+
background-color: #FF9600;
139+
}
140+
141+
.dialog__avatar.m-type_group.m-user__img_2 {
142+
color: #ebfcb6;
143+
background-color: #CDDA49;
144+
}
145+
146+
.dialog__avatar.m-type_group.m-user__img_3 {
147+
color: #a1d5cf;
148+
background-color: #159588;
149+
}
150+
151+
.dialog__avatar.m-type_group.m-user__img_4 {
152+
color: #ffabbb;
153+
background-color: #FF2D55;
154+
}
155+
156+
.dialog__avatar.m-type_group.m-user__img_5 {
157+
color: #b4f1bf;
158+
background-color: #44DB5E;
159+
}
160+
161+
.dialog__avatar.m-type_group.m-user__img_6 {
162+
color: #a5e4ed;
163+
background-color: #1FBCD2;
164+
}
165+
166+
.dialog__avatar.m-type_group.m-user__img_7 {
167+
color: #99caff;
168+
background-color: #007AFF;
169+
}
170+
171+
.dialog__avatar.m-type_group.m-user__img_8 {
172+
color: #d5acdf;
173+
background-color: #9B2FAE;
174+
}
175+
176+
.dialog__avatar.m-type_group.m-user__img_9 {
177+
color: #bbe9fe;
178+
background-color: #54C7FC;
179+
}
180+
181+
.dialog__avatar.m-type_group.m-user__img_10 {
182+
color: #b3bbe0;
183+
background-color: #4054B2;
184+
}
185+
186+
.message__avatar.m-user__img_not_loaded,
187+
.message__avatar.m-typing_unknown {
188+
opacity: .1;
189+
}
190+
191+
.dialog__info {
192+
flex: 1 1 100%;
193+
overflow: hidden;
194+
}
195+
196+
.dialog__name {
197+
display: block;
198+
width: 100%;
199+
font-size: 15px;
200+
font-weight: 500;
201+
line-height: 18px;
202+
color: #4A4A4A;
203+
white-space: nowrap;
204+
text-overflow: ellipsis;
205+
overflow: hidden;
206+
margin: 0 10px 6px 0;
207+
}
208+
209+
.dialog__last_message {
210+
display: block;
211+
width: 100%;
212+
font-size: 13px;
213+
line-height: 15px;
214+
color: #778594;
215+
white-space: nowrap;
216+
text-overflow: ellipsis;
217+
overflow: hidden;
218+
}
219+
220+
.dialog__last_message.attachment {
221+
color: #007AFF;
222+
}
223+
224+
225+
.dialog_additional_info {
226+
flex:0 0 24px;
227+
text-align: right;
228+
}
229+
230+
.dialog__last_message_date {
231+
font-size: 12px;
232+
line-height: 14px;
233+
color: #4A4A4A;
234+
margin: 0 0 2px 0;
235+
display: inline-block;
236+
}
237+
238+
.dialog_unread_counter {
239+
min-width: 23px;
240+
background-color: #17D04B;
241+
border-radius: 4px;
242+
font-size: 13px;
243+
font-weight: 500;
244+
line-height: 19px;
245+
color: #FFFFFF;
246+
text-align: center;
247+
display: inline-block;
248+
}
249+
250+
.dialog_unread_counter.hidden {
251+
display: none;
252+
}

0 commit comments

Comments
 (0)