]> git.proxmox.com Git - ceph.git/blame - ceph/src/pybind/mgr/dashboard/static/AdminLTE-2.3.7/build/less/direct-chat.less
update sources to v12.1.0
[ceph.git] / ceph / src / pybind / mgr / dashboard / static / AdminLTE-2.3.7 / build / less / direct-chat.less
CommitLineData
31f18b77
FG
1/*
2 * Component: Direct Chat
3 * ----------------------
4 */
5.direct-chat {
6 .box-body {
7 .border-bottom-radius(0);
8 position: relative;
9 overflow-x: hidden;
10 padding: 0;
11 }
12 &.chat-pane-open {
13 .direct-chat-contacts {
14 .translate(0, 0);
15 }
16 }
17}
18
19.direct-chat-messages {
20 .translate(0, 0);
21 padding: 10px;
22 height: 250px;
23 overflow: auto;
24}
25
26.direct-chat-msg,
27.direct-chat-text {
28 display: block;
29}
30
31.direct-chat-msg {
32 .clearfix();
33 margin-bottom: 10px;
34}
35
36.direct-chat-messages,
37.direct-chat-contacts {
38 .transition-transform(.5s ease-in-out);
39}
40
41.direct-chat-text {
42 .border-radius(5px);
43 position: relative;
44 padding: 5px 10px;
45 background: @direct-chat-default-msg-bg;
46 border: 1px solid @direct-chat-default-msg-border-color;
47 margin: 5px 0 0 50px;
48 color: @direct-chat-default-font-color;
49
50 //Create the arrow
51 &:after,
52 &:before {
53 position: absolute;
54 right: 100%;
55 top: 15px;
56 border: solid transparent;
57 border-right-color: @direct-chat-default-msg-border-color;
58 content: ' ';
59 height: 0;
60 width: 0;
61 pointer-events: none;
62 }
63
64 &:after {
65 border-width: 5px;
66 margin-top: -5px;
67 }
68 &:before {
69 border-width: 6px;
70 margin-top: -6px;
71 }
72 .right & {
73 margin-right: 50px;
74 margin-left: 0;
75 &:after,
76 &:before {
77 right: auto;
78 left: 100%;
79 border-right-color: transparent;
80 border-left-color: @direct-chat-default-msg-border-color;
81 }
82 }
83}
84
85.direct-chat-img {
86 .border-radius(50%);
87 float: left;
88 width: 40px;
89 height: 40px;
90 .right & {
91 float: right;
92 }
93}
94
95.direct-chat-info {
96 display: block;
97 margin-bottom: 2px;
98 font-size: 12px;
99}
100
101.direct-chat-name {
102 font-weight: 600;
103}
104
105.direct-chat-timestamp {
106 color: #999;
107}
108
109//Direct chat contacts pane
110.direct-chat-contacts-open {
111 .direct-chat-contacts {
112 .translate(0, 0);
113 }
114}
115
116.direct-chat-contacts {
117 .translate(101%, 0);
118 position: absolute;
119 top: 0;
120 bottom: 0;
121 height: 250px;
122 width: 100%;
123 background: #222d32;
124 color: #fff;
125 overflow: auto;
126}
127
128//Contacts list -- for displaying contacts in direct chat contacts pane
129.contacts-list {
130 &:extend(.list-unstyled);
131 > li {
132 .clearfix();
133 border-bottom: 1px solid rgba(0, 0, 0, 0.2);
134 padding: 10px;
135 margin: 0;
136 &:last-of-type {
137 border-bottom: none;
138 }
139 }
140}
141
142.contacts-list-img {
143 .border-radius(50%);
144 width: 40px;
145 float: left;
146}
147
148.contacts-list-info {
149 margin-left: 45px;
150 color: #fff;
151}
152
153.contacts-list-name,
154.contacts-list-status {
155 display: block;
156}
157
158.contacts-list-name {
159 font-weight: 600;
160}
161
162.contacts-list-status {
163 font-size: 12px;
164}
165
166.contacts-list-date {
167 color: #aaa;
168 font-weight: normal;
169}
170
171.contacts-list-msg {
172 color: #999;
173}
174
175//Direct Chat Variants
176.direct-chat-danger {
177 .direct-chat-variant(@red);
178}
179
180.direct-chat-primary {
181 .direct-chat-variant(@light-blue);
182}
183
184.direct-chat-warning {
185 .direct-chat-variant(@yellow);
186}
187
188.direct-chat-info {
189 .direct-chat-variant(@aqua);
190}
191
192.direct-chat-success {
193 .direct-chat-variant(@green);
194}