सब्सक्रिप्शन फ़ॉर्म विजेट को कस्टमाइज़ करें

डिफ़ॉल्ट रूप से, सब्सक्रिप्शन फ़ॉर्म विजेट एक न्यूट्रल स्टाइल का उपयोग करता है जो अधिकांश पेजों पर काम करता है। एम्बेड कोड जोड़ने के बाद, आप pushwoosh-subscribe-widget एलिमेंट पर CSS कस्टम प्रॉपर्टीज़ सेट करके इसे अपनी साइट की विज़ुअल पहचान से मिला सकते हैं। नीचे दी गई तालिकाओं में दिए गए मान डिफ़ॉल्ट को बदल देते हैं।

रंग कस्टमाइज़ करें

वेरिएबल	विवरण	डिफ़ॉल्ट
`--esw-primary-color`	बटन, लिंक और एक्सेंट के लिए प्राथमिक रंग	`#0E72E5`
`--esw-primary-hover`	प्राथमिक तत्वों का होवर रंग	`#1A85FF`
`--esw-text-color`	मुख्य टेक्स्ट का रंग	`#4B5057`
`--esw-text-secondary`	द्वितीयक टेक्स्ट (प्लेसहोल्डर, कैप्शन)	`#969CA3`
`--esw-background`	विजेट का बैकग्राउंड	`#FFFFFF`
`--esw-surface-color`	सतह का रंग (होवर, द्वितीयक बैकग्राउंड)	`#F7F9FA`
`--esw-border-color`	बॉर्डर का रंग	`#DCE1E5`
`--esw-border-color-focus`	फ़ोकस स्थिति में बॉर्डर का रंग	`#0E72E5`
`--esw-error-color`	त्रुटि का रंग	`#E52E59`
`--esw-success-color`	सफलता का रंग	`#479900`
`--esw-success-bg`	सफलता संदेश का बैकग्राउंड	`#F7F9FA`

टाइपोग्राफी

वेरिएबल	विवरण	डिफ़ॉल्ट
`--esw-font-family`	फ़ॉन्ट परिवार	`Roboto, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif`
`--esw-font-size-base`	बेस फ़ॉन्ट आकार	`14px`
`--esw-font-size-title`	शीर्षक फ़ॉन्ट आकार	`18px`
`--esw-font-size-label`	फ़ील्ड लेबल फ़ॉन्ट आकार	`12px`
`--esw-font-size-small`	छोटा टेक्स्ट (त्रुटियाँ, नोट्स)	`12px`
`--esw-font-weight-regular`	नियमित वज़न	`400`
`--esw-font-weight-medium`	मध्यम वज़न	`500`
`--esw-font-weight-bold`	बोल्ड वज़न	`700`
`--esw-line-height-base`	बेस लाइन की ऊँचाई	`1.4`
`--esw-line-height-title`	शीर्षक लाइन की ऊँचाई	`1.2`

आकार और स्पेसिंग

वेरिएबल	विवरण	डिफ़ॉल्ट
`--esw-input-height`	इनपुट फ़ील्ड की ऊँचाई	`36px`
`--esw-button-height`	बटन की ऊँचाई	`36px`
`--esw-spacing-xs`	अतिरिक्त छोटी स्पेसिंग	`4px`
`--esw-spacing-sm`	छोटी स्पेसिंग	`8px`
`--esw-spacing-md`	मध्यम स्पेसिंग	`16px`
`--esw-spacing-lg`	बड़ी स्पेसिंग	`24px`
`--esw-popup-width`	मोडल की चौड़ाई	`380px`
`--esw-popup-max-width`	मोडल की अधिकतम चौड़ाई	`90vw`

दिखावट

वेरिएबल	विवरण	डिफ़ॉल्ट
`--esw-border-radius`	तत्वों के लिए कॉर्नर रेडियस	`4px`
`--esw-border-radius-popup`	मोडल कॉर्नर रेडियस	`8px`
`--esw-shadow-popup`	मोडल बॉक्स शैडो	`0 0 6px rgba(0, 0, 0, 0.06), 0 10px 16px rgba(0, 0, 0, 0.1)`

pushwoosh-subscribe-widget {
  --esw-primary-color: #ff6b6b;
  --esw-border-radius: 12px;
  --esw-font-family: "Inter", sans-serif;
}

<pushwoosh-subscribe-widget
  formCode="YOUR_FORM_CODE"
  style="--esw-primary-color: #ff6b6b; --esw-border-radius: 12px;"
></pushwoosh-subscribe-widget>