PluginProbe
Formidable Forms – WordPress Form Builder for Contact Forms, Calculators, Quizzes & More / 5.4
Formidable Forms – WordPress Form Builder for Contact Forms, Calculators, Quizzes & More v5.4
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 +318 -429 6.255.4 View file →
@@ -7,9 +7,8 @@
7 7 header( 'Content-type: text/css' );
8 8
9 9 if ( ! empty( $css ) ) {
10 10 echo strip_tags( $css, 'all' ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
11 - FrmStylesController::maybe_hide_sample_form_error_message();
12 11 die();
13 12 }
14 13 }
15 14
@@ -16,14 +15,12 @@
16 15 if ( ! isset( $frm_style ) ) {
17 16 $frm_style = new FrmStyle();
18 17 }
19 18
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();
19 +$styles = $frm_style->get_all();
20 +$default_style = $frm_style->get_default_style( $styles );
21 +$defaults = FrmStylesHelper::get_settings_for_output( $default_style );
22 +$important = empty( $defaults['important_style'] ) ? '' : ' !important';
26 23
27 24 ?>
28 25 .with_frm_style{
29 26 <?php FrmStylesHelper::output_vars( $defaults ); ?>
@@ -38,12 +35,12 @@
38 35
39 36 .with_frm_style,
40 37 .with_frm_style form,
41 38 .with_frm_style .frm-show-form div.frm_description p{
42 - text-align: var(--form-align)<?php echo esc_html( $important ); ?>;
39 + text-align:<?php echo esc_html( $defaults['form_align'] . $important ); ?>;
40 + text-align:var(--form-align)<?php echo esc_html( $important ); ?>;
43 41 }
44 42
45 -/* Keep this. This is used for Honeypot */
46 43 input:-webkit-autofill {
47 44 -webkit-box-shadow: 0 0 0 30px white inset;
48 45 }
49 46
@@ -49,24 +46,34 @@
49 46
50 47 /* Form description */
51 48 .with_frm_style .frm-show-form div.frm_description p{
52 49 <?php if ( ! empty( $defaults['form_desc_size'] ) ) { ?>
53 - font-size: var(--form-desc-size)<?php echo esc_html( $important ); ?>;
50 + font-size:<?php echo esc_html( $defaults['form_desc_size'] . $important ); ?>;
51 + font-size:var(--form-desc-size)<?php echo esc_html( $important ); ?>;
54 52 <?php } ?>
55 53 <?php if ( ! empty( $defaults['form_desc_color'] ) ) { ?>
56 - color: var(--form-desc-color)<?php echo esc_html( $important ); ?>;
54 + color:<?php echo esc_html( $defaults['form_desc_color'] . $important ); ?>;
55 + color:var(--form-desc-color)<?php echo esc_html( $important ); ?>;
57 56 <?php } ?>
58 57 <?php if ( ! empty( $defaults['form_desc_margin_top'] ) ) { ?>
59 - margin-top: var(--form-desc-margin-top)<?php echo esc_html( $important ); ?>;
58 + margin-top:<?php echo esc_html( $defaults['form_desc_margin_top'] . $important ); ?>;
59 + margin-top:var(--form-desc-margin-top)<?php echo esc_html( $important ); ?>;
60 60 <?php } ?>
61 61 <?php if ( ! empty( $defaults['form_desc_margin_bottom'] ) ) { ?>
62 - margin-bottom: var(--form-desc-margin-bottom)<?php echo esc_html( $important ); ?>;
62 + margin-bottom:<?php echo esc_html( $defaults['form_desc_margin_bottom'] . $important ); ?>;
63 + margin-bottom:var(--form-desc-margin-bottom)<?php echo esc_html( $important ); ?>;
63 64 <?php } ?>
64 65 <?php if ( isset( $defaults['form_desc_padding'] ) ) { ?>
65 - padding: var(--form-desc-padding)<?php echo esc_html( $important ); ?>;
66 + padding:<?php echo esc_html( $defaults['form_desc_padding'] . $important ); ?>;
67 + padding:var(--form-desc-padding)<?php echo esc_html( $important ); ?>;
66 68 <?php } ?>
67 69 }
68 70
71 +form input.frm_verify{
72 + position:absolute;
73 + left:-3000px;
74 +}
75 +
69 76 .with_frm_style fieldset{
70 77 min-width:0;
71 78 display: block; /* Override 2021 theme */
72 79 }
@@ -78,21 +85,25 @@
78 85 background-color:transparent;
79 86 }
80 87
81 88 .with_frm_style .frm_form_fields > fieldset{
82 -<?php if ( isset( $defaults['fieldset'] ) && ( $defaults['fieldset'] || '0' === $defaults['fieldset'] ) ) { ?>
83 - border-width: var(--fieldset)<?php echo esc_html( $important ); ?>;
89 +<?php if ( ! empty( $defaults['fieldset'] ) ) { ?>
90 + border-width:<?php echo esc_html( $defaults['fieldset'] . $important ); ?>;
91 + border-width:var(--fieldset)<?php echo esc_html( $important ); ?>;
84 92 <?php } ?>
85 93 border-style:solid;
86 94 <?php if ( ! empty( $defaults['fieldset_color'] ) ) { ?>
87 - border-color: var(--fieldset-color)<?php echo esc_html( $important ); ?>;
95 + border-color:<?php echo esc_html( $defaults['fieldset_color'] . $important ); ?>;
96 + border-color:var(--fieldset-color)<?php echo esc_html( $important ); ?>;
88 97 <?php } ?>
89 98 margin:0;
90 99 <?php if ( ! empty( $defaults['fieldset_padding'] ) ) { ?>
91 - padding: var(--fieldset-padding)<?php echo esc_html( $important ); ?>;
100 + padding:<?php echo esc_html( $defaults['fieldset_padding'] . $important ); ?>;
101 + padding:var(--fieldset-padding)<?php echo esc_html( $important ); ?>;
92 102 <?php } ?>
93 103 <?php if ( ! empty( $defaults['fieldset_bg_color'] ) ) { ?>
94 - background-color: var(--fieldset-bg-color)<?php echo esc_html( $important ); ?>;
104 + background-color:<?php echo esc_html( $defaults['fieldset_bg_color'] ); ?>;
105 + background-color:var(--fieldset-bg-color)<?php echo esc_html( $important ); ?>;
95 106 <?php } ?>
96 107 <?php if ( ! empty( $defaults['font'] ) ) { ?>
97 108 font-family:var(--font);
98 109 <?php } ?>
@@ -116,21 +127,26 @@
116 127
117 128 .with_frm_style legend + h3,
118 129 .with_frm_style h3.frm_form_title{
119 130 <?php if ( ! empty( $defaults['title_size'] ) ) { ?>
120 - font-size: var(--title-size)<?php echo esc_html( $important ); ?>;
131 + font-size:<?php echo esc_html( $defaults['title_size'] . $important ); ?>;
132 + font-size:var(--title-size)<?php echo esc_html( $important ); ?>;
121 133 <?php } ?>
122 134 <?php if ( ! empty( $defaults['title_color'] ) ) { ?>
123 - color: var(--title-color)<?php echo esc_html( $important ); ?>;
135 + color:<?php echo esc_html( $defaults['title_color'] . $important ); ?>;
136 + color:var(--title-color)<?php echo esc_html( $important ); ?>;
124 137 <?php } ?>
125 138 <?php if ( ! empty( $defaults['font'] ) ) { ?>
126 - font-family: var(--font);
139 + font-family:<?php echo FrmAppHelper::kses( $defaults['font'] ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
140 + font-family:var(--font);
127 141 <?php } ?>
128 142 <?php if ( ! empty( $defaults['title_margin_top'] ) ) { ?>
129 - margin-top: var(--title-margin-top)<?php echo esc_html( $important ); ?>;
143 + margin-top:<?php echo esc_html( $defaults['title_margin_top'] . $important ); ?>;
144 + margin-top:var(--title-margin-top)<?php echo esc_html( $important ); ?>;
130 145 <?php } ?>
131 146 <?php if ( ! empty( $defaults['title_margin_bottom'] ) ) { ?>
132 - margin-bottom: var(--title-margin-bottom)<?php echo esc_html( $important ); ?>;
147 + margin-bottom:<?php echo esc_html( $defaults['title_margin_bottom'] . $important ); ?>;
148 + margin-bottom:var(--title-margin-bottom)<?php echo esc_html( $important ); ?>;
133 149 <?php } ?>
134 150 }
135 151
136 152 .with_frm_style .frm_form_field.frm_html_container,
@@ -135,42 +151,46 @@
135 151
136 152 .with_frm_style .frm_form_field.frm_html_container,
137 153 .with_frm_style .frm_form_field .frm_show_it{
138 154 <?php if ( ! empty( $defaults['font'] ) ) { ?>
139 - font-family: var(--font);
155 + font-family:<?php echo FrmAppHelper::kses( $defaults['font'] ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
156 + font-family:var(--font);
140 157 <?php } ?>
141 158 <?php if ( ! empty( $defaults['form_desc_color'] ) ) { ?>
142 - color: var(--form-desc-color)<?php echo esc_html( $important ); ?>;
159 + color:<?php echo esc_html( $defaults['form_desc_color'] . $important ); ?>;
160 + color:var(--form-desc-color)<?php echo esc_html( $important ); ?>;
143 161 <?php } ?>
144 162 }
145 163
146 164 <?php if ( ! empty( $defaults['form_desc_size'] ) ) { ?>
147 165 .with_frm_style .frm_form_field.frm_html_container{
148 - font-size: var(--form-desc-size)<?php echo esc_html( $important ); ?>;
166 + font-size:<?php echo esc_html( $defaults['form_desc_size'] . $important ); ?>;
167 + font-size:var(--form-desc-size)<?php echo esc_html( $important ); ?>;
149 168 }
150 169 <?php } ?>
151 170
152 171 .with_frm_style .frm_form_field .frm_show_it{
153 172 <?php if ( ! empty( $defaults['field_font_size'] ) ) { ?>
154 - font-size: var(--field-font-size)<?php echo esc_html( $important ); ?>;
173 + font-size:<?php echo esc_html( $defaults['field_font_size'] . $important ); ?>;
174 + font-size:var(--field-font-size)<?php echo esc_html( $important ); ?>;
155 175 <?php } ?>
156 176 <?php if ( ! empty( $defaults['field_weight'] ) ) { ?>
157 - font-weight: var(--field-weight)<?php echo esc_html( $important ); ?>;
177 + font-weight:<?php echo esc_html( $defaults['field_weight'] ); ?>;
178 + font-weight:var(--field-weight)<?php echo esc_html( $important ); ?>;
158 179 <?php } ?>
159 180 }
160 181
161 -.with_frm_style .frm_required {
182 +.with_frm_style .frm_required{
162 183 <?php if ( ! empty( $defaults['required_color'] ) ) { ?>
163 - color: var(--required-color)<?php echo esc_html( $important ); ?>;
184 + color:<?php echo esc_html( $defaults['required_color'] . $important ); ?>;
185 + color:var(--required-color)<?php echo esc_html( $important ); ?>;
164 186 <?php } ?>
165 187 <?php if ( ! empty( $defaults['required_weight'] ) ) { ?>
166 - font-weight: var(--required-weight)<?php echo esc_html( $important ); ?>;
188 + font-weight:<?php echo esc_html( $defaults['required_weight'] . $important ); ?>;
189 + font-weight:var(--required-weight)<?php echo esc_html( $important ); ?>;
167 190 <?php } ?>
168 191 }
169 192
170 -<?php if ( $use_chosen_js ) { ?>
171 -.with_frm_style .chosen-container,
172 -<?php } ?>
173 193 .with_frm_style input[type=text],
174 194 .with_frm_style input[type=password],
175 195 .with_frm_style input[type=email],
176 196 .with_frm_style input[type=number],
@@ -178,12 +198,14 @@
178 198 .with_frm_style input[type=tel],
179 199 .with_frm_style input[type=search],
180 200 .with_frm_style select,
181 201 .with_frm_style textarea,
182 -.with_frm_style .frm-card-element.StripeElement {
202 +.with_frm_style .frm-card-element.StripeElement,
203 +.with_frm_style .chosen-container{
183 204 font-family:var(--font)<?php echo esc_html( $important ); ?>;
184 205 <?php if ( ! empty( $defaults['field_font_size'] ) ) { ?>
185 - font-size: var(--field-font-size)<?php echo esc_html( $important ); ?>;
206 + font-size:<?php echo esc_html( $defaults['field_font_size'] ); ?>;
207 + font-size:var(--field-font-size)<?php echo esc_html( $important ); ?>;
186 208 <?php } ?>
187 209 margin-bottom:0<?php echo esc_html( $important ); ?>;
188 210 }
189 211
@@ -206,63 +228,48 @@
206 228 .with_frm_style .frm_scroll_box .frm_opt_container,
207 229 .frm_form_fields_active_style,
208 230 .frm_form_fields_error_style,
209 231 .with_frm_style .frm-card-element.StripeElement,
210 -<?php if ( $use_chosen_js ) { ?>
211 232 .with_frm_style .chosen-container-multi .chosen-choices,
212 -.with_frm_style .chosen-container-single .chosen-single,
233 +.with_frm_style .chosen-container-single .chosen-single{
234 + color:<?php echo esc_html( $defaults['text_color'] ); ?>;
235 + color:var(--text-color)<?php echo esc_html( $important ); ?>;
236 + background-color:<?php echo esc_html( $defaults['bg_color'] . $important ); ?>;
237 + background-color:var(--bg-color)<?php echo esc_html( $important ); ?>;
238 +<?php if ( ! empty( $important ) ) { ?>
239 + background-image:none !important;
213 240 <?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);
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 } ?>
235 -.with_frm_style input[type=text],
236 -.with_frm_style input[type=password],
237 -.with_frm_style input[type=email],
238 -.with_frm_style input[type=number],
239 -.with_frm_style input[type=url],
240 -.with_frm_style input[type=tel],
241 -.with_frm_style input[type=phone],
242 -.with_frm_style input[type=search],
243 -.with_frm_style textarea,
244 -.frm_form_fields_style,
245 -.with_frm_style .frm_scroll_box .frm_opt_container,
246 -.frm_form_fields_active_style,
247 -.frm_form_fields_error_style,
248 -.with_frm_style .frm-card-element.StripeElement {
249 - background-image:none !important;
250 -}
251 -<?php endif; ?>
252 -
253 -.with_frm_style select option {
254 - color: var(--text-color)<?php echo esc_html( $important ); ?>;
255 -}
256 -
257 -.with_frm_style select option.frm-select-placeholder {
258 - color: var(--text-color-disabled)<?php echo esc_html( $important ); ?>;
259 -}
260 -
261 267 .with_frm_style input[type=radio],
262 268 .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 ); ?>;
269 + border-color:<?php echo esc_html( $defaults['border_color'] . $important ); ?>;
270 + border-color:var(--border-color)<?php echo esc_html( $important ); ?>;
271 + box-shadow:var(--box-shadow)<?php echo esc_html( $important ); ?>;
265 272 float: none;
266 273 }
267 274
268 275 .with_frm_style input[type=radio]:after,
@@ -269,18 +276,8 @@
269 276 .with_frm_style input[type=checkbox]:after {
270 277 display: none; /* 2021 conflict */
271 278 }
272 279
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 280 .with_frm_style input[type=text],
284 281 .with_frm_style input[type=password],
285 282 .with_frm_style input[type=email],
286 283 .with_frm_style input[type=number],
@@ -289,9 +286,10 @@
289 286 .with_frm_style input[type=file],
290 287 .with_frm_style input[type=search],
291 288 .with_frm_style select,
292 289 .with_frm_style .frm-card-element.StripeElement{
293 - min-height: var(--field-height)<?php echo esc_html( $important ); ?>;
290 + height:<?php echo esc_html( $defaults['field_height'] ); ?>;
291 + height:var(--field-height)<?php echo esc_html( $important ); ?>;
294 292 line-height:1.3<?php echo esc_html( $important ); ?>;
295 293 }
296 294
297 295 .with_frm_style select[multiple=multiple]{
@@ -306,15 +304,17 @@
306 304 box-shadow:none;
307 305 }
308 306
309 307 .with_frm_style input[type=file]{
310 - color: var(--text-color)<?php echo esc_html( $important ); ?>;
311 - padding: 0px;
308 + color:<?php echo esc_html( $defaults['text_color'] ); ?>;
309 + color:var(--text-color)<?php echo esc_html( $important ); ?>;
310 + padding:0px;
312 311 <?php if ( ! empty( $defaults['font'] ) ) { ?>
313 - font-family: var(--font)<?php echo esc_html( $important ); ?>;
312 + font-family:var(--font)<?php echo esc_html( $important ); ?>;
314 313 <?php } ?>
315 - font-size: var(--field-font-size)<?php echo esc_html( $important ); ?>;
316 - display: initial;
314 + font-size:<?php echo esc_html( $defaults['field_font_size'] ); ?>;
315 + font-size:var(--field-font-size)<?php echo esc_html( $important ); ?>;
316 + display:initial;
317 317 }
318 318
319 319 .with_frm_style input[type=file].frm_transparent{
320 320 color:transparent<?php echo esc_html( $important ); ?>;
@@ -320,25 +320,26 @@
320 320 color:transparent<?php echo esc_html( $important ); ?>;
321 321 }
322 322
323 323 .with_frm_style .wp-editor-wrap{
324 - width: var(--field-width)<?php echo esc_html( $important ); ?>;
324 + width:<?php echo esc_html( $defaults['field_width'] . $important ); ?>;
325 + width:var(--field-width)<?php echo esc_html( $important ); ?>;
325 326 max-width:100%;
326 327 }
327 328
328 329 .with_frm_style .wp-editor-container textarea{
329 330 border:none<?php echo esc_html( $important ); ?>;
330 - box-shadow:none !important;
331 331 }
332 332
333 333 .with_frm_style .mceIframeContainer{
334 - background-color: var(--bg-color)<?php echo esc_html( $important ); ?>;
334 + background-color:<?php echo esc_html( $defaults['bg_color'] . $important ); ?>;
335 + background-color:var(--bg-color)<?php echo esc_html( $important ); ?>;
335 336 }
336 337
337 338 .with_frm_style select{
338 - width: var(--auto-width)<?php echo esc_html( $important ); ?>;
339 + width:<?php echo esc_html( $defaults['auto_width'] ); ?>;
340 + width:var(--auto-width)<?php echo esc_html( $important ); ?>;
339 341 max-width:100%;
340 - background-position-y: calc(50% + 3px);
341 342 }
342 343
343 344 .with_frm_style input[disabled],
344 345 .with_frm_style select[disabled],
@@ -344,12 +345,15 @@
344 345 .with_frm_style select[disabled],
345 346 .with_frm_style textarea[disabled],
346 347 .with_frm_style input[readonly],
347 348 .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 ); ?>;
349 +.with_frm_style textarea[readonly]{
350 + background-color:<?php echo esc_html( $defaults['bg_color_disabled'] ); ?>;
351 + background-color:var(--bg-color-disabled)<?php echo esc_html( $important ); ?>;
352 + color:<?php echo esc_html( $defaults['text_color_disabled'] ); ?>;
353 + color:var(--text-color-disabled)<?php echo esc_html( $important ); ?>;
354 + border-color:<?php echo esc_html( $defaults['border_color_disabled'] ); ?>;
355 + border-color:var(--border-color-disabled)<?php echo esc_html( $important ); ?>;
352 356 }
353 357
354 358 .frm_preview_page:before{
355 359 content:normal !important;
@@ -361,24 +365,30 @@
361 365
362 366 .with_frm_style .frm_primary_label{
363 367 max-width:100%;
364 368 <?php if ( ! empty( $defaults['font'] ) ) { ?>
365 - font-family: var(--font);
369 + font-family:<?php echo FrmAppHelper::kses( $defaults['font'] ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
370 + font-family:var(--font);
366 371 <?php } ?>
367 372 <?php if ( ! empty( $defaults['font_size'] ) ) { ?>
368 - font-size: var(--font-size)<?php echo esc_html( $important ); ?>;
373 + font-size:<?php echo esc_html( $defaults['font_size'] . $important ); ?>;
374 + font-size:var(--font-size)<?php echo esc_html( $important ); ?>;
369 375 <?php } ?>
370 376 <?php if ( ! empty( $defaults['label_color'] ) ) { ?>
371 - color: var(--label-color)<?php echo esc_html( $important ); ?>;
377 + color:<?php echo esc_html( $defaults['label_color'] . $important ); ?>;
378 + color:var(--label-color)<?php echo esc_html( $important ); ?>;
372 379 <?php } ?>
373 380 <?php if ( ! empty( $defaults['weight'] ) ) { ?>
374 - font-weight: var(--weight)<?php echo esc_html( $important ); ?>;
381 + font-weight:<?php echo esc_html( $defaults['weight'] . $important ); ?>;
382 + font-weight:var(--weight)<?php echo esc_html( $important ); ?>;
375 383 <?php } ?>
376 384 <?php if ( ! empty( $defaults['align'] ) ) { ?>
377 - text-align: var(--align)<?php echo esc_html( $important ); ?>;
385 + text-align:<?php echo esc_html( $defaults['align'] . $important ); ?>;
386 + text-align:var(--align)<?php echo esc_html( $important ); ?>;
378 387 <?php } ?>
379 388 <?php if ( ! empty( $defaults['label_padding'] ) ) { ?>
380 - padding: var(--label-padding)<?php echo esc_html( $important ); ?>;
389 + padding:<?php echo esc_html( $defaults['label_padding'] . $important ); ?>;
390 + padding:var(--label-padding)<?php echo esc_html( $important ); ?>;
381 391 <?php } ?>
382 392 margin:0;
383 393 width:auto;
384 394 display:block;
@@ -424,108 +434,19 @@
424 434 visibility:hidden;
425 435 white-space:nowrap;
426 436 }
427 437
438 +.with_frm_style .frm_inside_container .frm_primary_label{
439 + opacity:0;
440 + transition: opacity 0.1s linear;
441 +}
442 +
443 +.with_frm_style .frm_inside_container label.frm_visible,
428 444 .frm_visible{
429 445 opacity:1;
430 446 }
431 447
432 -/* Floating labels */
433 -.with_frm_style .frm_inside_container {
434 - position: relative;
435 - padding-top: 18px;
436 - padding-top: calc(0.5 * var(--field-height));
437 -}
438 -
439 -.with_frm_style .frm_inside_container > input,
440 -.with_frm_style .frm_inside_container > select,
441 -.with_frm_style .frm_inside_container > textarea {
442 - display: block;
443 -}
444 -
445 -/* These do not work if they are combined */
446 -.with_frm_style input::placeholder,
447 -.with_frm_style textarea::placeholder {
448 - font-size: var(--field-font-size)<?php echo esc_html( $important ); ?>;
449 -}
450 -
451 -.with_frm_style .frm_inside_container > input::-moz-placeholder,
452 -.with_frm_style .frm_inside_container > textarea::-moz-placeholder {
453 - opacity: 0 !important;
454 - transition: opacity 0.3s ease-in;
455 -}
456 -
457 -.with_frm_style .frm_inside_container > input:-ms-input-placeholder,
458 -.with_frm_style .frm_inside_container > textarea:-ms-input-placeholder {
459 - opacity: 0;
460 - transition: opacity 0.3s ease-in;
461 -}
462 -
463 -.with_frm_style .frm_inside_container > input::placeholder,
464 -.with_frm_style .frm_inside_container > textarea::placeholder {
465 - opacity: 0;
466 - transition: opacity 0.3s ease-in;
467 -}
468 -
469 -.with_frm_style .frm_inside_container > label {
470 - transition: all 0.3s ease-in;
471 -
472 - position: absolute;
473 - top: 19px;
474 - top: calc(1px + .5 * var(--field-height));
475 - left: 3px;
476 - width: 100%;
477 -
478 - line-height: 1.3;
479 - text-overflow: ellipsis;
480 - overflow: hidden;
481 - white-space: nowrap;
482 -
483 - padding: 8px 12px;
484 - padding: var(--field-pad);
485 -
486 - font-size: 14px;
487 - font-size: var(--field-font-size);
488 - font-weight: normal;
489 - font-weight: var(--field-weight);
490 -
491 - pointer-events: none;
492 -}
493 -
494 -.with_frm_style.frm_style_lines-no-boxes .frm_inside_container > label {
495 - line-height: 1;
496 -}
497 -
498 -.with_frm_style .frm_inside_container.frm_label_float_top > label {
499 - top: 0;
500 - left: 0;
501 - padding: 0;
502 - font-size: 12px;
503 - font-size: calc(0.85 * var(--field-font-size));
504 -}
505 -
506 -/* These do not work if they are combined */
507 -.with_frm_style .frm_inside_container.frm_label_float_top > input::-moz-placeholder,
508 -.with_frm_style .frm_inside_container.frm_label_float_top > textarea::-moz-placeholder {
509 - opacity: 1 !important;
510 - transition: opacity 0.3s ease-in;
511 -}
512 -
513 -.with_frm_style .frm_inside_container.frm_label_float_top > input:-ms-input-placeholder,
514 -.with_frm_style .frm_inside_container.frm_label_float_top > textarea:-ms-input-placeholder {
515 - opacity: 1;
516 - transition: opacity 0.3s ease-in;
517 -}
518 -
519 -.with_frm_style .frm_inside_container.frm_label_float_top > input::placeholder,
520 -.with_frm_style .frm_inside_container.frm_label_float_top > textarea::placeholder {
521 - opacity: 1;
522 - transition: opacity 0.3s ease-in;
523 -}
524 -/* End floating label */
525 -
526 -.with_frm_style .frm_description,
527 -.with_frm_style .frm_pro_max_limit_desc{
448 +.with_frm_style .frm_description{
528 449 clear:both;
529 450 }
530 451
531 452 .with_frm_style input[type=number][readonly]{
@@ -572,39 +493,50 @@
572 493 text-decoration:none !important;;
573 494 border:1px solid #eee;
574 495 display:inline-block;
575 496 <?php if ( ! empty( $defaults['submit_padding'] ) ) { ?>
576 - padding: var(--submit-padding)<?php echo esc_html( $important ); ?>;
497 + padding:<?php echo esc_html( $defaults['submit_padding'] . $important ); ?>;
498 + padding:var(--submit-padding)<?php echo esc_html( $important ); ?>;
577 499 <?php } else { ?>
578 500 padding:5px;
579 501 <?php } ?>
580 502 <?php if ( ! empty( $defaults['border_radius'] ) ) { ?>
503 + -moz-border-radius:<?php echo esc_html( $defaults['border_radius'] . $important ); ?>;
504 + -webkit-border-radius:<?php echo esc_html( $defaults['border_radius'] . $important ); ?>;
581 505 border-radius:<?php echo esc_html( $defaults['border_radius'] . $important ); ?>;
582 506 border-radius:var(--border-radius)<?php echo esc_html( $important ); ?>;
583 507 <?php } ?>
584 508 <?php if ( ! empty( $defaults['submit_font_size'] ) ) { ?>
585 - font-size: var(--submit-font-size)<?php echo esc_html( $important ); ?>;
509 + font-size:<?php echo esc_html( $defaults['submit_font_size'] . $important ); ?>;
510 + font-size:var(--submit-font-size)<?php echo esc_html( $important ); ?>;
586 511 <?php } ?>
587 512 <?php if ( ! empty( $defaults['font'] ) ) { ?>
588 - font-family: var(--font)<?php echo esc_html( $important ); ?>;
513 + font-family:<?php echo FrmAppHelper::kses( $defaults['font'] . $important ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
514 + font-family:var(--font)<?php echo esc_html( $important ); ?>;
589 515 <?php } ?>
590 516 <?php if ( ! empty( $defaults['submit_weight'] ) ) { ?>
591 - font-weight: var(--submit-weight)<?php echo esc_html( $important ); ?>;
517 + font-weight:<?php echo esc_html( $defaults['submit_weight'] . $important ); ?>;
518 + font-weight:var(--submit-weight)<?php echo esc_html( $important ); ?>;
592 519 <?php } ?>
593 520 <?php if ( ! empty( $defaults['submit_text_color'] ) ) { ?>
594 - color: var(--submit-text-color)<?php echo esc_html( $important ); ?>;
521 + color:<?php echo esc_html( $defaults['submit_text_color'] . $important ); ?>;
522 + color:var(--submit-text-color)<?php echo esc_html( $important ); ?>;
595 523 <?php } ?>
596 524 <?php if ( ! empty( $defaults['submit_bg_color'] ) ) { ?>
597 - background: var(--submit-bg-color)<?php echo esc_html( $important ); ?>;
525 + background:<?php echo esc_html( $defaults['submit_bg_color'] . $important ); ?>;
526 + background:var(--submit-bg-color)<?php echo esc_html( $important ); ?>;
598 527 <?php } ?>
599 528 <?php if ( ! empty( $defaults['submit_border_width'] ) ) { ?>
600 - border-width: var(--submit-border-width)<?php echo esc_html( $important ); ?>;
529 + border-width:<?php echo esc_html( $defaults['submit_border_width'] ); ?>;
530 + border-width:var(--submit-border-width)<?php echo esc_html( $important ); ?>;
601 531 <?php } ?>
602 532 <?php if ( ! empty( $defaults['submit_border_color'] ) ) { ?>
603 - border-color: var(--submit-border-color)<?php echo esc_html( $important ); ?>;
533 + border-color:<?php echo esc_html( $defaults['submit_border_color'] . $important ); ?>;
534 + border-color:var(--submit-border-color)<?php echo esc_html( $important ); ?>;
604 535 <?php } ?>
605 536 <?php if ( ! empty( $defaults['submit_height'] ) ) { ?>
606 - height: var(--submit-height)<?php echo esc_html( $important ); ?>;
537 + height:<?php echo esc_html( $defaults['submit_height'] . $important ); ?>;
538 + height:var(--submit-height)<?php echo esc_html( $important ); ?>;
607 539 <?php } ?>
608 540 }
609 541
610 542 <?php if ( ! empty( $defaults['submit_text_color'] ) ) { ?>
@@ -637,12 +569,8 @@
637 569 .with_frm_style.frm_center_submit .frm_submit{
638 570 text-align:center;
639 571 }
640 572
641 -.with_frm_style.frm_center_submit .frm_flex.frm_submit {
642 - justify-content: center;
643 -}
644 -
645 573 .with_frm_style .frm_inline_success .frm_submit{
646 574 display: flex;
647 575 flex-direction: row;
648 576 align-items: center;
@@ -686,8 +614,9 @@
686 614
687 615 .with_frm_style .frm_loading_prev .frm_prev_page,
688 616 .with_frm_style .frm_loading_form .frm_button_submit {
689 617 position: relative;
618 + opacity: .8;
690 619 color: transparent !important;
691 620 text-shadow: none !important;
692 621 }
693 622
@@ -713,9 +642,9 @@
713 642 border-top-color: transparent;
714 643 border-left-color: transparent;
715 644 border-radius: 50%;
716 645 box-sizing: border-box;
717 - <?php $loader_size = 12; ?>
646 + <?php $loader_size = 20; ?>
718 647 top: 50%;
719 648 left: 50%;
720 649 margin-top: -<?php echo absint( $loader_size / 2 ); ?>px;
721 650 margin-left: -<?php echo absint( $loader_size / 2 ); ?>px;
@@ -720,23 +649,17 @@
720 649 margin-top: -<?php echo absint( $loader_size / 2 ); ?>px;
721 650 margin-left: -<?php echo absint( $loader_size / 2 ); ?>px;
722 651 width: <?php echo absint( $loader_size ); ?>px;
723 652 height: <?php echo absint( $loader_size ); ?>px;
724 - animation: spin 2s linear infinite;
653 + -webkit-animation: spin 2s linear infinite;
654 + -moz-animation: spin 2s linear infinite;
655 + -o-animation: spin 2s linear infinite;
656 + animation: spin 2s linear infinite;
725 657 }
726 658
727 -.with_frm_style .frm_submit.frm_flex {
728 - align-items: center;
729 - gap: 2%;
730 -}
731 -
732 -.with_frm_style .frm_submit.frm_flex button.frm_button_submit ~ .frm_prev_page {
733 - order: -1;
734 -}
735 -
736 659 <?php
737 660 foreach ( $styles as $style ) {
738 - include __DIR__ . '/_single_theme.css.php';
661 + include( dirname( __FILE__ ) . '/_single_theme.css.php' );
739 662 unset( $style );
740 663 }
741 664
742 665 // Set it again since it may have been overridden.
@@ -758,12 +681,15 @@
758 681
759 682 .with_frm_style a.frm_save_draft,
760 683 .with_frm_style a.frm_start_over{
761 684 <?php if ( ! empty( $defaults['font'] ) ) { ?>
762 - font-family: var(--font);
685 + font-family:<?php echo FrmAppHelper::kses( $defaults['font'] ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
686 + font-family:var(--font);
763 687 <?php } ?>
764 - font-size: var(--submit-font-size);
765 - font-weight: var(--submit-weight);
688 + font-size:<?php echo esc_html( $defaults['submit_font_size'] ); ?>;
689 + font-size:var(--submit-font-size);
690 + font-weight:<?php echo esc_html( $defaults['submit_weight'] ); ?>;
691 + font-weight:var(--submit-weight);
766 692 }
767 693
768 694 .horizontal_radio .frm_radio{
769 695 margin:0 5px 0 0;
@@ -770,9 +696,9 @@
770 696 }
771 697
772 698 .horizontal_radio .frm_checkbox{
773 699 margin:0;
774 - margin-right:12px;
700 + margin-right:5px;
775 701 }
776 702
777 703 .vertical_radio .frm_checkbox,
778 704 .vertical_radio .frm_radio,
@@ -787,13 +713,15 @@
787 713 padding-left: 0;
788 714 }
789 715
790 716 .with_frm_style .frm_radio{
791 - display: var(--radio-align)<?php echo esc_html( $important ); ?>;
717 + display:<?php echo esc_html( $defaults['radio_align'] . $important ); ?>;
718 + display:var(--radio-align)<?php echo esc_html( $important ); ?>;
792 719 }
793 720
794 721 .with_frm_style .frm_checkbox{
795 - display: var(--check-align)<?php echo esc_html( $important ); ?>;
722 + display:<?php echo esc_html( $defaults['check_align'] . $important ); ?>;
723 + display:var(--check-align)<?php echo esc_html( $important ); ?>;
796 724 }
797 725
798 726 .with_frm_style .vertical_radio .frm_checkbox,
799 727 .with_frm_style .vertical_radio .frm_radio,
@@ -798,9 +726,8 @@
798 726 .with_frm_style .vertical_radio .frm_checkbox,
799 727 .with_frm_style .vertical_radio .frm_radio,
800 728 .vertical_radio .frm_catlevel_1{
801 729 display:block<?php echo esc_html( $important ); ?>;
802 - margin-bottom: 10px;
803 730 }
804 731
805 732 .with_frm_style .horizontal_radio .frm_checkbox,
806 733 .with_frm_style .horizontal_radio .frm_radio,
@@ -808,45 +735,40 @@
808 735 display:inline-block<?php echo esc_html( $important ); ?>;
809 736 }
810 737
811 738 .with_frm_style .frm_checkbox label,
812 -.with_frm_style .frm_radio label {
813 - display: inline-block;
814 - vertical-align: middle;
739 +.with_frm_style .frm_radio label{
740 + display: inline;
815 741 white-space:normal;
816 742 }
817 743
818 -.with_frm_style .frm_checkbox label input[type=checkbox],
819 -.with_frm_style .frm_radio label input[type=radio] {
820 - margin-right: 4px;
821 -}
822 -
823 -.with_frm_style .frm_checkbox label:not(.frm-label-disabled),
824 -.with_frm_style .frm_radio label:not(.frm-label-disabled) {
825 - cursor: pointer;
826 -}
827 -
828 744 .with_frm_style .vertical_radio .frm_checkbox label,
829 745 .with_frm_style .vertical_radio .frm_radio label{
830 746 display: block;
831 - width: 100%;
747 + padding-left: 20px;
748 + text-indent: -20px;
832 749 }
833 750
834 751 .with_frm_style .frm_radio label,
835 -.with_frm_style .frm_checkbox label {
752 +.with_frm_style .frm_checkbox label{
836 753 <?php if ( ! empty( $defaults['font'] ) ) { ?>
837 - font-family: var(--font);
754 + font-family:<?php echo FrmAppHelper::kses( $defaults['font'] ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
755 + font-family:var(--font);
838 756 <?php } ?>
839 - font-size: var(--check-font-size)<?php echo esc_html( $important ); ?>;
840 - color: var(--check-label-color)<?php echo esc_html( $important ); ?>;
841 - font-weight: var(--check-weight)<?php echo esc_html( $important ); ?>;
757 + font-size:<?php echo esc_html( $defaults['check_font_size'] . $important ); ?>;
758 + font-size:var(--check-font-size)<?php echo esc_html( $important ); ?>;
759 + color:<?php echo esc_html( $defaults['check_label_color'] . $important ); ?>;
760 + color:var(--check-label-color)<?php echo esc_html( $important ); ?>;
761 + font-weight:<?php echo esc_html( $defaults['check_weight'] . $important ); ?>;
762 + font-weight:var(--check-weight)<?php echo esc_html( $important ); ?>;
842 763 line-height: 1.3;
843 764 }
844 765
845 766 .with_frm_style .frm_radio input[type=radio],
846 767 .with_frm_style .frm_checkbox input[type=checkbox] {
847 - font-size: var(--check-font-size)<?php echo esc_html( $important ); ?>;
848 - position: static<?php echo esc_html( $important ); ?>;
768 + font-size:<?php echo esc_html( $defaults['check_font_size'] . $important ); ?>;
769 + font-size:var(--check-font-size)<?php echo esc_html( $important ); ?>;
770 + position:static<?php echo esc_html( $important ); ?>;
849 771 }
850 772
851 773 .frm_file_container .frm_file_link,
852 774 .with_frm_style .frm_radio label .frm_file_container,
@@ -855,104 +777,60 @@
855 777 margin:5px;
856 778 vertical-align:middle;
857 779 }
858 780
859 -.with_frm_style .frm_radio input[type=radio]
860 -<?php if ( $pro_is_installed ) : ?>
861 -, .with_frm_style .frm_scale input[type=radio]
862 -<?php endif; ?>
863 -{
781 +.with_frm_style .frm_radio input[type=radio]{
864 782 border-radius:50%;
865 783 }
866 784
867 -.with_frm_style .frm_checkbox input[type=checkbox] {
868 - border-radius: calc(var(--border-radius) / 2) !important;
785 +.with_frm_style .frm_checkbox input[type=checkbox]{
786 + border-radius:0;
869 787 }
870 788
871 789 .with_frm_style .frm_radio input[type=radio],
872 -<?php if ( $pro_is_installed ) : ?>
873 -.with_frm_style .frm_scale input[type=radio],
874 -<?php endif; ?>
875 790 .with_frm_style .frm_checkbox input[type=checkbox]{
791 + -webkit-appearance: none;
876 792 appearance: none;
877 793 background-color: var(--bg-color);
878 794 flex: none;
879 795 display:inline-block !important;
880 - width: 16px !important;
881 - min-width: 16px !important;
882 - height: 16px !important;
796 + margin: 0 5px 0 0;
883 797 color: var(--border-color);
798 + width: 18px;
799 + min-width: 18px;
800 + height: 18px;
884 801 border: 1px solid currentColor;
885 802 border-color: var(--border-color);
886 803 vertical-align: middle;
887 804 position: initial; /* override Bootstrap */
888 805 padding: 0;
889 - margin: 0;
890 806 }
891 807
892 -.frm_forms.with_frm_style .frm_fields_container .frm_radio input[type=radio]:not([disabled]):checked,
893 -<?php if ( $pro_is_installed ) : ?>
894 -.frm_forms.with_frm_style .frm_fields_container .frm_scale input[type=radio]:not([disabled]):checked,
895 -<?php endif; ?>
896 -.frm_forms.with_frm_style .frm_fields_container .frm_checkbox input[type=checkbox]:not([disabled]):checked {
897 - border-color: var(--border-color-active) !important;
808 +.with_frm_style .frm_radio input[type=radio]:before,
809 +.with_frm_style .frm_checkbox input[type=checkbox]:before {
810 + content: '';
811 + width: 12px;
812 + height: 12px;
813 + border-radius: 50%;
814 + transform: scale(0);
815 + transition: 120ms transform ease-in-out;
816 + box-shadow: inset 10px 10px var(--text-color);
817 + display: block;
818 + margin: 2px 0 0 2px;
898 819 }
899 820
900 -.frm_forms.with_frm_style .frm_fields_container .frm_checkbox input[type=checkbox]:not([disabled]):checked {
901 - background-color: var(--border-color-active) !important;
821 +.with_frm_style .frm_checkbox input[type=checkbox]:before{
822 + clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
823 + border-radius: 0;
902 824 }
903 825
904 -.with_frm_style .frm_radio input[type=radio][disabled]:checked,
905 -<?php if ( $pro_is_installed ) : ?>
906 -.with_frm_style .frm_scale input[type=radio][disabled]:checked,
907 -<?php endif; ?>
908 -.with_frm_style .frm_checkbox input[type=checkbox][disabled]:checked {
909 - border-color: var(--border-color) !important; /* Override Style Preview */
910 -}
911 -
912 -.with_frm_style .frm_checkbox input[type=checkbox][disabled]:checked {
913 - background-color: var(--border-color) !important;
914 -}
915 -
916 826 .with_frm_style .frm_radio input[type=radio]:checked:before,
917 -<?php if ( $pro_is_installed ) { ?>
918 -.with_frm_style .frm_scale input[type=radio]:checked:before,
919 -<?php } ?>
920 827 .with_frm_style .frm_checkbox input[type=checkbox]:checked:before {
921 - position: static !important; /* Override Style Preview */
922 - content: '';
923 - display: block;
828 + transform: scale(1);
924 829 }
925 830
926 -.frm_forms.with_frm_style .frm_checkbox input[type=checkbox]:before {
927 - width: 100% !important;
928 - height: 100% !important;
929 - 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;
930 - background-size: 9px !important;
931 - background-repeat: no-repeat !important;
932 - background-position: center !important;
933 - margin: 0;
934 -}
935 -
936 -<?php if ( $pro_is_installed ) { ?>
937 -.with_frm_style .frm_scale input[type=radio]:before,
938 -<?php } ?>
939 -.with_frm_style .frm_radio input[type=radio]:before {
940 - width: 8px;
941 - height: 8px;
942 - border-radius: 50%;
943 - background-color: var(--border-color-active);
944 - margin: 3px;
945 -}
946 -
947 -<?php if ( $pro_is_installed ) { ?>
948 -.with_frm_style .frm_scale input[type=radio][disabled]:before,
949 -<?php } ?>
950 -.with_frm_style .frm_radio input[type=radio][disabled]:before {
951 - background-color: var(--border-color);
952 -}
953 -
954 831 .with_frm_style :invalid,
832 +.with_frm_style :-moz-submit-invalid,
955 833 .with_frm_style :-moz-ui-invalid{
956 834 box-shadow:none;
957 835 }
958 836
@@ -968,29 +846,33 @@
968 846
969 847 .with_frm_style .frm_error_style,
970 848 .with_frm_style .frm_message,
971 849 .frm_success_style{
850 + -moz-border-radius:4px;
851 + -webkit-border-radius:4px;
972 852 border-radius:4px;
973 853 padding:15px;
974 854 }
975 855
976 -.with_frm_style .frm_message p {
977 - color: var(--success-text-color)<?php echo esc_html( $important ); ?>;
978 - margin-bottom: 0;
856 +.with_frm_style .frm_message p{
857 + margin-bottom:5px;
858 + color:<?php echo esc_html( $defaults['success_text_color'] ); ?>;
859 + color:var(--success-text-color)<?php echo esc_html( $important ); ?>;
979 860 }
980 861
981 -.with_frm_style .frm_message > p:first-of-type {
982 - margin-top: 0;
983 -}
984 -
985 862 .with_frm_style .frm_message,
986 -.frm_success_style {
987 - margin: 5px 0 15px;
988 - border: 1px solid var(--success-border-color);
989 - background-color: var(--success-bg-color);
990 - color: var(--success-text-color)<?php echo esc_html( $important ); ?>;
991 - border-radius: var(--border-radius);
992 - font-size: var(--success-font-size)<?php echo esc_html( $important ); ?>;
863 +.frm_success_style{
864 + margin:5px 0 15px;
865 + border:1px solid <?php echo esc_html( $defaults['success_border_color'] ); ?>;
866 + border-color:var(--success-border-color);
867 + background-color:<?php echo esc_html( $defaults['success_bg_color'] ); ?>;
868 + background-color:var(--success-bg-color);
869 + color:<?php echo esc_html( $defaults['success_text_color'] ); ?>;
870 + color:var(--success-text-color)<?php echo esc_html( $important ); ?>;
871 + border-radius:<?php echo esc_html( $defaults['border_radius'] ); ?>;
872 + border-radius:var(--border-radius);
873 + font-size:<?php echo esc_html( $defaults['success_font_size'] ); ?>;
874 + font-size:var(--success-font-size)<?php echo esc_html( $important ); ?>;
993 875 }
994 876
995 877 .with_frm_style .frm_plain_success .frm_message {
996 878 background-color: transparent;
@@ -1026,9 +908,10 @@
1026 908 padding:5px;
1027 909 border-width:1px;
1028 910 border-style:solid;
1029 911 <?php if ( ! empty( $defaults['border_color'] ) ) { ?>
1030 - border-color: var(--border-color);
912 + border-color:<?php echo esc_html( $defaults['border_color'] ); ?>;
913 + border-color:var(--border-color);
1031 914 <?php } ?>
1032 915 border-top:none;
1033 916 border-left:none;
1034 917 border-right:none;
@@ -1043,9 +926,10 @@
1043 926 }
1044 927
1045 928 <?php if ( ! empty( $defaults['border_color'] ) ) { ?>
1046 929 .with_frm_style .frm-alt-table{
1047 - border-color: var(--border-color);
930 + border-color:<?php echo esc_html( $defaults['border_color'] ); ?>;
931 + border-color:var(--border-color);
1048 932 }
1049 933 <?php } ?>
1050 934
1051 935 .frm-alt-table th {
@@ -1069,11 +953,11 @@
1069 953 background-color:<?php echo esc_html( FrmStylesHelper::adjust_brightness( $defaults['border_color'], 45 ) ); ?>;
1070 954 }
1071 955
1072 956 table.form_results.with_frm_style{
1073 - border-style: solid;
1074 - border-width: var(--field-border-width)<?php echo esc_html( $important ); ?>;
1075 - border-color: var(--border-color)<?php echo esc_html( $important ); ?>;
957 + border:<?php echo esc_html( $defaults['field_border_width'] ); ?> solid <?php echo esc_html( $defaults['border_color'] . $important ); ?>;
958 + border-width:var(--field-border-width)<?php echo esc_html( $important ); ?>;
959 + border-color:var(--border-color)<?php echo esc_html( $important ); ?>;
1076 960 }
1077 961
1078 962 table.form_results.with_frm_style tr td{
1079 963 text-align:left;
@@ -1078,14 +962,15 @@
1078 962 table.form_results.with_frm_style tr td{
1079 963 text-align:left;
1080 964 padding:7px 9px;
1081 965 <?php if ( ! empty( $defaults['text_color'] ) ) { ?>
1082 - color: var(--text-color)<?php echo esc_html( $important ); ?>;
966 + color:<?php echo esc_html( $defaults['text_color'] ); ?>;
967 + color:var(--text-color)<?php echo esc_html( $important ); ?>;
1083 968 <?php } ?>
1084 969 <?php if ( ! empty( $defaults['border_color'] ) ) { ?>
1085 - border-top-style: solid;
1086 - border-top-width: var(--field-border-width)<?php echo esc_html( $important ); ?>;
1087 - border-top-color: var(--border-color)<?php echo esc_html( $important ); ?>;
970 + border-top:1px solid <?php echo esc_html( $defaults['border_color'] ); ?>;
971 + border-top-width:var(--field-border-width)<?php echo esc_html( $important ); ?>;
972 + border-top-color:var(--border-color)<?php echo esc_html( $important ); ?>;
1088 973 <?php } ?>
1089 974 }
1090 975
1091 976 table.form_results.with_frm_style tr.frm_even,
@@ -1095,10 +980,11 @@
1095 980 }
1096 981
1097 982 <?php if ( ! empty( $defaults['bg_color'] ) ) { ?>
1098 983 table.form_results.with_frm_style tr.frm_odd,
1099 -.frm-grid .frm_odd {
1100 - background-color: var(--bg-color)<?php echo esc_html( $important ); ?>;
984 +.frm-grid .frm_odd{
985 + background-color:<?php echo esc_html( $defaults['bg_color'] ); ?>;
986 + background-color:var(--bg-color)<?php echo esc_html( $important ); ?>;
1101 987 }
1102 988 <?php } ?>
1103 989
1104 990 <?php if ( ! empty( $defaults['border_color'] ) ) { ?>
@@ -1180,25 +1066,26 @@
1180 1066 animation:2s linear 0s normal none infinite progress-bar-stripes;
1181 1067 }
1182 1068
1183 1069 <?php if ( ! empty( $defaults['bg_color'] ) ) { ?>
1184 -#frm_loading .progress-striped .progress-bar {
1070 +#frm_loading .progress-striped .progress-bar{
1185 1071 <?php if ( ! empty( $defaults['border_color'] ) ) { ?>
1186 - 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));
1072 + 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));
1187 1073 <?php } ?>
1188 1074 background-size:40px 40px;
1189 1075 }
1190 1076 <?php } ?>
1191 1077
1192 -#frm_loading .progress-bar {
1193 - background-color: var(--bg-color);
1194 - box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15) inset;
1195 - float: left;
1196 - height: 100%;
1197 - line-height: 20px;
1198 - text-align: center;
1199 - transition: width 0.6s ease 0s;
1200 - width: 100%;
1078 +#frm_loading .progress-bar{
1079 + background-color:<?php echo esc_html( $defaults['bg_color'] ); ?>;
1080 + background-color:var(--bg-color);
1081 + box-shadow:0 -1px 0 rgba(0, 0, 0, 0.15) inset;
1082 + float:left;
1083 + height:100%;
1084 + line-height:20px;
1085 + text-align:center;
1086 + transition:width 0.6s ease 0s;
1087 + width:100%;
1201 1088 }
1202 1089
1203 1090 .frm_image_from_url{
1204 1091 height:50px;
@@ -1215,9 +1102,9 @@
1215 1102 background-repeat: no-repeat;
1216 1103 color: transparent !important;
1217 1104 }
1218 1105
1219 -<?php readfile( __DIR__ . '/frm_grids.css' ); ?>
1106 +<?php readfile( dirname( __FILE__ ) . '/frm_grids.css' ); ?>
1220 1107
1221 1108 .frm_conf_field.frm_left_container .frm_primary_label{
1222 1109 display:none;
1223 1110 }
@@ -1224,8 +1111,10 @@
1224 1111
1225 1112 .wp-editor-wrap *,
1226 1113 .wp-editor-wrap *:after,
1227 1114 .wp-editor-wrap *:before{
1115 + -webkit-box-sizing:content-box;
1116 + -moz-box-sizing:content-box;
1228 1117 box-sizing:content-box;
1229 1118 }
1230 1119
1231 1120 .with_frm_style .frm_grid,
@@ -1236,9 +1125,10 @@
1236 1125 padding:5px;
1237 1126 border-width:1px;
1238 1127 border-style:solid;
1239 1128 <?php if ( ! empty( $defaults['border_color'] ) ) { ?>
1240 - border-color: var(--border-color)<?php echo esc_html( $important ); ?>;
1129 + border-color:<?php echo esc_html( $defaults['border_color'] ); ?>;
1130 + border-color:var(--border-color)<?php echo esc_html( $important ); ?>;
1241 1131 <?php } ?>
1242 1132 border-left:none;
1243 1133 border-right:none;
1244 1134 }
@@ -1249,12 +1139,9 @@
1249 1139 }
1250 1140
1251 1141 .frm_grid .frm_error,
1252 1142 .frm_grid_first .frm_error,
1253 -.frm_grid_odd .frm_error,
1254 -.frm_grid .frm_limit_error,
1255 -.frm_grid_first .frm_limit_error,
1256 -.frm_grid_odd .frm_limit_error{
1143 +.frm_grid_odd .frm_error{
1257 1144 display:none;
1258 1145 }
1259 1146
1260 1147 .frm_grid:after,
@@ -1273,16 +1160,18 @@
1273 1160 }
1274 1161
1275 1162 <?php if ( ! empty( $defaults['bg_color'] ) ) { ?>
1276 1163 .frm_grid_first,
1277 -.frm_grid_odd {
1278 - background-color: var(--bg-color);
1164 +.frm_grid_odd{
1165 + background-color:<?php echo esc_html( $defaults['bg_color'] ); ?>;
1166 + background-color:var(--bg-color);
1279 1167 }
1280 1168 <?php } ?>
1281 1169
1282 1170 <?php if ( ! empty( $defaults['bg_color_active'] ) ) { ?>
1283 -.frm_grid {
1284 - background-color: var(--bg-color-active)<?php echo esc_html( $important ); ?>;
1171 +.frm_grid{
1172 + background-color:<?php echo esc_html( $defaults['bg_color_active'] . $important ); ?>;
1173 + background-color:var(--bg-color-active)<?php echo esc_html( $important ); ?>;
1285 1174 }
1286 1175 <?php } ?>
1287 1176
1288 1177 .with_frm_style .frm_grid.frm_blank_field,
@@ -1287,10 +1176,12 @@
1287 1176
1288 1177 .with_frm_style .frm_grid.frm_blank_field,
1289 1178 .with_frm_style .frm_grid_first.frm_blank_field,
1290 1179 .with_frm_style .frm_grid_odd.frm_blank_field{
1180 + background-color:<?php echo esc_html( $defaults['error_bg'] . $important ); ?>;
1291 1181 background-color:var(--error-bg)<?php echo esc_html( $important ); ?>;
1292 - border-color: var(--error-border);
1182 + border-color:<?php echo esc_html( $defaults['error_border'] ); ?>;
1183 + border-color:var(--error-bg);
1293 1184 }
1294 1185
1295 1186 .frm_grid .frm_primary_label,
1296 1187 .frm_grid_first .frm_primary_label,
@@ -1312,10 +1203,9 @@
1312 1203 .frm_grid_odd .frm_radio label,
1313 1204 .frm_grid_first .frm_checkbox label,
1314 1205 .frm_grid .frm_checkbox label,
1315 1206 .frm_grid_odd .frm_checkbox label{
1316 - color:transparent;
1317 - text-indent: -9999px;
1207 + visibility:hidden;
1318 1208 white-space:nowrap;
1319 1209 text-align:left;
1320 1210 }
1321 1211
@@ -1441,18 +1331,8 @@
1441 1331 .frm_form_field.frm_left_container .frm_opt_container{
1442 1332 padding-top:4px;
1443 1333 }
1444 1334
1445 -.with_frm_style .frm_left_container > select.auto_width,
1446 -.with_frm_style .frm_right_container > select.auto_width {
1447 - width: max-content<?php echo esc_html( $important ); ?>;
1448 -}
1449 -
1450 -.with_frm_style .frm_right_container > .frm_primary_label,
1451 -.with_frm_style .frm_right_container > select.auto_width {
1452 - margin-left: auto<?php echo esc_html( $important ); ?>;
1453 -}
1454 -
1455 1335 .with_frm_style .frm_inline_container.frm_grid_first .frm_primary_label,
1456 1336 .with_frm_style .frm_inline_container.frm_grid .frm_primary_label,
1457 1337 .with_frm_style .frm_inline_container.frm_grid_odd .frm_primary_label,
1458 1338 .with_frm_style .frm_inline_container.frm_grid_first .frm_opt_container,
@@ -1487,9 +1367,11 @@
1487 1367 grid-column-end: span 1;
1488 1368 }
1489 1369
1490 1370 .frm_form_field .frm_checkbox,
1491 -.frm_form_field .frm_radio {
1371 +.frm_form_field .frm_checkbox + .frm_checkbox,
1372 +.frm_form_field .frm_radio,
1373 +.frm_form_field .frm_radio + .frm_radio{
1492 1374 margin-top: 0;
1493 1375 margin-bottom: 0;
1494 1376 }
1495 1377
@@ -1498,24 +1380,36 @@
1498 1380 overflow:auto;
1499 1381 }
1500 1382
1501 1383 .frm_html_container.frm_scroll_box,
1502 -.frm_form_field.frm_html_scroll_box {
1503 - height: 100px;
1504 - overflow: auto;
1505 - background-color: var(--bg-color);
1506 - border-color: var(--border-color);
1507 - border-width: var(--field-border-width);
1508 - border-style: var(--field-border-style);
1509 - border-radius: var(--border-radius);
1510 - width: var(--field-width);
1511 - max-width: 100%;
1512 - font-size: var(--field-font-size);
1513 - padding: var(--field-pad);
1514 - box-sizing: border-box;
1515 - outline: none<?php echo esc_html( $important ); ?>;
1516 - font-weight: normal;
1517 - box-shadow: var(--box-shadow);
1384 +.frm_form_field.frm_html_scroll_box{
1385 + height:100px;
1386 + overflow:auto;
1387 + background-color:<?php echo esc_html( $defaults['bg_color'] ); ?>;
1388 + background-color:var(--bg-color);
1389 + border-color:<?php echo esc_html( $defaults['border_color'] ); ?>;
1390 + border-color:var(--border-color);
1391 + border-width:<?php echo esc_html( $defaults['field_border_width'] ); ?>;
1392 + border-width:var(--field-border-width);
1393 + border-style:<?php echo esc_html( $defaults['field_border_style'] ); ?>;
1394 + border-style:var(--field-border-style);
1395 + -moz-border-radius:<?php echo esc_html( $defaults['border_radius'] ); ?>;
1396 + -webkit-border-radius:<?php echo esc_html( $defaults['border_radius'] ); ?>;
1397 + border-radius:<?php echo esc_html( $defaults['border_radius'] ); ?>;
1398 + border-radius:var(--border-radius);
1399 + width:<?php echo esc_html( $defaults['field_width'] ); ?>;
1400 + width:var(--field-width);
1401 + max-width:100%;
1402 + font-size:<?php echo esc_html( $defaults['field_font_size'] ); ?>;
1403 + font-size:var(--field-font-size);
1404 + padding:<?php echo esc_html( $defaults['field_pad'] ); ?>;
1405 + padding:var(--field-pad);
1406 + -webkit-box-sizing:border-box;
1407 + -moz-box-sizing:border-box;
1408 + box-sizing:border-box;
1409 + outline:none<?php echo esc_html( $important ); ?>;
1410 + font-weight:normal;
1411 + box-shadow:var(--box-shadow);
1518 1412 }
1519 1413
1520 1414 .frm_form_field.frm_total_big input,
1521 1415 .frm_form_field.frm_total_big textarea,
@@ -1524,8 +1418,10 @@
1524 1418 opacity:1;
1525 1419 background-color:transparent !important;
1526 1420 border:none !important;
1527 1421 font-weight:bold;
1422 + -moz-box-shadow:none;
1423 + -webkit-box-shadow:none;
1528 1424 width:auto !important;
1529 1425 height:auto !important;
1530 1426 box-shadow:none !important;
1531 1427 display:inline;
@@ -1545,8 +1441,10 @@
1545 1441 .frm_form_field.frm_total input:focus,
1546 1442 .frm_form_field.frm_total textarea:focus{
1547 1443 background-color:transparent;
1548 1444 border:none;
1445 + -moz-box-shadow:none;
1446 + -webkit-box-shadow:none;
1549 1447 box-shadow:none;
1550 1448 }
1551 1449
1552 1450 .frm_form_field.frm_label_justify .frm_primary_label{
@@ -1571,8 +1469,13 @@
1571 1469 .frm_clearfix{
1572 1470 display:block;
1573 1471 }
1574 1472
1473 +.with_frm_style .frm_repeat_sec .frm_form_field.frm_repeat_buttons .frm_icon_font::before {
1474 + color:<?php echo esc_html( $defaults['repeat_icon_color'] . $important ); ?>;
1475 + color:var(--repeat-icon-color)<?php echo esc_html( $important ); ?>;
1476 +}
1477 +
1575 1478 .with_frm_style .frm_combo_inputs_container > .frm_form_subfield-first,
1576 1479 .with_frm_style .frm_combo_inputs_container > .frm_form_subfield-middle,
1577 1480 .with_frm_style .frm_combo_inputs_container > .frm_form_subfield-last {
1578 1481 margin-bottom: 0 !important;
@@ -1577,20 +1480,12 @@
1577 1480 .with_frm_style .frm_combo_inputs_container > .frm_form_subfield-last {
1578 1481 margin-bottom: 0 !important;
1579 1482 }
1580 1483
1484 +/* Fonts */
1485 +<?php readfile( FrmAppHelper::plugin_path() . '/css/font_icons.css' ); ?>
1486 +<?php do_action( 'frm_include_front_css', compact( 'defaults' ) ); ?>
1581 1487
1582 -<?php
1583 -/**
1584 - * Call action so other plugins can add additional CSS.
1585 - *
1586 - * @param array $args {
1587 - * @type array $defaults
1588 - * }
1589 - */
1590 -do_action( 'frm_include_front_css', compact( 'defaults' ) );
1591 -?>
1592 -
1593 1488 /* Responsive */
1594 1489
1595 1490 @media only screen and (max-width: 900px) {
1596 1491 .frm_form_field .frm_repeat_grid .frm_form_field.frm_sixth .frm_primary_label,
@@ -1634,8 +1529,9 @@
1634 1529 max-width:302px;
1635 1530 border-right:1px solid #d3d3d3;
1636 1531 border-radius:4px;
1637 1532 box-shadow:2px 0px 4px -1px rgba(0,0,0,.08);
1533 + -moz-box-shadow:2px 0px 4px -1px rgba(0,0,0,.08);
1638 1534 }
1639 1535
1640 1536 .with_frm_style .g-recaptcha iframe,
1641 1537 .with_frm_style .frm-g-recaptcha iframe{
@@ -1641,14 +1537,7 @@
1641 1537 .with_frm_style .frm-g-recaptcha iframe{
1642 1538 width:100%;
1643 1539 }
1644 1540 }
1645 -
1646 -.frm-card-element .sq-card-wrapper .sq-card-message {
1647 - margin-bottom: 0;
1648 -}
1649 -.frm-card-errors:empty {
1650 - margin: 0;
1651 -}
1652 1541 <?php
1653 1542
1654 -echo strip_tags( FrmStylesController::get_custom_css() ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
1543 +echo strip_tags( $defaults['custom_css'] ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped