releasebird-javascript-sdk 1.0.83 → 1.0.84

package/src/RbirdFormManager.js

@@ -162,7 +162,7 @@ export class RbirdFormManager {
                 ` : ''}
                 <div class="rbird-form-body">
                     ${form.title ? `<h3 class="rbird-form-title" style="${this.getTitleStyles(theme)}">${this.escapeHtml(form.title)}</h3>` : ''}
-                    ${form.description ? `<p class="rbird-form-description" style="${this.getDescriptionStyles()}">${this.escapeHtml(form.description)}</p>` : ''}
+                    ${form.description ? `<p class="rbird-form-description" style="${this.getDescriptionStyles(theme)}">${this.escapeHtml(form.description)}</p>` : ''}
                     <form class="rbird-form-fields" data-form-id="${form.id}">
                         ${fieldsHtml}
                         <button type="submit" class="rbird-form-submit" style="${this.getSubmitButtonStyles(theme)}">
@@ -206,7 +206,7 @@ export class RbirdFormManager {
         let html = `<div class="rbird-form-field" style="margin-bottom: 16px;">`;
 
         if (field.label) {
-            html += `<label style="${this.getLabelStyles()}">${this.escapeHtml(field.label)} ${requiredMark}</label>`;
+            html += `<label style="${this.getLabelStyles(theme)}">${this.escapeHtml(field.label)} ${requiredMark}</label>`;
         }
 
         switch (field.type) {
@@ -416,26 +416,26 @@ export class RbirdFormManager {
     getTitleStyles(theme) {
         return `
             margin: 0 0 8px 0;
-            font-size: 20px;
+            font-size: ${theme.titleFontSize || '20px'};
             font-weight: 600;
             color: ${theme.primaryColor || '#1f2937'};
         `;
     }
 
-    getDescriptionStyles() {
+    getDescriptionStyles(theme) {
         return `
             margin: 0 0 20px 0;
-            font-size: 14px;
+            font-size: ${theme.descriptionFontSize || '14px'};
             color: #6b7280;
             line-height: 1.5;
         `;
     }
 
-    getLabelStyles() {
+    getLabelStyles(theme) {
         return `
             display: block;
             margin-bottom: 6px;
-            font-size: 14px;
+            font-size: ${theme.labelFontSize || '14px'};
             font-weight: 500;
             color: #374151;
         `;