From 1a920dceb581d34614e262d4d237707578f110de Mon Sep 17 00:00:00 2001 From: Rob Howard Date: Sun, 27 Sep 2026 10:06:37 -0600 Subject: [PATCH] Restyle bulk tab image cards - Checkbox overlaid on the thumbnail corner with a white ring so it stays visible on any image; square cropped thumbnails in bordered cards. - Selected cards get a blue outline (also after Select all/none); finished cards fade with a green checkmark, errors get a red border. - Shared everyalt-bulk-card class so the title tab gets the same styling (it previously had none of the card rules). - Screen-reader label per checkbox ("Select "), since images on this page have no alt text by definition. Co-Authored-By: Claude Opus 5.5 --- admin/css/everyalt-admin.css | 2 +- admin/js/everyalt-admin-simple.js | 27 ++++++++++++++++----- admin/partials/everyalt-options-display.php | 6 +++-- 3 files changed, 26 insertions(+), 9 deletions(-) diff --git a/admin/css/everyalt-admin.css b/admin/css/everyalt-admin.css index ebc7a57..1a2358e 100644 --- a/admin/css/everyalt-admin.css +++ b/admin/css/everyalt-admin.css @@ -1 +1 @@ -*{box-sizing:inherit}.everyalt-settings-page{box-sizing:border-box;font-family:Helvetica Neue,Helvetica,Arial,Lucida Grande,sans-serif;font-size:14px;position:relative}#everyalt-history-images-empty{margin-left:auto;margin-right:auto;margin-top:2rem;max-width:1280px;padding:0 15px}#everyalt-history-images{grid-column-gap:10px;grid-row-gap:10px;display:grid;grid-template-columns:repeat(2,1fr);margin-top:2rem;padding-left:15px;padding-right:15px}@media (min-width:768px){#everyalt-history-images{grid-template-columns:repeat(3,1fr)}}@media (min-width:1200px){#everyalt-history-images{grid-template-columns:repeat(4,1fr)}}@media (min-width:1400px){#everyalt-history-images{grid-template-columns:repeat(5,1fr)}}@media (min-width:1800px){#everyalt-history-images{grid-template-columns:repeat(7,1fr)}}#everyalt-history-images img{height:auto;width:100%}#everyalt-history-images a{display:block;margin-bottom:1rem}#everyalt-history .components-snackbar-list__notice-container{display:flex;justify-content:end;padding-right:15px}#everyalt-custom-media-button .components-snackbar-list{bottom:15px;position:fixed;right:15px}#everyalt-custom-media-button .components-snackbar-list__notice-container{display:flex;justify-content:end}#everyalt-bulk-generator{margin-left:auto;margin-right:auto;max-width:1280px;padding:0 15px}#everyalt-bulk-generator .components-card{background-color:#fefefa;margin-top:2rem}#everyalt-bulk-generator .components-card .everyalt-progress-bar{margin-top:1rem}#everyalt-bulk-generator .components-card .everyalt-progress-bar .every-bar-wrapper{background-color:#fff;border:1px solid #b7c9d9;border-radius:3px;height:20px;overflow:hidden;position:relative}#everyalt-bulk-generator .components-card .everyalt-progress-bar .every-bar-bar{background-color:#0750b6;height:100%;left:0;position:absolute;top:0}#everyalt-bulk-generator .components-card .components-button.is-primary{background-color:#0750b6;text-transform:uppercase}#everyalt-bulk-generator table{margin-top:2rem;width:100%}#everyalt-bulk-generator table th{background-color:#00205b;color:#fff;font-size:.75rem;padding:5px;text-align:left;text-transform:uppercase;width:50%}#everyalt-bulk-generator table td{font-size:.75rem;padding:5px}#everyalt-bulk-generator table td.has_error{background-color:crimson;color:#fff}#everyalt-bulk-generator table tr.even{background-color:#e8e8e8}#everyalt-bulk-generator .everyalt-spinner{display:flex;justify-content:center;text-align:center}#everyalt-bulk-generator .everyalt-spinner-container{text-align:center}#everyalt-bulk-generator .completed-message{padding:20px;text-align:center}#everyalt-bulk-generator .completed-message h2{color:#00205b}#everyalt-plugin .components-snackbar-list{bottom:15px;left:0;position:fixed;width:100%}#everyalt-plugin .is-primary{background-color:#0750b6}#everyalt-plugin .every_alt_http_password_holder{margin-top:50px}#everyalt-plugin .every_alt_http_password_holder .components-base-control__help{margin-top:-15px}#everyalt-plugin .every_alt_http_password_holder h2{margin-bottom:5px}#everyalt-plugin .everyalt-main{padding:0 15px}#everyalt-plugin .components-form-toggle.is-checked .components-form-toggle__track{background-color:#0750b6}#everyalt-plugin .components-card{background-color:#fefefa;margin-top:2rem}#everyalt-plugin .components-card .everyalt-progress-bar{margin-top:2rem}#everyalt-plugin .components-card .everyalt-progress-bar .every-bar-wrapper{background-color:#fff;border:1px solid #b7c9d9;border-radius:3px;height:20px;overflow:hidden;position:relative}#everyalt-plugin .components-card .everyalt-progress-bar .every-bar-bar{background-color:#0750b6;height:100%;left:0;position:absolute;top:0}#everyalt-plugin .components-card .components-toggle-control{margin-top:2rem}#everyalt-plugin .components-card .components-base-control .components-base-control__field{align-items:center;display:flex;margin-bottom:10px}#everyalt-plugin .components-card .components-base-control.everyalt-text-field{width:100%}#everyalt-plugin .components-card .components-base-control.everyalt-text-field .components-base-control__field{display:block}#everyalt-plugin .components-card .components-base-control.everyalt-text-field .components-base-control__field label{font-weight:600;margin-bottom:10px}#everyalt-plugin .components-card .components-base-control.everyalt-text-field .components-base-control__field input{border:1px solid #b7c9d9;border-radius:3px;box-shadow:none;color:#444;font-size:14px;height:40px;margin:0 0 10px;padding:9px 15px;width:100%}#everyalt-plugin .components-card .components-base-control.everyalt-text-field .components-base-control__field input:disabled{background:#f6f6f6;border-color:#eee;color:#bbb}#everyalt-plugin .components-card .components-base-control.everyalt-text-field .components-base-control__field input:focus{border-color:#00a0d2;box-shadow:0 0 0 1px #00a0d2;outline:2px solid transparent;outline-offset:-2px}#everyalt-plugin .components-card .components-base-control.everyalt-text-field .components-base-control__field .everyalt-text-field-button-group{align-items:center;display:flex;margin:2px 0 15px}#everyalt-plugin .components-card .components-base-control.everyalt-text-field .components-base-control__field .everyalt-text-field-button-group .is-primary{background-color:#0750b6;margin-right:10px}#everyalt-plugin .components-snackbar-list__notice-container{display:flex;justify-content:end;padding-right:15px}#everyalt-plugin .components-notice{margin:0;width:100%}#everyalt-plugin .components-placeholder{background:#f6f6f6;box-shadow:none}#everyalt-plugin .components-placeholder .components-placeholder__fieldset{display:flex;justify-content:center}#everyalt-plugin .everyalt-main-error{margin-top:2rem}#everyalt-plugin .everyalt-main{margin-left:auto;margin-right:auto;max-width:1280px}#everyalt-plugin .everyalt-main .components-panel__body{background:#fff;border:1px solid #e2e4e7;margin:25px 0}#everyalt-plugin .everyalt-main .components-panel__body .components-panel__body-toggle{border-bottom:1px solid #d6e2ed}#everyalt-plugin .everyalt-main .components-panel__body .components-panel__row{margin:0;padding:10px}#everyalt-plugin .everyalt-main .components-panel__body .components-panel__row .components-base-control .components-base-control__field{align-items:center;display:flex;margin-bottom:10px}#everyalt-plugin .everyalt-main .components-panel__body .components-panel__row .components-base-control.everyalt-text-field{width:100%}#everyalt-plugin .everyalt-main .components-panel__body .components-panel__row .components-base-control.everyalt-text-field .components-base-control__field{display:block}#everyalt-plugin .everyalt-main .components-panel__body .components-panel__row .components-base-control.everyalt-text-field .components-base-control__field label{font-weight:600;margin-bottom:10px}#everyalt-plugin .everyalt-main .components-panel__body .components-panel__row .components-base-control.everyalt-text-field .components-base-control__field input{border:1px solid #b7c9d9;border-radius:3px;box-shadow:none;color:#444;font-size:14px;height:40px;margin:0 0 10px;padding:9px 15px;width:100%}#everyalt-plugin .everyalt-main .components-panel__body .components-panel__row .components-base-control.everyalt-text-field .components-base-control__field input:disabled{background:#f6f6f6;border-color:#eee;color:#bbb}#everyalt-plugin .everyalt-main .components-panel__body .components-panel__row .components-base-control.everyalt-text-field .components-base-control__field input:focus{border-color:#00a0d2;box-shadow:0 0 0 1px #00a0d2;outline:2px solid transparent;outline-offset:-2px}#everyalt-plugin .everyalt-main .components-panel__body .components-panel__row .components-base-control.everyalt-text-field .components-base-control__field .everyalt-text-field-button-group{align-items:center;display:flex;margin:2px 0 15px}#everyalt-plugin .everyalt-main .components-panel__body .components-panel__row .components-base-control.everyalt-text-field .components-base-control__field .everyalt-text-field-button-group .is-primary{margin-right:10px}#everyalt-plugin .everyalt-main .everyalt-info{padding:0 10px 10px}#everyalt-plugin .everyalt-main .everyalt-info h2{font-weight:300;margin-bottom:10px}#everyalt-plugin .everyalt-main .everyalt-info p{margin:0 0 1.5em}#everyalt-plugin .everyalt-main .everyalt-info .everyalt-info-button-group{display:flex}#everyalt-plugin .everyalt-main .everyalt-info .everyalt-info-button-group .is-default{font-size:14px;height:auto;padding:2px 20px}#everyalt-plugin .everyalt-main .everyalt-info .everyalt-info-button-group .is-default:first-child{margin-right:15px}#every_alt_pagination{display:flex;font-size:.85rem;font-weight:700;justify-content:center;margin-top:2rem}#every_alt_pagination a.page-numbers{background-color:#0750b6;color:#fff;display:inline-block;margin-right:-4px;min-width:20px;padding:8px;text-align:center;text-decoration:none}#every_alt_pagination a.page-numbers:hover{background-color:#00205b}#every_alt_pagination a.next,#every_alt_pagination a.prev{background-color:transparent;color:#0750b6;padding:0}#every_alt_pagination a.next:hover,#every_alt_pagination a.prev:hover{background-color:transparent;color:#00205b}#every_alt_pagination a.next{margin-left:10px}#every_alt_pagination a.prev{margin-right:10px}#every_alt_pagination span.current{background-color:#00205b;color:#fff;display:inline-block;margin-right:-4px;min-width:20px;padding:8px;text-align:center}#everyalt-main-error{background-color:#fefefa;margin-left:auto;margin-right:auto;margin-top:2rem;max-width:1280px;padding:15px}#everyalt-main-error h2{color:#00205b;text-align:center!important}#everyalt-gutenber-button p{font-size:.75rem}.everyalt-progress.hidden,.hidden{display:none!important}.everyalt-settings-wrap .form-table,.everyalt-bulk-wrap table,.everyalt-history-wrap table{margin-top:1em}.everyalt-log-detail{max-width:480px;vertical-align:top}.everyalt-log-detail-inner{max-height:280px;overflow-y:auto;overflow-x:auto;padding:6px 8px;background:#f6f7f7;border:1px solid #c3c4c7;border-radius:3px;font-size:12px;line-height:1.4;white-space:pre-wrap;word-break:break-word}.everyalt-key-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.everyalt-key-row .regular-text{flex:1;min-width:200px}.everyalt-bulk-actions{margin:1em 0}.everyalt-bulk-actions .button{margin-right:8px}.everyalt-bulk-progress{margin:1em 0;padding:1em;background:#f6f7f7;border:1px solid #c3c4c7;border-radius:3px}.everyalt-bulk-progress-bar{height:22px;background:#fff;border:1px solid #c3c4c7;border-radius:3px;overflow:hidden}.everyalt-bulk-progress-bar span{display:block;height:100%;background:#2271b1;transition:width .2s}.everyalt-bulk-progress-log{margin:.5em 0 0;padding-left:1.5em;max-height:200px;overflow-y:auto;font-size:13px}.everyalt-bulk-progress-log li.success{color:#00a32a}.everyalt-bulk-progress-log li.error{color:#b32d2e}.everyalt-bulk-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px;list-style:none;margin:1em 0;padding:0}.everyalt-bulk-item label{display:block;cursor:pointer}.everyalt-bulk-item .everyalt-bulk-thumb{display:block;line-height:0}.everyalt-bulk-item .everyalt-bulk-thumb img{width:100%;height:auto;display:block;vertical-align:middle}.everyalt-bulk-item .everyalt-bulk-checkbox{margin:6px 6px 0 0}.everyalt-bulk-item .everyalt-bulk-edit-link{display:inline-block;margin-top:4px;font-size:12px}.everyalt-bulk-item-status{display:block;margin-top:4px;font-size:11px;line-height:1.3}.everyalt-bulk-item-status.success{color:#00a32a}.everyalt-bulk-item-status.error{color:#b32d2e}.everyalt-review-wrap .description{margin-bottom:1em}.everyalt-review-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px;list-style:none;margin:1em 0;padding:0}.everyalt-review-item{border:1px solid #c3c4c7;border-radius:4px;padding:10px;background:#fff}.everyalt-review-item .everyalt-review-thumb{display:block;line-height:0;margin-bottom:8px}.everyalt-review-item .everyalt-review-thumb img{width:100%;height:auto;display:block}.everyalt-review-item .everyalt-review-edit-link{display:inline-block;font-size:12px;margin-bottom:6px}.everyalt-review-item .everyalt-review-alt-field{width:100%;margin:0 0 8px;padding:6px;font-size:13px;min-height:60px;display:block;box-sizing:border-box}.everyalt-review-item .everyalt-review-actions{display:flex;gap:6px;flex-wrap:wrap}.everyalt-review-item .everyalt-review-actions .button{margin:0}.everyalt-review-item .everyalt-review-status{display:block;margin-top:6px;font-size:12px}.everyalt-review-item .everyalt-review-status.success{color:#00a32a}.everyalt-review-item .everyalt-review-status.error{color:#b32d2e}.everyalt-page-count{margin:1em 0 0;color:#646970}.everyalt-pagination{display:flex;flex-wrap:wrap;gap:4px;margin:1.5em 0}.everyalt-pagination .page-numbers{display:inline-block;min-width:30px;padding:4px 8px;text-align:center;border:1px solid #c3c4c7;border-radius:3px;background:#fff;text-decoration:none}.everyalt-pagination .page-numbers.current{background:#2271b1;border-color:#2271b1;color:#fff}.everyalt-pagination .page-numbers.dots{border-color:transparent;background:transparent}.everyalt-model-list{display:grid;gap:8px;max-width:640px}.form-table td fieldset.everyalt-model-list label.everyalt-model-option{display:grid;grid-template-columns:auto 1fr;column-gap:8px;align-items:baseline;padding:10px 12px;border:1px solid #c3c4c7;border-radius:4px;background:#fff;cursor:pointer}.form-table td fieldset.everyalt-model-list label.everyalt-model-option input{grid-row:span 3;margin:2px 0 0}.everyalt-model-option .everyalt-model-provider,.everyalt-model-option .everyalt-model-price{display:block}.everyalt-model-option:has(input:checked){border-color:#2271b1;box-shadow:0 0 0 1px #2271b1}.everyalt-model-provider,.everyalt-model-price{color:#646970;font-size:13px}.everyalt-provider-key{max-width:640px;margin-bottom:1.5em}.everyalt-provider-key-title{display:flex;align-items:center;gap:10px;margin:0 0 8px;font-size:14px}.everyalt-key-status{font-size:12px;font-weight:400;padding:1px 8px;border-radius:10px}.everyalt-key-status.is-saved{background:#edfaef;color:#008a20}.everyalt-key-status.is-missing{background:#fcf9e8;color:#8a6d00}.everyalt-key-steps{margin:10px 0 8px 1.5em}.everyalt-key-steps li{margin-bottom:4px}.everyalt-privacy-note{margin-top:10px;padding:10px 12px;border-left:4px solid #00a32a;background:#f6f7f7}.everyalt-privacy-note p{margin:0 0 6px}.everyalt-privacy-note p:last-child{margin-bottom:0}.everyalt-queue-panel p{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.everyalt-queue-panel .everyalt-queue-spinner{float:none;margin:0}.everyalt-queue-panel:not(.is-working) .everyalt-queue-spinner{display:none}.everyalt-queue-panel .everyalt-bulk-progress-log{margin:0 0 8px;max-height:160px}.everyalt-queue-panel .everyalt-bulk-progress-log:empty{display:none}#everyalt-queue-clear{margin-left:auto}.everyalt-review-item.is-decorative{border-style:dashed}.everyalt-decorative-badge{display:inline-block;margin:0 6px 6px 0;padding:1px 8px;border-radius:10px;background:#f0f6fc;color:#0a4b78;font-size:12px}.everyalt-budget-bar{max-width:480px;margin:0 0 1em}.everyalt-budget-bar.is-full span{background:#d63638}.everyalt-usage-table{max-width:900px;margin-bottom:.5em} \ No newline at end of file +*{box-sizing:inherit}.everyalt-settings-page{box-sizing:border-box;font-family:Helvetica Neue,Helvetica,Arial,Lucida Grande,sans-serif;font-size:14px;position:relative}#everyalt-history-images-empty{margin-left:auto;margin-right:auto;margin-top:2rem;max-width:1280px;padding:0 15px}#everyalt-history-images{grid-column-gap:10px;grid-row-gap:10px;display:grid;grid-template-columns:repeat(2,1fr);margin-top:2rem;padding-left:15px;padding-right:15px}@media (min-width:768px){#everyalt-history-images{grid-template-columns:repeat(3,1fr)}}@media (min-width:1200px){#everyalt-history-images{grid-template-columns:repeat(4,1fr)}}@media (min-width:1400px){#everyalt-history-images{grid-template-columns:repeat(5,1fr)}}@media (min-width:1800px){#everyalt-history-images{grid-template-columns:repeat(7,1fr)}}#everyalt-history-images img{height:auto;width:100%}#everyalt-history-images a{display:block;margin-bottom:1rem}#everyalt-history .components-snackbar-list__notice-container{display:flex;justify-content:end;padding-right:15px}#everyalt-custom-media-button .components-snackbar-list{bottom:15px;position:fixed;right:15px}#everyalt-custom-media-button .components-snackbar-list__notice-container{display:flex;justify-content:end}#everyalt-bulk-generator{margin-left:auto;margin-right:auto;max-width:1280px;padding:0 15px}#everyalt-bulk-generator .components-card{background-color:#fefefa;margin-top:2rem}#everyalt-bulk-generator .components-card .everyalt-progress-bar{margin-top:1rem}#everyalt-bulk-generator .components-card .everyalt-progress-bar .every-bar-wrapper{background-color:#fff;border:1px solid #b7c9d9;border-radius:3px;height:20px;overflow:hidden;position:relative}#everyalt-bulk-generator .components-card .everyalt-progress-bar .every-bar-bar{background-color:#0750b6;height:100%;left:0;position:absolute;top:0}#everyalt-bulk-generator .components-card .components-button.is-primary{background-color:#0750b6;text-transform:uppercase}#everyalt-bulk-generator table{margin-top:2rem;width:100%}#everyalt-bulk-generator table th{background-color:#00205b;color:#fff;font-size:.75rem;padding:5px;text-align:left;text-transform:uppercase;width:50%}#everyalt-bulk-generator table td{font-size:.75rem;padding:5px}#everyalt-bulk-generator table td.has_error{background-color:crimson;color:#fff}#everyalt-bulk-generator table tr.even{background-color:#e8e8e8}#everyalt-bulk-generator .everyalt-spinner{display:flex;justify-content:center;text-align:center}#everyalt-bulk-generator .everyalt-spinner-container{text-align:center}#everyalt-bulk-generator .completed-message{padding:20px;text-align:center}#everyalt-bulk-generator .completed-message h2{color:#00205b}#everyalt-plugin .components-snackbar-list{bottom:15px;left:0;position:fixed;width:100%}#everyalt-plugin .is-primary{background-color:#0750b6}#everyalt-plugin .every_alt_http_password_holder{margin-top:50px}#everyalt-plugin .every_alt_http_password_holder .components-base-control__help{margin-top:-15px}#everyalt-plugin .every_alt_http_password_holder h2{margin-bottom:5px}#everyalt-plugin .everyalt-main{padding:0 15px}#everyalt-plugin .components-form-toggle.is-checked .components-form-toggle__track{background-color:#0750b6}#everyalt-plugin .components-card{background-color:#fefefa;margin-top:2rem}#everyalt-plugin .components-card .everyalt-progress-bar{margin-top:2rem}#everyalt-plugin .components-card .everyalt-progress-bar .every-bar-wrapper{background-color:#fff;border:1px solid #b7c9d9;border-radius:3px;height:20px;overflow:hidden;position:relative}#everyalt-plugin .components-card .everyalt-progress-bar .every-bar-bar{background-color:#0750b6;height:100%;left:0;position:absolute;top:0}#everyalt-plugin .components-card .components-toggle-control{margin-top:2rem}#everyalt-plugin .components-card .components-base-control .components-base-control__field{align-items:center;display:flex;margin-bottom:10px}#everyalt-plugin .components-card .components-base-control.everyalt-text-field{width:100%}#everyalt-plugin .components-card .components-base-control.everyalt-text-field .components-base-control__field{display:block}#everyalt-plugin .components-card .components-base-control.everyalt-text-field .components-base-control__field label{font-weight:600;margin-bottom:10px}#everyalt-plugin .components-card .components-base-control.everyalt-text-field .components-base-control__field input{border:1px solid #b7c9d9;border-radius:3px;box-shadow:none;color:#444;font-size:14px;height:40px;margin:0 0 10px;padding:9px 15px;width:100%}#everyalt-plugin .components-card .components-base-control.everyalt-text-field .components-base-control__field input:disabled{background:#f6f6f6;border-color:#eee;color:#bbb}#everyalt-plugin .components-card .components-base-control.everyalt-text-field .components-base-control__field input:focus{border-color:#00a0d2;box-shadow:0 0 0 1px #00a0d2;outline:2px solid transparent;outline-offset:-2px}#everyalt-plugin .components-card .components-base-control.everyalt-text-field .components-base-control__field .everyalt-text-field-button-group{align-items:center;display:flex;margin:2px 0 15px}#everyalt-plugin .components-card .components-base-control.everyalt-text-field .components-base-control__field .everyalt-text-field-button-group .is-primary{background-color:#0750b6;margin-right:10px}#everyalt-plugin .components-snackbar-list__notice-container{display:flex;justify-content:end;padding-right:15px}#everyalt-plugin .components-notice{margin:0;width:100%}#everyalt-plugin .components-placeholder{background:#f6f6f6;box-shadow:none}#everyalt-plugin .components-placeholder .components-placeholder__fieldset{display:flex;justify-content:center}#everyalt-plugin .everyalt-main-error{margin-top:2rem}#everyalt-plugin .everyalt-main{margin-left:auto;margin-right:auto;max-width:1280px}#everyalt-plugin .everyalt-main .components-panel__body{background:#fff;border:1px solid #e2e4e7;margin:25px 0}#everyalt-plugin .everyalt-main .components-panel__body .components-panel__body-toggle{border-bottom:1px solid #d6e2ed}#everyalt-plugin .everyalt-main .components-panel__body .components-panel__row{margin:0;padding:10px}#everyalt-plugin .everyalt-main .components-panel__body .components-panel__row .components-base-control .components-base-control__field{align-items:center;display:flex;margin-bottom:10px}#everyalt-plugin .everyalt-main .components-panel__body .components-panel__row .components-base-control.everyalt-text-field{width:100%}#everyalt-plugin .everyalt-main .components-panel__body .components-panel__row .components-base-control.everyalt-text-field .components-base-control__field{display:block}#everyalt-plugin .everyalt-main .components-panel__body .components-panel__row .components-base-control.everyalt-text-field .components-base-control__field label{font-weight:600;margin-bottom:10px}#everyalt-plugin .everyalt-main .components-panel__body .components-panel__row .components-base-control.everyalt-text-field .components-base-control__field input{border:1px solid #b7c9d9;border-radius:3px;box-shadow:none;color:#444;font-size:14px;height:40px;margin:0 0 10px;padding:9px 15px;width:100%}#everyalt-plugin .everyalt-main .components-panel__body .components-panel__row .components-base-control.everyalt-text-field .components-base-control__field input:disabled{background:#f6f6f6;border-color:#eee;color:#bbb}#everyalt-plugin .everyalt-main .components-panel__body .components-panel__row .components-base-control.everyalt-text-field .components-base-control__field input:focus{border-color:#00a0d2;box-shadow:0 0 0 1px #00a0d2;outline:2px solid transparent;outline-offset:-2px}#everyalt-plugin .everyalt-main .components-panel__body .components-panel__row .components-base-control.everyalt-text-field .components-base-control__field .everyalt-text-field-button-group{align-items:center;display:flex;margin:2px 0 15px}#everyalt-plugin .everyalt-main .components-panel__body .components-panel__row .components-base-control.everyalt-text-field .components-base-control__field .everyalt-text-field-button-group .is-primary{margin-right:10px}#everyalt-plugin .everyalt-main .everyalt-info{padding:0 10px 10px}#everyalt-plugin .everyalt-main .everyalt-info h2{font-weight:300;margin-bottom:10px}#everyalt-plugin .everyalt-main .everyalt-info p{margin:0 0 1.5em}#everyalt-plugin .everyalt-main .everyalt-info .everyalt-info-button-group{display:flex}#everyalt-plugin .everyalt-main .everyalt-info .everyalt-info-button-group .is-default{font-size:14px;height:auto;padding:2px 20px}#everyalt-plugin .everyalt-main .everyalt-info .everyalt-info-button-group .is-default:first-child{margin-right:15px}#every_alt_pagination{display:flex;font-size:.85rem;font-weight:700;justify-content:center;margin-top:2rem}#every_alt_pagination a.page-numbers{background-color:#0750b6;color:#fff;display:inline-block;margin-right:-4px;min-width:20px;padding:8px;text-align:center;text-decoration:none}#every_alt_pagination a.page-numbers:hover{background-color:#00205b}#every_alt_pagination a.next,#every_alt_pagination a.prev{background-color:transparent;color:#0750b6;padding:0}#every_alt_pagination a.next:hover,#every_alt_pagination a.prev:hover{background-color:transparent;color:#00205b}#every_alt_pagination a.next{margin-left:10px}#every_alt_pagination a.prev{margin-right:10px}#every_alt_pagination span.current{background-color:#00205b;color:#fff;display:inline-block;margin-right:-4px;min-width:20px;padding:8px;text-align:center}#everyalt-main-error{background-color:#fefefa;margin-left:auto;margin-right:auto;margin-top:2rem;max-width:1280px;padding:15px}#everyalt-main-error h2{color:#00205b;text-align:center!important}#everyalt-gutenber-button p{font-size:.75rem}.everyalt-progress.hidden,.hidden{display:none!important}.everyalt-settings-wrap .form-table,.everyalt-bulk-wrap table,.everyalt-history-wrap table{margin-top:1em}.everyalt-log-detail{max-width:480px;vertical-align:top}.everyalt-log-detail-inner{max-height:280px;overflow-y:auto;overflow-x:auto;padding:6px 8px;background:#f6f7f7;border:1px solid #c3c4c7;border-radius:3px;font-size:12px;line-height:1.4;white-space:pre-wrap;word-break:break-word}.everyalt-key-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.everyalt-key-row .regular-text{flex:1;min-width:200px}.everyalt-bulk-actions{margin:1em 0}.everyalt-bulk-actions .button{margin-right:8px}.everyalt-bulk-progress{margin:1em 0;padding:1em;background:#f6f7f7;border:1px solid #c3c4c7;border-radius:3px}.everyalt-bulk-progress-bar{height:22px;background:#fff;border:1px solid #c3c4c7;border-radius:3px;overflow:hidden}.everyalt-bulk-progress-bar span{display:block;height:100%;background:#2271b1;transition:width .2s}.everyalt-bulk-progress-log{margin:.5em 0 0;padding-left:1.5em;max-height:200px;overflow-y:auto;font-size:13px}.everyalt-bulk-progress-log li.success{color:#00a32a}.everyalt-bulk-progress-log li.error{color:#b32d2e}.everyalt-bulk-item-status.success{color:#00a32a}.everyalt-bulk-item-status.error{color:#b32d2e}.everyalt-review-wrap .description{margin-bottom:1em}.everyalt-review-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px;list-style:none;margin:1em 0;padding:0}.everyalt-review-item{border:1px solid #c3c4c7;border-radius:4px;padding:10px;background:#fff}.everyalt-review-item .everyalt-review-thumb{display:block;line-height:0;margin-bottom:8px}.everyalt-review-item .everyalt-review-thumb img{width:100%;height:auto;display:block}.everyalt-review-item .everyalt-review-edit-link{display:inline-block;font-size:12px;margin-bottom:6px}.everyalt-review-item .everyalt-review-alt-field{width:100%;margin:0 0 8px;padding:6px;font-size:13px;min-height:60px;display:block;box-sizing:border-box}.everyalt-review-item .everyalt-review-actions{display:flex;gap:6px;flex-wrap:wrap}.everyalt-review-item .everyalt-review-actions .button{margin:0}.everyalt-review-item .everyalt-review-status{display:block;margin-top:6px;font-size:12px}.everyalt-review-item .everyalt-review-status.success{color:#00a32a}.everyalt-review-item .everyalt-review-status.error{color:#b32d2e}.everyalt-page-count{margin:1em 0 0;color:#646970}.everyalt-pagination{display:flex;flex-wrap:wrap;gap:4px;margin:1.5em 0}.everyalt-pagination .page-numbers{display:inline-block;min-width:30px;padding:4px 8px;text-align:center;border:1px solid #c3c4c7;border-radius:3px;background:#fff;text-decoration:none}.everyalt-pagination .page-numbers.current{background:#2271b1;border-color:#2271b1;color:#fff}.everyalt-pagination .page-numbers.dots{border-color:transparent;background:transparent}.everyalt-model-list{display:grid;gap:8px;max-width:640px}.form-table td fieldset.everyalt-model-list label.everyalt-model-option{display:grid;grid-template-columns:auto 1fr;column-gap:8px;align-items:baseline;padding:10px 12px;border:1px solid #c3c4c7;border-radius:4px;background:#fff;cursor:pointer}.form-table td fieldset.everyalt-model-list label.everyalt-model-option input{grid-row:span 3;margin:2px 0 0}.everyalt-model-option .everyalt-model-provider,.everyalt-model-option .everyalt-model-price{display:block}.everyalt-model-option:has(input:checked){border-color:#2271b1;box-shadow:0 0 0 1px #2271b1}.everyalt-model-provider,.everyalt-model-price{color:#646970;font-size:13px}.everyalt-provider-key{max-width:640px;margin-bottom:1.5em}.everyalt-provider-key-title{display:flex;align-items:center;gap:10px;margin:0 0 8px;font-size:14px}.everyalt-key-status{font-size:12px;font-weight:400;padding:1px 8px;border-radius:10px}.everyalt-key-status.is-saved{background:#edfaef;color:#008a20}.everyalt-key-status.is-missing{background:#fcf9e8;color:#8a6d00}.everyalt-key-steps{margin:10px 0 8px 1.5em}.everyalt-key-steps li{margin-bottom:4px}.everyalt-privacy-note{margin-top:10px;padding:10px 12px;border-left:4px solid #00a32a;background:#f6f7f7}.everyalt-privacy-note p{margin:0 0 6px}.everyalt-privacy-note p:last-child{margin-bottom:0}.everyalt-queue-panel p{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.everyalt-queue-panel .everyalt-queue-spinner{float:none;margin:0}.everyalt-queue-panel:not(.is-working) .everyalt-queue-spinner{display:none}.everyalt-queue-panel .everyalt-bulk-progress-log{margin:0 0 8px;max-height:160px}.everyalt-queue-panel .everyalt-bulk-progress-log:empty{display:none}#everyalt-queue-clear{margin-left:auto}.everyalt-review-item.is-decorative{border-style:dashed}.everyalt-decorative-badge{display:inline-block;margin:0 6px 6px 0;padding:1px 8px;border-radius:10px;background:#f0f6fc;color:#0a4b78;font-size:12px}.everyalt-budget-bar{max-width:480px;margin:0 0 1em}.everyalt-budget-bar.is-full span{background:#d63638}.everyalt-usage-table{max-width:900px;margin-bottom:.5em}/* Bulk tabs: selectable image cards (alt text and titles) */.everyalt-bulk-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:16px;list-style:none;margin:1em 0;padding:0}.everyalt-bulk-card{position:relative;margin:0;padding:6px;background:#fff;border:1px solid #dcdcde;border-radius:4px;transition:border-color .15s,box-shadow .15s}.everyalt-bulk-card:hover{border-color:#8c8f94}.everyalt-bulk-card.is-selected{border-color:#2271b1;box-shadow:0 0 0 1px #2271b1}.everyalt-bulk-card.is-error{border-color:#d63638}.everyalt-bulk-card label{position:relative;display:block;cursor:pointer}.everyalt-bulk-card .everyalt-bulk-thumb{position:relative;display:block;line-height:0;border-radius:2px;overflow:hidden;background:#f0f0f1}.everyalt-bulk-card .everyalt-bulk-thumb img{display:block;width:100%;height:auto;aspect-ratio:1/1;object-fit:cover;transition:opacity .2s}.everyalt-bulk-card label input[type=checkbox]{position:absolute;top:8px;left:8px;z-index:2;margin:0;box-shadow:0 0 0 3px rgba(255,255,255,.9),0 1px 4px 3px rgba(0,0,0,.25)}.everyalt-bulk-card.is-done label{cursor:default}.everyalt-bulk-card.is-done .everyalt-bulk-thumb img{opacity:.4}.everyalt-bulk-card.is-done .everyalt-bulk-thumb::after{content:"\2713";position:absolute;top:50%;left:50%;width:40px;height:40px;margin:-20px 0 0 -20px;border-radius:50%;background:#00a32a;color:#fff;font-size:22px;font-weight:600;line-height:40px;text-align:center;box-shadow:0 1px 4px rgba(0,0,0,.3)}.everyalt-bulk-card .everyalt-bulk-edit-link{display:inline-block;margin-top:6px;font-size:12px}.everyalt-bulk-item-status{display:block;margin-top:4px;font-size:12px;line-height:1.35;word-break:break-word}.everyalt-bulk-item-status:empty{display:none} \ No newline at end of file diff --git a/admin/js/everyalt-admin-simple.js b/admin/js/everyalt-admin-simple.js index fafc448..a27a379 100644 --- a/admin/js/everyalt-admin-simple.js +++ b/admin/js/everyalt-admin-simple.js @@ -86,17 +86,31 @@ }); }); + // Bulk tabs: highlight selected image cards. Select all/none change checkboxes without a change + // event, so they call syncCards() themselves. + function syncCards() { + document.querySelectorAll('.everyalt-bulk-card').forEach(function(card) { + var cb = card.querySelector('input[type="checkbox"]'); + card.classList.toggle('is-selected', !!(cb && cb.checked)); + }); + } + document.addEventListener('change', function(e) { + if (e.target && e.target.closest && e.target.closest('.everyalt-bulk-card')) syncCards(); + }); + // Bulk: Select all / Select none var selectAllBtn = document.getElementById('everyalt-bulk-select-all'); var selectNoneBtn = document.getElementById('everyalt-bulk-select-none'); if (selectAllBtn) { selectAllBtn.addEventListener('click', function() { - document.querySelectorAll('.everyalt-bulk-checkbox').forEach(function(cb) { cb.checked = true; }); + document.querySelectorAll('.everyalt-bulk-checkbox:not(:disabled)').forEach(function(cb) { cb.checked = true; }); + syncCards(); }); } if (selectNoneBtn) { selectNoneBtn.addEventListener('click', function() { document.querySelectorAll('.everyalt-bulk-checkbox').forEach(function(cb) { cb.checked = false; }); + syncCards(); }); } @@ -148,10 +162,9 @@ } var cb = itemEl.querySelector('input[type="checkbox"]'); if (cb && r.success) { cb.checked = false; cb.disabled = true; } - if (r.success) { - var label = itemEl.querySelector('label'); - if (label) label.style.opacity = '0.5'; - } + itemEl.classList.toggle('is-done', !!r.success); + itemEl.classList.toggle('is-error', !r.success); + itemEl.classList.remove('is-selected'); } if (queueLog) { var li = document.createElement('li'); @@ -310,12 +323,14 @@ var titleSelectNoneBtn = document.getElementById('everyalt-bulk-title-select-none'); if (titleSelectAllBtn) { titleSelectAllBtn.addEventListener('click', function() { - document.querySelectorAll('.everyalt-bulk-title-checkbox').forEach(function(cb) { cb.checked = true; }); + document.querySelectorAll('.everyalt-bulk-title-checkbox:not(:disabled)').forEach(function(cb) { cb.checked = true; }); + syncCards(); }); } if (titleSelectNoneBtn) { titleSelectNoneBtn.addEventListener('click', function() { document.querySelectorAll('.everyalt-bulk-title-checkbox').forEach(function(cb) { cb.checked = false; }); + syncCards(); }); } diff --git a/admin/partials/everyalt-options-display.php b/admin/partials/everyalt-options-display.php index 39dfa8f..2dd4da6 100644 --- a/admin/partials/everyalt-options-display.php +++ b/admin/partials/everyalt-options-display.php @@ -313,9 +313,10 @@ ID; ?> -
  • +
  • ID; ?> -
  • +