PluginProbe
WPBot – AI ChatBot for Live Support, Lead Generation, WordPress Automation, AI Services / 3.2.9
WPBot – AI ChatBot for Live Support, Lead Generation, WordPress Automation, AI Services v3.2.9
8.7.7 8.7.6 8.7.5 8.7.4 8.7.3 8.7.2 8.7.1 8.7.0 8.6.9 8.6.8 8.6.7 8.6.6 8.6.5 8.6.4 8.6.2 8.6.1 8.6.0 8.5.9 8.5.8 8.5.7 8.5.6 8.5.5 8.5.4 8.5.3 8.5.2 All 533 releases
chatbot / css / wp-chatbot-tabs.css

wp-chatbot-tabs.css in WPBot – AI ChatBot for Live Support, Lead Generation, WordPress Automation, AI Services 3.2.9, at css/wp-chatbot-tabs.css

399 lines 4.4 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 /* Default tab style */
2
3 .wp-chatbot-tabs {
4
5 position: relative;
6
7 overflow: hidden;
8
9 margin: 0 auto;
10
11 width: 100%;
12
13 font-weight: 300;
14
15 font-size: 1.25em;
16
17 }
18
19
20
21 /* Nav */
22
23 .wp-chatbot-tabs nav {
24
25 width: 25%;
26
27 display: block;
28
29 float: left;
30
31
32
33 }
34
35
36
37 .wp-chatbot-tabs nav ul {
38
39 position: relative;
40
41 margin: 0 auto;
42
43 padding: 0;
44
45 list-style: none;
46
47 }
48
49
50
51 .wp-chatbot-tabs nav ul li {
52
53 position: relative;
54
55 border-bottom: 1px solid #4d565f;
56
57 z-index: 1;
58
59 display: block;
60
61 margin: 0;
62
63 text-align: left;
64
65 -webkit-flex: 1;
66
67 -moz-flex: 1;
68
69 -ms-flex: 1;
70
71 flex: 1;
72
73 }
74
75
76
77 .wp-chatbot-tabs nav a {
78
79 position: relative;
80
81 display: block;
82
83 overflow: hidden;
84
85 text-overflow: ellipsis;
86
87 white-space: nowrap;
88
89 line-height: 2.5;
90
91 text-decoration: none;
92
93 /*padding: 10px 20px;*/
94
95 }
96
97
98
99 .wp-chatbot-tabs nav a span {
100
101 vertical-align: middle;
102
103 font-size: 0.75em;
104
105 }
106
107
108
109 .wp-chatbot-tabs nav li.tab-current a {
110
111 color: #74777b;
112
113 }
114
115
116
117 .wp-chatbot-tabs nav a:focus {
118
119 outline: none;
120
121 }
122
123
124
125 /* Content */
126
127 .content-wrap {
128
129 position: relative;
130
131 width: 75%;
132
133 display: block;
134
135 float: left;
136
137 min-height: 600px;
138
139 }
140
141
142
143 .content-wrap section {
144
145 display: none;
146
147 margin: 0 auto;
148
149 padding: 1em;
150
151 max-width: 1200px; /*text-align: center;*/
152
153 }
154
155
156
157 .content-wrap section.content-current {
158
159 display: block;
160
161 }
162
163
164
165 .top-section .row {
166
167 padding-top: 15px;
168
169 padding-bottom: 15px;
170
171 }
172
173 .wp-chatbot-lng-items .row, #wp-chatbot-language-section .row{
174
175 padding-top: 2px;
176
177 padding-bottom: 2px;
178
179 margin-bottom: 0;
180
181 }
182
183
184
185 .top-section .row .cxsc-settings-blocks {
186
187 padding-top: 10px;
188
189 }
190
191
192
193 .content-wrap section h4 {
194
195 margin-top: 0;
196
197 padding-top: 0;
198
199 font-size: 16px;
200
201 font-weight: normal;
202
203 }
204
205
206
207 .content-wrap section.content-current input[type=checkbox] + label, .wp-chatbot-wrap label {
208
209 font-size: 14px;
210
211 font-weight: normal !important;
212
213 margin-bottom: 0;
214
215 }
216
217
218
219 /* Fallback */
220
221 .no-js .content-wrap section {
222
223 display: block;
224
225 padding-bottom: 2em;
226
227 border-bottom: 1px solid rgba(255, 255, 255, 0.6);
228
229 }
230
231
232
233 .no-flexbox nav ul {
234
235 display: block;
236
237 }
238
239
240
241 .no-flexbox nav ul li {
242
243 min-width: 15%;
244
245 display: inline-block;
246
247 }
248
249
250
251 /*****************************/
252
253 /* Flip */
254
255 /*****************************/
256
257
258
259 .wp-chatbot-tabs-style-flip {
260
261 max-width: 1200px;
262
263 }
264
265
266
267 .wp-chatbot-tabs-style-flip nav a {
268
269 padding: 0.5em 1em;
270
271 color: #33B0D9;
272
273 -webkit-transition: color 0.3s;
274
275 transition: color 0.3s;
276
277 font-size: 18px;
278
279 }
280
281
282
283 .wp-chatbot-tabs-style-flip nav a:hover, .wp-chatbot-tabs-style-flip nav a:focus, .wp-chatbot-tabs-style-flip nav a:active, .wp-chatbot-tabs-style-flip nav li.tab-current a {
284
285 color: #74777b;
286
287 outline: none;
288
289 box-shadow: none;
290
291 }
292
293
294
295 .wp-chatbot-tabs-style-flip nav a span {
296
297 text-transform: uppercase;
298
299 letter-spacing: 1px;
300
301 font-weight: 700;
302
303 font-size: 0.625em;
304
305 }
306
307
308
309 .wp-chatbot-tabs-style-flip nav a::after {
310
311 position: absolute;
312
313 top: 0;
314
315 left: 0;
316
317 z-index: -1;
318
319 width: 100%;
320
321 height: 100%;
322
323 background-color: #f0f0f0;
324
325 content: '';
326
327 -webkit-transition: -webkit-transform 0.3s, background-color 0.3s;
328
329 transition: transform 0.3s, background-color 0.3s;
330
331 -webkit-transform: perspective(900px) rotate3d(1, 0, 0, 90deg);
332
333 transform: perspective(900px) rotate3d(1, 0, 0, 90deg);
334
335 -webkit-transform-origin: 50% 100%;
336
337 transform-origin: 50% 100%;
338
339 -webkit-perspective-origin: 50% 100%;
340
341 perspective-origin: 50% 100%;
342
343 }
344
345
346
347 .wp-chatbot-tabs-style-flip nav li.tab-current a::after {
348
349 background-color: #fff;
350
351 -webkit-transform: perspective(900px) rotate3d(1, 0, 0, 0deg);
352
353 transform: perspective(900px) rotate3d(1, 0, 0, 0deg);
354
355 }
356
357
358
359 .wp-chatbot-tabs-style-flip .content-wrap {
360
361 background: #fff;
362
363 }
364
365
366
367 @media screen and (max-width: 58em) {
368
369 .wp-chatbot-tabs nav a.icon span {
370
371 display: none;
372
373 }
374
375
376
377 .wp-chatbot-tabs nav a:before {
378
379 margin-right: 0;
380
381 }
382
383 }
384
385
386
387 @media screen and (max-width: 650px) {
388
389 .wp-chatbot-tabs-style-flip nav a {
390
391 padding: 0;
392
393 line-height: 2;
394
395 }
396
397
398
399 }