PluginProbe
Automatic YouTube Gallery – Embed Auto-Updating YouTube Video Galleries, Feeds, Playlists & Channels / 2.6.4
Automatic YouTube Gallery – Embed Auto-Updating YouTube Video Galleries, Feeds, Playlists & Channels v2.6.4
2.9.1 2.9.0 trunk 1.0.0 1.1.0 1.2.0 1.3.0 1.4.0 1.5.0 1.6.0 1.6.1 1.6.2 1.6.3 1.6.4 1.6.5 2.0.0 2.1.0 2.2.0 2.3.2 2.3.3 2.3.5 2.3.6 2.3.8 2.3.9 2.4.3 All 37 releases
← All changes | admin/assets/css/admin.css +172 -657 trunk2.6.4 View file →
@@ -1,154 +1,31 @@
1 1 /*----------------------------------------------------------------------------------------------
2 2 *
3 - * Base
3 + * Global
4 4 *
5 5 *--------------------------------------------------------------------------------------------*/
6 -.ayg .widefat {
7 - max-width: 100%;
6 +.ayg-margin-bottom {
7 + margin-bottom: 1em;
8 8 }
9 9
10 -.ayg .spinner {
11 - float: none;
12 - visibility: visible;
13 - margin: 0;
10 +.ayg-text-center {
11 + text-align: center;
14 12 }
15 13
16 -.ayg .ayg-no-margin {
17 - margin: 0;
14 +.ayg-text-error {
15 + color: #EC4338;
18 16 }
19 17
20 -.ayg .ayg-no-padding {
21 - padding: 0;
18 +.ayg-text-success {
19 + color: green;
22 20 }
23 21
24 -.ayg .ayg-text-error {
25 - color: #b31105;
22 +.ayg-ajax-status .spinner {
23 + float: none;
24 + visibility: visible;
26 25 }
27 26
28 -.ayg .ayg-text-success {
29 - color: #008000;
30 -}
31 -
32 -.ayg .ayg-text-info {
33 - color: var(--wp-admin-theme-color, #3858e9);
34 -}
35 -
36 -.ayg .ayg-button {
37 - display: inline-flex;
38 - align-items: center;
39 - justify-content: center;
40 - gap: 0.35em;
41 -}
42 -
43 -@media screen and (max-width: 320px) {
44 - .ayg .button-hero {
45 - width: 100%;
46 - }
47 -}
48 -
49 -/** Animations: Dots */
50 -@keyframes ayg-dots {
51 - 0%, 20% {
52 - content: ".";
53 - }
54 - 40% {
55 - content: "..";
56 - }
57 - 60% {
58 - content: "...";
59 - }
60 - 90%, 100% {
61 - content: "";
62 - }
63 -}
64 -
65 -.ayg .ayg-animate-dots:before {
66 - display: inline-block;
67 - animation: ayg-dots 2s linear infinite;
68 - width: 1.2em;
69 - content: "";
70 -}
71 -
72 -/*----------------------------------------------------------------------------------------------
73 - *
74 - * Accordion
75 - *
76 - *--------------------------------------------------------------------------------------------*/
77 -.ayg details {
78 - transition: box-shadow 0.3s ease;
79 - outline: 1px solid #ddd;
80 - border: 0;
81 - border-radius: 3px;
82 - background-color: #fff;
83 -}
84 -
85 -.ayg details:hover {
86 - box-shadow: 0 1px 4px rgba( 0, 0, 0, 0.08 );
87 -}
88 -
89 -.ayg details[open] {
90 - background-color: #fff;
91 -}
92 -
93 -.ayg details > summary {
94 - display: flex;
95 - align-items: center;
96 - gap: 0.25em;
97 - outline: none;
98 - cursor: pointer;
99 - padding: 0.75em 1em;
100 - list-style: none;
101 - overflow: hidden;
102 -}
103 -
104 -.ayg details > summary > span {
105 - flex: 1;
106 - min-width: 0;
107 - overflow: hidden;
108 - text-overflow: ellipsis;
109 - white-space: nowrap;
110 -}
111 -
112 -.ayg details[open] > summary {
113 - border-bottom: 1px solid #ddd;
114 -}
115 -
116 -.ayg details > summary::after {
117 - display: inline-block;
118 - transform-origin: 50% 50%;
119 - transform: rotate(0deg);
120 - transition: transform 0.2s ease;
121 - margin-left: auto;
122 - width: 16px;
123 - height: 16px;
124 - vertical-align: middle;
125 - line-height: 1;
126 - font-family: dashicons;
127 - font-size: 16px;
128 - content: "\f347";
129 -}
130 -
131 -.ayg details[open] > summary::after {
132 - transform: rotate(180deg);
133 -}
134 -
135 -.ayg details > div,
136 -.ayg details > ol {
137 - margin: 0;
138 - padding: 1em 1.25em;
139 - color: #555;
140 -}
141 -
142 -.ayg details > ol {
143 - list-style-position: inside;
144 -}
145 -
146 -/*----------------------------------------------------------------------------------------------
147 - *
148 - * Tabs
149 - *
150 - *--------------------------------------------------------------------------------------------*/
27 +/* Tabs */
151 28 .ayg .nav-tab {
152 29 border-top-left-radius: 3px;
153 30 border-top-right-radius: 3px;
154 31 padding: 5px 15px;
@@ -157,8 +34,9 @@
157 34 @media screen and (max-width: 782px) {
158 35 .ayg h2.nav-tab-wrapper {
159 36 display: flex;
160 37 flex-wrap: wrap;
38 + justify-content: center;
161 39 gap: 0.5em;
162 40 }
163 41
164 42 .ayg h2.nav-tab-wrapper .nav-tab {
@@ -167,600 +45,267 @@
167 45 }
168 46
169 47 /*----------------------------------------------------------------------------------------------
170 48 *
171 - * Badges
49 + * Dashboard
172 50 *
173 51 *--------------------------------------------------------------------------------------------*/
174 -.ayg .ayg-badge {
175 - display: inline-block;
176 - padding: 0 0.75em;
177 - border: 1px solid transparent;
178 - border-radius: 2px;
179 - font-size: 0.85em;
52 +#ayg-dashboard h1 {
53 + font-size: 2em;
180 54 font-weight: 500;
181 - line-height: 1.8;
182 - white-space: nowrap;
183 55 }
184 56
185 -.ayg .ayg-badge-idle {
186 - background: #f0f0f0;
187 - border-color: #dcdcde;
188 - color: #50575e;
57 +#ayg-dashboard .wp-badge {
58 + margin-bottom: 0;
59 + border-radius: 3px;
60 + background: #EC4338 url( '../images/logo.png' ) no-repeat top;
189 61 }
190 62
191 -.ayg .ayg-badge-running {
192 - border: 1px solid #bfdbfe;
193 - background-color: #dbeafe;
194 - color: #1f2937;
63 +#ayg-table-api-key .ayg-ajax-status span {
64 + margin: 0 0.5em;
195 65 }
196 66
197 -.ayg .ayg-badge-paused {
198 - border: 1px solid #ffe69c;
199 - background-color: #fff3cd;
200 - color: #664d03;
67 +#ayg-shortcode-builder {
68 + display: grid;
69 + gap: 2em;
201 70 }
202 71
203 -.ayg .ayg-badge-error {
204 - border: 1px solid #f1aeb5;
205 - background-color: #f8d7da;
206 - color: #58151c;
72 +#ayg-shortcode-builder .ayg-left-col .ayg-col-content {
73 + margin-top: 2em;
207 74 }
208 75
209 -.ayg .ayg-badge-completed {
210 - border: 1px solid #a3cfbb;
211 - background-color: #d1e7dd;
212 - color: #0a3622;
76 +@media only screen and (min-width: 768px) {
77 + #ayg-shortcode-builder {
78 + grid-template-columns: 3fr 2fr;
79 + }
213 80 }
214 81
215 -.ayg .ayg-badge-live {
216 - border: 1px solid #d8b4fe;
217 - background-color: #f3e8ff;
218 - color: #6b21a8;
219 -}
220 -
221 82 /*----------------------------------------------------------------------------------------------
222 83 *
223 - * Notices
84 + * Settings
224 85 *
225 86 *--------------------------------------------------------------------------------------------*/
226 -.ayg .ayg-notice {
87 +#ayg-table-delete-cache {
227 88 margin-top: 0;
228 - border-radius: 2px;
229 - padding: 1em;
230 89 }
231 90
232 -.ayg .ayg-notice-info {
233 - border: 1px solid #bfdbfe;
234 - background-color: #dbeafe;
235 - color: #1f2937;
91 +#ayg-table-delete-cache .ayg-text-success {
92 + line-height: 30px;
93 + margin: 0 0.5em;
236 94 }
237 95
238 -.ayg .ayg-notice-warning {
239 - border: 1px solid #ffe69c;
240 - background-color: #fff3cd;
241 - color: #664d03;
96 +#ayg-settings.player_type-youtube tr.player_color {
97 + display: none;
242 98 }
243 99
244 -.ayg .ayg-notice-error {
245 - border: 1px solid #f1aeb5;
246 - background-color: #f8d7da;
247 - color: #58151c;
248 -}
249 -
250 -.ayg .ayg-notice-success {
251 - border: 1px solid #a3cfbb;
252 - background-color: #d1e7dd;
253 - color: #0a3622;
254 -}
255 -
256 100 /*----------------------------------------------------------------------------------------------
257 101 *
258 - * Cards
102 + * Modal
259 103 *
260 104 *--------------------------------------------------------------------------------------------*/
261 -.ayg .ayg-card {
262 - border: 1px solid #dcdcde;
105 +.ayg-modal {
106 + position: relative;
107 + margin: 2em auto;
263 108 border-radius: 3px;
264 - background: #fff;
265 - padding: 1.5em;
109 + background-color: #fff;
110 + padding: 1em;
111 + width: auto;
112 + max-width: 640px;
266 113 }
267 114
268 -/*----------------------------------------------------------------------------------------------
269 - *
270 - * Form
271 - *
272 - *--------------------------------------------------------------------------------------------*/
273 -.ayg .ayg-form {
274 - display: flex;
275 - flex-direction: column;
276 - gap: 0.5em;
115 +.mfp-fade.mfp-bg {
116 + -webkit-transition: all 0.15s ease-out;
117 + -moz-transition: all 0.15s ease-out;
118 + transition: all 0.15s ease-out;
119 + opacity: 0;
277 120 }
278 121
279 -.ayg-form .ayg-form-controls {
280 - display: flex;
281 - flex-direction: column;
282 - gap: 1.5em;
122 +.mfp-fade.mfp-bg.mfp-ready {
123 + opacity: 0.8;
283 124 }
284 125
285 -.ayg-form .ayg-form-control {
286 - display: flex;
287 - flex-direction: column;
288 - gap: 0.5em;
126 +.mfp-fade.mfp-bg.mfp-removing {
127 + opacity: 0;
289 128 }
290 129
291 -.ayg-form .ayg-form-control .ayg-form-label {
292 - display: flex;
293 - align-items: center;
294 - gap: 0.5em;
295 - line-height: 1.5;
296 - color: #000;
130 +.mfp-fade.mfp-wrap .mfp-content {
131 + -webkit-transition: all 0.15s ease-out;
132 + -moz-transition: all 0.15s ease-out;
133 + transition: all 0.15s ease-out;
134 + opacity: 0;
297 135 }
298 136
299 -.ayg-form .ayg-form-required,
300 -.ayg-form .ayg-form-control .ayg-form-required {
301 - color: #b31105;
137 +.mfp-fade.mfp-wrap.mfp-ready .mfp-content {
138 + opacity: 1;
302 139 }
303 140
304 -.ayg-form .ayg-form-control .ayg-form-field {
305 - box-sizing: border-box;
141 +.mfp-fade.mfp-wrap.mfp-removing .mfp-content {
142 + opacity: 0;
306 143 }
307 144
308 -.ayg-form .ayg-form-control label input[type="checkbox"] {
309 - margin: 0;
310 -}
311 -
312 -.ayg-form .ayg-form-control .wp-picker-input-wrap label {
313 - display: inline-block;
314 -}
315 -
316 -.ayg-form .ayg-form-control .wp-picker-input-wrap label input[type="text"] {
317 - padding-top: 0;
318 - padding-bottom: 0;
319 -}
320 -
321 -.ayg-form .ayg-form-control input[readonly],
322 -.ayg-form .ayg-form-control textarea[readonly] {
323 - pointer-events: none;
324 -}
325 -
326 -.ayg-form .ayg-form-control .description {
327 - margin: 0;
328 - word-break: break-word;
329 -}
330 -
331 -.ayg-form .ayg-form-actions {
145 +/*----------------------------------------------------------------------------------------------
146 + *
147 + * Editor
148 + *
149 + *--------------------------------------------------------------------------------------------*/
150 +.ayg-editor {
332 151 display: flex;
333 - flex-wrap: wrap;
334 - align-items: center;
152 + flex-direction: column;
335 153 gap: 0.5em;
336 154 }
337 155
338 -.ayg-form .ayg-form-status:empty {
339 - display: none !important;
156 +.ayg-editor .widefat {
157 + max-width: 100%;
340 158 }
341 159
342 -.ayg-form .ayg-form-status > span {
343 - display: flex;
344 - align-items: center;
345 - gap: 0.25em;
160 +.ayg-editor .ayg-editor-section {
161 + border: 1px solid #ccc;
162 + border-radius: 3px;
163 + overflow: hidden;
346 164 }
347 165
348 -.ayg-form .ayg-form-status .ayg-animate-dots {
349 - margin-left: -0.25em;
350 -}
351 -
352 -.ayg-form .ayg-form-invalid .ayg-form-label {
353 - color: #b31105;
354 -}
355 -
356 -.ayg-form .ayg-form-invalid input[type="text"],
357 -.ayg-form .ayg-form-invalid textarea {
358 - outline: 2px solid #b31105;
359 - border: 0;
360 -}
361 -
362 -/* Toggle form controls based on source type */
363 -.ayg-form .ayg-form-control-channel,
364 -.ayg-form .ayg-form-control-playlist,
365 -.ayg-form .ayg-form-control-username,
366 -.ayg-form .ayg-form-control-search,
367 -.ayg-form .ayg-form-control-video,
368 -.ayg-form .ayg-form-control-videos,
369 -.ayg-form .ayg-form-control-order,
370 -.ayg-form .ayg-form-control-limit,
371 -.ayg-form .ayg-form-control-exclude,
372 -.ayg-form .ayg-form-control-schedule {
373 - display: none;
374 -}
375 -
376 -.ayg-form-field-type-channel .ayg-form-control-channel,
377 -.ayg-form-field-type-channel .ayg-form-control-exclude,
378 -.ayg-form-field-type-channel .ayg-form-control-schedule {
166 +.ayg-editor .ayg-editor-section-header {
379 167 display: flex;
168 + align-items: center;
169 + gap: 0.5em;
170 + padding: 0.75em;
171 + background: #e5e5e5;
172 + cursor: pointer;
380 173 }
381 174
382 -.ayg-form-field-type-playlist .ayg-form-control-playlist,
383 -.ayg-form-field-type-playlist .ayg-form-control-exclude,
384 -.ayg-form-field-type-playlist .ayg-form-control-schedule {
385 - display: flex;
175 +.ayg-editor .ayg-editor-section-header:hover {
176 + background: #f9f9f9;
386 177 }
387 178
388 -.ayg-form-field-type-username .ayg-form-control-username,
389 -.ayg-form-field-type-username .ayg-form-control-exclude,
390 -.ayg-form-field-type-username .ayg-form-control-schedule {
391 - display: flex;
179 +.ayg-editor .ayg-editor-section-header .dashicons-before {
180 + color: #006799;
392 181 }
393 182
394 -.ayg-form-field-type-search .ayg-form-control-search,
395 -.ayg-form-field-type-search .ayg-form-control-order,
396 -.ayg-form-field-type-search .ayg-form-control-limit {
183 +.ayg-editor .ayg-editor-section-header .dashicons-plus {
397 184 display: flex;
398 185 }
399 186
400 -.ayg-form-field-type-search .ayg-form-control-sort_by,
401 -.ayg-form-field-type-search .ayg-form-control-sort_order,
402 -.ayg-form-field-type-search .ayg-form-control-duration_filter,
403 -.ayg-form-field-type-search .ayg-form-control-duration {
187 +.ayg-editor .ayg-editor-section-header .dashicons-minus {
404 188 display: none;
405 189 }
406 190
407 -.ayg-form-field-type-video .ayg-form-control-video {
408 - display: flex;
409 -}
410 -
411 -.ayg-form-field-type-video .ayg-form-control-autoadvance {
191 +.ayg-editor .ayg-active .ayg-editor-section-header .dashicons-plus {
412 192 display: none;
413 193 }
414 194
415 -.ayg-form-field-type-livestream .ayg-form-control-channel {
195 +.ayg-editor .ayg-active .ayg-editor-section-header .dashicons-minus {
416 196 display: flex;
417 197 }
418 198
419 -.ayg-form-field-type-livestream .ayg-form-control-cache,
420 -.ayg-form-field-type-livestream .ayg-form-control-player_title,
421 -.ayg-form-field-type-livestream .ayg-form-control-player_description,
422 -.ayg-form-field-type-livestream .ayg-form-control-autoadvance,
423 -.ayg-form-field-type-livestream .ayg-form-control-loop {
424 - display: none;
425 -}
426 -
427 -.ayg-form-field-type-videos .ayg-form-control-videos {
199 +.ayg-editor .ayg-editor-controls {
428 200 display: flex;
201 + flex-direction: column;
202 + gap: 1em;
203 + margin-top: -1px;
204 + padding: 1em;
205 + background: #fff;
206 + border-top: 1px solid #ccc;
429 207 }
430 208
431 -.ayg-form-field-type-video .ayg-form-section-gallery,
432 -.ayg-form-field-type-livestream .ayg-form-section-gallery {
433 - display: none;
434 -}
435 -
436 -.ayg-form-field-type-video .ayg-form-section-search,
437 -.ayg-form-field-type-livestream .ayg-form-section-search {
438 - display: none;
439 -}
440 -
441 -.ayg-form-field-theme-slider .ayg-form-section-search,
442 -.ayg-form-field-theme-slider-popup .ayg-form-section-search,
443 -.ayg-form-field-theme-slider-inline .ayg-form-section-search,
444 -.ayg-form-field-theme-playlister .ayg-form-section-search {
445 - display: none;
446 -}
447 -
448 -.ayg-form-field-type-search .ayg-form-section-import-history,
449 -.ayg-form-field-type-video .ayg-form-section-import-history,
450 -.ayg-form-field-type-livestream .ayg-form-section-import-history,
451 -.ayg-form-field-type-videos .ayg-form-section-import-history {
452 - display: none;
453 -}
454 -
455 -/*----------------------------------------------------------------------------------------------
456 - *
457 - * Dashboard Page
458 - *
459 - *--------------------------------------------------------------------------------------------*/
460 -#ayg-dashboard {
209 +.ayg-editor-control {
461 210 display: flex;
462 211 flex-direction: column;
463 - gap: 2em;
464 - margin: 0 auto;
465 - padding: 25px 30px 0 10px;
466 - max-width: 1024px;
212 + gap: 0.25em;
467 213 }
468 214
469 -/* About section */
470 -#ayg-dashboard .about-wrap {
215 +.ayg-editor .ayg-editor-controls .ayg-editor-control label {
471 216 display: flex;
472 - flex-direction: column;
473 - gap: 1.5em;
474 - margin: 0;
475 - max-width: 100%;
476 - min-height: 160px;
217 + align-items: center;
218 + gap: 0.5em;
219 + line-height: 1.5;
220 + font-weight: 500;
477 221 }
478 222
479 -#ayg-dashboard .about-wrap h1 {
480 - margin: 0 160px 0 0;
481 - font-size: 2.1em;
482 -}
483 -
484 -#ayg-dashboard .about-wrap .about-text {
485 - margin: -0.5em 160px 0 0;
486 -}
487 -
488 -#ayg-dashboard .about-wrap .button-hero {
489 - align-self: flex-start;
223 +.ayg-editor .ayg-editor-controls .ayg-editor-control label input[type="checkbox"] {
490 224 margin: 0;
491 225 }
492 226
493 -#ayg-dashboard .about-wrap .wp-badge {
494 - margin: 0;
495 - border-radius: 4px;
496 - background: #ec4338 url( '../images/logo.png' ) no-repeat center 15px;
497 - background-size: 100px 100px;
227 +.ayg-editor .ayg-editor-controls .ayg-editor-control .wp-picker-input-wrap label {
228 + display: inline-block;
498 229 }
499 230
500 -@media screen and (max-width: 782px) {
501 - #ayg-dashboard {
502 - padding: 20px 20px 0 10px;
503 - }
504 -
505 - #ayg-dashboard .about-wrap h1 {
506 - font-size: 1.8em;
507 - }
508 -
509 - #ayg-dashboard .about-wrap .about-text {
510 - font-size: 1.2em;
511 - }
231 +.ayg-editor .ayg-editor-controls .ayg-editor-control .wp-picker-input-wrap label input[type="text"] {
232 + padding-top: 0;
233 + padding-bottom: 0;
512 234 }
513 235
514 -@media screen and (max-width: 500px) {
515 - #ayg-dashboard .about-wrap h1 {
516 - margin-right: 0;
517 - }
518 -
519 - #ayg-dashboard .about-wrap .about-text {
520 - margin-right: 0;
521 - }
522 -
523 - #ayg-dashboard .about-wrap .button {
524 - width: 100%;
525 - }
526 -}
527 -
528 -/* Gallery List: WP List Table */
529 -.ayg-gallery-list table {
530 - outline: 1px solid #c3c4c7;
531 - border: 0;
532 - border-radius: 3px;
533 -}
534 -
535 -.ayg-gallery-list table td.column-source,
536 -.ayg-gallery-list table td.column-videos,
537 -.ayg-gallery-list table td.column-schedule {
538 - font-size: 0.9em;
539 -}
540 -
541 -.ayg-gallery-list td.column-status .ayg-badge {
542 - min-width: 84px;
543 - max-width: 160px;
544 - text-align: center;
545 - white-space: normal;
546 - overflow-wrap: break-word;
547 -}
548 -
549 -@media screen and (max-width: 782px) {
550 - .ayg-gallery-list .search-box {
551 - flex-wrap: nowrap;
552 - margin-bottom: 0.5em;
553 - }
554 -
555 - .ayg-gallery-list .tablenav.top {
556 - display: none;
557 - }
558 -}
559 -
560 -/* Gallery Form */
561 -.ayg-gallery-form {
562 - display: flex;
563 - flex-direction: column;
564 - gap: 1.5em;
565 - margin: 0 auto;
566 - width: 100%;
567 - max-width: 900px;
568 -}
569 -
570 -.ayg-gallery-form .ayg-back-to-galleries-link a {
571 - text-decoration: none;
572 -}
573 -
574 -.ayg-gallery-form .ayg-gallery-form-heading {
236 +.ayg-editor .ayg-editor-controls .ayg-editor-control .description {
575 237 margin: 0;
238 + line-height: 1.5;
239 + word-break: break-word;
240 + font-size: 90%;
241 + font-weight: normal;
576 242 }
577 243
578 -@media screen and (max-width: 320px) {
579 - .ayg-gallery-form .ayg-gallery-form-heading {
580 - font-size: 1.6em;
581 - }
244 +.ayg-editor .ayg-editor-control-playlist,
245 +.ayg-editor .ayg-editor-control-channel,
246 +.ayg-editor .ayg-editor-control-username,
247 +.ayg-editor .ayg-editor-control-search,
248 +.ayg-editor .ayg-editor-control-video,
249 +.ayg-editor .ayg-editor-control-videos,
250 +.ayg-editor .ayg-editor-control-order,
251 +.ayg-editor .ayg-editor-control-limit {
252 + display: none;
582 253 }
583 254
584 -/* Gallery Form: Shortcode notice */
585 -.ayg-gallery-form .ayg-notice-shortcode {
255 +.ayg-editor-field-type-playlist .ayg-editor-control-playlist {
586 256 display: flex;
587 - align-items: center;
588 - gap: 1em;
589 257 }
590 258
591 -.ayg-gallery-form .ayg-notice-shortcode .ayg-notice-shortcode-text {
259 +.ayg-editor-field-type-channel .ayg-editor-control-channel,
260 +.ayg-editor-field-type-livestream .ayg-editor-control-channel {
592 261 display: flex;
593 - flex-direction: column;
594 - gap: 0.5em;
595 - margin-right: auto;
596 262 }
597 263
598 -.ayg-gallery-form .ayg-notice-shortcode .ayg-notice-shortcode-text code {
599 - align-self: flex-start;
600 -}
601 -
602 -.ayg-gallery-form .ayg-notice-shortcode .ayg-button-copy-shortcode {
603 - flex-shrink: 0;
604 -}
605 -
606 -@media (max-width: 782px) {
607 - .ayg-gallery-form .ayg-notice-shortcode {
608 - flex-direction: column;
609 - align-items: flex-start;
610 - }
611 -}
612 -
613 -/* Gallery Form: KPIs */
614 -.ayg-gallery-form .ayg-kpi-cards {
264 +.ayg-editor-field-type-username .ayg-editor-control-username {
615 265 display: flex;
616 - flex-wrap: wrap;
617 - gap: 1.5em;
618 266 }
619 267
620 -.ayg-gallery-form .ayg-card-kpi {
268 +.ayg-editor-field-type-search .ayg-editor-control-search,
269 +.ayg-editor-field-type-search .ayg-editor-control-order,
270 +.ayg-editor-field-type-search .ayg-editor-control-limit {
621 271 display: flex;
622 - flex: 1 1 220px;
623 - flex-direction: row;
624 - align-items: center;
625 - gap: 1em;
626 272 }
627 273
628 -.ayg-gallery-form .ayg-kpi-icon {
629 - flex-shrink: 0;
630 - width: 1em;
631 - height: 1em;
632 - color: var(--wp-admin-theme-color, #3858e9);
633 - font-size: 2.25em;
634 -}
635 -
636 -.ayg-gallery-form .ayg-kpi-body {
274 +.ayg-editor-field-type-video .ayg-editor-control-video {
637 275 display: flex;
638 - flex-direction: column;
639 - min-width: 0;
640 276 }
641 277
642 -.ayg-gallery-form .ayg-kpi-value {
643 - line-height: 1.1;
644 - white-space: nowrap;
645 - color: #1d2327;
646 - font-size: 1.9em;
647 - font-weight: 700;
278 +.ayg-editor-field-type-video .ayg-editor-control-autoadvance {
279 + display: none;
648 280 }
649 281
650 -.ayg-gallery-form .ayg-kpi-value-date {
651 - font-size: 1em;
652 - font-weight: 600;
282 +.ayg-editor-field-type-livestream .ayg-editor-control-cache,
283 +.ayg-editor-field-type-livestream .ayg-editor-control-player_title,
284 +.ayg-editor-field-type-livestream .ayg-editor-control-player_description,
285 +.ayg-editor-field-type-livestream .ayg-editor-control-autoadvance,
286 +.ayg-editor-field-type-livestream .ayg-editor-control-loop {
287 + display: none;
653 288 }
654 289
655 -.ayg-gallery-form .ayg-kpi-label {
656 - margin-top: 0.2em;
657 - color: #646970;
658 - font-size: 0.9em;
659 -}
660 -
661 -.ayg-gallery-form .ayg-kpi-sublabel {
662 - color: #646970;
663 - font-size: 0.85em;
664 -}
665 -
666 -@media (max-width: 782px) {
667 - .ayg-gallery-form .ayg-kpi-value {
668 - font-size: 1.5em;
669 - }
670 -}
671 -
672 -/* Gallery Form: Form sections */
673 -.ayg-gallery-form .ayg-form {
674 - gap: 1em;
675 -}
676 -
677 -.ayg-gallery-form details > summary {
678 - padding: 1em 1.5em;
679 - font-size: 1.1em;
680 - font-weight: 500;
681 -}
682 -
683 -.ayg-gallery-form details > summary::after {
684 - width: 18px;
685 - height: 18px;
686 - font-size: 18px;
687 -}
688 -
689 -.ayg-gallery-form details > div {
690 - padding: 1.5em;
691 -}
692 -
693 -.ayg-gallery-form .ayg-form-actions .ayg-form-status {
290 +.ayg-editor-field-type-videos .ayg-editor-control-videos {
694 291 display: flex;
695 - flex-basis: 100%;
696 - align-items: center;
697 - gap: 0.35em;
698 - margin-top: 0.5em;
699 292 }
700 293
701 -.ayg-gallery-form .ayg-form-field-type-channel .ayg-form-control-cache,
702 -.ayg-gallery-form .ayg-form-field-type-playlist .ayg-form-control-cache,
703 -.ayg-gallery-form .ayg-form-field-type-username .ayg-form-control-cache,
704 -.ayg-gallery-form .ayg-form-field-type-video .ayg-form-control-cache,
705 -.ayg-gallery-form .ayg-form-field-type-videos .ayg-form-control-cache {
294 +.ayg-editor-field-type-video .ayg-editor-section-gallery,
295 +.ayg-editor-field-type-livestream .ayg-editor-section-gallery {
706 296 display: none;
707 297 }
708 298
709 -.ayg-gallery-form .ayg-form-field-type-search .ayg-form-section-search {
299 +.ayg-editor-field-type-video .ayg-editor-section-search,
300 +.ayg-editor-field-type-livestream .ayg-editor-section-search {
710 301 display: none;
711 302 }
712 303
713 -/* Gallery Form: Import History */
714 -.ayg-gallery-form table {
715 - outline: 1px solid #c3c4c7;
716 - border: 0;
717 - border-radius: 3px;
718 -}
719 -
720 -.ayg-gallery-form table .column-number {
721 - width: 10%;
722 - vertical-align: top;
723 - text-align: center;
724 -}
725 -
726 -.ayg-gallery-form table .column-date {
727 - width: 30%;
728 -}
729 -
730 -.ayg-gallery-form table .column-videos ul {
731 - margin: 0;
732 - font-size: 0.9em;
733 -}
734 -
735 -.ayg-gallery-form table .column-videos ul li {
736 - margin-bottom: 3px;
737 -}
738 -
739 -.ayg-gallery-form table .column-status p {
740 - margin: 0;
741 - margin-top: 0.5em;
742 -}
743 -
744 -/*----------------------------------------------------------------------------------------------
745 - *
746 - * Settings Page
747 - *
748 - *--------------------------------------------------------------------------------------------*/
749 -#ayg-settings h1 {
750 - margin-bottom: 0.25em;
751 - font-size: 1.8em;
752 -}
753 -
754 -#ayg-settings .subsubsub {
755 - margin-bottom: 1em;
756 -}
757 -
758 -#ayg-table-delete-cache {
759 - margin-top: 0;
760 -}
761 -
762 -#ayg-settings.player_type-youtube tr.player_color {
304 +.ayg-editor-field-theme-slider .ayg-editor-section-search,
305 +.ayg-editor-field-theme-slider-popup .ayg-editor-section-search,
306 +.ayg-editor-field-theme-slider-inline .ayg-editor-section-search,
307 +.ayg-editor-field-theme-playlister .ayg-editor-section-search {
763 308 display: none;
764 309 }
765 310
766 311 /*----------------------------------------------------------------------------------------------
@@ -767,40 +312,38 @@
767 312 *
768 313 * Block
769 314 *
770 315 *--------------------------------------------------------------------------------------------*/
771 -.block-editor .automatic-youtube-gallery-block-panel .components-panel__row {
316 +.automatic-youtube-gallery-block-panel .components-panel__row {
772 317 margin-bottom: 1.25em;
773 318 }
774 319
775 -.block-editor .automatic-youtube-gallery-block-panel .components-panel__row label {
776 - text-transform: unset;
777 - line-height: 1.6;
778 - font-size: 13px;
779 - font-weight: normal;
320 +.automatic-youtube-gallery-block-panel .components-panel__row .components-base-control {
321 + width: 100%;
780 322 }
781 323
782 -.block-editor .automatic-youtube-gallery-block-panel .components-panel__row .components-base-control {
783 - width: 100%;
324 +.automatic-youtube-gallery-block-panel .components-panel__row .components-range-control__wrapper {
325 + flex: 1 1 100%;
784 326 }
785 327
786 -.block-editor .automatic-youtube-gallery-block-panel .components-panel__row .components-base-control__help {
787 - overflow: hidden;
788 - text-overflow: ellipsis;
328 +.automatic-youtube-gallery-block-panel .components-panel__row .block-editor-panel-color-gradient-settings {
329 + padding-left: 0;
330 + padding-right: 0;
331 + width: 100%;
789 332 }
790 333
791 -.block-editor .automatic-youtube-gallery-block-panel .components-panel__row .components-range-control__wrapper {
792 - flex: 1 1 100%;
334 +.wp-block-automatic-youtube-gallery-block .components-spinner {
335 + display: flex;
336 + align-items: center;
337 + width: 100%;
793 338 }
794 339
795 -.block-editor .automatic-youtube-gallery-block-panel .components-panel__row .block-editor-panel-color-gradient-settings {
796 - border: 0;
797 - padding: 0;
798 - width: 100%;
340 +.wp-block-automatic-youtube-gallery-block .components-placeholder {
341 + display: none;
799 342 }
800 343
801 -.block-editor .automatic-youtube-gallery-block-panel .components-panel__row .block-editor-tools-panel-color-gradient-settings__item {
802 - margin-top: 18px;
344 +.is-loading .wp-block-automatic-youtube-gallery-block {
345 + opacity: 0.5;
803 346 }
804 347
805 348 /*----------------------------------------------------------------------------------------------
806 349 *
@@ -806,44 +349,16 @@
806 349 *
807 350 * Widget
808 351 *
809 352 *--------------------------------------------------------------------------------------------*/
810 -.ayg-widget-form .ayg-widget-field-title {
811 - margin-bottom: 1em;
353 +.widget-inside .ayg-editor {
354 + margin-top: 1em;
812 355 }
813 356
814 -.ayg-widget-form .ayg-form details > summary {
815 - background-color: #f0f0f0;
816 - font-size: 14px;
817 -}
818 -
819 -.ayg-widget-form .ayg-form details select.ayg-form-field {
820 - padding-left: 8px;
821 - line-height: 1.5;
822 -}
823 -
824 -.ayg-widget-form .ayg-form .ayg-form-controls {
825 - gap: 1.25em;
826 -}
827 -
828 -.ayg-widget-form .ayg-form .ayg-form-control {
829 - gap: 0.35em;
830 -}
831 -
832 -.ayg-widget-form p {
833 - margin: 0 !important;
834 - line-height: 1.5 !important;
835 -}
836 -
837 -.ayg-widget-form label {
838 - line-height: normal !important;
839 -}
840 -
841 357 /*----------------------------------------------------------------------------------------------
842 358 *
843 359 * Elementor
844 360 *
845 361 *--------------------------------------------------------------------------------------------*/
846 -.elementor-control-type-wp_widget .ayg-widget-form p.description {
847 - color: #909090;
848 - font-size: 0.9em;
362 +#elementor-controls .ayg-editor-section-header {
363 + padding: 0.35em 0.5em;
849 364 }