Fix WooCommerce product sync button functionality

- Move sync handler from wc-integration.js to admin.js (uses wpBnbAdmin)
- Add CSS for button icon vertical alignment with inline-flex
- Add spin animation for sync button icon during operation
- Add sync status styling (success/error colors)
- Add i18n strings for syncing messages

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
2026-02-04 10:17:17 +01:00
parent ada838a1e4
commit c92be303e8
3 changed files with 90 additions and 0 deletions

View File

@@ -2098,3 +2098,45 @@
width: 16px;
height: 16px;
}
/* ============================================
WooCommerce Sync Button
============================================ */
.bnb-sync-rooms-btn {
display: inline-flex;
align-items: center;
gap: 6px;
}
.bnb-sync-rooms-btn .dashicons {
font-size: 16px;
width: 16px;
height: 16px;
line-height: 1;
}
.bnb-sync-rooms-btn .dashicons.bnb-spin {
animation: bnb-spin 1s linear infinite;
}
@keyframes bnb-spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
.sync-status {
margin-left: 10px;
font-style: italic;
}
.sync-status .bnb-sync-success {
color: #00a32a;
}
.sync-status .bnb-sync-error {
color: #d63638;
}