wp-plugins/twilio-wp-plugin
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix browser phone Twilio SDK loading and CSS layout issues

Browse Source 
- Update Twilio SDK URL from sdk.twilio.com to unpkg CDN (same as backend)
- Change SDK version from 2.11.1 to 2.11.0 for consistency
- Fix dial number input overflow by adding box-sizing: border-box
- Ensure all elements use border-box sizing model

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
jknapp
2025-08-13 15:03:08 -07:00
parent e3fab38d01
commit 3bdfc3f490
2 changed files with 9 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
assets/css/browser-phone-frontend.css
View File

@@ -7,6 +7,11 @@
border-radius: 12px; border-radius: 12px;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
box-sizing: border-box;
}
.twp-browser-phone-container * {
box-sizing: border-box;
} }
.twp-browser-phone-container.compact { .twp-browser-phone-container.compact {

8
includes/class-twp-shortcodes.php
View File

@@ -26,12 +26,12 @@ class TWP_Shortcodes {
global $post; global $post;
if (is_a($post, 'WP_Post') && has_shortcode($post->post_content, 'twp_browser_phone')) { if (is_a($post, 'WP_Post') && has_shortcode($post->post_content, 'twp_browser_phone')) {
// Enqueue Twilio Voice SDK with multiple fallbacks // Enqueue Twilio Voice SDK from unpkg CDN (same as backend)
wp_enqueue_script( wp_enqueue_script(
'twilio-voice-sdk', 'twilio-voice-sdk',
'https://sdk.twilio.com/js/voice/2.11.1/twilio.min.js', 'https://unpkg.com/@twilio/voice-sdk@2.11.0/dist/twilio.min.js',
array(), array(),
'2.11.1', '2.11.0',
false // Load in head to ensure it's available false // Load in head to ensure it's available
); );
@@ -41,7 +41,7 @@ class TWP_Shortcodes {
if (typeof Twilio === 'undefined') { if (typeof Twilio === 'undefined') {
console.warn('Primary Twilio SDK failed, attempting fallback load'); console.warn('Primary Twilio SDK failed, attempting fallback load');
var script = document.createElement('script'); var script = document.createElement('script');
script.src = 'https://sdk.twilio.com/js/voice/2.11.1/twilio.min.js'; script.src = 'https://unpkg.com/@twilio/voice-sdk@2.11.0/dist/twilio.min.js';
script.onload = function() { console.log('Fallback Twilio SDK loaded'); }; script.onload = function() { console.log('Fallback Twilio SDK loaded'); };
script.onerror = function() { console.error('Fallback Twilio SDK failed'); }; script.onerror = function() { console.error('Fallback Twilio SDK failed'); };
document.head.appendChild(script); document.head.appendChild(script);