PluginProbe
Formidable Forms – WordPress Form Builder for Contact Forms, Calculators, Quizzes & More / 6.7.2
Formidable Forms – WordPress Form Builder for Contact Forms, Calculators, Quizzes & More v6.7.2
6.35 6.34 6.33.1 6.33 6.32.1 6.32 6.31 6.25 6.25.1 6.26 6.26.1 6.27 6.28 6.29 6.3 6.3.1 6.3.2 6.30 6.4 6.4.1 6.4.2 6.5 6.5.1 6.5.2 6.5.3 All 141 releases
← All changes | css/custom_theme.css.php +348 -281 6.266.7.2 View file →
@@ -16,14 +16,12 @@
16 16 if ( ! isset( $frm_style ) ) {
17 17 $frm_style = new FrmStyle();
18 18 }
19 19
20 -$styles = $frm_style->get_all();
21 -$default_style = $frm_style->get_default_style( $styles );
22 -$defaults = FrmStylesHelper::get_settings_for_output( $default_style );
23 -$important = empty( $defaults['important_style'] ) ? '' : ' !important';
24 -$pro_is_installed = FrmAppHelper::pro_is_installed();
25 -$use_chosen_js = FrmStylesHelper::use_chosen_js();
20 +$styles = $frm_style->get_all();
21 +$default_style = $frm_style->get_default_style( $styles );
22 +$defaults = FrmStylesHelper::get_settings_for_output( $default_style );
23 +$important = empty( $defaults['important_style'] ) ? '' : ' !important';
26 24
27 25 ?>
28 26 .with_frm_style{
29 27 <?php FrmStylesHelper::output_vars( $defaults ); ?>
@@ -38,12 +36,12 @@
38 36
39 37 .with_frm_style,
40 38 .with_frm_style form,
41 39 .with_frm_style .frm-show-form div.frm_description p{
42 - text-align: var(--form-align)<?php echo esc_html( $important ); ?>;
40 + text-align:<?php echo esc_html( $defaults['form_align'] . $important ); ?>;
41 + text-align:var(--form-align)<?php echo esc_html( $important ); ?>;
43 42 }
44 43
45 -/* Keep this. This is used for Honeypot */
46 44 input:-webkit-autofill {
47 45 -webkit-box-shadow: 0 0 0 30px white inset;
48 46 }
49 47
@@ -49,24 +47,36 @@
49 47
50 48 /* Form description */
51 49 .with_frm_style .frm-show-form div.frm_description p{
52 50 <?php if ( ! empty( $defaults['form_desc_size'] ) ) { ?>
53 - font-size: var(--form-desc-size)<?php echo esc_html( $important ); ?>;
51 + font-size:<?php echo esc_html( $defaults['form_desc_size'] . $important ); ?>;
52 + font-size:var(--form-desc-size)<?php echo esc_html( $important ); ?>;
54 53 <?php } ?>
55 54 <?php if ( ! empty( $defaults['form_desc_color'] ) ) { ?>
56 - color: var(--form-desc-color)<?php echo esc_html( $important ); ?>;
55 + color:<?php echo esc_html( $defaults['form_desc_color'] . $important ); ?>;
56 + color:var(--form-desc-color)<?php echo esc_html( $important ); ?>;
57 57 <?php } ?>
58 58 <?php if ( ! empty( $defaults['form_desc_margin_top'] ) ) { ?>
59 - margin-top: var(--form-desc-margin-top)<?php echo esc_html( $important ); ?>;
59 + margin-top:<?php echo esc_html( $defaults['form_desc_margin_top'] . $important ); ?>;
60 + margin-top:var(--form-desc-margin-top)<?php echo esc_html( $important ); ?>;
60 61 <?php } ?>
61 62 <?php if ( ! empty( $defaults['form_desc_margin_bottom'] ) ) { ?>
62 - margin-bottom: var(--form-desc-margin-bottom)<?php echo esc_html( $important ); ?>;
63 + margin-bottom:<?php echo esc_html( $defaults['form_desc_margin_bottom'] . $important ); ?>;
64 + margin-bottom:var(--form-desc-margin-bottom)<?php echo esc_html( $important ); ?>;
63 65 <?php } ?>
64 66 <?php if ( isset( $defaults['form_desc_padding'] ) ) { ?>
65 - padding: var(--form-desc-padding)<?php echo esc_html( $important ); ?>;
67 + padding:<?php echo esc_html( $defaults['form_desc_padding'] . $important ); ?>;
68 + padding:var(--form-desc-padding)<?php echo esc_html( $important ); ?>;
66 69 <?php } ?>
67 70 }
68 71
72 +form .<?php echo esc_html( FrmHoneypot::generate_class_name() ); ?> {
73 + overflow: hidden;
74 + width: 0;
75 + height: 0;
76 + position: absolute;
77 +}
78 +
69 79 .with_frm_style fieldset{
70 80 min-width:0;
71 81 display: block; /* Override 2021 theme */
72 82 }
@@ -79,20 +89,24 @@
79 89 }
80 90
81 91 .with_frm_style .frm_form_fields > fieldset{
82 92 <?php if ( isset( $defaults['fieldset'] ) && ( $defaults['fieldset'] || '0' === $defaults['fieldset'] ) ) { ?>
83 - border-width: var(--fieldset)<?php echo esc_html( $important ); ?>;
93 + border-width:<?php echo esc_html( $defaults['fieldset'] . $important ); ?>;
94 + border-width:var(--fieldset)<?php echo esc_html( $important ); ?>;
84 95 <?php } ?>
85 96 border-style:solid;
86 97 <?php if ( ! empty( $defaults['fieldset_color'] ) ) { ?>
87 - border-color: var(--fieldset-color)<?php echo esc_html( $important ); ?>;
98 + border-color:<?php echo esc_html( $defaults['fieldset_color'] . $important ); ?>;
99 + border-color:var(--fieldset-color)<?php echo esc_html( $important ); ?>;
88 100 <?php } ?>
89 101 margin:0;
90 102 <?php if ( ! empty( $defaults['fieldset_padding'] ) ) { ?>
91 - padding: var(--fieldset-padding)<?php echo esc_html( $important ); ?>;
103 + padding:<?php echo esc_html( $defaults['fieldset_padding'] . $important ); ?>;
104 + padding:var(--fieldset-padding)<?php echo esc_html( $important ); ?>;
92 105 <?php } ?>
93 106 <?php if ( ! empty( $defaults['fieldset_bg_color'] ) ) { ?>
94 - background-color: var(--fieldset-bg-color)<?php echo esc_html( $important ); ?>;
107 + background-color:<?php echo esc_html( $defaults['fieldset_bg_color'] ); ?>;
108 + background-color:var(--fieldset-bg-color)<?php echo esc_html( $important ); ?>;
95 109 <?php } ?>
96 110 <?php if ( ! empty( $defaults['font'] ) ) { ?>
97 111 font-family:var(--font);
98 112 <?php } ?>
@@ -116,21 +130,26 @@
116 130
117 131 .with_frm_style legend + h3,
118 132 .with_frm_style h3.frm_form_title{
119 133 <?php if ( ! empty( $defaults['title_size'] ) ) { ?>
120 - font-size: var(--title-size)<?php echo esc_html( $important ); ?>;
134 + font-size:<?php echo esc_html( $defaults['title_size'] . $important ); ?>;
135 + font-size:var(--title-size)<?php echo esc_html( $important ); ?>;
121 136 <?php } ?>
122 137 <?php if ( ! empty( $defaults['title_color'] ) ) { ?>
123 - color: var(--title-color)<?php echo esc_html( $important ); ?>;
138 + color:<?php echo esc_html( $defaults['title_color'] . $important ); ?>;
139 + color:var(--title-color)<?php echo esc_html( $important ); ?>;
124 140 <?php } ?>
125 141 <?php if ( ! empty( $defaults['font'] ) ) { ?>
126 - font-family: var(--font);
142 + font-family:<?php echo FrmAppHelper::kses( $defaults['font'] ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
143 + font-family:var(--font);
127 144 <?php } ?>
128 145 <?php if ( ! empty( $defaults['title_margin_top'] ) ) { ?>
129 - margin-top: var(--title-margin-top)<?php echo esc_html( $important ); ?>;
146 + margin-top:<?php echo esc_html( $defaults['title_margin_top'] . $important ); ?>;
147 + margin-top:var(--title-margin-top)<?php echo esc_html( $important ); ?>;
130 148 <?php } ?>
131 149 <?php if ( ! empty( $defaults['title_margin_bottom'] ) ) { ?>
132 - margin-bottom: var(--title-margin-bottom)<?php echo esc_html( $important ); ?>;
150 + margin-bottom:<?php echo esc_html( $defaults['title_margin_bottom'] . $important ); ?>;
151 + margin-bottom:var(--title-margin-bottom)<?php echo esc_html( $important ); ?>;
133 152 <?php } ?>
134 153 }
135 154
136 155 .with_frm_style .frm_form_field.frm_html_container,
@@ -135,42 +154,46 @@
135 154
136 155 .with_frm_style .frm_form_field.frm_html_container,
137 156 .with_frm_style .frm_form_field .frm_show_it{
138 157 <?php if ( ! empty( $defaults['font'] ) ) { ?>
139 - font-family: var(--font);
158 + font-family:<?php echo FrmAppHelper::kses( $defaults['font'] ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
159 + font-family:var(--font);
140 160 <?php } ?>
141 161 <?php if ( ! empty( $defaults['form_desc_color'] ) ) { ?>
142 - color: var(--form-desc-color)<?php echo esc_html( $important ); ?>;
162 + color:<?php echo esc_html( $defaults['form_desc_color'] . $important ); ?>;
163 + color:var(--form-desc-color)<?php echo esc_html( $important ); ?>;
143 164 <?php } ?>
144 165 }
145 166
146 167 <?php if ( ! empty( $defaults['form_desc_size'] ) ) { ?>
147 168 .with_frm_style .frm_form_field.frm_html_container{
148 - font-size: var(--form-desc-size)<?php echo esc_html( $important ); ?>;
169 + font-size:<?php echo esc_html( $defaults['form_desc_size'] . $important ); ?>;
170 + font-size:var(--form-desc-size)<?php echo esc_html( $important ); ?>;
149 171 }
150 172 <?php } ?>
151 173
152 174 .with_frm_style .frm_form_field .frm_show_it{
153 175 <?php if ( ! empty( $defaults['field_font_size'] ) ) { ?>
154 - font-size: var(--field-font-size)<?php echo esc_html( $important ); ?>;
176 + font-size:<?php echo esc_html( $defaults['field_font_size'] . $important ); ?>;
177 + font-size:var(--field-font-size)<?php echo esc_html( $important ); ?>;
155 178 <?php } ?>
156 179 <?php if ( ! empty( $defaults['field_weight'] ) ) { ?>
157 - font-weight: var(--field-weight)<?php echo esc_html( $important ); ?>;
180 + font-weight:<?php echo esc_html( $defaults['field_weight'] ); ?>;
181 + font-weight:var(--field-weight)<?php echo esc_html( $important ); ?>;
158 182 <?php } ?>
159 183 }
160 184
161 -.with_frm_style .frm_required {
185 +.with_frm_style .frm_required{
162 186 <?php if ( ! empty( $defaults['required_color'] ) ) { ?>
163 - color: var(--required-color)<?php echo esc_html( $important ); ?>;
187 + color:<?php echo esc_html( $defaults['required_color'] . $important ); ?>;
188 + color:var(--required-color)<?php echo esc_html( $important ); ?>;
164 189 <?php } ?>
165 190 <?php if ( ! empty( $defaults['required_weight'] ) ) { ?>
166 - font-weight: var(--required-weight)<?php echo esc_html( $important ); ?>;
191 + font-weight:<?php echo esc_html( $defaults['required_weight'] . $important ); ?>;
192 + font-weight:var(--required-weight)<?php echo esc_html( $important ); ?>;
167 193 <?php } ?>
168 194 }
169 195
170 -<?php if ( $use_chosen_js ) { ?>
171 -.with_frm_style .chosen-container,
172 -<?php } ?>
173 196 .with_frm_style input[type=text],
174 197 .with_frm_style input[type=password],
175 198 .with_frm_style input[type=email],
176 199 .with_frm_style input[type=number],
@@ -178,12 +201,14 @@
178 201 .with_frm_style input[type=tel],
179 202 .with_frm_style input[type=search],
180 203 .with_frm_style select,
181 204 .with_frm_style textarea,
182 -.with_frm_style .frm-card-element.StripeElement {
205 +.with_frm_style .frm-card-element.StripeElement,
206 +.with_frm_style .chosen-container{
183 207 font-family:var(--font)<?php echo esc_html( $important ); ?>;
184 208 <?php if ( ! empty( $defaults['field_font_size'] ) ) { ?>
185 - font-size: var(--field-font-size)<?php echo esc_html( $important ); ?>;
209 + font-size:<?php echo esc_html( $defaults['field_font_size'] ); ?>;
210 + font-size:var(--field-font-size)<?php echo esc_html( $important ); ?>;
186 211 <?php } ?>
187 212 margin-bottom:0<?php echo esc_html( $important ); ?>;
188 213 }
189 214
@@ -206,33 +231,41 @@
206 231 .with_frm_style .frm_scroll_box .frm_opt_container,
207 232 .frm_form_fields_active_style,
208 233 .frm_form_fields_error_style,
209 234 .with_frm_style .frm-card-element.StripeElement,
210 -<?php if ( $use_chosen_js ) { ?>
211 235 .with_frm_style .chosen-container-multi .chosen-choices,
212 -.with_frm_style .chosen-container-single .chosen-single,
213 -<?php } ?>
214 -.with_frm_style .frm_slimselect.ss-main {
215 - color: var(--text-color)<?php echo esc_html( $important ); ?>;
216 - background-color: var(--bg-color)<?php echo esc_html( $important ); ?>;
217 - border-color: var(--border-color)<?php echo esc_html( $important ); ?>;
218 - border-width: var(--field-border-width)<?php echo esc_html( $important ); ?>;
219 - border-style: var(--field-border-style)<?php echo esc_html( $important ); ?>;
220 - border-radius: var(--border-radius)<?php echo esc_html( $important ); ?>;
221 - width: var(--field-width)<?php echo esc_html( $important ); ?>;
222 - max-width: 100%;
223 - font-size: var(--field-font-size)<?php echo esc_html( $important ); ?>;
224 - padding: var(--field-pad)<?php echo esc_html( $important ); ?>;
225 - box-sizing: border-box;
226 - outline: none<?php echo esc_html( $important ); ?>;
227 - font-weight: var(--field-weight);
236 +.with_frm_style .chosen-container-single .chosen-single{
237 + color:<?php echo esc_html( $defaults['text_color'] ); ?>;
238 + color:var(--text-color)<?php echo esc_html( $important ); ?>;
239 + background-color:<?php echo esc_html( $defaults['bg_color'] . $important ); ?>;
240 + background-color:var(--bg-color)<?php echo esc_html( $important ); ?>;
241 + border-color:<?php echo esc_html( $defaults['border_color'] ); ?>;
242 + border-color:var(--border-color)<?php echo esc_html( $important ); ?>;
243 + border-width:<?php echo esc_html( $defaults['field_border_width'] ); ?>;
244 + border-width:var(--field-border-width)<?php echo esc_html( $important ); ?>;
245 + border-style:<?php echo esc_html( $defaults['field_border_style'] ); ?>;
246 + border-style:var(--field-border-style)<?php echo esc_html( $important ); ?>;
247 + -moz-border-radius:<?php echo esc_html( $defaults['border_radius'] . $important ); ?>;
248 + -webkit-border-radius:<?php echo esc_html( $defaults['border_radius'] . $important ); ?>;
249 + border-radius:<?php echo esc_html( $defaults['border_radius'] ); ?>;
250 + border-radius:var(--border-radius)<?php echo esc_html( $important ); ?>;
251 + width:<?php echo esc_html( $defaults['field_width'] ); ?>;
252 + width:var(--field-width)<?php echo esc_html( $important ); ?>;
253 + max-width:100%;
254 + font-size:<?php echo esc_html( $defaults['field_font_size'] ); ?>;
255 + font-size:var(--field-font-size)<?php echo esc_html( $important ); ?>;
256 + padding:<?php echo esc_html( $defaults['field_pad'] ); ?>;
257 + padding:var(--field-pad)<?php echo esc_html( $important ); ?>;
258 + -webkit-box-sizing:border-box;
259 + -moz-box-sizing:border-box;
260 + box-sizing:border-box;
261 + outline:none<?php echo esc_html( $important ); ?>;
262 + font-weight:<?php echo esc_html( $defaults['field_weight'] ); ?>;
263 + font-weight:var(--field-weight);
264 + box-shadow:var(--box-shadow)<?php echo esc_html( $important ); ?>;
228 265 }
229 266
230 -<?php if ( ! empty( $important ) ) : ?>
231 - <?php if ( $use_chosen_js ) { ?>
232 - .with_frm_style .chosen-container-multi .chosen-choices,
233 - .with_frm_style .chosen-container-single .chosen-single,
234 - <?php } ?>
267 +<?php if ( ! empty( $important ) ) { ?>
235 268 .with_frm_style input[type=text],
236 269 .with_frm_style input[type=password],
237 270 .with_frm_style input[type=email],
238 271 .with_frm_style input[type=number],
@@ -244,25 +277,30 @@
244 277 .frm_form_fields_style,
245 278 .with_frm_style .frm_scroll_box .frm_opt_container,
246 279 .frm_form_fields_active_style,
247 280 .frm_form_fields_error_style,
248 -.with_frm_style .frm-card-element.StripeElement {
281 +.with_frm_style .frm-card-element.StripeElement,
282 +.with_frm_style .chosen-container-multi .chosen-choices,
283 +.with_frm_style .chosen-container-single .chosen-single{
249 284 background-image:none !important;
250 285 }
251 -<?php endif; ?>
286 +<?php } ?>
252 287
253 288 .with_frm_style select option {
254 - color: var(--text-color)<?php echo esc_html( $important ); ?>;
289 + color:<?php echo esc_html( $defaults['text_color'] ); ?>;
290 + color:var(--text-color)<?php echo esc_html( $important ); ?>;
255 291 }
256 292
257 293 .with_frm_style select option.frm-select-placeholder {
258 - color: var(--text-color-disabled)<?php echo esc_html( $important ); ?>;
294 + color:<?php echo esc_html( $defaults['text_color_disabled'] ); ?>;
295 + color:var(--text-color-disabled)<?php echo esc_html( $important ); ?>;
259 296 }
260 297
261 298 .with_frm_style input[type=radio],
262 299 .with_frm_style input[type=checkbox]{
263 - border-color: var(--border-color)<?php echo esc_html( $important ); ?>;
264 - box-shadow: var(--box-shadow)<?php echo esc_html( $important ); ?>;
300 + border-color:<?php echo esc_html( $defaults['border_color'] . $important ); ?>;
301 + border-color:var(--border-color)<?php echo esc_html( $important ); ?>;
302 + box-shadow:var(--box-shadow)<?php echo esc_html( $important ); ?>;
265 303 float: none;
266 304 }
267 305
268 306 .with_frm_style input[type=radio]:after,
@@ -269,18 +307,8 @@
269 307 .with_frm_style input[type=checkbox]:after {
270 308 display: none; /* 2021 conflict */
271 309 }
272 310
273 -.with_frm_style input[type=radio]:not(:checked):focus,
274 -.with_frm_style input[type=checkbox]:not(:checked):focus {
275 - border-color: var(--border-color) !important;
276 -}
277 -
278 -.with_frm_style input[type=radio]:focus,
279 -.with_frm_style input[type=checkbox]:focus {
280 - box-shadow:0px 0px 0px 3px rgba(<?php echo esc_html( FrmStylesHelper::hex2rgb( $defaults['border_color_active'] ) ); ?>, 0.4) !important;
281 -}
282 -
283 311 .with_frm_style input[type=text],
284 312 .with_frm_style input[type=password],
285 313 .with_frm_style input[type=email],
286 314 .with_frm_style input[type=number],
@@ -289,9 +317,10 @@
289 317 .with_frm_style input[type=file],
290 318 .with_frm_style input[type=search],
291 319 .with_frm_style select,
292 320 .with_frm_style .frm-card-element.StripeElement{
293 - min-height: var(--field-height)<?php echo esc_html( $important ); ?>;
321 + min-height:<?php echo esc_html( $defaults['field_height'] ); ?>;
322 + min-height:var(--field-height)<?php echo esc_html( $important ); ?>;
294 323 line-height:1.3<?php echo esc_html( $important ); ?>;
295 324 }
296 325
297 326 .with_frm_style select[multiple=multiple]{
@@ -306,15 +335,17 @@
306 335 box-shadow:none;
307 336 }
308 337
309 338 .with_frm_style input[type=file]{
310 - color: var(--text-color)<?php echo esc_html( $important ); ?>;
311 - padding: 0px;
339 + color:<?php echo esc_html( $defaults['text_color'] ); ?>;
340 + color:var(--text-color)<?php echo esc_html( $important ); ?>;
341 + padding:0px;
312 342 <?php if ( ! empty( $defaults['font'] ) ) { ?>
313 - font-family: var(--font)<?php echo esc_html( $important ); ?>;
343 + font-family:var(--font)<?php echo esc_html( $important ); ?>;
314 344 <?php } ?>
315 - font-size: var(--field-font-size)<?php echo esc_html( $important ); ?>;
316 - display: initial;
345 + font-size:<?php echo esc_html( $defaults['field_font_size'] ); ?>;
346 + font-size:var(--field-font-size)<?php echo esc_html( $important ); ?>;
347 + display:initial;
317 348 }
318 349
319 350 .with_frm_style input[type=file].frm_transparent{
320 351 color:transparent<?php echo esc_html( $important ); ?>;
@@ -320,9 +351,10 @@
320 351 color:transparent<?php echo esc_html( $important ); ?>;
321 352 }
322 353
323 354 .with_frm_style .wp-editor-wrap{
324 - width: var(--field-width)<?php echo esc_html( $important ); ?>;
355 + width:<?php echo esc_html( $defaults['field_width'] . $important ); ?>;
356 + width:var(--field-width)<?php echo esc_html( $important ); ?>;
325 357 max-width:100%;
326 358 }
327 359
328 360 .with_frm_style .wp-editor-container textarea{
@@ -330,13 +362,15 @@
330 362 box-shadow:none !important;
331 363 }
332 364
333 365 .with_frm_style .mceIframeContainer{
334 - background-color: var(--bg-color)<?php echo esc_html( $important ); ?>;
366 + background-color:<?php echo esc_html( $defaults['bg_color'] . $important ); ?>;
367 + background-color:var(--bg-color)<?php echo esc_html( $important ); ?>;
335 368 }
336 369
337 370 .with_frm_style select{
338 - width: var(--auto-width)<?php echo esc_html( $important ); ?>;
371 + width:<?php echo esc_html( $defaults['auto_width'] ); ?>;
372 + width:var(--auto-width)<?php echo esc_html( $important ); ?>;
339 373 max-width:100%;
340 374 background-position-y: calc(50% + 3px);
341 375 }
342 376
@@ -344,12 +378,15 @@
344 378 .with_frm_style select[disabled],
345 379 .with_frm_style textarea[disabled],
346 380 .with_frm_style input[readonly],
347 381 .with_frm_style select[readonly],
348 -.with_frm_style textarea[readonly] {
349 - background-color: var(--bg-color-disabled)<?php echo esc_html( $important ); ?>;
350 - color: var(--text-color-disabled)<?php echo esc_html( $important ); ?>;
351 - border-color: var(--border-color-disabled)<?php echo esc_html( $important ); ?>;
382 +.with_frm_style textarea[readonly]{
383 + background-color:<?php echo esc_html( $defaults['bg_color_disabled'] ); ?>;
384 + background-color:var(--bg-color-disabled)<?php echo esc_html( $important ); ?>;
385 + color:<?php echo esc_html( $defaults['text_color_disabled'] ); ?>;
386 + color:var(--text-color-disabled)<?php echo esc_html( $important ); ?>;
387 + border-color:<?php echo esc_html( $defaults['border_color_disabled'] ); ?>;
388 + border-color:var(--border-color-disabled)<?php echo esc_html( $important ); ?>;
352 389 }
353 390
354 391 .frm_preview_page:before{
355 392 content:normal !important;
@@ -361,24 +398,30 @@
361 398
362 399 .with_frm_style .frm_primary_label{
363 400 max-width:100%;
364 401 <?php if ( ! empty( $defaults['font'] ) ) { ?>
365 - font-family: var(--font);
402 + font-family:<?php echo FrmAppHelper::kses( $defaults['font'] ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
403 + font-family:var(--font);
366 404 <?php } ?>
367 405 <?php if ( ! empty( $defaults['font_size'] ) ) { ?>
368 - font-size: var(--font-size)<?php echo esc_html( $important ); ?>;
406 + font-size:<?php echo esc_html( $defaults['font_size'] . $important ); ?>;
407 + font-size:var(--font-size)<?php echo esc_html( $important ); ?>;
369 408 <?php } ?>
370 409 <?php if ( ! empty( $defaults['label_color'] ) ) { ?>
371 - color: var(--label-color)<?php echo esc_html( $important ); ?>;
410 + color:<?php echo esc_html( $defaults['label_color'] . $important ); ?>;
411 + color:var(--label-color)<?php echo esc_html( $important ); ?>;
372 412 <?php } ?>
373 413 <?php if ( ! empty( $defaults['weight'] ) ) { ?>
374 - font-weight: var(--weight)<?php echo esc_html( $important ); ?>;
414 + font-weight:<?php echo esc_html( $defaults['weight'] . $important ); ?>;
415 + font-weight:var(--weight)<?php echo esc_html( $important ); ?>;
375 416 <?php } ?>
376 417 <?php if ( ! empty( $defaults['align'] ) ) { ?>
377 - text-align: var(--align)<?php echo esc_html( $important ); ?>;
418 + text-align:<?php echo esc_html( $defaults['align'] . $important ); ?>;
419 + text-align:var(--align)<?php echo esc_html( $important ); ?>;
378 420 <?php } ?>
379 421 <?php if ( ! empty( $defaults['label_padding'] ) ) { ?>
380 - padding: var(--label-padding)<?php echo esc_html( $important ); ?>;
422 + padding:<?php echo esc_html( $defaults['label_padding'] . $important ); ?>;
423 + padding:var(--label-padding)<?php echo esc_html( $important ); ?>;
381 424 <?php } ?>
382 425 margin:0;
383 426 width:auto;
384 427 display:block;
@@ -431,9 +474,9 @@
431 474
432 475 /* Floating labels */
433 476 .with_frm_style .frm_inside_container {
434 477 position: relative;
435 - padding-top: 18px;
478 + padding-top: 16px;
436 479 padding-top: calc(0.5 * var(--field-height));
437 480 }
438 481
439 482 .with_frm_style .frm_inside_container > input,
@@ -441,13 +484,21 @@
441 484 .with_frm_style .frm_inside_container > textarea {
442 485 display: block;
443 486 }
444 487
445 -.with_frm_style input::placeholder,
446 -.with_frm_style textarea::placeholder {
447 - font-size: var(--field-font-size)<?php echo esc_html( $important ); ?>;
488 +/* These do not work if they are combined */
489 +.with_frm_style .frm_inside_container > input::-moz-placeholder,
490 +.with_frm_style .frm_inside_container > textarea::-moz-placeholder {
491 + opacity: 0 !important;
492 + transition: opacity 0.3s ease-in;
448 493 }
449 494
495 +.with_frm_style .frm_inside_container > input:-ms-input-placeholder,
496 +.with_frm_style .frm_inside_container > textarea:-ms-input-placeholder {
497 + opacity: 0;
498 + transition: opacity 0.3s ease-in;
499 +}
500 +
450 501 .with_frm_style .frm_inside_container > input::placeholder,
451 502 .with_frm_style .frm_inside_container > textarea::placeholder {
452 503 opacity: 0;
453 504 transition: opacity 0.3s ease-in;
@@ -456,9 +507,9 @@
456 507 .with_frm_style .frm_inside_container > label {
457 508 transition: all 0.3s ease-in;
458 509
459 510 position: absolute;
460 - top: 19px;
511 + top: 17px;
461 512 top: calc(1px + .5 * var(--field-height));
462 513 left: 3px;
463 514 width: 100%;
464 515
@@ -466,9 +517,9 @@
466 517 text-overflow: ellipsis;
467 518 overflow: hidden;
468 519 white-space: nowrap;
469 520
470 - padding: 8px 12px;
521 + padding: 6px 10px;
471 522 padding: var(--field-pad);
472 523
473 524 font-size: 14px;
474 525 font-size: var(--field-font-size);
@@ -474,8 +525,9 @@
474 525 font-size: var(--field-font-size);
475 526 font-weight: normal;
476 527 font-weight: var(--field-weight);
477 528
529 + -ms-pointer-events: none;
478 530 pointer-events: none;
479 531 }
480 532
481 533 .with_frm_style.frm_style_lines-no-boxes .frm_inside_container > label {
@@ -489,8 +541,21 @@
489 541 font-size: 12px;
490 542 font-size: calc(0.85 * var(--field-font-size));
491 543 }
492 544
545 +/* These do not work if they are combined */
546 +.with_frm_style .frm_inside_container.frm_label_float_top > input::-moz-placeholder,
547 +.with_frm_style .frm_inside_container.frm_label_float_top > textarea::-moz-placeholder {
548 + opacity: 1 !important;
549 + transition: opacity 0.3s ease-in;
550 +}
551 +
552 +.with_frm_style .frm_inside_container.frm_label_float_top > input:-ms-input-placeholder,
553 +.with_frm_style .frm_inside_container.frm_label_float_top > textarea:-ms-input-placeholder {
554 + opacity: 1;
555 + transition: opacity 0.3s ease-in;
556 +}
557 +
493 558 .with_frm_style .frm_inside_container.frm_label_float_top > input::placeholder,
494 559 .with_frm_style .frm_inside_container.frm_label_float_top > textarea::placeholder {
495 560 opacity: 1;
496 561 transition: opacity 0.3s ease-in;
@@ -542,43 +607,54 @@
542 607 white-space:nowrap;
543 608 }
544 609
545 610 .with_frm_style .frm_button{
546 - text-decoration:none !important;
611 + text-decoration:none !important;;
547 612 border:1px solid #eee;
548 613 display:inline-block;
549 614 <?php if ( ! empty( $defaults['submit_padding'] ) ) { ?>
550 - padding: var(--submit-padding)<?php echo esc_html( $important ); ?>;
615 + padding:<?php echo esc_html( $defaults['submit_padding'] . $important ); ?>;
616 + padding:var(--submit-padding)<?php echo esc_html( $important ); ?>;
551 617 <?php } else { ?>
552 618 padding:5px;
553 619 <?php } ?>
554 620 <?php if ( ! empty( $defaults['border_radius'] ) ) { ?>
621 + -moz-border-radius:<?php echo esc_html( $defaults['border_radius'] . $important ); ?>;
622 + -webkit-border-radius:<?php echo esc_html( $defaults['border_radius'] . $important ); ?>;
555 623 border-radius:<?php echo esc_html( $defaults['border_radius'] . $important ); ?>;
556 624 border-radius:var(--border-radius)<?php echo esc_html( $important ); ?>;
557 625 <?php } ?>
558 626 <?php if ( ! empty( $defaults['submit_font_size'] ) ) { ?>
559 - font-size: var(--submit-font-size)<?php echo esc_html( $important ); ?>;
627 + font-size:<?php echo esc_html( $defaults['submit_font_size'] . $important ); ?>;
628 + font-size:var(--submit-font-size)<?php echo esc_html( $important ); ?>;
560 629 <?php } ?>
561 630 <?php if ( ! empty( $defaults['font'] ) ) { ?>
562 - font-family: var(--font)<?php echo esc_html( $important ); ?>;
631 + font-family:<?php echo FrmAppHelper::kses( $defaults['font'] . $important ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
632 + font-family:var(--font)<?php echo esc_html( $important ); ?>;
563 633 <?php } ?>
564 634 <?php if ( ! empty( $defaults['submit_weight'] ) ) { ?>
565 - font-weight: var(--submit-weight)<?php echo esc_html( $important ); ?>;
635 + font-weight:<?php echo esc_html( $defaults['submit_weight'] . $important ); ?>;
636 + font-weight:var(--submit-weight)<?php echo esc_html( $important ); ?>;
566 637 <?php } ?>
567 638 <?php if ( ! empty( $defaults['submit_text_color'] ) ) { ?>
568 - color: var(--submit-text-color)<?php echo esc_html( $important ); ?>;
639 + color:<?php echo esc_html( $defaults['submit_text_color'] . $important ); ?>;
640 + color:var(--submit-text-color)<?php echo esc_html( $important ); ?>;
569 641 <?php } ?>
570 642 <?php if ( ! empty( $defaults['submit_bg_color'] ) ) { ?>
571 - background: var(--submit-bg-color)<?php echo esc_html( $important ); ?>;
643 + background:<?php echo esc_html( $defaults['submit_bg_color'] . $important ); ?>;
644 + background:var(--submit-bg-color)<?php echo esc_html( $important ); ?>;
572 645 <?php } ?>
573 646 <?php if ( ! empty( $defaults['submit_border_width'] ) ) { ?>
574 - border-width: var(--submit-border-width)<?php echo esc_html( $important ); ?>;
647 + border-width:<?php echo esc_html( $defaults['submit_border_width'] ); ?>;
648 + border-width:var(--submit-border-width)<?php echo esc_html( $important ); ?>;
575 649 <?php } ?>
576 650 <?php if ( ! empty( $defaults['submit_border_color'] ) ) { ?>
577 - border-color: var(--submit-border-color)<?php echo esc_html( $important ); ?>;
651 + border-color:<?php echo esc_html( $defaults['submit_border_color'] . $important ); ?>;
652 + border-color:var(--submit-border-color)<?php echo esc_html( $important ); ?>;
578 653 <?php } ?>
579 654 <?php if ( ! empty( $defaults['submit_height'] ) ) { ?>
580 - height: var(--submit-height)<?php echo esc_html( $important ); ?>;
655 + height:<?php echo esc_html( $defaults['submit_height'] . $important ); ?>;
656 + height:var(--submit-height)<?php echo esc_html( $important ); ?>;
581 657 <?php } ?>
582 658 }
583 659
584 660 <?php if ( ! empty( $defaults['submit_text_color'] ) ) { ?>
@@ -660,8 +736,9 @@
660 736
661 737 .with_frm_style .frm_loading_prev .frm_prev_page,
662 738 .with_frm_style .frm_loading_form .frm_button_submit {
663 739 position: relative;
740 + opacity: .8;
664 741 color: transparent !important;
665 742 text-shadow: none !important;
666 743 }
667 744
@@ -687,9 +764,9 @@
687 764 border-top-color: transparent;
688 765 border-left-color: transparent;
689 766 border-radius: 50%;
690 767 box-sizing: border-box;
691 - <?php $loader_size = 12; ?>
768 + <?php $loader_size = 20; ?>
692 769 top: 50%;
693 770 left: 50%;
694 771 margin-top: -<?php echo absint( $loader_size / 2 ); ?>px;
695 772 margin-left: -<?php echo absint( $loader_size / 2 ); ?>px;
@@ -694,9 +771,12 @@
694 771 margin-top: -<?php echo absint( $loader_size / 2 ); ?>px;
695 772 margin-left: -<?php echo absint( $loader_size / 2 ); ?>px;
696 773 width: <?php echo absint( $loader_size ); ?>px;
697 774 height: <?php echo absint( $loader_size ); ?>px;
698 - animation: spin 2s linear infinite;
775 + -webkit-animation: spin 2s linear infinite;
776 + -moz-animation: spin 2s linear infinite;
777 + -o-animation: spin 2s linear infinite;
778 + animation: spin 2s linear infinite;
699 779 }
700 780
701 781 .with_frm_style .frm_submit.frm_flex {
702 782 align-items: center;
@@ -708,9 +788,9 @@
708 788 }
709 789
710 790 <?php
711 791 foreach ( $styles as $style ) {
712 - include __DIR__ . '/_single_theme.css.php';
792 + include( dirname( __FILE__ ) . '/_single_theme.css.php' );
713 793 unset( $style );
714 794 }
715 795
716 796 // Set it again since it may have been overridden.
@@ -732,12 +812,15 @@
732 812
733 813 .with_frm_style a.frm_save_draft,
734 814 .with_frm_style a.frm_start_over{
735 815 <?php if ( ! empty( $defaults['font'] ) ) { ?>
736 - font-family: var(--font);
816 + font-family:<?php echo FrmAppHelper::kses( $defaults['font'] ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
817 + font-family:var(--font);
737 818 <?php } ?>
738 - font-size: var(--submit-font-size);
739 - font-weight: var(--submit-weight);
819 + font-size:<?php echo esc_html( $defaults['submit_font_size'] ); ?>;
820 + font-size:var(--submit-font-size);
821 + font-weight:<?php echo esc_html( $defaults['submit_weight'] ); ?>;
822 + font-weight:var(--submit-weight);
740 823 }
741 824
742 825 .horizontal_radio .frm_radio{
743 826 margin:0 5px 0 0;
@@ -744,9 +827,9 @@
744 827 }
745 828
746 829 .horizontal_radio .frm_checkbox{
747 830 margin:0;
748 - margin-right:12px;
831 + margin-right:5px;
749 832 }
750 833
751 834 .vertical_radio .frm_checkbox,
752 835 .vertical_radio .frm_radio,
@@ -761,13 +844,15 @@
761 844 padding-left: 0;
762 845 }
763 846
764 847 .with_frm_style .frm_radio{
765 - display: var(--radio-align)<?php echo esc_html( $important ); ?>;
848 + display:<?php echo esc_html( $defaults['radio_align'] . $important ); ?>;
849 + display:var(--radio-align)<?php echo esc_html( $important ); ?>;
766 850 }
767 851
768 852 .with_frm_style .frm_checkbox{
769 - display: var(--check-align)<?php echo esc_html( $important ); ?>;
853 + display:<?php echo esc_html( $defaults['check_align'] . $important ); ?>;
854 + display:var(--check-align)<?php echo esc_html( $important ); ?>;
770 855 }
771 856
772 857 .with_frm_style .vertical_radio .frm_checkbox,
773 858 .with_frm_style .vertical_radio .frm_radio,
@@ -772,9 +857,8 @@
772 857 .with_frm_style .vertical_radio .frm_checkbox,
773 858 .with_frm_style .vertical_radio .frm_radio,
774 859 .vertical_radio .frm_catlevel_1{
775 860 display:block<?php echo esc_html( $important ); ?>;
776 - margin-bottom: 10px;
777 861 }
778 862
779 863 .with_frm_style .horizontal_radio .frm_checkbox,
780 864 .with_frm_style .horizontal_radio .frm_radio,
@@ -782,45 +866,40 @@
782 866 display:inline-block<?php echo esc_html( $important ); ?>;
783 867 }
784 868
785 869 .with_frm_style .frm_checkbox label,
786 -.with_frm_style .frm_radio label {
787 - display: inline-block;
788 - vertical-align: middle;
870 +.with_frm_style .frm_radio label{
871 + display: inline;
789 872 white-space:normal;
790 873 }
791 874
792 -.with_frm_style .frm_checkbox label input[type=checkbox],
793 -.with_frm_style .frm_radio label input[type=radio] {
794 - margin-right: 4px;
795 -}
796 -
797 -.with_frm_style .frm_checkbox label:not(.frm-label-disabled),
798 -.with_frm_style .frm_radio label:not(.frm-label-disabled) {
799 - cursor: pointer;
800 -}
801 -
802 875 .with_frm_style .vertical_radio .frm_checkbox label,
803 876 .with_frm_style .vertical_radio .frm_radio label{
804 877 display: block;
805 - width: 100%;
878 + padding-left: 20px;
879 + text-indent: -20px;
806 880 }
807 881
808 882 .with_frm_style .frm_radio label,
809 -.with_frm_style .frm_checkbox label {
883 +.with_frm_style .frm_checkbox label{
810 884 <?php if ( ! empty( $defaults['font'] ) ) { ?>
811 - font-family: var(--font);
885 + font-family:<?php echo FrmAppHelper::kses( $defaults['font'] ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
886 + font-family:var(--font);
812 887 <?php } ?>
813 - font-size: var(--check-font-size)<?php echo esc_html( $important ); ?>;
814 - color: var(--check-label-color)<?php echo esc_html( $important ); ?>;
815 - font-weight: var(--check-weight)<?php echo esc_html( $important ); ?>;
888 + font-size:<?php echo esc_html( $defaults['check_font_size'] . $important ); ?>;
889 + font-size:var(--check-font-size)<?php echo esc_html( $important ); ?>;
890 + color:<?php echo esc_html( $defaults['check_label_color'] . $important ); ?>;
891 + color:var(--check-label-color)<?php echo esc_html( $important ); ?>;
892 + font-weight:<?php echo esc_html( $defaults['check_weight'] . $important ); ?>;
893 + font-weight:var(--check-weight)<?php echo esc_html( $important ); ?>;
816 894 line-height: 1.3;
817 895 }
818 896
819 897 .with_frm_style .frm_radio input[type=radio],
820 898 .with_frm_style .frm_checkbox input[type=checkbox] {
821 - font-size: var(--check-font-size)<?php echo esc_html( $important ); ?>;
822 - position: static<?php echo esc_html( $important ); ?>;
899 + font-size:<?php echo esc_html( $defaults['check_font_size'] . $important ); ?>;
900 + font-size:var(--check-font-size)<?php echo esc_html( $important ); ?>;
901 + position:static<?php echo esc_html( $important ); ?>;
823 902 }
824 903
825 904 .frm_file_container .frm_file_link,
826 905 .with_frm_style .frm_radio label .frm_file_container,
@@ -830,9 +909,9 @@
830 909 vertical-align:middle;
831 910 }
832 911
833 912 .with_frm_style .frm_radio input[type=radio]
834 -<?php if ( $pro_is_installed ) : ?>
913 +<?php if ( FrmAppHelper::pro_is_installed() ) : ?>
835 914 , .with_frm_style .frm_scale input[type=radio]
836 915 <?php endif; ?>
837 916 {
838 917 border-radius:50%;
@@ -837,96 +916,62 @@
837 916 {
838 917 border-radius:50%;
839 918 }
840 919
841 -.with_frm_style .frm_checkbox input[type=checkbox] {
842 - border-radius: calc(var(--border-radius) / 2) !important;
920 +.with_frm_style .frm_checkbox input[type=checkbox]{
921 + border-radius:0;
843 922 }
844 923
845 924 .with_frm_style .frm_radio input[type=radio],
846 -<?php if ( $pro_is_installed ) : ?>
925 +<?php if ( FrmAppHelper::pro_is_installed() ) : ?>
847 926 .with_frm_style .frm_scale input[type=radio],
848 927 <?php endif; ?>
849 928 .with_frm_style .frm_checkbox input[type=checkbox]{
929 + -webkit-appearance: none;
850 930 appearance: none;
851 931 background-color: var(--bg-color);
852 932 flex: none;
853 933 display:inline-block !important;
854 - width: 16px !important;
855 - min-width: 16px !important;
856 - height: 16px !important;
934 + margin: 0 5px 0 0;
857 935 color: var(--border-color);
936 + width: 18px;
937 + min-width: 18px;
938 + height: 18px;
858 939 border: 1px solid currentColor;
859 940 border-color: var(--border-color);
860 941 vertical-align: middle;
861 942 position: initial; /* override Bootstrap */
862 943 padding: 0;
863 - margin: 0;
864 944 }
865 945
866 -.frm_forms.with_frm_style .frm_fields_container .frm_radio input[type=radio]:not([disabled]):checked,
867 -<?php if ( $pro_is_installed ) : ?>
868 -.frm_forms.with_frm_style .frm_fields_container .frm_scale input[type=radio]:not([disabled]):checked,
946 +.with_frm_style .frm_radio input[type=radio]:before,
947 +<?php if ( FrmAppHelper::pro_is_installed() ) : ?>
948 +.with_frm_style .frm_scale input[type=radio]:before,
869 949 <?php endif; ?>
870 -.frm_forms.with_frm_style .frm_fields_container .frm_checkbox input[type=checkbox]:not([disabled]):checked {
871 - border-color: var(--border-color-active) !important;
950 +.with_frm_style .frm_checkbox input[type=checkbox]:before {
951 + content: '';
952 + width: 12px;
953 + height: 12px;
954 + border-radius: 50%;
955 + transform: scale(0);
956 + transition: 120ms transform ease-in-out;
957 + box-shadow: inset 10px 10px var(--text-color);
958 + display: block;
959 + margin: 2px 0 0 2px;
872 960 }
873 961
874 -.frm_forms.with_frm_style .frm_fields_container .frm_checkbox input[type=checkbox]:not([disabled]):checked {
875 - background-color: var(--border-color-active) !important;
962 +.with_frm_style .frm_checkbox input[type=checkbox]:before{
963 + clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
964 + border-radius: 0;
876 965 }
877 966
878 -.with_frm_style .frm_radio input[type=radio][disabled]:checked,
879 -<?php if ( $pro_is_installed ) : ?>
880 -.with_frm_style .frm_scale input[type=radio][disabled]:checked,
881 -<?php endif; ?>
882 -.with_frm_style .frm_checkbox input[type=checkbox][disabled]:checked {
883 - border-color: var(--border-color) !important; /* Override Style Preview */
884 -}
885 -
886 -.with_frm_style .frm_checkbox input[type=checkbox][disabled]:checked {
887 - background-color: var(--border-color) !important;
888 -}
889 -
890 967 .with_frm_style .frm_radio input[type=radio]:checked:before,
891 -<?php if ( $pro_is_installed ) { ?>
892 -.with_frm_style .frm_scale input[type=radio]:checked:before,
893 -<?php } ?>
894 968 .with_frm_style .frm_checkbox input[type=checkbox]:checked:before {
895 - position: static !important; /* Override Style Preview */
896 - content: '';
897 - display: block;
969 + transform: scale(1);
898 970 }
899 971
900 -.frm_forms.with_frm_style .frm_checkbox input[type=checkbox]:before {
901 - width: 100% !important;
902 - height: 100% !important;
903 - background-image: url("data:image/svg+xml,%3Csvg width='12' height='9' viewBox='0 0 12 9' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10.6667 1.5L4.25001 7.91667L1.33334 5' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A") !important;
904 - background-size: 9px !important;
905 - background-repeat: no-repeat !important;
906 - background-position: center !important;
907 - margin: 0;
908 -}
909 -
910 -<?php if ( $pro_is_installed ) { ?>
911 -.with_frm_style .frm_scale input[type=radio]:before,
912 -<?php } ?>
913 -.with_frm_style .frm_radio input[type=radio]:before {
914 - width: 8px;
915 - height: 8px;
916 - border-radius: 50%;
917 - background-color: var(--border-color-active);
918 - margin: 3px;
919 -}
920 -
921 -<?php if ( $pro_is_installed ) { ?>
922 -.with_frm_style .frm_scale input[type=radio][disabled]:before,
923 -<?php } ?>
924 -.with_frm_style .frm_radio input[type=radio][disabled]:before {
925 - background-color: var(--border-color);
926 -}
927 -
928 972 .with_frm_style :invalid,
973 +.with_frm_style :-moz-submit-invalid,
929 974 .with_frm_style :-moz-ui-invalid{
930 975 box-shadow:none;
931 976 }
932 977
@@ -942,29 +987,33 @@
942 987
943 988 .with_frm_style .frm_error_style,
944 989 .with_frm_style .frm_message,
945 990 .frm_success_style{
991 + -moz-border-radius:4px;
992 + -webkit-border-radius:4px;
946 993 border-radius:4px;
947 994 padding:15px;
948 995 }
949 996
950 -.with_frm_style .frm_message p {
951 - color: var(--success-text-color)<?php echo esc_html( $important ); ?>;
952 - margin-bottom: 0;
997 +.with_frm_style .frm_message p{
998 + margin-bottom:5px;
999 + color:<?php echo esc_html( $defaults['success_text_color'] ); ?>;
1000 + color:var(--success-text-color)<?php echo esc_html( $important ); ?>;
953 1001 }
954 1002
955 -.with_frm_style .frm_message > p:first-of-type {
956 - margin-top: 0;
957 -}
958 -
959 1003 .with_frm_style .frm_message,
960 -.frm_success_style {
961 - margin: 5px 0 15px;
962 - border: 1px solid var(--success-border-color);
963 - background-color: var(--success-bg-color);
964 - color: var(--success-text-color)<?php echo esc_html( $important ); ?>;
965 - border-radius: var(--border-radius);
966 - font-size: var(--success-font-size)<?php echo esc_html( $important ); ?>;
1004 +.frm_success_style{
1005 + margin:5px 0 15px;
1006 + border:1px solid <?php echo esc_html( $defaults['success_border_color'] ); ?>;
1007 + border-color:var(--success-border-color);
1008 + background-color:<?php echo esc_html( $defaults['success_bg_color'] ); ?>;
1009 + background-color:var(--success-bg-color);
1010 + color:<?php echo esc_html( $defaults['success_text_color'] ); ?>;
1011 + color:var(--success-text-color)<?php echo esc_html( $important ); ?>;
1012 + border-radius:<?php echo esc_html( $defaults['border_radius'] ); ?>;
1013 + border-radius:var(--border-radius);
1014 + font-size:<?php echo esc_html( $defaults['success_font_size'] ); ?>;
1015 + font-size:var(--success-font-size)<?php echo esc_html( $important ); ?>;
967 1016 }
968 1017
969 1018 .with_frm_style .frm_plain_success .frm_message {
970 1019 background-color: transparent;
@@ -1000,9 +1049,10 @@
1000 1049 padding:5px;
1001 1050 border-width:1px;
1002 1051 border-style:solid;
1003 1052 <?php if ( ! empty( $defaults['border_color'] ) ) { ?>
1004 - border-color: var(--border-color);
1053 + border-color:<?php echo esc_html( $defaults['border_color'] ); ?>;
1054 + border-color:var(--border-color);
1005 1055 <?php } ?>
1006 1056 border-top:none;
1007 1057 border-left:none;
1008 1058 border-right:none;
@@ -1017,9 +1067,10 @@
1017 1067 }
1018 1068
1019 1069 <?php if ( ! empty( $defaults['border_color'] ) ) { ?>
1020 1070 .with_frm_style .frm-alt-table{
1021 - border-color: var(--border-color);
1071 + border-color:<?php echo esc_html( $defaults['border_color'] ); ?>;
1072 + border-color:var(--border-color);
1022 1073 }
1023 1074 <?php } ?>
1024 1075
1025 1076 .frm-alt-table th {
@@ -1043,11 +1094,11 @@
1043 1094 background-color:<?php echo esc_html( FrmStylesHelper::adjust_brightness( $defaults['border_color'], 45 ) ); ?>;
1044 1095 }
1045 1096
1046 1097 table.form_results.with_frm_style{
1047 - border-style: solid;
1048 - border-width: var(--field-border-width)<?php echo esc_html( $important ); ?>;
1049 - border-color: var(--border-color)<?php echo esc_html( $important ); ?>;
1098 + border:<?php echo esc_html( $defaults['field_border_width'] ); ?> solid <?php echo esc_html( $defaults['border_color'] . $important ); ?>;
1099 + border-width:var(--field-border-width)<?php echo esc_html( $important ); ?>;
1100 + border-color:var(--border-color)<?php echo esc_html( $important ); ?>;
1050 1101 }
1051 1102
1052 1103 table.form_results.with_frm_style tr td{
1053 1104 text-align:left;
@@ -1052,14 +1103,15 @@
1052 1103 table.form_results.with_frm_style tr td{
1053 1104 text-align:left;
1054 1105 padding:7px 9px;
1055 1106 <?php if ( ! empty( $defaults['text_color'] ) ) { ?>
1056 - color: var(--text-color)<?php echo esc_html( $important ); ?>;
1107 + color:<?php echo esc_html( $defaults['text_color'] ); ?>;
1108 + color:var(--text-color)<?php echo esc_html( $important ); ?>;
1057 1109 <?php } ?>
1058 1110 <?php if ( ! empty( $defaults['border_color'] ) ) { ?>
1059 - border-top-style: solid;
1060 - border-top-width: var(--field-border-width)<?php echo esc_html( $important ); ?>;
1061 - border-top-color: var(--border-color)<?php echo esc_html( $important ); ?>;
1111 + border-top:1px solid <?php echo esc_html( $defaults['border_color'] ); ?>;
1112 + border-top-width:var(--field-border-width)<?php echo esc_html( $important ); ?>;
1113 + border-top-color:var(--border-color)<?php echo esc_html( $important ); ?>;
1062 1114 <?php } ?>
1063 1115 }
1064 1116
1065 1117 table.form_results.with_frm_style tr.frm_even,
@@ -1069,10 +1121,11 @@
1069 1121 }
1070 1122
1071 1123 <?php if ( ! empty( $defaults['bg_color'] ) ) { ?>
1072 1124 table.form_results.with_frm_style tr.frm_odd,
1073 -.frm-grid .frm_odd {
1074 - background-color: var(--bg-color)<?php echo esc_html( $important ); ?>;
1125 +.frm-grid .frm_odd{
1126 + background-color:<?php echo esc_html( $defaults['bg_color'] ); ?>;
1127 + background-color:var(--bg-color)<?php echo esc_html( $important ); ?>;
1075 1128 }
1076 1129 <?php } ?>
1077 1130
1078 1131 <?php if ( ! empty( $defaults['border_color'] ) ) { ?>
@@ -1154,25 +1207,26 @@
1154 1207 animation:2s linear 0s normal none infinite progress-bar-stripes;
1155 1208 }
1156 1209
1157 1210 <?php if ( ! empty( $defaults['bg_color'] ) ) { ?>
1158 -#frm_loading .progress-striped .progress-bar {
1211 +#frm_loading .progress-striped .progress-bar{
1159 1212 <?php if ( ! empty( $defaults['border_color'] ) ) { ?>
1160 - background-image: linear-gradient(45deg, var(--border-color) 25%, rgba(0, 0, 0, 0) 25%, rgba(0, 0, 0, 0) 50%, var(--border-color) 50%, var(--border-color) 75%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0));
1213 + background-image:linear-gradient(45deg, <?php echo esc_html( $defaults['border_color'] ); ?> 25%, rgba(0, 0, 0, 0) 25%, rgba(0, 0, 0, 0) 50%, <?php echo esc_html( $defaults['border_color'] ); ?> 50%, <?php echo esc_html( $defaults['border_color'] ); ?> 75%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0));
1161 1214 <?php } ?>
1162 1215 background-size:40px 40px;
1163 1216 }
1164 1217 <?php } ?>
1165 1218
1166 -#frm_loading .progress-bar {
1167 - background-color: var(--bg-color);
1168 - box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15) inset;
1169 - float: left;
1170 - height: 100%;
1171 - line-height: 20px;
1172 - text-align: center;
1173 - transition: width 0.6s ease 0s;
1174 - width: 100%;
1219 +#frm_loading .progress-bar{
1220 + background-color:<?php echo esc_html( $defaults['bg_color'] ); ?>;
1221 + background-color:var(--bg-color);
1222 + box-shadow:0 -1px 0 rgba(0, 0, 0, 0.15) inset;
1223 + float:left;
1224 + height:100%;
1225 + line-height:20px;
1226 + text-align:center;
1227 + transition:width 0.6s ease 0s;
1228 + width:100%;
1175 1229 }
1176 1230
1177 1231 .frm_image_from_url{
1178 1232 height:50px;
@@ -1189,9 +1243,9 @@
1189 1243 background-repeat: no-repeat;
1190 1244 color: transparent !important;
1191 1245 }
1192 1246
1193 -<?php readfile( __DIR__ . '/frm_grids.css' ); ?>
1247 +<?php readfile( dirname( __FILE__ ) . '/frm_grids.css' ); ?>
1194 1248
1195 1249 .frm_conf_field.frm_left_container .frm_primary_label{
1196 1250 display:none;
1197 1251 }
@@ -1198,8 +1252,10 @@
1198 1252
1199 1253 .wp-editor-wrap *,
1200 1254 .wp-editor-wrap *:after,
1201 1255 .wp-editor-wrap *:before{
1256 + -webkit-box-sizing:content-box;
1257 + -moz-box-sizing:content-box;
1202 1258 box-sizing:content-box;
1203 1259 }
1204 1260
1205 1261 .with_frm_style .frm_grid,
@@ -1210,9 +1266,10 @@
1210 1266 padding:5px;
1211 1267 border-width:1px;
1212 1268 border-style:solid;
1213 1269 <?php if ( ! empty( $defaults['border_color'] ) ) { ?>
1214 - border-color: var(--border-color)<?php echo esc_html( $important ); ?>;
1270 + border-color:<?php echo esc_html( $defaults['border_color'] ); ?>;
1271 + border-color:var(--border-color)<?php echo esc_html( $important ); ?>;
1215 1272 <?php } ?>
1216 1273 border-left:none;
1217 1274 border-right:none;
1218 1275 }
@@ -1247,16 +1304,18 @@
1247 1304 }
1248 1305
1249 1306 <?php if ( ! empty( $defaults['bg_color'] ) ) { ?>
1250 1307 .frm_grid_first,
1251 -.frm_grid_odd {
1252 - background-color: var(--bg-color);
1308 +.frm_grid_odd{
1309 + background-color:<?php echo esc_html( $defaults['bg_color'] ); ?>;
1310 + background-color:var(--bg-color);
1253 1311 }
1254 1312 <?php } ?>
1255 1313
1256 1314 <?php if ( ! empty( $defaults['bg_color_active'] ) ) { ?>
1257 -.frm_grid {
1258 - background-color: var(--bg-color-active)<?php echo esc_html( $important ); ?>;
1315 +.frm_grid{
1316 + background-color:<?php echo esc_html( $defaults['bg_color_active'] . $important ); ?>;
1317 + background-color:var(--bg-color-active)<?php echo esc_html( $important ); ?>;
1259 1318 }
1260 1319 <?php } ?>
1261 1320
1262 1321 .with_frm_style .frm_grid.frm_blank_field,
@@ -1261,10 +1320,12 @@
1261 1320
1262 1321 .with_frm_style .frm_grid.frm_blank_field,
1263 1322 .with_frm_style .frm_grid_first.frm_blank_field,
1264 1323 .with_frm_style .frm_grid_odd.frm_blank_field{
1324 + background-color:<?php echo esc_html( $defaults['error_bg'] . $important ); ?>;
1265 1325 background-color:var(--error-bg)<?php echo esc_html( $important ); ?>;
1266 - border-color: var(--error-border);
1326 + border-color:<?php echo esc_html( $defaults['error_border'] ); ?>;
1327 + border-color:var(--error-bg);
1267 1328 }
1268 1329
1269 1330 .frm_grid .frm_primary_label,
1270 1331 .frm_grid_first .frm_primary_label,
@@ -1286,10 +1347,9 @@
1286 1347 .frm_grid_odd .frm_radio label,
1287 1348 .frm_grid_first .frm_checkbox label,
1288 1349 .frm_grid .frm_checkbox label,
1289 1350 .frm_grid_odd .frm_checkbox label{
1290 - color:transparent;
1291 - text-indent: -9999px;
1351 + visibility:hidden;
1292 1352 white-space:nowrap;
1293 1353 text-align:left;
1294 1354 }
1295 1355
@@ -1415,18 +1475,8 @@
1415 1475 .frm_form_field.frm_left_container .frm_opt_container{
1416 1476 padding-top:4px;
1417 1477 }
1418 1478
1419 -.with_frm_style .frm_left_container > select.auto_width,
1420 -.with_frm_style .frm_right_container > select.auto_width {
1421 - width: max-content<?php echo esc_html( $important ); ?>;
1422 -}
1423 -
1424 -.with_frm_style .frm_right_container > .frm_primary_label,
1425 -.with_frm_style .frm_right_container > select.auto_width {
1426 - margin-left: auto<?php echo esc_html( $important ); ?>;
1427 -}
1428 -
1429 1479 .with_frm_style .frm_inline_container.frm_grid_first .frm_primary_label,
1430 1480 .with_frm_style .frm_inline_container.frm_grid .frm_primary_label,
1431 1481 .with_frm_style .frm_inline_container.frm_grid_odd .frm_primary_label,
1432 1482 .with_frm_style .frm_inline_container.frm_grid_first .frm_opt_container,
@@ -1461,9 +1511,11 @@
1461 1511 grid-column-end: span 1;
1462 1512 }
1463 1513
1464 1514 .frm_form_field .frm_checkbox,
1465 -.frm_form_field .frm_radio {
1515 +.frm_form_field .frm_checkbox + .frm_checkbox,
1516 +.frm_form_field .frm_radio,
1517 +.frm_form_field .frm_radio + .frm_radio{
1466 1518 margin-top: 0;
1467 1519 margin-bottom: 0;
1468 1520 }
1469 1521
@@ -1472,24 +1524,36 @@
1472 1524 overflow:auto;
1473 1525 }
1474 1526
1475 1527 .frm_html_container.frm_scroll_box,
1476 -.frm_form_field.frm_html_scroll_box {
1477 - height: 100px;
1478 - overflow: auto;
1479 - background-color: var(--bg-color);
1480 - border-color: var(--border-color);
1481 - border-width: var(--field-border-width);
1482 - border-style: var(--field-border-style);
1483 - border-radius: var(--border-radius);
1484 - width: var(--field-width);
1485 - max-width: 100%;
1486 - font-size: var(--field-font-size);
1487 - padding: var(--field-pad);
1488 - box-sizing: border-box;
1489 - outline: none<?php echo esc_html( $important ); ?>;
1490 - font-weight: normal;
1491 - box-shadow: var(--box-shadow);
1528 +.frm_form_field.frm_html_scroll_box{
1529 + height:100px;
1530 + overflow:auto;
1531 + background-color:<?php echo esc_html( $defaults['bg_color'] ); ?>;
1532 + background-color:var(--bg-color);
1533 + border-color:<?php echo esc_html( $defaults['border_color'] ); ?>;
1534 + border-color:var(--border-color);
1535 + border-width:<?php echo esc_html( $defaults['field_border_width'] ); ?>;
1536 + border-width:var(--field-border-width);
1537 + border-style:<?php echo esc_html( $defaults['field_border_style'] ); ?>;
1538 + border-style:var(--field-border-style);
1539 + -moz-border-radius:<?php echo esc_html( $defaults['border_radius'] ); ?>;
1540 + -webkit-border-radius:<?php echo esc_html( $defaults['border_radius'] ); ?>;
1541 + border-radius:<?php echo esc_html( $defaults['border_radius'] ); ?>;
1542 + border-radius:var(--border-radius);
1543 + width:<?php echo esc_html( $defaults['field_width'] ); ?>;
1544 + width:var(--field-width);
1545 + max-width:100%;
1546 + font-size:<?php echo esc_html( $defaults['field_font_size'] ); ?>;
1547 + font-size:var(--field-font-size);
1548 + padding:<?php echo esc_html( $defaults['field_pad'] ); ?>;
1549 + padding:var(--field-pad);
1550 + -webkit-box-sizing:border-box;
1551 + -moz-box-sizing:border-box;
1552 + box-sizing:border-box;
1553 + outline:none<?php echo esc_html( $important ); ?>;
1554 + font-weight:normal;
1555 + box-shadow:var(--box-shadow);
1492 1556 }
1493 1557
1494 1558 .frm_form_field.frm_total_big input,
1495 1559 .frm_form_field.frm_total_big textarea,
@@ -1498,8 +1562,10 @@
1498 1562 opacity:1;
1499 1563 background-color:transparent !important;
1500 1564 border:none !important;
1501 1565 font-weight:bold;
1566 + -moz-box-shadow:none;
1567 + -webkit-box-shadow:none;
1502 1568 width:auto !important;
1503 1569 height:auto !important;
1504 1570 box-shadow:none !important;
1505 1571 display:inline;
@@ -1519,8 +1585,10 @@
1519 1585 .frm_form_field.frm_total input:focus,
1520 1586 .frm_form_field.frm_total textarea:focus{
1521 1587 background-color:transparent;
1522 1588 border:none;
1589 + -moz-box-shadow:none;
1590 + -webkit-box-shadow:none;
1523 1591 box-shadow:none;
1524 1592 }
1525 1593
1526 1594 .frm_form_field.frm_label_justify .frm_primary_label{
@@ -1545,8 +1613,13 @@
1545 1613 .frm_clearfix{
1546 1614 display:block;
1547 1615 }
1548 1616
1617 +.with_frm_style .frm_repeat_sec .frm_form_field.frm_repeat_buttons .frm_icon_font::before {
1618 + color:<?php echo esc_html( $defaults['repeat_icon_color'] . $important ); ?>;
1619 + color:var(--repeat-icon-color)<?php echo esc_html( $important ); ?>;
1620 +}
1621 +
1549 1622 .with_frm_style .frm_combo_inputs_container > .frm_form_subfield-first,
1550 1623 .with_frm_style .frm_combo_inputs_container > .frm_form_subfield-middle,
1551 1624 .with_frm_style .frm_combo_inputs_container > .frm_form_subfield-last {
1552 1625 margin-bottom: 0 !important;
@@ -1551,15 +1624,15 @@
1551 1624 .with_frm_style .frm_combo_inputs_container > .frm_form_subfield-last {
1552 1625 margin-bottom: 0 !important;
1553 1626 }
1554 1627
1628 +<?php
1629 +FrmStylesHelper::maybe_include_font_icon_css();
1555 1630
1556 -<?php
1557 1631 /**
1558 1632 * Call action so other plugins can add additional CSS.
1559 1633 *
1560 1634 * @param array $args {
1561 - *
1562 1635 * @type array $defaults
1563 1636 * }
1564 1637 */
1565 1638 do_action( 'frm_include_front_css', compact( 'defaults' ) );
@@ -1609,8 +1682,9 @@
1609 1682 max-width:302px;
1610 1683 border-right:1px solid #d3d3d3;
1611 1684 border-radius:4px;
1612 1685 box-shadow:2px 0px 4px -1px rgba(0,0,0,.08);
1686 + -moz-box-shadow:2px 0px 4px -1px rgba(0,0,0,.08);
1613 1687 }
1614 1688
1615 1689 .with_frm_style .g-recaptcha iframe,
1616 1690 .with_frm_style .frm-g-recaptcha iframe{
@@ -1615,15 +1689,8 @@
1615 1689 .with_frm_style .g-recaptcha iframe,
1616 1690 .with_frm_style .frm-g-recaptcha iframe{
1617 1691 width:100%;
1618 1692 }
1619 -}
1620 -
1621 -.frm-card-element .sq-card-wrapper .sq-card-message {
1622 - margin-bottom: 0;
1623 -}
1624 -.frm-card-errors:empty {
1625 - margin: 0;
1626 1693 }
1627 1694 <?php
1628 1695
1629 1696 echo strip_tags( FrmStylesController::get_custom_css() ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped