PluginProbe
Formidable Forms – WordPress Form Builder for Contact Forms, Calculators, Quizzes & More / trunk
Formidable Forms – WordPress Form Builder for Contact Forms, Calculators, Quizzes & More vtrunk
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/_single_theme.css.php +134 -142 6.4.2 → trunk View file →
@@ -5,13 +5,15 @@
5 5
6 6 $settings = FrmStylesHelper::get_settings_for_output( $style );
7 7 extract( $settings ); // phpcs:ignore WordPress.PHP.DontExtract
8 8
9 -$important = empty( $important_style ) ? '' : ' !important';
9 +$is_loaded_via_ajax = $is_loaded_via_ajax ?? false;
10 +FrmStylesPreviewHelper::get_additional_preview_style( $settings, $is_loaded_via_ajax );
10 11
11 -$minus_icons = FrmStylesHelper::minus_icons();
12 -$arrow_icons = FrmStylesHelper::arrow_icons();
13 -
12 +$important = ! empty( $important_style ) ? ' !important' : '';
13 +$submit_bg_img = FrmStylesHelper::get_submit_image_bg_url( $settings );
14 +$use_chosen_js = $use_chosen_js ?? FrmStylesHelper::use_chosen_js();
15 +$pro_is_installed = $pro_is_installed ?? FrmAppHelper::pro_is_installed();
14 16 ?>
15 17 .<?php echo esc_html( $style_class ); ?>{
16 18 <?php FrmStylesHelper::output_vars( $settings, $defaults ); ?>
17 19 }
@@ -16,10 +18,10 @@
16 18 <?php FrmStylesHelper::output_vars( $settings, $defaults ); ?>
17 19 }
18 20
19 21 .frm_forms.<?php echo esc_html( $style_class ); ?>{
20 - max-width:<?php echo esc_html( $form_width . $important ); ?>;
21 - direction:<?php echo esc_html( $direction . $important ); ?>;
22 + max-width:var(--form-width)<?php echo esc_html( $important ); ?>;
23 + direction:var(--direction)<?php echo esc_html( $important ); ?>;
22 24 <?php if ( 'rtl' === $direction ) { ?>
23 25 unicode-bidi:embed;
24 26 <?php } ?>
25 27 <?php if ( $center_form ) { ?>
@@ -32,53 +34,19 @@
32 34 text-align:center;
33 35 }
34 36 <?php } ?>
35 37
36 -<?php if ( ! empty( $label_color ) ) { ?>
37 -.<?php echo esc_html( $style_class ); ?> .frm_icon_font{
38 - color:<?php echo esc_html( $label_color . $important ); ?>;
39 -}
40 -<?php } ?>
41 -
42 -.<?php echo esc_html( $style_class ); ?> .frm_icon_font.frm_minus_icon:before{
43 - content:"\e<?php echo esc_html( isset( $minus_icons[ $repeat_icon ] ) ? $minus_icons[ $repeat_icon ]['-'] : $minus_icons[1]['-'] ); ?>";
44 -}
45 -
46 -.<?php echo esc_html( $style_class ); ?> .frm_icon_font.frm_plus_icon:before{
47 - content:"\e<?php echo esc_html( isset( $minus_icons[ $repeat_icon ] ) ? $minus_icons[ $repeat_icon ]['+'] : $minus_icons[1]['+'] ); ?>";
48 -}
49 -
50 -.<?php echo esc_html( $style_class ); ?> .frm_icon_font.frm_minus_icon:before,
51 -.<?php echo esc_html( $style_class ); ?> .frm_icon_font.frm_plus_icon:before{
52 - <?php if ( ! empty( $submit_text_color ) ) { ?>
53 - color:<?php echo esc_html( $submit_text_color . $important ); ?>;
54 - <?php } ?>
55 - vertical-align:middle;
56 -}
57 -
58 -.<?php echo esc_html( $style_class ); ?> .frm_trigger.active .frm_icon_font.frm_arrow_icon:before{
59 - content:"\e<?php echo esc_html( isset( $arrow_icons[ $collapse_icon ] ) ? $arrow_icons[ $collapse_icon ]['-'] : $arrow_icons[1]['-'] ); ?>";
60 - <?php if ( ! empty( $section_color ) ) { ?>
61 - color:<?php echo esc_html( $section_color . $important ); ?>;
62 - <?php } ?>
63 -}
64 -
65 -.<?php echo esc_html( $style_class ); ?> .frm_trigger .frm_icon_font.frm_arrow_icon:before{
66 - content:"\e<?php echo esc_html( isset( $arrow_icons[ $collapse_icon ] ) ? $arrow_icons[ $collapse_icon ]['+'] : $arrow_icons[1]['+'] ); ?>";
67 - <?php if ( ! empty( $section_color ) ) { ?>
68 - color:<?php echo esc_html( $section_color . $important ); ?>;
69 - <?php } ?>
70 -}
71 -
72 38 <?php if ( ! empty( $field_margin ) ) { ?>
73 39 .<?php echo esc_html( $style_class ); ?> .form-field{
74 - margin-bottom:<?php echo esc_html( $field_margin . $important ); ?>;
40 + margin-bottom:var(--field-margin)<?php echo esc_html( $important ); ?>;
75 41 }
76 42 <?php } ?>
77 43
44 +<?php if ( $pro_is_installed ) { ?>
78 45 .<?php echo esc_html( $style_class ); ?> .form-field.frm_section_heading{
79 46 margin-bottom:0<?php echo esc_html( $important ); ?>;
80 47 }
48 +<?php } ?>
81 49
82 50 .<?php echo esc_html( $style_class ); ?> p.description,
83 51 .<?php echo esc_html( $style_class ); ?> div.description,
84 52 .<?php echo esc_html( $style_class ); ?> div.frm_description,
@@ -86,12 +54,14 @@
86 54 .<?php echo esc_html( $style_class ); ?> .frm_error,
87 55 .<?php echo esc_html( $style_class ); ?> .frm_pro_max_limit_desc{
88 56 <?php if ( ! empty( $description_margin ) ) { ?>
89 57 margin:<?php echo esc_html( $description_margin . $important ); ?>;
58 + <?php } else { ?>
59 + margin-top: 6px;
90 60 <?php } ?>
91 61 padding:0;
92 62 <?php if ( ! empty( $font ) ) { ?>
93 - font-family:<?php echo FrmAppHelper::kses( $font . $important ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
63 + font-family:<?php FrmAppHelper::kses_echo( $font . $important ); ?>;
94 64 <?php } ?>
95 65 <?php if ( ! empty( $description_font_size ) ) { ?>
96 66 font-size:<?php echo esc_html( $description_font_size . $important ); ?>;
97 67 <?php } ?>
@@ -112,10 +82,8 @@
112 82
113 83 /* Left and right labels */
114 84 <?php
115 85
116 -$frm_settings = FrmAppHelper::get_settings();
117 -
118 86 if ( '' === $field_height || 'auto' === $field_height ) {
119 87 foreach ( array( 'left', 'right', 'inline' ) as $alignit ) {
120 88 ?>
121 89 .<?php echo esc_html( $style_class ); ?> .frm_<?php echo esc_html( $alignit ); ?>_container input[type=text],
@@ -140,12 +108,8 @@
140 108 .<?php echo esc_html( $style_class ); ?> .frm_form_field.frm_right_container{
141 109 grid-template-columns: auto <?php echo esc_html( $width ); ?>;
142 110 }
143 111
144 -.frm_form_field.frm_right_container{
145 - grid-template-columns: auto 25%;
146 -}
147 -
148 112 .<?php echo esc_html( $style_class ); ?> .frm_inline_container.frm_dynamic_select_container .frm_data_container,
149 113 .<?php echo esc_html( $style_class ); ?> .frm_inline_container.frm_dynamic_select_container .frm_opt_container{
150 114 display:inline<?php echo esc_html( $important ); ?>;
151 115 }
@@ -151,9 +115,9 @@
151 115 }
152 116
153 117 .<?php echo esc_html( $style_class ); ?> .frm_pos_right{
154 118 display:inline<?php echo esc_html( $important ); ?>;
155 - width:<?php echo esc_html( $width . $important ); ?>;
119 + width:var(--width)<?php echo esc_html( $important ); ?>;
156 120 }
157 121
158 122 .<?php echo esc_html( $style_class ); ?> .frm_none_container .frm_primary_label,
159 123 .<?php echo esc_html( $style_class ); ?> .frm_pos_none{
@@ -159,15 +123,15 @@
159 123 .<?php echo esc_html( $style_class ); ?> .frm_pos_none{
160 124 display:none<?php echo esc_html( $important ); ?>;
161 125 }
162 126
163 -<?php if ( FrmAppHelper::pro_is_installed() ) : ?>
127 +<?php if ( $pro_is_installed ) : ?>
164 128 .<?php echo esc_html( $style_class ); ?> .frm_scale label{
165 129 <?php if ( ! empty( $check_weight ) ) { ?>
166 130 font-weight:<?php echo esc_html( $check_weight . $important ); ?>;
167 131 <?php } ?>
168 132 <?php if ( ! empty( $font ) ) { ?>
169 - font-family:<?php echo FrmAppHelper::kses( $font . $important ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
133 + font-family:<?php FrmAppHelper::kses_echo( $font . $important ); ?>;
170 134 <?php } ?>
171 135 <?php if ( ! empty( $check_font_size ) ) { ?>
172 136 font-size:<?php echo esc_html( $check_font_size . $important ); ?>;
173 137 <?php } ?>
@@ -176,44 +140,28 @@
176 140 <?php } ?>
177 141 }
178 142 <?php endif; ?>
179 143
180 -/* These do not work if they are combined */
181 144 .<?php echo esc_html( $style_class ); ?> input::placeholder,
182 145 .<?php echo esc_html( $style_class ); ?> textarea::placeholder{
183 - color: <?php echo esc_html( $text_color_disabled . $important ); ?>;
146 + color:var(--text-color-disabled)<?php echo esc_html( $important ); ?>;
184 147 }
185 -.<?php echo esc_html( $style_class ); ?> input::-webkit-input-placeholder,
186 -.<?php echo esc_html( $style_class ); ?> textarea::-webkit-input-placeholder{
187 - color: <?php echo esc_html( $text_color_disabled . $important ); ?>;
188 -}
189 -.<?php echo esc_html( $style_class ); ?> input::-moz-placeholder,
190 -.<?php echo esc_html( $style_class ); ?> textarea::-moz-placeholder{
191 - color: <?php echo esc_html( $text_color_disabled . $important ); ?>;
192 - opacity: 1;
193 -}
194 -.<?php echo esc_html( $style_class ); ?> input:-ms-input-placeholder,
195 -<?php echo esc_html( $style_class ); ?> textarea:-ms-input-placeholder{
196 - color: <?php echo esc_html( $text_color_disabled . $important ); ?>;
197 -}
198 -.<?php echo esc_html( $style_class ); ?> input:-moz-placeholder,
199 -.<?php echo esc_html( $style_class ); ?> textarea:-moz-placeholder{
200 - color: <?php echo esc_html( $text_color_disabled . $important ); ?>;
201 -}
202 148
203 149 .<?php echo esc_html( $style_class ); ?> .frm_default,
204 150 .<?php echo esc_html( $style_class ); ?> input.frm_default,
205 151 .<?php echo esc_html( $style_class ); ?> textarea.frm_default,
206 152 .<?php echo esc_html( $style_class ); ?> select.frm_default,
207 -.<?php echo esc_html( $style_class ); ?> .placeholder,
153 +<?php if ( $use_chosen_js ) { ?>
208 154 .<?php echo esc_html( $style_class ); ?> .chosen-container-multi .chosen-choices li.search-field .default,
209 -.<?php echo esc_html( $style_class ); ?> .chosen-container-single .chosen-default{
210 - color: <?php echo esc_html( $text_color_disabled . $important ); ?>;
155 +.<?php echo esc_html( $style_class ); ?> .chosen-container-single .chosen-default,
156 +<?php } ?>
157 +.<?php echo esc_html( $style_class ); ?> .placeholder {
158 + color:var(--text-color-disabled)<?php echo esc_html( $important ); ?>;
211 159 }
212 160
213 -.<?php echo esc_html( $style_class ); ?> .form-field input:not([type=file]):focus,
161 +.<?php echo esc_html( $style_class ); ?> .form-field input:not([type=file]):not([type=range]):not([readonly]):focus,
214 162 .<?php echo esc_html( $style_class ); ?> select:focus,
215 -.<?php echo esc_html( $style_class ); ?> textarea:focus,
163 +.<?php echo esc_html( $style_class ); ?> .form-field textarea:focus,
216 164 .<?php echo esc_html( $style_class ); ?> .frm_focus_field input[type=text],
217 165 .<?php echo esc_html( $style_class ); ?> .frm_focus_field input[type=password],
218 166 .<?php echo esc_html( $style_class ); ?> .frm_focus_field input[type=email],
219 167 .<?php echo esc_html( $style_class ); ?> .frm_focus_field input[type=number],
@@ -220,32 +168,44 @@
220 168 .<?php echo esc_html( $style_class ); ?> .frm_focus_field input[type=url],
221 169 .<?php echo esc_html( $style_class ); ?> .frm_focus_field input[type=tel],
222 170 .<?php echo esc_html( $style_class ); ?> .frm_focus_field input[type=search],
223 171 .frm_form_fields_active_style,
224 -.<?php echo esc_html( $style_class ); ?> .frm_focus_field .frm-card-element.StripeElement,
172 +<?php if ( $use_chosen_js ) { ?>
225 173 .<?php echo esc_html( $style_class ); ?> .chosen-container-single.chosen-container-active .chosen-single,
226 -.<?php echo esc_html( $style_class ); ?> .chosen-container-active .chosen-choices{
227 - background-color:<?php echo esc_html( $bg_color_active . $important ); ?>;
228 - border-color:<?php echo esc_html( $border_color_active . $important ); ?>;
229 - color: var(--text-color);
230 - <?php if ( isset( $remove_box_shadow_active ) && $remove_box_shadow_active ) { ?>
174 +.<?php echo esc_html( $style_class ); ?> .chosen-container-active .chosen-choices,
175 +<?php } ?>
176 +.<?php echo esc_html( $style_class ); ?> .frm_focus_field .frm-card-element.StripeElement {
177 + background-color:var(--bg-color-active)<?php echo esc_html( $important ); ?>;
178 + border-color:var(--border-color-active)<?php echo esc_html( $important ); ?>;
179 + color:var(--text-color);
180 + <?php if ( ! empty( $remove_box_shadow_active ) ) { ?>
231 181 box-shadow:none;
232 182 outline: none;
233 183 <?php } else { ?>
234 - box-shadow:0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(<?php echo esc_html( FrmStylesHelper::hex2rgb( $border_color_active ) ); ?>, 0.6);
184 + box-shadow:0px 0px 5px 0px rgba(<?php echo esc_html( FrmStylesHelper::hex2rgb( $border_color_active ) ); ?>, 0.6);
235 185 <?php } ?>
236 186 }
237 187
188 +.<?php echo esc_html( $style_class ); ?> input:-webkit-autofill {
189 + <?php if ( ! empty( $remove_box_shadow_active ) ) { ?>
190 + -webkit-box-shadow: none<?php echo esc_html( $important ); ?>;
191 + <?php } else { ?>
192 + -webkit-box-shadow: 0px 0px 5px 0px rgba(<?php echo esc_html( FrmStylesHelper::hex2rgb( $border_color_active ) ); ?>, 0.6);
193 + <?php } ?>
194 +}
195 +
238 196 <?php if ( ! $submit_style ) { ?>
197 + <?php if ( $pro_is_installed ) { ?>
239 198 .<?php echo esc_html( $style_class ); ?> .frm_compact .frm_dropzone.dz-clickable .dz-message,
199 +.<?php echo esc_html( $style_class ); ?> .frm-edit-page-btn,
200 + <?php } ?>
240 201 .<?php echo esc_html( $style_class ); ?> input[type=submit],
241 202 .<?php echo esc_html( $style_class ); ?> .frm_submit input[type=button],
242 203 .<?php echo esc_html( $style_class ); ?> .frm_submit button,
243 -.frm_form_submit_style,
244 -.<?php echo esc_html( $style_class ); ?> .frm-edit-page-btn {
245 - width:<?php echo esc_html( ( $submit_width == '' ? 'auto' : $submit_width ) . $important ); ?>;
204 +.frm_form_submit_style {
205 + width:<?php echo esc_html( ( $submit_width == '' ? 'auto' : $submit_width ) . $important ); // phpcs:ignore Universal.Operators.StrictComparisons ?>;
246 206 <?php if ( ! empty( $font ) ) { ?>
247 - font-family:<?php echo FrmAppHelper::kses( $font ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
207 + font-family:<?php FrmAppHelper::kses_echo( $font ); ?>;
248 208 <?php } ?>
249 209 font-size:<?php echo esc_html( $submit_font_size . $important ); ?>;
250 210 height:<?php echo esc_html( $submit_height . $important ); ?>;
251 211 line-height:normal<?php echo esc_html( $important ); ?>;
@@ -252,37 +212,34 @@
252 212 text-align:center;
253 213 background:
254 214 <?php
255 215 echo esc_html( $submit_bg_color );
256 - if ( ! empty( $submit_bg_img ) ) {
216 +
217 + if ( $submit_bg_img ) {
257 218 echo esc_html( ' url(' . $submit_bg_img . ')' );
258 219 }
259 220 echo esc_html( $important );
260 221 ?>
261 222 ;
223 + <?php if ( '' !== $submit_border_width ) : ?>
262 224 border-width:<?php echo esc_html( $submit_border_width ); ?>;
225 + <?php endif; ?>
263 226 border-color: <?php echo esc_html( $submit_border_color . $important ); ?>;
264 227 border-style:solid;
265 228 color:<?php echo esc_html( $submit_text_color . $important ); ?>;
266 229 cursor:pointer;
267 230 font-weight:<?php echo esc_html( $submit_weight . $important ); ?>;
268 - -moz-border-radius:<?php echo esc_html( $submit_border_radius . $important ); ?>;
269 - -webkit-border-radius:<?php echo esc_html( $submit_border_radius . $important ); ?>;
270 231 border-radius:<?php echo esc_html( $submit_border_radius . $important ); ?>;
271 232 text-shadow:none;
272 233 padding:<?php echo esc_html( $submit_padding . $important ); ?>;
273 - -moz-box-sizing:border-box;
274 234 box-sizing:border-box;
275 - -ms-box-sizing:border-box;
276 235 <?php if ( ! empty( $submit_shadow_color ) ) { ?>
277 - -moz-box-shadow:0 1px 1px <?php echo esc_html( $submit_shadow_color ); ?>;
278 - -webkit-box-shadow:0 1px 1px <?php echo esc_html( $submit_shadow_color ); ?>;
279 236 box-shadow:0 1px 1px <?php echo esc_html( $submit_shadow_color ); ?>;
280 237 <?php } ?>
281 238 margin:<?php echo esc_html( $submit_margin ); ?>;
282 239 <?php
283 240 // For reverse compatibility... But allow "10px 10px".
284 - if ( strpos( trim( $submit_margin ), ' ' ) === false ) {
241 + if ( ! str_contains( trim( $submit_margin ), ' ' ) ) {
285 242 ?>
286 243 margin-left:0;
287 244 margin-right:0;
288 245 <?php } ?>
@@ -288,27 +245,33 @@
288 245 <?php } ?>
289 246 vertical-align:middle;
290 247 }
291 248
249 + <?php if ( $pro_is_installed ) { ?>
292 250 .<?php echo esc_html( $style_class ); ?> .frm_compact .frm_dropzone.dz-clickable .dz-message{
293 251 margin:0;
294 252 }
253 + <?php } ?>
295 254
296 - <?php if ( empty( $submit_bg_img ) ) { ?>
255 + <?php if ( ! $submit_bg_img ) { ?>
256 + <?php if ( $pro_is_installed ) { ?>
297 257 .<?php echo esc_html( $style_class ); ?> .frm-edit-page-btn:hover,
258 + <?php } ?>
298 259 .<?php echo esc_html( $style_class ); ?> input[type=submit]:hover,
299 260 .<?php echo esc_html( $style_class ); ?> .frm_submit input[type=button]:hover,
300 261 .<?php echo esc_html( $style_class ); ?> .frm_submit button:hover{
301 - background: <?php echo esc_html( $submit_hover_bg_color . $important ); ?>;
302 - border-color: <?php echo esc_html( $submit_hover_border_color . $important ); ?>;
303 - color: <?php echo esc_html( $submit_hover_color . $important ); ?>;
262 + background:var(--submit-hover-bg-color)<?php echo esc_html( $important ); ?>;
263 + border-color:var(--submit-hover-border-color)<?php echo esc_html( $important ); ?>;
264 + color:var(--submit-hover-color)<?php echo esc_html( $important ); ?>;
304 265 }
305 266
306 267 .<?php echo esc_html( $style_class ); ?>.frm_center_submit .frm_submit .frm_ajax_loading{
307 - margin-bottom:<?php echo esc_html( $submit_margin ); ?>;
268 + margin-bottom:<?php echo esc_html( FrmStylesHelper::get_bottom_value( $submit_margin ) ); ?>;
308 269 }
309 270
271 + <?php if ( $pro_is_installed ) { ?>
310 272 .<?php echo esc_html( $style_class ); ?> .frm-edit-page-btn:focus,
273 + <?php } ?>
311 274 .<?php echo esc_html( $style_class ); ?> input[type=submit]:focus,
312 275 .<?php echo esc_html( $style_class ); ?> .frm_submit input[type=button]:focus,
313 276 .<?php echo esc_html( $style_class ); ?> .frm_submit button:focus,
314 277 .<?php echo esc_html( $style_class ); ?> input[type=submit]:active,
@@ -313,40 +276,51 @@
313 276 .<?php echo esc_html( $style_class ); ?> .frm_submit button:focus,
314 277 .<?php echo esc_html( $style_class ); ?> input[type=submit]:active,
315 278 .<?php echo esc_html( $style_class ); ?> .frm_submit input[type=button]:active,
316 279 .<?php echo esc_html( $style_class ); ?> .frm_submit button:active{
317 - background: <?php echo esc_html( $submit_active_bg_color . $important ); ?>;
318 - border-color: <?php echo esc_html( $submit_active_border_color . $important ); ?>;
319 - color: <?php echo esc_html( $submit_active_color . $important ); ?>;
280 + background:var(--submit-active-bg-color)<?php echo esc_html( $important ); ?>;
281 + border-color:var(--submit-active-border-color)<?php echo esc_html( $important ); ?>;
282 + color:var(--submit-active-color)<?php echo esc_html( $important ); ?>;
320 283 outline: none;
321 284 }
322 285
286 + <?php if ( $pro_is_installed ) { ?>
323 287 .<?php echo esc_html( $style_class ); ?> .frm_loading_prev .frm_prev_page,
324 288 .<?php echo esc_html( $style_class ); ?> .frm_loading_prev .frm_prev_page:hover,
325 289 .<?php echo esc_html( $style_class ); ?> .frm_loading_prev .frm_prev_page:active,
326 290 .<?php echo esc_html( $style_class ); ?> .frm_loading_prev .frm_prev_page:focus,
291 + <?php } ?>
327 292 .<?php echo esc_html( $style_class ); ?> .frm_loading_form .frm_button_submit,
328 293 .<?php echo esc_html( $style_class ); ?> .frm_loading_form .frm_button_submit:hover,
329 294 .<?php echo esc_html( $style_class ); ?> .frm_loading_form .frm_button_submit:active,
330 295 .<?php echo esc_html( $style_class ); ?> .frm_loading_form .frm_button_submit:focus{
331 - color: transparent <?php echo esc_html( $important ); ?>;
332 - background: <?php echo esc_html( $submit_bg_color . $important ); ?>;
296 + color: transparent<?php echo esc_html( $important ); ?>;
297 + background:var(--submit-bg-color)<?php echo esc_html( $important ); ?>;
298 + border-color:var(--submit-bg-color)<?php echo esc_html( $important ); ?>;
333 299 }
334 300
301 + <?php if ( $pro_is_installed ) { ?>
335 302 .<?php echo esc_html( $style_class ); ?> .frm_loading_prev .frm_prev_page:before,
303 + <?php } ?>
336 304 .<?php echo esc_html( $style_class ); ?> .frm_loading_form .frm_button_submit:before {
337 - border-bottom-color: <?php echo esc_html( $submit_text_color . $important ); ?>;
338 - border-right-color: <?php echo esc_html( $submit_text_color . $important ); ?>;
305 + border-bottom-color:var(--submit-text-color)<?php echo esc_html( $important ); ?>;
306 + border-right-color:var(--submit-text-color)<?php echo esc_html( $important ); ?>;
339 307 <?php if ( $submit_height !== 'auto' ) { ?>
340 - max-height:<?php echo esc_html( $submit_height ); ?>;
308 + max-height:var(--submit-height)<?php echo esc_html( $important ); ?>;
341 309 <?php } ?>
342 310 <?php if ( $submit_width !== 'auto' ) { ?>
343 - max-width:<?php echo esc_html( $submit_width ); ?>;
311 + max-width:var(--submit-width)<?php echo esc_html( $important ); ?>;
344 312 <?php } ?>
345 313 }
314 +.<?php echo esc_html( $style_class ); ?> input[type=submit][disabled],
315 +.<?php echo esc_html( $style_class ); ?> .frm_submit input[type=button][disabled],
316 +.<?php echo esc_html( $style_class ); ?> .frm_submit button[disabled] {
317 + opacity: 0.5;
318 + cursor: not-allowed;
319 +}
346 320 <?php
347 - }
348 -}
321 + }//end if
322 +}//end if
349 323 ?>
350 324
351 325 .<?php echo esc_html( $style_class ); ?>.frm_inline_top .frm_submit::before,
352 326 .<?php echo esc_html( $style_class ); ?> .frm_submit.frm_inline_submit::before {
@@ -351,15 +325,15 @@
351 325 .<?php echo esc_html( $style_class ); ?>.frm_inline_top .frm_submit::before,
352 326 .<?php echo esc_html( $style_class ); ?> .frm_submit.frm_inline_submit::before {
353 327 content:"before";
354 328 <?php if ( ! empty( $font ) ) { ?>
355 - font-family:<?php echo FrmAppHelper::kses( $font ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
329 + font-family:<?php FrmAppHelper::kses_echo( $font ); ?>;
356 330 <?php } ?>
357 - font-size:<?php echo esc_html( $font_size . $important ); ?>;
358 - color:<?php echo esc_html( $label_color . $important ); ?>;
359 - font-weight:<?php echo esc_html( $weight . $important ); ?>;
331 + font-size:var(--font-size)<?php echo esc_html( $important ); ?>;
332 + color:var(--label-color)<?php echo esc_html( $important ); ?>;
333 + font-weight:var(--weight)<?php echo esc_html( $important ); ?>;
360 334 margin:0;
361 - padding:<?php echo esc_html( $label_padding . $important ); ?>;
335 + padding:var(--label-padding)<?php echo esc_html( $important ); ?>;
362 336 width:auto;
363 337 display:block;
364 338 visibility:hidden;
365 339 }
@@ -370,17 +344,24 @@
370 344 .<?php echo esc_html( $style_class ); ?> .frm_submit.frm_inline_submit button {
371 345 margin: 0 !important;
372 346 }
373 347
348 +<?php
349 +// Only include this CSS when the math captcha plugin is active.
350 +if ( class_exists( 'FrmCptController' ) ) :
351 + ?>
374 352 .<?php echo esc_html( $style_class ); ?> #frm_field_cptch_number_container{
375 353 <?php if ( ! empty( $font ) ) { ?>
376 - font-family:<?php echo FrmAppHelper::kses( $font ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
354 + font-family:<?php FrmAppHelper::kses_echo( $font ); ?>;
377 355 <?php } ?>
378 - font-size:<?php echo esc_html( $font_size . $important ); ?>;
379 - color:<?php echo esc_html( $label_color . $important ); ?>;
380 - font-weight:<?php echo esc_html( $weight . $important ); ?>;
356 + font-size:var(--font-size)<?php echo esc_html( $important ); ?>;
357 + color:var(--label-color)<?php echo esc_html( $important ); ?>;
358 + font-weight:var(--weight)<?php echo esc_html( $important ); ?>;
381 359 clear:both;
382 360 }
361 + <?php
362 +endif;
363 +?>
383 364
384 365 .<?php echo esc_html( $style_class ); ?> .frm_blank_field input[type=text],
385 366 .<?php echo esc_html( $style_class ); ?> .frm_blank_field input[type=password],
386 367 .<?php echo esc_html( $style_class ); ?> .frm_blank_field input[type=url],
@@ -386,57 +367,67 @@
386 367 .<?php echo esc_html( $style_class ); ?> .frm_blank_field input[type=url],
387 368 .<?php echo esc_html( $style_class ); ?> .frm_blank_field input[type=tel],
388 369 .<?php echo esc_html( $style_class ); ?> .frm_blank_field input[type=number],
389 370 .<?php echo esc_html( $style_class ); ?> .frm_blank_field input[type=email],
371 +.<?php echo esc_html( $style_class ); ?> .frm_blank_field input[type=checkbox],
372 +.<?php echo esc_html( $style_class ); ?> .frm_blank_field input[type=radio],
390 373 .<?php echo esc_html( $style_class ); ?> .frm_blank_field textarea,
374 +<?php if ( $pro_is_installed ) { ?>
391 375 .<?php echo esc_html( $style_class ); ?> .frm_blank_field .mce-edit-area iframe,
376 +<?php } ?>
392 377 .<?php echo esc_html( $style_class ); ?> .frm_blank_field select:not(.ui-datepicker-month):not(.ui-datepicker-year),
393 378 .frm_form_fields_error_style,
394 379 .<?php echo esc_html( $style_class ); ?> .frm_blank_field .frm-g-recaptcha iframe,
395 380 .<?php echo esc_html( $style_class ); ?> .frm_blank_field .g-recaptcha iframe,
396 381 .<?php echo esc_html( $style_class ); ?> .frm_blank_field .frm-card-element.StripeElement,
382 +<?php if ( $use_chosen_js ) { ?>
397 383 .<?php echo esc_html( $style_class ); ?> .frm_blank_field .chosen-container-multi .chosen-choices,
398 384 .<?php echo esc_html( $style_class ); ?> .frm_blank_field .chosen-container-single .chosen-single,
399 -.<?php echo esc_html( $style_class ); ?> .frm_form_field :invalid{
400 - color:<?php echo esc_html( $text_color_error . $important ); ?>;
401 - background-color:<?php echo esc_html( $bg_color_error . $important ); ?>;
402 - border-color:<?php echo esc_html( $border_color_error . $important ); ?>;
403 - border-width:<?php echo esc_html( $border_width_error . $important ); ?>;
404 - border-style:<?php echo esc_html( $border_style_error . $important ); ?>;
385 +<?php } ?>
386 +.<?php echo esc_html( $style_class ); ?> .frm_form_field :invalid {
387 + color:var(--text-color-error)<?php echo esc_html( $important ); ?>;
388 + background-color:var(--bg-color-error)<?php echo esc_html( $important ); ?>;
389 + border-color:var(--border-color-error)<?php echo esc_html( $important ); ?>;
390 + border-width:var(--border-width-error)<?php echo esc_html( $important ); ?>;
391 + border-style:var(--border-style-error)<?php echo esc_html( $important ); ?>;
405 392 }
406 393
394 +<?php
395 +// Only include this style when the signatures add-on is active
396 +if ( class_exists( 'FrmSigField' ) ) :
397 + ?>
407 398 .<?php echo esc_html( $style_class ); ?> .frm_blank_field .sigWrapper{
408 - border-color:<?php echo esc_html( $border_color_error ); ?> !important;
399 + border-color:var(--border-color-error) !important;
409 400 }
401 + <?php
402 +endif;
403 +?>
410 404
411 405 .<?php echo esc_html( $style_class ); ?> .frm_error,
412 406 .<?php echo esc_html( $style_class ); ?> .frm_limit_error{
413 - font-weight:<?php echo esc_html( $weight . $important ); ?>;
407 + font-weight:var(--weight)<?php echo esc_html( $important ); ?>;
408 + color:var(--border-color-error)<?php echo esc_html( $important ); ?>;
414 409 }
415 410
416 -.<?php echo esc_html( $style_class ); ?> .frm_blank_field label,
417 -.<?php echo esc_html( $style_class ); ?> .frm_error,
418 -.<?php echo esc_html( $style_class ); ?> .frm_limit_error{
419 - color:<?php echo esc_html( $border_color_error . $important ); ?>;
420 -}
421 -
422 411 .<?php echo esc_html( $style_class ); ?> .frm_error_style{
423 - background-color:<?php echo esc_html( $error_bg . $important ); ?>;
424 - border:1px solid <?php echo esc_html( $error_border . $important ); ?>;
425 - border-radius:<?php echo esc_html( $border_radius . $important ); ?>;
426 - color: <?php echo esc_html( $error_text . $important ); ?>;
427 - font-size:<?php echo esc_html( $error_font_size . $important ); ?>;
412 + background-color:var(--error-bg)<?php echo esc_html( $important ); ?>;
413 + border:1px solid var(--error-border)<?php echo esc_html( $important ); ?>;
414 + border-radius:var(--border-radius)<?php echo esc_html( $important ); ?>;
415 + color:var(--error-text)<?php echo esc_html( $important ); ?>;
416 + font-size:var(--error-font-size)<?php echo esc_html( $important ); ?>;
428 417 margin:0;
429 - margin-bottom:<?php echo esc_html( $field_margin ); ?>;
418 + margin-bottom:var(--field-margin);
430 419 }
431 420
421 +<?php if ( $pro_is_installed ) { ?>
432 422 .<?php echo esc_html( $style_class ); ?> #frm_loading .progress-striped .progress-bar{
433 423 background-image:linear-gradient(45deg, <?php echo esc_html( $border_color ); ?> 25%, rgba(0, 0, 0, 0) 25%, rgba(0, 0, 0, 0) 50%, <?php echo esc_html( $border_color ); ?> 50%, <?php echo esc_html( $border_color ); ?> 75%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0));
434 424 }
435 425
436 426 .<?php echo esc_html( $style_class ); ?> #frm_loading .progress-bar{
437 - background-color:<?php echo esc_html( $bg_color . $important ); ?>;
427 + background-color:var(--bg-color)<?php echo esc_html( $important ); ?>;
438 428 }
429 +<?php } ?>
439 430
440 431 .<?php echo esc_html( $style_class ); ?> .frm_form_field.frm_total_big input,
441 432 .<?php echo esc_html( $style_class ); ?> .frm_form_field.frm_total_big textarea,
442 433 .<?php echo esc_html( $style_class ); ?> .frm_form_field.frm_total input,
@@ -448,5 +439,6 @@
448 439 width:auto<?php echo esc_html( $important ); ?>;
449 440 padding:0<?php echo esc_html( $important ); ?>;
450 441 }
451 442
443 +<?php echo strip_tags( FrmStylesController::get_custom_css( $settings ) ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
452 444 <?php do_action( 'frm_output_single_style', $settings ); ?>