@pocketping/widget 1.9.0 → 1.10.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.cjs CHANGED
@@ -63,6 +63,7 @@ function styles(options) {
63
63
  const resolvedFooterColor = resolveThemeColor(footerColor, isDark, "#f0f2f5", "#202c33");
64
64
  const resolvedToggleColor = resolveThemeColor(toggleColor, isDark, "#25d366", "#25d366");
65
65
  const resolvedToggleHoverColor = resolvedToggleColor !== "#25d366" ? adjustBrightness(resolvedToggleColor, -10) : "#22c55e";
66
+ const resolvedSendButtonHoverColor = adjustBrightness(resolvedHeaderColor, -15);
66
67
  const whatsappPattern = isDark ? `url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E")` : `url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23000000' fill-opacity='0.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E")`;
67
68
  const dotsPattern = isDark ? `url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='10' cy='10' r='1' fill='%23ffffff' fill-opacity='0.05'/%3E%3C/svg%3E")` : `url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='10' cy='10' r='1' fill='%23000000' fill-opacity='0.05'/%3E%3C/svg%3E")`;
68
69
  const resolvedChatBg = resolveThemeColor(chatBackground, isDark, "whatsapp", "whatsapp");
@@ -632,7 +633,7 @@ function styles(options) {
632
633
  height: 42px;
633
634
  min-width: 42px;
634
635
  border-radius: 50%;
635
- background: #00a884;
636
+ background: ${resolvedHeaderColor};
636
637
  color: white;
637
638
  border: none;
638
639
  cursor: pointer;
@@ -646,7 +647,7 @@ function styles(options) {
646
647
  }
647
648
 
648
649
  .pp-send-btn:not(:disabled):hover {
649
- background: #008f72;
650
+ background: ${resolvedSendButtonHoverColor};
650
651
  }
651
652
 
652
653
  .pp-send-btn:not(:disabled):active {
@@ -672,7 +673,7 @@ function styles(options) {
672
673
  }
673
674
 
674
675
  .pp-footer a {
675
- color: ${isDark ? "#00a884" : "#008069"};
676
+ color: ${primaryColor};
676
677
  text-decoration: none;
677
678
  font-weight: 500;
678
679
  }
package/dist/index.js CHANGED
@@ -22,6 +22,7 @@ function styles(options) {
22
22
  const resolvedFooterColor = resolveThemeColor(footerColor, isDark, "#f0f2f5", "#202c33");
23
23
  const resolvedToggleColor = resolveThemeColor(toggleColor, isDark, "#25d366", "#25d366");
24
24
  const resolvedToggleHoverColor = resolvedToggleColor !== "#25d366" ? adjustBrightness(resolvedToggleColor, -10) : "#22c55e";
25
+ const resolvedSendButtonHoverColor = adjustBrightness(resolvedHeaderColor, -15);
25
26
  const whatsappPattern = isDark ? `url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E")` : `url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23000000' fill-opacity='0.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E")`;
26
27
  const dotsPattern = isDark ? `url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='10' cy='10' r='1' fill='%23ffffff' fill-opacity='0.05'/%3E%3C/svg%3E")` : `url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='10' cy='10' r='1' fill='%23000000' fill-opacity='0.05'/%3E%3C/svg%3E")`;
27
28
  const resolvedChatBg = resolveThemeColor(chatBackground, isDark, "whatsapp", "whatsapp");
@@ -591,7 +592,7 @@ function styles(options) {
591
592
  height: 42px;
592
593
  min-width: 42px;
593
594
  border-radius: 50%;
594
- background: #00a884;
595
+ background: ${resolvedHeaderColor};
595
596
  color: white;
596
597
  border: none;
597
598
  cursor: pointer;
@@ -605,7 +606,7 @@ function styles(options) {
605
606
  }
606
607
 
607
608
  .pp-send-btn:not(:disabled):hover {
608
- background: #008f72;
609
+ background: ${resolvedSendButtonHoverColor};
609
610
  }
610
611
 
611
612
  .pp-send-btn:not(:disabled):active {
@@ -631,7 +632,7 @@ function styles(options) {
631
632
  }
632
633
 
633
634
  .pp-footer a {
634
- color: ${isDark ? "#00a884" : "#008069"};
635
+ color: ${primaryColor};
635
636
  text-decoration: none;
636
637
  font-weight: 500;
637
638
  }