PluginProbe
Formidable Forms – WordPress Form Builder for Contact Forms, Calculators, Quizzes & More / 5.4.5
Formidable Forms – WordPress Form Builder for Contact Forms, Calculators, Quizzes & More v5.4.5
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 +343 -347 6.265.4.5 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;
@@ -431,10 +441,10 @@
431 441
432 442 /* Floating labels */
433 443 .with_frm_style .frm_inside_container {
434 444 position: relative;
435 - padding-top: 18px;
436 - padding-top: calc(0.5 * var(--field-height));
445 + padding-top: 27px;
446 + padding-top: calc(0.85 * var(--field-height));
437 447 }
438 448
439 449 .with_frm_style .frm_inside_container > input,
440 450 .with_frm_style .frm_inside_container > select,
@@ -441,13 +451,21 @@
441 451 .with_frm_style .frm_inside_container > textarea {
442 452 display: block;
443 453 }
444 454
445 -.with_frm_style input::placeholder,
446 -.with_frm_style textarea::placeholder {
447 - font-size: var(--field-font-size)<?php echo esc_html( $important ); ?>;
455 +/* These do not work if they are combined */
456 +.with_frm_style .frm_inside_container > input::-moz-placeholder,
457 +.with_frm_style .frm_inside_container > textarea::-moz-placeholder {
458 + opacity: 0 !important;
459 + transition: opacity 0.3s ease-in;
448 460 }
449 461
462 +.with_frm_style .frm_inside_container > input:-ms-input-placeholder,
463 +.with_frm_style .frm_inside_container > textarea:-ms-input-placeholder {
464 + opacity: 0;
465 + transition: opacity 0.3s ease-in;
466 +}
467 +
450 468 .with_frm_style .frm_inside_container > input::placeholder,
451 469 .with_frm_style .frm_inside_container > textarea::placeholder {
452 470 opacity: 0;
453 471 transition: opacity 0.3s ease-in;
@@ -456,10 +474,10 @@
456 474 .with_frm_style .frm_inside_container > label {
457 475 transition: all 0.3s ease-in;
458 476
459 477 position: absolute;
460 - top: 19px;
461 - top: calc(1px + .5 * var(--field-height));
478 + top: 28px;
479 + top: calc(1px + 0.85 * var(--field-height));
462 480 left: 3px;
463 481 width: 100%;
464 482
465 483 line-height: 1.3;
@@ -466,9 +484,9 @@
466 484 text-overflow: ellipsis;
467 485 overflow: hidden;
468 486 white-space: nowrap;
469 487
470 - padding: 8px 12px;
488 + padding: 6px 10px;
471 489 padding: var(--field-pad);
472 490
473 491 font-size: 14px;
474 492 font-size: var(--field-font-size);
@@ -474,8 +492,9 @@
474 492 font-size: var(--field-font-size);
475 493 font-weight: normal;
476 494 font-weight: var(--field-weight);
477 495
496 + -ms-pointer-events: none;
478 497 pointer-events: none;
479 498 }
480 499
481 500 .with_frm_style.frm_style_lines-no-boxes .frm_inside_container > label {
@@ -484,22 +503,32 @@
484 503
485 504 .with_frm_style .frm_inside_container.frm_label_float_top > label {
486 505 top: 0;
487 506 left: 0;
488 - padding: 0;
489 507 font-size: 12px;
490 508 font-size: calc(0.85 * var(--field-font-size));
491 509 }
492 510
511 +/* These do not work if they are combined */
512 +.with_frm_style .frm_inside_container.frm_label_float_top > input::-moz-placeholder,
513 +.with_frm_style .frm_inside_container.frm_label_float_top > textarea::-moz-placeholder {
514 + opacity: 1 !important;
515 + transition: opacity 0.3s ease-in;
516 +}
517 +
518 +.with_frm_style .frm_inside_container.frm_label_float_top > input:-ms-input-placeholder,
519 +.with_frm_style .frm_inside_container.frm_label_float_top > textarea:-ms-input-placeholder {
520 + opacity: 1;
521 + transition: opacity 0.3s ease-in;
522 +}
523 +
493 524 .with_frm_style .frm_inside_container.frm_label_float_top > input::placeholder,
494 525 .with_frm_style .frm_inside_container.frm_label_float_top > textarea::placeholder {
495 526 opacity: 1;
496 527 transition: opacity 0.3s ease-in;
497 528 }
498 -/* End floating label */
499 529
500 -.with_frm_style .frm_description,
501 -.with_frm_style .frm_pro_max_limit_desc{
530 +.with_frm_style .frm_description{
502 531 clear:both;
503 532 }
504 533
505 534 .with_frm_style input[type=number][readonly]{
@@ -542,43 +571,54 @@
542 571 white-space:nowrap;
543 572 }
544 573
545 574 .with_frm_style .frm_button{
546 - text-decoration:none !important;
575 + text-decoration:none !important;;
547 576 border:1px solid #eee;
548 577 display:inline-block;
549 578 <?php if ( ! empty( $defaults['submit_padding'] ) ) { ?>
550 - padding: var(--submit-padding)<?php echo esc_html( $important ); ?>;
579 + padding:<?php echo esc_html( $defaults['submit_padding'] . $important ); ?>;
580 + padding:var(--submit-padding)<?php echo esc_html( $important ); ?>;
551 581 <?php } else { ?>
552 582 padding:5px;
553 583 <?php } ?>
554 584 <?php if ( ! empty( $defaults['border_radius'] ) ) { ?>
585 + -moz-border-radius:<?php echo esc_html( $defaults['border_radius'] . $important ); ?>;
586 + -webkit-border-radius:<?php echo esc_html( $defaults['border_radius'] . $important ); ?>;
555 587 border-radius:<?php echo esc_html( $defaults['border_radius'] . $important ); ?>;
556 588 border-radius:var(--border-radius)<?php echo esc_html( $important ); ?>;
557 589 <?php } ?>
558 590 <?php if ( ! empty( $defaults['submit_font_size'] ) ) { ?>
559 - font-size: var(--submit-font-size)<?php echo esc_html( $important ); ?>;
591 + font-size:<?php echo esc_html( $defaults['submit_font_size'] . $important ); ?>;
592 + font-size:var(--submit-font-size)<?php echo esc_html( $important ); ?>;
560 593 <?php } ?>
561 594 <?php if ( ! empty( $defaults['font'] ) ) { ?>
562 - font-family: var(--font)<?php echo esc_html( $important ); ?>;
595 + font-family:<?php echo FrmAppHelper::kses( $defaults['font'] . $important ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
596 + font-family:var(--font)<?php echo esc_html( $important ); ?>;
563 597 <?php } ?>
564 598 <?php if ( ! empty( $defaults['submit_weight'] ) ) { ?>
565 - font-weight: var(--submit-weight)<?php echo esc_html( $important ); ?>;
599 + font-weight:<?php echo esc_html( $defaults['submit_weight'] . $important ); ?>;
600 + font-weight:var(--submit-weight)<?php echo esc_html( $important ); ?>;
566 601 <?php } ?>
567 602 <?php if ( ! empty( $defaults['submit_text_color'] ) ) { ?>
568 - color: var(--submit-text-color)<?php echo esc_html( $important ); ?>;
603 + color:<?php echo esc_html( $defaults['submit_text_color'] . $important ); ?>;
604 + color:var(--submit-text-color)<?php echo esc_html( $important ); ?>;
569 605 <?php } ?>
570 606 <?php if ( ! empty( $defaults['submit_bg_color'] ) ) { ?>
571 - background: var(--submit-bg-color)<?php echo esc_html( $important ); ?>;
607 + background:<?php echo esc_html( $defaults['submit_bg_color'] . $important ); ?>;
608 + background:var(--submit-bg-color)<?php echo esc_html( $important ); ?>;
572 609 <?php } ?>
573 610 <?php if ( ! empty( $defaults['submit_border_width'] ) ) { ?>
574 - border-width: var(--submit-border-width)<?php echo esc_html( $important ); ?>;
611 + border-width:<?php echo esc_html( $defaults['submit_border_width'] ); ?>;
612 + border-width:var(--submit-border-width)<?php echo esc_html( $important ); ?>;
575 613 <?php } ?>
576 614 <?php if ( ! empty( $defaults['submit_border_color'] ) ) { ?>
577 - border-color: var(--submit-border-color)<?php echo esc_html( $important ); ?>;
615 + border-color:<?php echo esc_html( $defaults['submit_border_color'] . $important ); ?>;
616 + border-color:var(--submit-border-color)<?php echo esc_html( $important ); ?>;
578 617 <?php } ?>
579 618 <?php if ( ! empty( $defaults['submit_height'] ) ) { ?>
580 - height: var(--submit-height)<?php echo esc_html( $important ); ?>;
619 + height:<?php echo esc_html( $defaults['submit_height'] . $important ); ?>;
620 + height:var(--submit-height)<?php echo esc_html( $important ); ?>;
581 621 <?php } ?>
582 622 }
583 623
584 624 <?php if ( ! empty( $defaults['submit_text_color'] ) ) { ?>
@@ -611,12 +651,8 @@
611 651 .with_frm_style.frm_center_submit .frm_submit{
612 652 text-align:center;
613 653 }
614 654
615 -.with_frm_style.frm_center_submit .frm_flex.frm_submit {
616 - justify-content: center;
617 -}
618 -
619 655 .with_frm_style .frm_inline_success .frm_submit{
620 656 display: flex;
621 657 flex-direction: row;
622 658 align-items: center;
@@ -660,8 +696,9 @@
660 696
661 697 .with_frm_style .frm_loading_prev .frm_prev_page,
662 698 .with_frm_style .frm_loading_form .frm_button_submit {
663 699 position: relative;
700 + opacity: .8;
664 701 color: transparent !important;
665 702 text-shadow: none !important;
666 703 }
667 704
@@ -687,9 +724,9 @@
687 724 border-top-color: transparent;
688 725 border-left-color: transparent;
689 726 border-radius: 50%;
690 727 box-sizing: border-box;
691 - <?php $loader_size = 12; ?>
728 + <?php $loader_size = 20; ?>
692 729 top: 50%;
693 730 left: 50%;
694 731 margin-top: -<?php echo absint( $loader_size / 2 ); ?>px;
695 732 margin-left: -<?php echo absint( $loader_size / 2 ); ?>px;
@@ -694,23 +731,17 @@
694 731 margin-top: -<?php echo absint( $loader_size / 2 ); ?>px;
695 732 margin-left: -<?php echo absint( $loader_size / 2 ); ?>px;
696 733 width: <?php echo absint( $loader_size ); ?>px;
697 734 height: <?php echo absint( $loader_size ); ?>px;
698 - animation: spin 2s linear infinite;
735 + -webkit-animation: spin 2s linear infinite;
736 + -moz-animation: spin 2s linear infinite;
737 + -o-animation: spin 2s linear infinite;
738 + animation: spin 2s linear infinite;
699 739 }
700 740
701 -.with_frm_style .frm_submit.frm_flex {
702 - align-items: center;
703 - gap: 2%;
704 -}
705 -
706 -.with_frm_style .frm_submit.frm_flex button.frm_button_submit ~ .frm_prev_page {
707 - order: -1;
708 -}
709 -
710 741 <?php
711 742 foreach ( $styles as $style ) {
712 - include __DIR__ . '/_single_theme.css.php';
743 + include( dirname( __FILE__ ) . '/_single_theme.css.php' );
713 744 unset( $style );
714 745 }
715 746
716 747 // Set it again since it may have been overridden.
@@ -732,12 +763,15 @@
732 763
733 764 .with_frm_style a.frm_save_draft,
734 765 .with_frm_style a.frm_start_over{
735 766 <?php if ( ! empty( $defaults['font'] ) ) { ?>
736 - font-family: var(--font);
767 + font-family:<?php echo FrmAppHelper::kses( $defaults['font'] ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
768 + font-family:var(--font);
737 769 <?php } ?>
738 - font-size: var(--submit-font-size);
739 - font-weight: var(--submit-weight);
770 + font-size:<?php echo esc_html( $defaults['submit_font_size'] ); ?>;
771 + font-size:var(--submit-font-size);
772 + font-weight:<?php echo esc_html( $defaults['submit_weight'] ); ?>;
773 + font-weight:var(--submit-weight);
740 774 }
741 775
742 776 .horizontal_radio .frm_radio{
743 777 margin:0 5px 0 0;
@@ -744,9 +778,9 @@
744 778 }
745 779
746 780 .horizontal_radio .frm_checkbox{
747 781 margin:0;
748 - margin-right:12px;
782 + margin-right:5px;
749 783 }
750 784
751 785 .vertical_radio .frm_checkbox,
752 786 .vertical_radio .frm_radio,
@@ -761,13 +795,15 @@
761 795 padding-left: 0;
762 796 }
763 797
764 798 .with_frm_style .frm_radio{
765 - display: var(--radio-align)<?php echo esc_html( $important ); ?>;
799 + display:<?php echo esc_html( $defaults['radio_align'] . $important ); ?>;
800 + display:var(--radio-align)<?php echo esc_html( $important ); ?>;
766 801 }
767 802
768 803 .with_frm_style .frm_checkbox{
769 - display: var(--check-align)<?php echo esc_html( $important ); ?>;
804 + display:<?php echo esc_html( $defaults['check_align'] . $important ); ?>;
805 + display:var(--check-align)<?php echo esc_html( $important ); ?>;
770 806 }
771 807
772 808 .with_frm_style .vertical_radio .frm_checkbox,
773 809 .with_frm_style .vertical_radio .frm_radio,
@@ -772,9 +808,8 @@
772 808 .with_frm_style .vertical_radio .frm_checkbox,
773 809 .with_frm_style .vertical_radio .frm_radio,
774 810 .vertical_radio .frm_catlevel_1{
775 811 display:block<?php echo esc_html( $important ); ?>;
776 - margin-bottom: 10px;
777 812 }
778 813
779 814 .with_frm_style .horizontal_radio .frm_checkbox,
780 815 .with_frm_style .horizontal_radio .frm_radio,
@@ -782,45 +817,40 @@
782 817 display:inline-block<?php echo esc_html( $important ); ?>;
783 818 }
784 819
785 820 .with_frm_style .frm_checkbox label,
786 -.with_frm_style .frm_radio label {
787 - display: inline-block;
788 - vertical-align: middle;
821 +.with_frm_style .frm_radio label{
822 + display: inline;
789 823 white-space:normal;
790 824 }
791 825
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 826 .with_frm_style .vertical_radio .frm_checkbox label,
803 827 .with_frm_style .vertical_radio .frm_radio label{
804 828 display: block;
805 - width: 100%;
829 + padding-left: 20px;
830 + text-indent: -20px;
806 831 }
807 832
808 833 .with_frm_style .frm_radio label,
809 -.with_frm_style .frm_checkbox label {
834 +.with_frm_style .frm_checkbox label{
810 835 <?php if ( ! empty( $defaults['font'] ) ) { ?>
811 - font-family: var(--font);
836 + font-family:<?php echo FrmAppHelper::kses( $defaults['font'] ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
837 + font-family:var(--font);
812 838 <?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 ); ?>;
839 + font-size:<?php echo esc_html( $defaults['check_font_size'] . $important ); ?>;
840 + font-size:var(--check-font-size)<?php echo esc_html( $important ); ?>;
841 + color:<?php echo esc_html( $defaults['check_label_color'] . $important ); ?>;
842 + color:var(--check-label-color)<?php echo esc_html( $important ); ?>;
843 + font-weight:<?php echo esc_html( $defaults['check_weight'] . $important ); ?>;
844 + font-weight:var(--check-weight)<?php echo esc_html( $important ); ?>;
816 845 line-height: 1.3;
817 846 }
818 847
819 848 .with_frm_style .frm_radio input[type=radio],
820 849 .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 ); ?>;
850 + font-size:<?php echo esc_html( $defaults['check_font_size'] . $important ); ?>;
851 + font-size:var(--check-font-size)<?php echo esc_html( $important ); ?>;
852 + position:static<?php echo esc_html( $important ); ?>;
823 853 }
824 854
825 855 .frm_file_container .frm_file_link,
826 856 .with_frm_style .frm_radio label .frm_file_container,
@@ -829,104 +859,60 @@
829 859 margin:5px;
830 860 vertical-align:middle;
831 861 }
832 862
833 -.with_frm_style .frm_radio input[type=radio]
834 -<?php if ( $pro_is_installed ) : ?>
835 -, .with_frm_style .frm_scale input[type=radio]
836 -<?php endif; ?>
837 -{
863 +.with_frm_style .frm_radio input[type=radio]{
838 864 border-radius:50%;
839 865 }
840 866
841 -.with_frm_style .frm_checkbox input[type=checkbox] {
842 - border-radius: calc(var(--border-radius) / 2) !important;
867 +.with_frm_style .frm_checkbox input[type=checkbox]{
868 + border-radius:0;
843 869 }
844 870
845 871 .with_frm_style .frm_radio input[type=radio],
846 -<?php if ( $pro_is_installed ) : ?>
847 -.with_frm_style .frm_scale input[type=radio],
848 -<?php endif; ?>
849 872 .with_frm_style .frm_checkbox input[type=checkbox]{
873 + -webkit-appearance: none;
850 874 appearance: none;
851 875 background-color: var(--bg-color);
852 876 flex: none;
853 877 display:inline-block !important;
854 - width: 16px !important;
855 - min-width: 16px !important;
856 - height: 16px !important;
878 + margin: 0 5px 0 0;
857 879 color: var(--border-color);
880 + width: 18px;
881 + min-width: 18px;
882 + height: 18px;
858 883 border: 1px solid currentColor;
859 884 border-color: var(--border-color);
860 885 vertical-align: middle;
861 886 position: initial; /* override Bootstrap */
862 887 padding: 0;
863 - margin: 0;
864 888 }
865 889
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,
869 -<?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;
890 +.with_frm_style .frm_radio input[type=radio]:before,
891 +.with_frm_style .frm_checkbox input[type=checkbox]:before {
892 + content: '';
893 + width: 12px;
894 + height: 12px;
895 + border-radius: 50%;
896 + transform: scale(0);
897 + transition: 120ms transform ease-in-out;
898 + box-shadow: inset 10px 10px var(--text-color);
899 + display: block;
900 + margin: 2px 0 0 2px;
872 901 }
873 902
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;
903 +.with_frm_style .frm_checkbox input[type=checkbox]:before{
904 + clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
905 + border-radius: 0;
876 906 }
877 907
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 908 .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 909 .with_frm_style .frm_checkbox input[type=checkbox]:checked:before {
895 - position: static !important; /* Override Style Preview */
896 - content: '';
897 - display: block;
910 + transform: scale(1);
898 911 }
899 912
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 913 .with_frm_style :invalid,
914 +.with_frm_style :-moz-submit-invalid,
929 915 .with_frm_style :-moz-ui-invalid{
930 916 box-shadow:none;
931 917 }
932 918
@@ -942,29 +928,33 @@
942 928
943 929 .with_frm_style .frm_error_style,
944 930 .with_frm_style .frm_message,
945 931 .frm_success_style{
932 + -moz-border-radius:4px;
933 + -webkit-border-radius:4px;
946 934 border-radius:4px;
947 935 padding:15px;
948 936 }
949 937
950 -.with_frm_style .frm_message p {
951 - color: var(--success-text-color)<?php echo esc_html( $important ); ?>;
952 - margin-bottom: 0;
938 +.with_frm_style .frm_message p{
939 + margin-bottom:5px;
940 + color:<?php echo esc_html( $defaults['success_text_color'] ); ?>;
941 + color:var(--success-text-color)<?php echo esc_html( $important ); ?>;
953 942 }
954 943
955 -.with_frm_style .frm_message > p:first-of-type {
956 - margin-top: 0;
957 -}
958 -
959 944 .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 ); ?>;
945 +.frm_success_style{
946 + margin:5px 0 15px;
947 + border:1px solid <?php echo esc_html( $defaults['success_border_color'] ); ?>;
948 + border-color:var(--success-border-color);
949 + background-color:<?php echo esc_html( $defaults['success_bg_color'] ); ?>;
950 + background-color:var(--success-bg-color);
951 + color:<?php echo esc_html( $defaults['success_text_color'] ); ?>;
952 + color:var(--success-text-color)<?php echo esc_html( $important ); ?>;
953 + border-radius:<?php echo esc_html( $defaults['border_radius'] ); ?>;
954 + border-radius:var(--border-radius);
955 + font-size:<?php echo esc_html( $defaults['success_font_size'] ); ?>;
956 + font-size:var(--success-font-size)<?php echo esc_html( $important ); ?>;
967 957 }
968 958
969 959 .with_frm_style .frm_plain_success .frm_message {
970 960 background-color: transparent;
@@ -1000,9 +990,10 @@
1000 990 padding:5px;
1001 991 border-width:1px;
1002 992 border-style:solid;
1003 993 <?php if ( ! empty( $defaults['border_color'] ) ) { ?>
1004 - border-color: var(--border-color);
994 + border-color:<?php echo esc_html( $defaults['border_color'] ); ?>;
995 + border-color:var(--border-color);
1005 996 <?php } ?>
1006 997 border-top:none;
1007 998 border-left:none;
1008 999 border-right:none;
@@ -1017,9 +1008,10 @@
1017 1008 }
1018 1009
1019 1010 <?php if ( ! empty( $defaults['border_color'] ) ) { ?>
1020 1011 .with_frm_style .frm-alt-table{
1021 - border-color: var(--border-color);
1012 + border-color:<?php echo esc_html( $defaults['border_color'] ); ?>;
1013 + border-color:var(--border-color);
1022 1014 }
1023 1015 <?php } ?>
1024 1016
1025 1017 .frm-alt-table th {
@@ -1043,11 +1035,11 @@
1043 1035 background-color:<?php echo esc_html( FrmStylesHelper::adjust_brightness( $defaults['border_color'], 45 ) ); ?>;
1044 1036 }
1045 1037
1046 1038 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 ); ?>;
1039 + border:<?php echo esc_html( $defaults['field_border_width'] ); ?> solid <?php echo esc_html( $defaults['border_color'] . $important ); ?>;
1040 + border-width:var(--field-border-width)<?php echo esc_html( $important ); ?>;
1041 + border-color:var(--border-color)<?php echo esc_html( $important ); ?>;
1050 1042 }
1051 1043
1052 1044 table.form_results.with_frm_style tr td{
1053 1045 text-align:left;
@@ -1052,14 +1044,15 @@
1052 1044 table.form_results.with_frm_style tr td{
1053 1045 text-align:left;
1054 1046 padding:7px 9px;
1055 1047 <?php if ( ! empty( $defaults['text_color'] ) ) { ?>
1056 - color: var(--text-color)<?php echo esc_html( $important ); ?>;
1048 + color:<?php echo esc_html( $defaults['text_color'] ); ?>;
1049 + color:var(--text-color)<?php echo esc_html( $important ); ?>;
1057 1050 <?php } ?>
1058 1051 <?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 ); ?>;
1052 + border-top:1px solid <?php echo esc_html( $defaults['border_color'] ); ?>;
1053 + border-top-width:var(--field-border-width)<?php echo esc_html( $important ); ?>;
1054 + border-top-color:var(--border-color)<?php echo esc_html( $important ); ?>;
1062 1055 <?php } ?>
1063 1056 }
1064 1057
1065 1058 table.form_results.with_frm_style tr.frm_even,
@@ -1069,10 +1062,11 @@
1069 1062 }
1070 1063
1071 1064 <?php if ( ! empty( $defaults['bg_color'] ) ) { ?>
1072 1065 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 ); ?>;
1066 +.frm-grid .frm_odd{
1067 + background-color:<?php echo esc_html( $defaults['bg_color'] ); ?>;
1068 + background-color:var(--bg-color)<?php echo esc_html( $important ); ?>;
1075 1069 }
1076 1070 <?php } ?>
1077 1071
1078 1072 <?php if ( ! empty( $defaults['border_color'] ) ) { ?>
@@ -1154,25 +1148,26 @@
1154 1148 animation:2s linear 0s normal none infinite progress-bar-stripes;
1155 1149 }
1156 1150
1157 1151 <?php if ( ! empty( $defaults['bg_color'] ) ) { ?>
1158 -#frm_loading .progress-striped .progress-bar {
1152 +#frm_loading .progress-striped .progress-bar{
1159 1153 <?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));
1154 + 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 1155 <?php } ?>
1162 1156 background-size:40px 40px;
1163 1157 }
1164 1158 <?php } ?>
1165 1159
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%;
1160 +#frm_loading .progress-bar{
1161 + background-color:<?php echo esc_html( $defaults['bg_color'] ); ?>;
1162 + background-color:var(--bg-color);
1163 + box-shadow:0 -1px 0 rgba(0, 0, 0, 0.15) inset;
1164 + float:left;
1165 + height:100%;
1166 + line-height:20px;
1167 + text-align:center;
1168 + transition:width 0.6s ease 0s;
1169 + width:100%;
1175 1170 }
1176 1171
1177 1172 .frm_image_from_url{
1178 1173 height:50px;
@@ -1189,9 +1184,9 @@
1189 1184 background-repeat: no-repeat;
1190 1185 color: transparent !important;
1191 1186 }
1192 1187
1193 -<?php readfile( __DIR__ . '/frm_grids.css' ); ?>
1188 +<?php readfile( dirname( __FILE__ ) . '/frm_grids.css' ); ?>
1194 1189
1195 1190 .frm_conf_field.frm_left_container .frm_primary_label{
1196 1191 display:none;
1197 1192 }
@@ -1198,8 +1193,10 @@
1198 1193
1199 1194 .wp-editor-wrap *,
1200 1195 .wp-editor-wrap *:after,
1201 1196 .wp-editor-wrap *:before{
1197 + -webkit-box-sizing:content-box;
1198 + -moz-box-sizing:content-box;
1202 1199 box-sizing:content-box;
1203 1200 }
1204 1201
1205 1202 .with_frm_style .frm_grid,
@@ -1210,9 +1207,10 @@
1210 1207 padding:5px;
1211 1208 border-width:1px;
1212 1209 border-style:solid;
1213 1210 <?php if ( ! empty( $defaults['border_color'] ) ) { ?>
1214 - border-color: var(--border-color)<?php echo esc_html( $important ); ?>;
1211 + border-color:<?php echo esc_html( $defaults['border_color'] ); ?>;
1212 + border-color:var(--border-color)<?php echo esc_html( $important ); ?>;
1215 1213 <?php } ?>
1216 1214 border-left:none;
1217 1215 border-right:none;
1218 1216 }
@@ -1223,12 +1221,9 @@
1223 1221 }
1224 1222
1225 1223 .frm_grid .frm_error,
1226 1224 .frm_grid_first .frm_error,
1227 -.frm_grid_odd .frm_error,
1228 -.frm_grid .frm_limit_error,
1229 -.frm_grid_first .frm_limit_error,
1230 -.frm_grid_odd .frm_limit_error{
1225 +.frm_grid_odd .frm_error{
1231 1226 display:none;
1232 1227 }
1233 1228
1234 1229 .frm_grid:after,
@@ -1247,16 +1242,18 @@
1247 1242 }
1248 1243
1249 1244 <?php if ( ! empty( $defaults['bg_color'] ) ) { ?>
1250 1245 .frm_grid_first,
1251 -.frm_grid_odd {
1252 - background-color: var(--bg-color);
1246 +.frm_grid_odd{
1247 + background-color:<?php echo esc_html( $defaults['bg_color'] ); ?>;
1248 + background-color:var(--bg-color);
1253 1249 }
1254 1250 <?php } ?>
1255 1251
1256 1252 <?php if ( ! empty( $defaults['bg_color_active'] ) ) { ?>
1257 -.frm_grid {
1258 - background-color: var(--bg-color-active)<?php echo esc_html( $important ); ?>;
1253 +.frm_grid{
1254 + background-color:<?php echo esc_html( $defaults['bg_color_active'] . $important ); ?>;
1255 + background-color:var(--bg-color-active)<?php echo esc_html( $important ); ?>;
1259 1256 }
1260 1257 <?php } ?>
1261 1258
1262 1259 .with_frm_style .frm_grid.frm_blank_field,
@@ -1261,10 +1258,12 @@
1261 1258
1262 1259 .with_frm_style .frm_grid.frm_blank_field,
1263 1260 .with_frm_style .frm_grid_first.frm_blank_field,
1264 1261 .with_frm_style .frm_grid_odd.frm_blank_field{
1262 + background-color:<?php echo esc_html( $defaults['error_bg'] . $important ); ?>;
1265 1263 background-color:var(--error-bg)<?php echo esc_html( $important ); ?>;
1266 - border-color: var(--error-border);
1264 + border-color:<?php echo esc_html( $defaults['error_border'] ); ?>;
1265 + border-color:var(--error-bg);
1267 1266 }
1268 1267
1269 1268 .frm_grid .frm_primary_label,
1270 1269 .frm_grid_first .frm_primary_label,
@@ -1286,10 +1285,9 @@
1286 1285 .frm_grid_odd .frm_radio label,
1287 1286 .frm_grid_first .frm_checkbox label,
1288 1287 .frm_grid .frm_checkbox label,
1289 1288 .frm_grid_odd .frm_checkbox label{
1290 - color:transparent;
1291 - text-indent: -9999px;
1289 + visibility:hidden;
1292 1290 white-space:nowrap;
1293 1291 text-align:left;
1294 1292 }
1295 1293
@@ -1415,18 +1413,8 @@
1415 1413 .frm_form_field.frm_left_container .frm_opt_container{
1416 1414 padding-top:4px;
1417 1415 }
1418 1416
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 1417 .with_frm_style .frm_inline_container.frm_grid_first .frm_primary_label,
1430 1418 .with_frm_style .frm_inline_container.frm_grid .frm_primary_label,
1431 1419 .with_frm_style .frm_inline_container.frm_grid_odd .frm_primary_label,
1432 1420 .with_frm_style .frm_inline_container.frm_grid_first .frm_opt_container,
@@ -1461,9 +1449,11 @@
1461 1449 grid-column-end: span 1;
1462 1450 }
1463 1451
1464 1452 .frm_form_field .frm_checkbox,
1465 -.frm_form_field .frm_radio {
1453 +.frm_form_field .frm_checkbox + .frm_checkbox,
1454 +.frm_form_field .frm_radio,
1455 +.frm_form_field .frm_radio + .frm_radio{
1466 1456 margin-top: 0;
1467 1457 margin-bottom: 0;
1468 1458 }
1469 1459
@@ -1472,24 +1462,36 @@
1472 1462 overflow:auto;
1473 1463 }
1474 1464
1475 1465 .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);
1466 +.frm_form_field.frm_html_scroll_box{
1467 + height:100px;
1468 + overflow:auto;
1469 + background-color:<?php echo esc_html( $defaults['bg_color'] ); ?>;
1470 + background-color:var(--bg-color);
1471 + border-color:<?php echo esc_html( $defaults['border_color'] ); ?>;
1472 + border-color:var(--border-color);
1473 + border-width:<?php echo esc_html( $defaults['field_border_width'] ); ?>;
1474 + border-width:var(--field-border-width);
1475 + border-style:<?php echo esc_html( $defaults['field_border_style'] ); ?>;
1476 + border-style:var(--field-border-style);
1477 + -moz-border-radius:<?php echo esc_html( $defaults['border_radius'] ); ?>;
1478 + -webkit-border-radius:<?php echo esc_html( $defaults['border_radius'] ); ?>;
1479 + border-radius:<?php echo esc_html( $defaults['border_radius'] ); ?>;
1480 + border-radius:var(--border-radius);
1481 + width:<?php echo esc_html( $defaults['field_width'] ); ?>;
1482 + width:var(--field-width);
1483 + max-width:100%;
1484 + font-size:<?php echo esc_html( $defaults['field_font_size'] ); ?>;
1485 + font-size:var(--field-font-size);
1486 + padding:<?php echo esc_html( $defaults['field_pad'] ); ?>;
1487 + padding:var(--field-pad);
1488 + -webkit-box-sizing:border-box;
1489 + -moz-box-sizing:border-box;
1490 + box-sizing:border-box;
1491 + outline:none<?php echo esc_html( $important ); ?>;
1492 + font-weight:normal;
1493 + box-shadow:var(--box-shadow);
1492 1494 }
1493 1495
1494 1496 .frm_form_field.frm_total_big input,
1495 1497 .frm_form_field.frm_total_big textarea,
@@ -1498,8 +1500,10 @@
1498 1500 opacity:1;
1499 1501 background-color:transparent !important;
1500 1502 border:none !important;
1501 1503 font-weight:bold;
1504 + -moz-box-shadow:none;
1505 + -webkit-box-shadow:none;
1502 1506 width:auto !important;
1503 1507 height:auto !important;
1504 1508 box-shadow:none !important;
1505 1509 display:inline;
@@ -1519,8 +1523,10 @@
1519 1523 .frm_form_field.frm_total input:focus,
1520 1524 .frm_form_field.frm_total textarea:focus{
1521 1525 background-color:transparent;
1522 1526 border:none;
1527 + -moz-box-shadow:none;
1528 + -webkit-box-shadow:none;
1523 1529 box-shadow:none;
1524 1530 }
1525 1531
1526 1532 .frm_form_field.frm_label_justify .frm_primary_label{
@@ -1545,8 +1551,13 @@
1545 1551 .frm_clearfix{
1546 1552 display:block;
1547 1553 }
1548 1554
1555 +.with_frm_style .frm_repeat_sec .frm_form_field.frm_repeat_buttons .frm_icon_font::before {
1556 + color:<?php echo esc_html( $defaults['repeat_icon_color'] . $important ); ?>;
1557 + color:var(--repeat-icon-color)<?php echo esc_html( $important ); ?>;
1558 +}
1559 +
1549 1560 .with_frm_style .frm_combo_inputs_container > .frm_form_subfield-first,
1550 1561 .with_frm_style .frm_combo_inputs_container > .frm_form_subfield-middle,
1551 1562 .with_frm_style .frm_combo_inputs_container > .frm_form_subfield-last {
1552 1563 margin-bottom: 0 !important;
@@ -1551,21 +1562,12 @@
1551 1562 .with_frm_style .frm_combo_inputs_container > .frm_form_subfield-last {
1552 1563 margin-bottom: 0 !important;
1553 1564 }
1554 1565
1566 +/* Fonts */
1567 +<?php readfile( FrmAppHelper::plugin_path() . '/css/font_icons.css' ); ?>
1568 +<?php do_action( 'frm_include_front_css', compact( 'defaults' ) ); ?>
1555 1569
1556 -<?php
1557 -/**
1558 - * Call action so other plugins can add additional CSS.
1559 - *
1560 - * @param array $args {
1561 - *
1562 - * @type array $defaults
1563 - * }
1564 - */
1565 -do_action( 'frm_include_front_css', compact( 'defaults' ) );
1566 -?>
1567 -
1568 1570 /* Responsive */
1569 1571
1570 1572 @media only screen and (max-width: 900px) {
1571 1573 .frm_form_field .frm_repeat_grid .frm_form_field.frm_sixth .frm_primary_label,
@@ -1609,8 +1611,9 @@
1609 1611 max-width:302px;
1610 1612 border-right:1px solid #d3d3d3;
1611 1613 border-radius:4px;
1612 1614 box-shadow:2px 0px 4px -1px rgba(0,0,0,.08);
1615 + -moz-box-shadow:2px 0px 4px -1px rgba(0,0,0,.08);
1613 1616 }
1614 1617
1615 1618 .with_frm_style .g-recaptcha iframe,
1616 1619 .with_frm_style .frm-g-recaptcha iframe{
@@ -1616,14 +1619,7 @@
1616 1619 .with_frm_style .frm-g-recaptcha iframe{
1617 1620 width:100%;
1618 1621 }
1619 1622 }
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 -}
1627 1623 <?php
1628 1624
1629 -echo strip_tags( FrmStylesController::get_custom_css() ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
1625 +echo strip_tags( $defaults['custom_css'] ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped