PluginProbe
WANotifier for Forms and Actions / 2.4.0
WANotifier for Forms and Actions v2.4.0
3.1.0 3.0.4 2.7.10 2.7.11 2.7.12 2.7.13 2.7.2 2.7.3 2.7.4 2.7.5 2.7.6 2.7.7 2.7.8 2.7.9 3.0.0 3.0.1 3.0.2 3.0.3 trunk 0.1.0 0.1.1 1.0.0 1.0.1 1.0.2 1.0.3 All 66 releases
notifier / assets / css / admin.css

admin.css in WANotifier for Forms and Actions 2.4.0, at assets/css/admin.css

995 lines 36.3 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 .select2-container { box-sizing: border-box; display: inline-block; margin: 0; position: relative; vertical-align: middle; }
2 .select2-container .select2-selection--single { box-sizing: border-box; cursor: pointer; display: block; height: 32px; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-user-select: none; }
3 .select2-container .select2-selection--single .select2-selection__rendered { display: block; padding-left: 8px; padding-right: 20px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
4 .select2-container .select2-selection--single .select2-selection__clear { background-color: transparent; border: none; font-size: 1em; }
5 .select2-container[dir="rtl"] .select2-selection--single .select2-selection__rendered { padding-right: 8px; padding-left: 20px; }
6 .select2-container .select2-selection--multiple { box-sizing: border-box; cursor: pointer; display: block; min-height: 32px; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-user-select: none; }
7 .select2-container .select2-selection--multiple .select2-selection__rendered { display: inline; list-style: none; padding: 0; }
8 .select2-container .select2-selection--multiple .select2-selection__clear { background-color: transparent; border: none; font-size: 1em; }
9 .select2-container .select2-search--inline .select2-search__field { box-sizing: border-box; border: none; font-size: 100%; padding: 0; max-width: 100%; resize: none; height: 18px; vertical-align: top; font-family: sans-serif; overflow: hidden; word-break: keep-all; }
10 .select2-container .select2-search--inline .select2-search__field::-webkit-search-cancel-button { -webkit-appearance: none; }
11 .select2-dropdown { background-color: white; border: 1px solid #aaa; border-radius: 4px; box-sizing: border-box; display: block; position: absolute; left: -100000px; width: 100%; z-index: 1051; }
12 .select2-results { display: block; }
13 .select2-results__options { list-style: none; margin: 0; padding: 0; }
14 .select2-results__option { padding: 8px; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-user-select: none; }
15 .select2-results__option--selectable { cursor: pointer; }
16 .select2-container--open .select2-dropdown { left: 0; }
17 .select2-container--open .select2-dropdown--above { border-bottom: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
18 .select2-container--open .select2-dropdown--below { border-top: none; border-top-left-radius: 0; border-top-right-radius: 0; }
19 .select2-search--dropdown { display: block; padding: 4px; }
20 .select2-search--dropdown .select2-search__field { padding: 4px; width: 100%; box-sizing: border-box; }
21 .select2-search--dropdown .select2-search__field::-webkit-search-cancel-button { -webkit-appearance: none; }
22 .select2-search--dropdown.select2-search--hide { display: none; }
23 .select2-close-mask { border: 0; margin: 0; padding: 0; display: block; position: fixed; left: 0; top: 0; min-height: 100%; min-width: 100%; height: auto; width: auto; opacity: 0; z-index: 99; background-color: #fff; filter: alpha(opacity=0); }
24 .select2-hidden-accessible { border: 0 !important; clip: rect(0 0 0 0) !important; -webkit-clip-path: inset(50%) !important; clip-path: inset(50%) !important; height: 1px !important; overflow: hidden !important; padding: 0 !important; position: absolute !important; width: 1px !important; white-space: nowrap !important; }
25 .select2-container--default .select2-selection--single { background-color: #fff; border: 1px solid #aaa; border-radius: 4px; }
26 .select2-container--default .select2-selection--single .select2-selection__rendered { color: #444; line-height: 28px; }
27 .select2-container--default .select2-selection--single .select2-selection__clear { cursor: pointer; float: right; font-weight: bold; height: 26px; margin-right: 20px; padding-right: 0; }
28 .select2-container--default .select2-selection--single .select2-selection__placeholder { color: #999; }
29 .select2-container--default .select2-selection--single .select2-selection__arrow { height: 26px; position: absolute; top: 1px; right: 1px; width: 20px; }
30 .select2-container--default .select2-selection--single .select2-selection__arrow b { border-color: #888 transparent transparent transparent; border-style: solid; border-width: 5px 4px 0 4px; height: 0; left: 50%; margin-left: -4px; margin-top: -2px; position: absolute; top: 50%; width: 0; }
31 .select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__clear { float: left; }
32 .select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__arrow { left: 1px; right: auto; }
33 .select2-container--default.select2-container--disabled .select2-selection--single { background-color: #eee; cursor: default; }
34 .select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__clear { display: none; }
35 .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b { border-color: transparent transparent #888 transparent; border-width: 0 4px 5px 4px; }
36 .select2-container--default .select2-selection--multiple { background-color: white; border: 1px solid #aaa; border-radius: 4px; cursor: text; padding: 8px 8px 0px 8px; position: relative; }
37 .select2-container--default .select2-selection--multiple.select2-selection--clearable { padding-right: 25px; }
38 .select2-container--default .select2-selection--multiple .select2-selection__clear { cursor: pointer; font-weight: bold; height: 20px; margin-right: 10px; margin-top: 5px; position: absolute; right: 0; padding: 1px; }
39 .select2-container--default .select2-selection--multiple .select2-selection__choice { background-color: #e4e4e4; border: 1px solid #aaa; border-radius: 4px; box-sizing: border-box; display: inline-block; margin-right: 8px; margin-bottom: 8px; padding: 0; padding-left: 20px; position: relative; max-width: 100%; overflow: hidden; text-overflow: ellipsis; vertical-align: bottom; white-space: nowrap; }
40 .select2-container--default .select2-selection--multiple .select2-selection__choice__display { cursor: default; padding-left: 2px; padding-right: 5px; }
41 .select2-container--default .select2-selection--multiple .select2-selection__choice__remove { background-color: transparent; border: none; border-right: 1px solid #aaa; border-top-left-radius: 4px; border-bottom-left-radius: 4px; color: #999; cursor: pointer; font-size: 1em; font-weight: bold; padding: 0 4px; position: absolute; left: 0; top: 0; }
42
43 .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover,
44 .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:focus { background-color: #f1f1f1; color: #333; outline: none; }
45 .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice { margin-left: 5px; margin-right: auto; }
46 .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice__display { padding-left: 5px; padding-right: 2px; }
47 .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove { border-left: 1px solid #aaa; border-right: none; border-top-left-radius: 0; border-bottom-left-radius: 0; border-top-right-radius: 4px; border-bottom-right-radius: 4px; }
48 .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__clear { float: left; margin-left: 10px; margin-right: auto; }
49 .select2-container--default.select2-container--focus .select2-selection--multiple { border: solid black 1px; outline: 0; }
50 .select2-container--default.select2-container--disabled .select2-selection--multiple { background-color: #eee; cursor: default; }
51 .select2-container--default.select2-container--disabled .select2-selection__choice__remove { display: none; }
52
53 .select2-container--default.select2-container--open.select2-container--above .select2-selection--single,
54 .select2-container--default.select2-container--open.select2-container--above .select2-selection--multiple { border-top-left-radius: 0; border-top-right-radius: 0; }
55
56 .select2-container--default.select2-container--open.select2-container--below .select2-selection--single,
57 .select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple { border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
58 .select2-container--default .select2-search--dropdown .select2-search__field { border: 1px solid #aaa; }
59 .select2-container--default .select2-search--inline .select2-search__field { background: transparent; border: none; outline: 0; box-shadow: none; -webkit-appearance: textfield; line-height: normal;}
60 .select2-container--default .select2-results > .select2-results__options { max-height: 200px; overflow-y: auto; }
61 .select2-container--default .select2-results__option .select2-results__option { padding-left: 16px; }
62 .select2-container--default .select2-results__option .select2-results__option .select2-results__group { padding-left: 0; }
63 .select2-container--default .select2-results__option .select2-results__option .select2-results__option { margin-left: -1em; padding-left: 2em; }
64 .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -2em; padding-left: 3em; }
65 .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -3em; padding-left: 4em; }
66 .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -4em; padding-left: 5em; }
67 .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -5em; padding-left: 6em; }
68 .select2-container--default .select2-results__option--group { padding: 0; }
69 .select2-container--default .select2-results__option--disabled { color: #999; }
70 .select2-container--default .select2-results__option--selected { background-color: rgb(34 113 177 / 20%); }
71 .select2-container--default .select2-results__option--highlighted.select2-results__option--selectable { background-color: #2271b1; color: white; }
72 .select2-container--default .select2-results__group { cursor: default; display: block; padding: 6px 8px; background: #eeeeee; }
73 .select2-container--classic .select2-selection--single { background-color: #f7f7f7; border: 1px solid #aaa; border-radius: 4px; outline: 0; background-image: linear-gradient(to bottom, #fff 50%, #eee 100%); background-repeat: repeat-x; filter: progid:dximagetransform.microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0); }
74 .select2-container--classic .select2-selection--single:focus { border: 1px solid #5897fb; }
75 .select2-container--classic .select2-selection--single .select2-selection__rendered { color: #444; line-height: 28px; }
76 .select2-container--classic .select2-selection--single .select2-selection__clear { cursor: pointer; float: right; font-weight: bold; height: 26px; margin-right: 20px; }
77 .select2-container--classic .select2-selection--single .select2-selection__placeholder { color: #999; }
78 .select2-container--classic .select2-selection--single .select2-selection__arrow { background-color: #ddd; border: none; border-left: 1px solid #aaa; border-top-right-radius: 4px; border-bottom-right-radius: 4px; height: 26px; position: absolute; top: 1px; right: 1px; width: 20px; background-image: linear-gradient(to bottom, #eee 50%, #ccc 100%); background-repeat: repeat-x; filter: progid:dximagetransform.microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFCCCCCC', GradientType=0); }
79 .select2-container--classic .select2-selection--single .select2-selection__arrow b { border-color: #888 transparent transparent transparent; border-style: solid; border-width: 5px 4px 0 4px; height: 0; left: 50%; margin-left: -4px; margin-top: -2px; position: absolute; top: 50%; width: 0; }
80 .select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__clear { float: left; }
81 .select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__arrow { border: none; border-right: 1px solid #aaa; border-radius: 0; border-top-left-radius: 4px; border-bottom-left-radius: 4px; left: 1px; right: auto; }
82 .select2-container--classic.select2-container--open .select2-selection--single { border: 1px solid #5897fb; }
83 .select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow { background: transparent; border: none; }
84 .select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow b { border-color: transparent transparent #888 transparent; border-width: 0 4px 5px 4px; }
85 .select2-container--classic.select2-container--open.select2-container--above .select2-selection--single { border-top: none; border-top-left-radius: 0; border-top-right-radius: 0; background-image: linear-gradient(to bottom, #fff 0%, #eee 50%); background-repeat: repeat-x; filter: progid:dximagetransform.microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0); }
86 .select2-container--classic.select2-container--open.select2-container--below .select2-selection--single { border-bottom: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; background-image: linear-gradient(to bottom, #eee 50%, #fff 100%); background-repeat: repeat-x; filter: progid:dximagetransform.microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFFFFFFF', GradientType=0); }
87 .select2-container--classic .select2-selection--multiple { background-color: white; border: 1px solid #aaa; border-radius: 4px; cursor: text; outline: 0; padding-bottom: 5px; padding-right: 5px; }
88 .select2-container--classic .select2-selection--multiple:focus { border: 1px solid #5897fb; }
89 .select2-container--classic .select2-selection--multiple .select2-selection__clear { display: none; }
90 .select2-container--classic .select2-selection--multiple .select2-selection__choice { background-color: #e4e4e4; border: 1px solid #aaa; border-radius: 4px; display: inline-block; margin-left: 5px; margin-top: 5px; padding: 0; }
91 .select2-container--classic .select2-selection--multiple .select2-selection__choice__display { cursor: default; padding-left: 2px; padding-right: 5px; }
92 .select2-container--classic .select2-selection--multiple .select2-selection__choice__remove { background-color: transparent; border: none; border-top-left-radius: 4px; border-bottom-left-radius: 4px; color: #888; cursor: pointer; font-size: 1em; font-weight: bold; padding: 0 4px; }
93 .select2-container--classic .select2-selection--multiple .select2-selection__choice__remove:hover { color: #555; outline: none; }
94 .select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice { margin-left: 5px; margin-right: auto; }
95 .select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice__display { padding-left: 5px; padding-right: 2px; }
96 .select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove { border-top-left-radius: 0; border-bottom-left-radius: 0; border-top-right-radius: 4px; border-bottom-right-radius: 4px; }
97 .select2-container--classic.select2-container--open .select2-selection--multiple { border: 1px solid #5897fb; }
98 .select2-container--classic.select2-container--open.select2-container--above .select2-selection--multiple { border-top: none; border-top-left-radius: 0; border-top-right-radius: 0; }
99 .select2-container--classic.select2-container--open.select2-container--below .select2-selection--multiple { border-bottom: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
100 .select2-container--classic .select2-search--dropdown .select2-search__field { border: 1px solid #aaa; outline: 0; }
101 .select2-container--classic .select2-search--inline .select2-search__field { outline: 0; box-shadow: none; }
102 .select2-container--classic .select2-dropdown { background-color: #fff; border: 1px solid transparent; }
103 .select2-container--classic .select2-dropdown--above { border-bottom: none; }
104 .select2-container--classic .select2-dropdown--below { border-top: none; }
105 .select2-container--classic .select2-results > .select2-results__options { max-height: 200px; overflow-y: auto; }
106 .select2-container--classic .select2-results__option--group { padding: 0; }
107 .select2-container--classic .select2-results__option--disabled { color: grey; }
108 .select2-container--classic .select2-results__option--highlighted.select2-results__option--selectable { background-color: #3875d7; color: #fff; }
109 .select2-container--classic .select2-results__group { cursor: default; display: block; padding: 6px; }
110 .select2-container--classic.select2-container--open .select2-dropdown { border-color: #5897fb; }
111
112 /**
113 * Breakpoints
114 */
115 /**
116 * Colours
117 */
118 .hide {
119 display: none !important;
120 }
121
122 .small {
123 font-size: 85%;
124 }
125
126 .d-block {
127 display: block !important;
128 }
129
130 .d-flex {
131 display: flex !important;
132 flex-wrap: wrap;
133 }
134
135 .justify-content-center {
136 justify-content: center;
137 }
138
139 .justify-content-end {
140 justify-content: flex-end;
141 }
142
143 .justify-content-between {
144 justify-content: space-between;
145 }
146
147 .align-content-center {
148 align-content: center;
149 }
150
151 .align-items-center {
152 align-items: center;
153 }
154
155 .col {
156 flex: 1 0 0%;
157 box-sizing: border-box;
158 }
159
160 .w-25 {
161 flex: 0 0 auto;
162 width: 25%;
163 }
164
165 .w-30 {
166 flex: 0 0 auto;
167 width: 30%;
168 }
169
170 .w-33 {
171 flex: 0 0 auto;
172 width: 33.33333333%;
173 }
174
175 .w-40 {
176 flex: 0 0 auto;
177 width: 40%;
178 }
179
180 .w-50 {
181 flex: 0 0 auto;
182 width: 50%;
183 }
184
185 .w-60 {
186 flex: 0 0 auto;
187 width: 60%;
188 }
189
190 .w-70 {
191 flex: 0 0 auto;
192 width: 70%;
193 }
194
195 .w-75 {
196 flex: 0 0 auto;
197 width: 75%;
198 }
199
200 .w-80 {
201 flex: 0 0 auto;
202 width: 80%;
203 }
204
205 .w-100 {
206 flex: 1 0 100%;
207 }
208
209 .w-auto {
210 width: auto !important;
211 }
212
213 .rounded {
214 border-radius: 8px;
215 }
216
217 .bg-white {
218 background-color: #fff;
219 }
220
221 .p-20 {
222 padding: 20px;
223 }
224
225 .text-truncate {
226 display: block;
227 white-space: nowrap;
228 overflow: hidden;
229 text-overflow: ellipsis;
230 }
231
232 .text-left {
233 text-align: left;
234 }
235
236 .text-right {
237 text-align: right;
238 }
239
240 .text-uppercase {
241 text-transform: uppercase;
242 }
243
244 .text-muted {
245 color: #777777;
246 }
247
248 .ms-auto {
249 margin-left: auto;
250 }
251
252 .mt-0 {
253 margin-top: 0;
254 }
255
256 .mb-0 {
257 margin-bottom: 0;
258 }
259
260 .loader {
261 height: 100px;
262 background-size: 50px 50px;
263 background-repeat: no-repeat;
264 background-position: center;
265 background-color: #f7f7f7;
266 background-image: url("data:image/svg+xml,%3Csvg version='1.1' id='L9' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 100 100' enable-background='new 0 0 0 0' xml:space='preserve'%3E%3Cpath fill='%23000' d='M73,50c0-12.7-10.3-23-23-23S27,37.3,27,50 M30.9,50c0-10.5,8.5-19.1,19.1-19.1S69.1,39.5,69.1,50'%3E%3CanimateTransform attributeName='transform' attributeType='XML' type='rotate' dur='1s' from='0 50 50' to='360 50 50' repeatCount='indefinite' /%3E%3C/path%3E%3C/svg%3E");
267 }
268
269 /* Global */
270 #wpcontent {
271 padding-left: 0 !important;
272 }
273
274 #screen-meta {
275 margin: 0 -20px;
276 }
277 @media screen and (max-width: 767px) {
278 #screen-meta {
279 margin: 0 0 0 -12px;
280 border-left: 0;
281 border-right: 0;
282 }
283 }
284
285 #wpbody {
286 padding-left: 20px;
287 }
288 @media screen and (max-width: 767px) {
289 #wpbody {
290 padding-top: 0;
291 padding-left: 12px;
292 }
293 }
294
295 .wrap.notifier {
296 margin-top: 20px;
297 }
298
299 /* Meta Fields */
300 .meta-fields .form-field {
301 position: relative;
302 }
303 .meta-fields .form-field label.form-label,
304 .meta-fields .form-field legend {
305 font-size: 14px;
306 font-weight: 500;
307 display: block;
308 margin-bottom: 5px;
309 }
310 .meta-fields .form-field label .limit-text {
311 float: right;
312 color: #999;
313 }
314 .meta-fields .form-field input[type=text],
315 .meta-fields .form-field input[type=password],
316 .meta-fields .form-field textarea,
317 .meta-fields .form-field select {
318 width: 100%;
319 max-width: 100%;
320 }
321 @media screen and (max-width: 767px) {
322 .meta-fields .form-field input[type=text],
323 .meta-fields .form-field input[type=password],
324 .meta-fields .form-field textarea,
325 .meta-fields .form-field select {
326 width: 100%;
327 }
328 }
329 .meta-fields .form-field input[disabled=disabled],
330 .meta-fields .form-field textarea[disabled=disabled],
331 .meta-fields .form-field select[disabled=disabled] {
332 background-color: #f6f7f7;
333 cursor: not-allowed;
334 }
335 .meta-fields .form-field *:disabled {
336 background-color: #f6f7f7;
337 }
338 .meta-fields .form-field .radio-buttons {
339 margin: 0;
340 }
341 .meta-fields .form-field .radio-buttons li {
342 display: inline-block;
343 margin-right: 20px;
344 }
345 .meta-fields .form-field .radio-buttons li label {
346 display: inline-block;
347 width: auto;
348 }
349 .meta-fields .form-field .fields-repeater {
350 width: 100%;
351 border-collapse: collapse;
352 }
353 .meta-fields .form-field .fields-repeater th {
354 text-align: left;
355 font-size: 13px;
356 font-weight: normal;
357 border: 1px solid #a8a6a6;
358 padding: 10px;
359 background-color: #f7f7f7;
360 }
361 .meta-fields .form-field .fields-repeater td {
362 width: 50%;
363 border: 1px solid #a8a6a6;
364 padding: 10px;
365 vertical-align: top;
366 }
367 .meta-fields .form-field .fields-repeater td input,
368 .meta-fields .form-field .fields-repeater td select,
369 .meta-fields .form-field .fields-repeater td textarea {
370 width: 100%;
371 }
372 .meta-fields .form-field .fields-repeater td.delete-repeater-field {
373 min-width: 20px;
374 text-align: center;
375 }
376 .meta-fields .form-field .fields-repeater td.delete-repeater-field span {
377 margin-top: 5px;
378 cursor: pointer;
379 }
380 .meta-fields fieldset.form-field {
381 font-size: 13px;
382 line-height: 1.5;
383 margin: 1em 0;
384 }
385 .meta-fields h3 {
386 margin-bottom: 5px;
387 font-size: 14px;
388 }
389 .meta-fields h4 {
390 margin-bottom: 0;
391 }
392 .meta-fields hr {
393 margin: 20px auto;
394 }
395 .meta-fields .optional-text {
396 color: #999;
397 font-weight: normal;
398 }
399 .meta-fields .description {
400 font-size: 12px;
401 margin-top: 5px;
402 display: inline-block;
403 color: #555;
404 }
405 @media screen and (max-width: 767px) {
406 .meta-fields .col {
407 flex: 0 0 100%;
408 }
409 }
410
411 .notifier-media-preview {
412 display: block;
413 }
414
415 .notifier-notice {
416 margin-top: 20px;
417 margin-left: 0;
418 }
419
420 table.wp-list-table {
421 border: 1px solid #eee;
422 box-shadow: none;
423 border-radius: 8px;
424 }
425 table.wp-list-table thead td,
426 table.wp-list-table thead th {
427 padding-top: 5px !important;
428 padding-bottom: 5px !important;
429 border-bottom: 1px solid #eee;
430 }
431 table.wp-list-table tfoot td,
432 table.wp-list-table tfoot th {
433 padding-top: 5px !important;
434 padding-bottom: 5px !important;
435 border-top: 1px solid #eee;
436 }
437
438 .notifier-toggle-switch input[type=checkbox] {
439 position: relative;
440 -webkit-appearance: none;
441 -moz-appearance: none;
442 appearance: none;
443 width: 32px;
444 height: 16px;
445 background: #ccc;
446 border-radius: 40px;
447 box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
448 cursor: pointer;
449 transition: 0.2s;
450 border: none;
451 outline: none;
452 }
453 .notifier-toggle-switch input:checked[type=checkbox] {
454 -webkit-appearance: none;
455 -moz-appearance: none;
456 appearance: none;
457 background: #00c417;
458 }
459 .notifier-toggle-switch input[type=checkbox]::before {
460 content: none;
461 }
462 .notifier-toggle-switch input[type=checkbox]::after {
463 position: absolute;
464 content: "";
465 width: 16px;
466 height: 16px;
467 top: 0;
468 left: 0;
469 background: #fff;
470 border-radius: 50%;
471 box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
472 transform: scale(1.1);
473 transition: 0.2s;
474 }
475 .notifier-toggle-switch input:checked[type=checkbox]::after {
476 left: 50%;
477 }
478
479 .select2-results__option {
480 margin-bottom: 0px;
481 }
482
483 @media screen and (max-width: 767px) {
484 #notifier-admin-header {
485 padding-top: 46px;
486 }
487 }
488 #notifier-admin-header .header-logo {
489 display: inline-block;
490 margin-right: 15px;
491 width: 35px;
492 height: 35px;
493 align-self: center;
494 }
495 #notifier-admin-header .header-logo img {
496 width: 100%;
497 height: 100%;
498 }
499 @media screen and (max-width: 767px) {
500 #notifier-admin-header .header-logo {
501 margin-right: 10px;
502 }
503 }
504 #notifier-admin-header .notifier-admin-header-content {
505 background: #fff;
506 box-sizing: border-box;
507 width: 100%;
508 top: 32px;
509 z-index: 1001;
510 padding: 0 20px;
511 height: 70px;
512 display: flex;
513 align-content: center;
514 align-items: center;
515 justify-content: space-between;
516 border-bottom: 1px solid #eee;
517 }
518 @media screen and (max-width: 767px) {
519 #notifier-admin-header .notifier-admin-header-content {
520 padding: 0 12px;
521 }
522 }
523 #notifier-admin-header .notifier-admin-header-content.sticky {
524 box-shadow: 0 8px 8px 0 rgba(85, 93, 102, 0.3);
525 }
526 @media screen and (max-width: 767px) {
527 #notifier-admin-header .notifier-admin-header-content .header-page-title {
528 flex: 1;
529 }
530 }
531 @media screen and (max-width: 767px) {
532 #notifier-admin-header .notifier-admin-header-content .header-menu-items {
533 flex: 1;
534 justify-content: flex-end;
535 }
536 }
537 #notifier-admin-header .notifier-admin-header-content .header-menu-items ul {
538 margin: 0;
539 }
540 #notifier-admin-header .notifier-admin-header-content .header-menu-items ul li {
541 display: inline-block;
542 margin-bottom: 0;
543 }
544 #notifier-admin-header .notifier-admin-header-content .header-menu-items ul li:last-child {
545 border-right: 0;
546 }
547 #notifier-admin-header .notifier-admin-header-content .header-menu-items ul li a {
548 text-decoration: none;
549 padding: 0 20px;
550 display: block;
551 }
552 @media screen and (max-width: 767px) {
553 #notifier-admin-header .notifier-admin-header-content .header-menu-items ul li a {
554 padding: 0 10px;
555 }
556 }
557 #notifier-admin-header .notifier-admin-header-content .header-menu-items ul li a.active {
558 color: #555;
559 }
560 @media screen and (max-width: 767px) {
561 #notifier-admin-header .notifier-admin-header-content .header-action-links {
562 display: none !important;
563 }
564 }
565 #notifier-admin-header .notifier-admin-header-content .header-action-links > * {
566 text-decoration: none;
567 padding: 0 10px;
568 display: inline-block;
569 }
570 #notifier-admin-header .notifier-admin-header-content .header-action-links > *.header-version {
571 color: #777;
572 }
573
574 .onboarding {
575 max-width: 600px;
576 margin: 0 auto;
577 background: #fff;
578 border-radius: 10px;
579 box-shadow: 0 8px 8px 0 rgba(85, 93, 102, 0.1);
580 }
581 .onboarding .onboarding-head {
582 padding: 20px;
583 border-bottom: 1px solid #eee;
584 }
585 .onboarding .onboarding-head h1,
586 .onboarding .onboarding-head h2,
587 .onboarding .onboarding-head h3 {
588 margin: 0;
589 }
590 .onboarding .onboarding-head p {
591 margin-bottom: 0;
592 }
593 .onboarding .onboarding-body {
594 padding: 20px;
595 }
596 .onboarding .onboarding-body h1,
597 .onboarding .onboarding-body h2,
598 .onboarding .onboarding-body h3,
599 .onboarding .onboarding-body p:first-child {
600 margin-top: 0;
601 }
602 .onboarding .onboarding-body p:last-child {
603 margin-bottom: 0;
604 }
605 .onboarding .onboarding-footer {
606 padding: 20px;
607 border-top: 1px solid #eee;
608 }
609
610 .dashboard-boxes {
611 display: flex;
612 flex-wrap: wrap;
613 margin-left: -10px;
614 margin-right: -10px;
615 }
616 .dashboard-boxes .col {
617 padding: 0 10px;
618 }
619 @media screen and (max-width: 992px) {
620 .dashboard-boxes > .col:not(.w-100) {
621 flex: 0 0 50% !important;
622 }
623 }
624 @media screen and (max-width: 767px) {
625 .dashboard-boxes > .col:not(.w-100) {
626 flex: 0 0 100% !important;
627 }
628 }
629 .dashboard-boxes .dashboard-box {
630 border-radius: 8px;
631 background-color: #fff;
632 display: flex;
633 flex-direction: column;
634 margin-bottom: 20px;
635 }
636 .dashboard-boxes .dashboard-box.dashboard-box-top {
637 height: auto;
638 }
639 @media screen and (max-width: 767px) {
640 .dashboard-boxes .dashboard-box.dashboard-box-top .w-25 {
641 flex: 0 0 100%;
642 }
643 }
644 .dashboard-boxes .dashboard-box .dashboard-box-head {
645 padding: 15px 20px;
646 border-bottom: 1px solid #eee;
647 }
648 @media screen and (max-width: 767px) {
649 .dashboard-boxes .dashboard-box .dashboard-box-head {
650 padding: 12px;
651 }
652 }
653 .dashboard-boxes .dashboard-box .dashboard-box-head h2,
654 .dashboard-boxes .dashboard-box .dashboard-box-head h3 {
655 margin: 0;
656 }
657 @media screen and (max-width: 767px) {
658 .dashboard-boxes .dashboard-box .dashboard-box-head h2,
659 .dashboard-boxes .dashboard-box .dashboard-box-head h3 {
660 font-size: 16px;
661 }
662 }
663 .dashboard-boxes .dashboard-box .dashboard-box-body {
664 padding: 15px 20px;
665 }
666 @media screen and (max-width: 767px) {
667 .dashboard-boxes .dashboard-box .dashboard-box-body {
668 padding: 12px;
669 }
670 }
671 .dashboard-boxes .dashboard-box .dashboard-box-body *:first-child {
672 margin-top: 0;
673 }
674 .dashboard-boxes .dashboard-box .dashboard-box-body h3 {
675 font-size: 1.2em;
676 }
677 .dashboard-boxes .dashboard-box .dashboard-box-body table {
678 width: 100%;
679 }
680 .dashboard-boxes .dashboard-box .dashboard-box-body table th,
681 .dashboard-boxes .dashboard-box .dashboard-box-body table td {
682 text-align: left;
683 vertical-align: top;
684 }
685 .dashboard-boxes .dashboard-box .dashboard-box-body table th:first-child,
686 .dashboard-boxes .dashboard-box .dashboard-box-body table td:first-child {
687 width: 20%;
688 }
689 .dashboard-boxes .dashboard-box .dashboard-box-body.how-to ul {
690 list-style: inherit;
691 padding-left: 20px;
692 margin-bottom: 10px;
693 }
694 .dashboard-boxes .dashboard-box .dashboard-box-body .dashicons-marker {
695 color: #ccc;
696 }
697 .dashboard-boxes .dashboard-box .dashboard-box-body .dashicons-yes-alt {
698 color: #01a401;
699 }
700 .dashboard-boxes .dashboard-box .dashboard-box-footer {
701 margin-top: auto;
702 padding: 15px 20px;
703 }
704 .dashboard-boxes .dashboard-box .dashboard-box-footer .dashboard-box-buttons-wrap {
705 text-align: right;
706 }
707 .dashboard-boxes .dashboard-box .dashboard-box-footer .dashboard-box-buttons-wrap .button {
708 margin-left: 10px;
709 }
710
711 #wa-notifier-api-key {
712 width: 100%;
713 margin-bottom: 10px;
714 }
715
716 .notifier-triggers-group-wrap {
717 margin-bottom: 30px;
718 }
719 .notifier-triggers-group-wrap .notifier-trigger-wrap {
720 margin-bottom: 20px;
721 }
722 .notifier-triggers-group-wrap .notifier-trigger-wrap .notifier-trigger-label {
723 font-size: 16px;
724 }
725 .notifier-triggers-group-wrap .notifier-trigger-wrap .notifier-trigger-label input[type=checkbox] {
726 -webkit-appearance: none;
727 -moz-appearance: none;
728 appearance: none;
729 margin: 0;
730 font: inherit;
731 color: #697a8d;
732 width: 20px;
733 height: 20px;
734 border: 2px solid #697a8d;
735 border-radius: 3px;
736 background-color: transparent;
737 outline: none !important;
738 margin-right: 10px;
739 }
740 .notifier-triggers-group-wrap .notifier-trigger-wrap .notifier-trigger-label input[type=checkbox]::before {
741 content: "";
742 }
743 .notifier-triggers-group-wrap .notifier-trigger-wrap .notifier-trigger-label input[type=checkbox]:checked {
744 color: white;
745 background: #0396a1;
746 border-color: #0396a1;
747 box-shadow: none;
748 }
749 .notifier-triggers-group-wrap .notifier-trigger-wrap .notifier-trigger-label input[type=checkbox]:checked::before {
750 content: "\f147";
751 font-family: "dashicons";
752 font-size: 20px;
753 display: block;
754 position: absolute;
755 height: 18px;
756 width: 18px;
757 margin-top: -1px;
758 margin-left: -3px;
759 }
760 .notifier-triggers-group-wrap .notifier-trigger-wrap .notifier-trigger-label .notifier-show-trigger-info {
761 border: 0;
762 background: none;
763 padding: 0;
764 cursor: pointer;
765 color: #aaa;
766 }
767 .notifier-triggers-group-wrap .notifier-trigger-wrap .notifier-trigger-info {
768 background: #f7f7f7;
769 padding: 10px;
770 margin-top: 10px;
771 border: 1px solid #eee;
772 border-radius: 10px;
773 }
774
775 .notifier-overview-image {
776 float: right;
777 display: inline-block;
778 width: 100%;
779 height: auto;
780 max-width: 250px;
781 margin-left: 30px;
782 }
783 @media screen and (max-width: 767px) {
784 .notifier-overview-image {
785 float: none;
786 }
787 .notifier-overview-image img {
788 max-width: none;
789 }
790 }
791
792 .notifier-settings-form-profile .notifier-profile-fields-right {
793 margin-left: 50px;
794 margin-top: 100px;
795 }
796 @media screen and (max-width: 767px) {
797 .notifier-settings-form-profile .notifier-profile-fields-right {
798 display: none;
799 }
800 }
801
802 .notifier-fields-table {
803 width: 100%;
804 max-width: 700px;
805 }
806 .notifier-fields-table tr th {
807 vertical-align: top;
808 text-align: left;
809 padding: 20px 10px 20px 0;
810 width: 200px;
811 line-height: 1.3;
812 font-weight: 600;
813 }
814 @media screen and (max-width: 767px) {
815 .notifier-fields-table tr th {
816 display: block;
817 width: 100%;
818 padding: 10px 0 5px 0;
819 }
820 }
821 .notifier-fields-table tr th.section-title {
822 padding: 0;
823 }
824 .notifier-fields-table tr td {
825 margin-bottom: 9px;
826 padding: 15px 10px;
827 line-height: 1.3;
828 vertical-align: middle;
829 }
830 @media screen and (max-width: 767px) {
831 .notifier-fields-table tr td {
832 display: block;
833 width: 100%;
834 padding: 0;
835 }
836 }
837 .notifier-fields-table tr h3 {
838 margin-bottom: 0px;
839 }
840 .notifier-fields-table tr .description {
841 font-weight: normal;
842 }
843 .notifier-fields-table input:not([type=button]):not([type=radio]):not([type=checkbox]),
844 .notifier-fields-table textarea,
845 .notifier-fields-table select {
846 width: 100%;
847 max-width: none;
848 }
849 .notifier-fields-table #notifier_ctc_enable {
850 max-width: 16px;
851 height: 16px;
852 }
853
854 .notifier-chat-btn-image-url {
855 display: none;
856 }
857
858 .disabled-field {
859 background: #fff !important;
860 opacity: 0.5;
861 pointer-events: none;
862 }
863
864 .post-type-wa_notifier_trigger #minor-publishing-actions #save-action,
865 .post-type-wa_notifier_trigger #misc-publishing-actions {
866 display: none;
867 }
868 .post-type-wa_notifier_trigger #minor-publishing-actions {
869 padding: 15px 10px;
870 text-align: left;
871 }
872 .post-type-wa_notifier_trigger .trigger-fields-wrap {
873 margin: 1em 0;
874 }
875 .post-type-wa_notifier_trigger .notifier-trigger-merge-tags {
876 margin-bottom: 5px;
877 }
878 .post-type-wa_notifier_trigger .notifier-trigger-merge-tags .notifier-merge-tags-wrap {
879 padding: 10px 10px 5px 10px;
880 border: 1px solid #8c8f94;
881 border-radius: 3px;
882 }
883 .post-type-wa_notifier_trigger .notifier-trigger-merge-tags .notifier-merge-tags-wrap .notifier-merge-tags {
884 flex-wrap: nowrap;
885 margin-bottom: 15px;
886 padding-bottom: 10px;
887 border-bottom: 1px solid #dddddd;
888 }
889 .post-type-wa_notifier_trigger .notifier-trigger-merge-tags .notifier-merge-tags-wrap .notifier-merge-tags:last-child {
890 margin-bottom: 0;
891 border-bottom: 0px;
892 }
893 @media screen and (max-width: 767px) {
894 .post-type-wa_notifier_trigger .notifier-trigger-merge-tags .notifier-merge-tags-wrap .notifier-merge-tags {
895 flex-wrap: wrap;
896 }
897 }
898 .post-type-wa_notifier_trigger .notifier-trigger-merge-tags .notifier-merge-tags-wrap .notifier-merge-tags legend.form-label {
899 font-size: 13px;
900 min-width: 120px;
901 max-width: 120px;
902 font-weight: 500;
903 margin-bottom: 5px;
904 margin-top: 1px;
905 }
906 .post-type-wa_notifier_trigger .notifier-trigger-merge-tags .notifier-merge-tags-wrap .notifier-merge-tags .multi-checkbox-wrapper {
907 flex-grow: 1;
908 max-height: 105px;
909 overflow: auto;
910 }
911 @media screen and (max-width: 767px) {
912 .post-type-wa_notifier_trigger .notifier-trigger-merge-tags .notifier-merge-tags-wrap .notifier-merge-tags .multi-checkbox-wrapper {
913 max-height: 150px;
914 }
915 }
916 .post-type-wa_notifier_trigger .notifier-trigger-merge-tags .notifier-merge-tags-wrap .notifier-merge-tags .multi-checkbox-wrapper .form-check {
917 display: inline-block;
918 margin-bottom: 5px;
919 width: 25%;
920 }
921 .post-type-wa_notifier_trigger .notifier-trigger-merge-tags .notifier-merge-tags-wrap .notifier-merge-tags .multi-checkbox-wrapper .form-check .form-check-label {
922 width: auto;
923 display: block;
924 white-space: nowrap;
925 overflow: hidden;
926 text-overflow: ellipsis;
927 }
928 @media screen and (max-width: 1440px) {
929 .post-type-wa_notifier_trigger .notifier-trigger-merge-tags .notifier-merge-tags-wrap .notifier-merge-tags .multi-checkbox-wrapper .form-check {
930 width: 33.33%;
931 }
932 }
933 @media screen and (max-width: 1024px) {
934 .post-type-wa_notifier_trigger .notifier-trigger-merge-tags .notifier-merge-tags-wrap .notifier-merge-tags .multi-checkbox-wrapper .form-check {
935 width: 50%;
936 }
937 }
938 @media screen and (max-width: 767px) {
939 .post-type-wa_notifier_trigger .notifier-trigger-merge-tags .notifier-merge-tags-wrap .notifier-merge-tags .multi-checkbox-wrapper .form-check {
940 width: 100%;
941 }
942 }
943
944 .notifier-click-to-chat-btn {
945 position: fixed;
946 bottom: 20px;
947 right: 20px;
948 cursor: pointer;
949 z-index: 99999999;
950 }
951 .notifier-click-to-chat-btn a {
952 text-decoration: none !important;
953 display: inline-block;
954 outline: none !important;
955 }
956 .notifier-click-to-chat-btn a:hover, .notifier-click-to-chat-btn a:focus {
957 text-decoration: none !important;
958 }
959 .notifier-click-to-chat-btn.notifier-click-to-chat-style-3 a {
960 display: flex;
961 justify-content: center;
962 align-items: center;
963 background-color: #e4e4e4;
964 color: #7f7d7d;
965 padding: 0 12px;
966 border-radius: 25px;
967 font-size: 13px;
968 line-height: 32px;
969 }
970 .notifier-click-to-chat-btn.notifier-click-to-chat-style-4 a {
971 display: flex;
972 padding: 0 2rem;
973 letter-spacing: 0.5px;
974 transition: 0.2s ease-out;
975 text-align: center;
976 justify-content: center;
977 align-items: center;
978 border-radius: 2px;
979 height: 36px;
980 line-height: 36px;
981 vertical-align: middle;
982 box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2);
983 box-sizing: inherit;
984 background-color: #26a69a;
985 color: #fff;
986 }
987 .notifier-click-to-chat-btn.notifier-click-to-chat-style-custom img {
988 width: 100%;
989 height: auto;
990 max-width: 150px;
991 max-height: 150px;
992 -o-object-fit: cover;
993 object-fit: cover;
994 }
995