1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
|
@import "tailwindcss";
@theme {
--color-dark: #000000;
--color-overlay: #1c1c1c;
--color-text: #ffffff;
--color-muted: #636363;
--color-primary: #6e61d8;
--color-primary-hover: #584fc1;
--color-secondary: #ff6b9d;
--color-secondary-hover: #e55a8c;
--color-warning: #f5a623;
--color-warning-hover: #d48e1f;
--color-success: #4caf50;
--color-success-hover: #3b8e3b;
--color-error: #f44336;
--color-error-hover: #d32f2f;
--text-xxs: 0.625rem;
}
/* @theme {
--color-bg-dark: #0a0a0f;
--color-bg-darker: #16161f;
--color-surface: #1e1e2e;
--color-surface-hover: #2a2a3e;
--color-purple: #6c63ff;
--color-pink: #ff6b9d;
--color-blue: #4dabf7;
--color-text: #e4e4e7;
--color-text-muted: #a1a1aa;
--color-text-dim: #71717a;
}
.gradient-message {
background: linear-gradient(135deg, #6c63ff 0%, #8a84ff 100%);
}
.gradient-primary {
background: linear-gradient(135deg, #6c63ff 0%, #ff6b9d 100%);
}
.glow-input {
box-shadow:
0 0 0 1px rgba(108, 99, 255, 0.1),
0 4px 12px rgba(108, 99, 255, 0.15);
}
.sidebar-icon {
width: 3rem;
height: 3rem;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
transition: all 0.2s;
cursor: pointer;
}
.sidebar-icon:hover {
border-radius: 1rem;
background-color: var(--color-purple);
}
.channel-item {
padding: 0.5rem 1rem;
border-radius: 0.375rem;
cursor: pointer;
transition: all 0.15s;
color: var(--color-text-muted);
}
.channel-item:hover {
background-color: var(--color-surface-hover);
color: var(--color-text);
}
.channel-item.active {
background-color: var(--color-surface-hover);
color: var(--color-text);
}
.message-bubble {
padding: 0.75rem 1rem;
border-radius: 1.25rem;
max-width: 70%;
word-wrap: break-word;
}
.message-own {
background: linear-gradient(135deg, #6c63ff 0%, #8a84ff 100%);
color: white;
margin-left: auto;
border-bottom-right-radius: 0.25rem;
}
.message-other {
background-color: var(--color-surface);
color: var(--color-text);
border-bottom-left-radius: 0.25rem;
} */
|
