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/custom_theme.css.php +368 -459 6.5.3 → trunk View file →
@@ -6,9 +6,9 @@
6 6 if ( ! isset( $saving ) ) {
7 7 header( 'Content-type: text/css' );
8 8
9 9 if ( ! empty( $css ) ) {
10 - echo strip_tags( $css, 'all' ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
10 + echo strip_tags( FrmStylesHelper::maybe_scope_custom_css_in_cached_output( $css ) ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
11 11 FrmStylesController::maybe_hide_sample_form_error_message();
12 12 die();
13 13 }
14 14 }
@@ -16,12 +16,20 @@
16 16 if ( ! isset( $frm_style ) ) {
17 17 $frm_style = new FrmStyle();
18 18 }
19 19
20 -$styles = $frm_style->get_all();
21 -$default_style = $frm_style->get_default_style( $styles );
20 +$styles = $frm_style->get_all();
21 +$default_style = $frm_style->get_default_style( $styles );
22 +$pro_is_installed = FrmAppHelper::pro_is_installed();
23 +
24 +if ( ! $pro_is_installed && $default_style ) {
25 + // Per-form styles are a Pro feature, so only the default style is ever used without Pro.
26 + $styles = array( $default_style->ID => $default_style );
27 +}
28 +
22 29 $defaults = FrmStylesHelper::get_settings_for_output( $default_style );
23 -$important = empty( $defaults['important_style'] ) ? '' : ' !important';
30 +$important = ! empty( $defaults['important_style'] ) ? ' !important' : '';
31 +$use_chosen_js = FrmStylesHelper::use_chosen_js();
24 32
25 33 ?>
26 34 .with_frm_style{
27 35 <?php FrmStylesHelper::output_vars( $defaults ); ?>
@@ -36,12 +44,12 @@
36 44
37 45 .with_frm_style,
38 46 .with_frm_style form,
39 47 .with_frm_style .frm-show-form div.frm_description p{
40 - text-align:<?php echo esc_html( $defaults['form_align'] . $important ); ?>;
41 - text-align:var(--form-align)<?php echo esc_html( $important ); ?>;
48 + text-align: var(--form-align)<?php echo esc_html( $important ); ?>;
42 49 }
43 50
51 +/* Keep this. This is used for Honeypot */
44 52 input:-webkit-autofill {
45 53 -webkit-box-shadow: 0 0 0 30px white inset;
46 54 }
47 55
@@ -47,36 +55,24 @@
47 55
48 56 /* Form description */
49 57 .with_frm_style .frm-show-form div.frm_description p{
50 58 <?php if ( ! empty( $defaults['form_desc_size'] ) ) { ?>
51 - font-size:<?php echo esc_html( $defaults['form_desc_size'] . $important ); ?>;
52 - font-size:var(--form-desc-size)<?php echo esc_html( $important ); ?>;
59 + font-size: var(--form-desc-size)<?php echo esc_html( $important ); ?>;
53 60 <?php } ?>
54 61 <?php if ( ! empty( $defaults['form_desc_color'] ) ) { ?>
55 - color:<?php echo esc_html( $defaults['form_desc_color'] . $important ); ?>;
56 - color:var(--form-desc-color)<?php echo esc_html( $important ); ?>;
62 + color: var(--form-desc-color)<?php echo esc_html( $important ); ?>;
57 63 <?php } ?>
58 64 <?php if ( ! empty( $defaults['form_desc_margin_top'] ) ) { ?>
59 - margin-top:<?php echo esc_html( $defaults['form_desc_margin_top'] . $important ); ?>;
60 - margin-top:var(--form-desc-margin-top)<?php echo esc_html( $important ); ?>;
65 + margin-top: var(--form-desc-margin-top)<?php echo esc_html( $important ); ?>;
61 66 <?php } ?>
62 67 <?php if ( ! empty( $defaults['form_desc_margin_bottom'] ) ) { ?>
63 - margin-bottom:<?php echo esc_html( $defaults['form_desc_margin_bottom'] . $important ); ?>;
64 - margin-bottom:var(--form-desc-margin-bottom)<?php echo esc_html( $important ); ?>;
68 + margin-bottom: var(--form-desc-margin-bottom)<?php echo esc_html( $important ); ?>;
65 69 <?php } ?>
66 70 <?php if ( isset( $defaults['form_desc_padding'] ) ) { ?>
67 - padding:<?php echo esc_html( $defaults['form_desc_padding'] . $important ); ?>;
68 - padding:var(--form-desc-padding)<?php echo esc_html( $important ); ?>;
71 + padding: var(--form-desc-padding)<?php echo esc_html( $important ); ?>;
69 72 <?php } ?>
70 73 }
71 74
72 -form .<?php echo esc_html( FrmHoneypot::generate_class_name() ); ?> {
73 - overflow: hidden;
74 - width: 0;
75 - height: 0;
76 - position: absolute;
77 -}
78 -
79 75 .with_frm_style fieldset{
80 76 min-width:0;
81 77 display: block; /* Override 2021 theme */
82 78 }
@@ -89,24 +85,20 @@
89 85 }
90 86
91 87 .with_frm_style .frm_form_fields > fieldset{
92 88 <?php if ( isset( $defaults['fieldset'] ) && ( $defaults['fieldset'] || '0' === $defaults['fieldset'] ) ) { ?>
93 - border-width:<?php echo esc_html( $defaults['fieldset'] . $important ); ?>;
94 - border-width:var(--fieldset)<?php echo esc_html( $important ); ?>;
89 + border-width: var(--fieldset)<?php echo esc_html( $important ); ?>;
95 90 <?php } ?>
96 91 border-style:solid;
97 92 <?php if ( ! empty( $defaults['fieldset_color'] ) ) { ?>
98 - border-color:<?php echo esc_html( $defaults['fieldset_color'] . $important ); ?>;
99 - border-color:var(--fieldset-color)<?php echo esc_html( $important ); ?>;
93 + border-color: var(--fieldset-color)<?php echo esc_html( $important ); ?>;
100 94 <?php } ?>
101 95 margin:0;
102 96 <?php if ( ! empty( $defaults['fieldset_padding'] ) ) { ?>
103 - padding:<?php echo esc_html( $defaults['fieldset_padding'] . $important ); ?>;
104 - padding:var(--fieldset-padding)<?php echo esc_html( $important ); ?>;
97 + padding: var(--fieldset-padding)<?php echo esc_html( $important ); ?>;
105 98 <?php } ?>
106 99 <?php if ( ! empty( $defaults['fieldset_bg_color'] ) ) { ?>
107 - background-color:<?php echo esc_html( $defaults['fieldset_bg_color'] ); ?>;
108 - background-color:var(--fieldset-bg-color)<?php echo esc_html( $important ); ?>;
100 + background-color: var(--fieldset-bg-color)<?php echo esc_html( $important ); ?>;
109 101 <?php } ?>
110 102 <?php if ( ! empty( $defaults['font'] ) ) { ?>
111 103 font-family:var(--font);
112 104 <?php } ?>
@@ -130,26 +122,21 @@
130 122
131 123 .with_frm_style legend + h3,
132 124 .with_frm_style h3.frm_form_title{
133 125 <?php if ( ! empty( $defaults['title_size'] ) ) { ?>
134 - font-size:<?php echo esc_html( $defaults['title_size'] . $important ); ?>;
135 - font-size:var(--title-size)<?php echo esc_html( $important ); ?>;
126 + font-size: var(--title-size)<?php echo esc_html( $important ); ?>;
136 127 <?php } ?>
137 128 <?php if ( ! empty( $defaults['title_color'] ) ) { ?>
138 - color:<?php echo esc_html( $defaults['title_color'] . $important ); ?>;
139 - color:var(--title-color)<?php echo esc_html( $important ); ?>;
129 + color: var(--title-color)<?php echo esc_html( $important ); ?>;
140 130 <?php } ?>
141 131 <?php if ( ! empty( $defaults['font'] ) ) { ?>
142 - font-family:<?php echo FrmAppHelper::kses( $defaults['font'] ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
143 - font-family:var(--font);
132 + font-family: var(--font);
144 133 <?php } ?>
145 134 <?php if ( ! empty( $defaults['title_margin_top'] ) ) { ?>
146 - margin-top:<?php echo esc_html( $defaults['title_margin_top'] . $important ); ?>;
147 - margin-top:var(--title-margin-top)<?php echo esc_html( $important ); ?>;
135 + margin-top: var(--title-margin-top)<?php echo esc_html( $important ); ?>;
148 136 <?php } ?>
149 137 <?php if ( ! empty( $defaults['title_margin_bottom'] ) ) { ?>
150 - margin-bottom:<?php echo esc_html( $defaults['title_margin_bottom'] . $important ); ?>;
151 - margin-bottom:var(--title-margin-bottom)<?php echo esc_html( $important ); ?>;
138 + margin-bottom: var(--title-margin-bottom)<?php echo esc_html( $important ); ?>;
152 139 <?php } ?>
153 140 }
154 141
155 142 .with_frm_style .frm_form_field.frm_html_container,
@@ -154,46 +141,43 @@
154 141
155 142 .with_frm_style .frm_form_field.frm_html_container,
156 143 .with_frm_style .frm_form_field .frm_show_it{
157 144 <?php if ( ! empty( $defaults['font'] ) ) { ?>
158 - font-family:<?php echo FrmAppHelper::kses( $defaults['font'] ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
159 - font-family:var(--font);
145 + font-family: var(--font);
160 146 <?php } ?>
161 147 <?php if ( ! empty( $defaults['form_desc_color'] ) ) { ?>
162 - color:<?php echo esc_html( $defaults['form_desc_color'] . $important ); ?>;
163 - color:var(--form-desc-color)<?php echo esc_html( $important ); ?>;
148 + color: var(--form-desc-color)<?php echo esc_html( $important ); ?>;
164 149 <?php } ?>
165 150 }
166 151
152 +.with_frm_style .frm_form_field.frm_html_container{
167 153 <?php if ( ! empty( $defaults['form_desc_size'] ) ) { ?>
168 -.with_frm_style .frm_form_field.frm_html_container{
169 - font-size:<?php echo esc_html( $defaults['form_desc_size'] . $important ); ?>;
170 - font-size:var(--form-desc-size)<?php echo esc_html( $important ); ?>;
154 + font-size: var(--form-desc-size)<?php echo esc_html( $important ); ?>;
155 +<?php } ?>
156 + overflow-wrap: break-word<?php echo esc_html( $important ); ?>;
171 157 }
172 -<?php } ?>
173 158
174 159 .with_frm_style .frm_form_field .frm_show_it{
175 160 <?php if ( ! empty( $defaults['field_font_size'] ) ) { ?>
176 - font-size:<?php echo esc_html( $defaults['field_font_size'] . $important ); ?>;
177 - font-size:var(--field-font-size)<?php echo esc_html( $important ); ?>;
161 + font-size: var(--field-font-size)<?php echo esc_html( $important ); ?>;
178 162 <?php } ?>
179 163 <?php if ( ! empty( $defaults['field_weight'] ) ) { ?>
180 - font-weight:<?php echo esc_html( $defaults['field_weight'] ); ?>;
181 - font-weight:var(--field-weight)<?php echo esc_html( $important ); ?>;
164 + font-weight: var(--field-weight)<?php echo esc_html( $important ); ?>;
182 165 <?php } ?>
183 166 }
184 167
185 -.with_frm_style .frm_required{
168 +.with_frm_style .frm_required {
186 169 <?php if ( ! empty( $defaults['required_color'] ) ) { ?>
187 - color:<?php echo esc_html( $defaults['required_color'] . $important ); ?>;
188 - color:var(--required-color)<?php echo esc_html( $important ); ?>;
170 + color: var(--required-color)<?php echo esc_html( $important ); ?>;
189 171 <?php } ?>
190 172 <?php if ( ! empty( $defaults['required_weight'] ) ) { ?>
191 - font-weight:<?php echo esc_html( $defaults['required_weight'] . $important ); ?>;
192 - font-weight:var(--required-weight)<?php echo esc_html( $important ); ?>;
173 + font-weight: var(--required-weight)<?php echo esc_html( $important ); ?>;
193 174 <?php } ?>
194 175 }
195 176
177 +<?php if ( $use_chosen_js ) { ?>
178 +.with_frm_style .chosen-container,
179 +<?php } ?>
196 180 .with_frm_style input[type=text],
197 181 .with_frm_style input[type=password],
198 182 .with_frm_style input[type=email],
199 183 .with_frm_style input[type=number],
@@ -201,14 +185,12 @@
201 185 .with_frm_style input[type=tel],
202 186 .with_frm_style input[type=search],
203 187 .with_frm_style select,
204 188 .with_frm_style textarea,
205 -.with_frm_style .frm-card-element.StripeElement,
206 -.with_frm_style .chosen-container{
189 +.with_frm_style .frm-card-element.StripeElement {
207 190 font-family:var(--font)<?php echo esc_html( $important ); ?>;
208 191 <?php if ( ! empty( $defaults['field_font_size'] ) ) { ?>
209 - font-size:<?php echo esc_html( $defaults['field_font_size'] ); ?>;
210 - font-size:var(--field-font-size)<?php echo esc_html( $important ); ?>;
192 + font-size: var(--field-font-size)<?php echo esc_html( $important ); ?>;
211 193 <?php } ?>
212 194 margin-bottom:0<?php echo esc_html( $important ); ?>;
213 195 }
214 196
@@ -216,8 +198,14 @@
216 198 vertical-align:top;
217 199 height:auto;
218 200 }
219 201
202 +<?php if ( $use_chosen_js ) { ?>
203 +.with_frm_style .chosen-container-multi .chosen-choices,
204 +.with_frm_style .chosen-container-single .chosen-single,
205 +<?php } elseif ( $pro_is_installed ) { ?>
206 +.with_frm_style .frm_slimselect.ss-main,
207 +<?php } ?>
220 208 .with_frm_style input[type=text],
221 209 .with_frm_style input[type=password],
222 210 .with_frm_style input[type=email],
223 211 .with_frm_style input[type=number],
@@ -230,42 +218,34 @@
230 218 .frm_form_fields_style,
231 219 .with_frm_style .frm_scroll_box .frm_opt_container,
232 220 .frm_form_fields_active_style,
233 221 .frm_form_fields_error_style,
234 -.with_frm_style .frm-card-element.StripeElement,
235 -.with_frm_style .chosen-container-multi .chosen-choices,
236 -.with_frm_style .chosen-container-single .chosen-single{
237 - color:<?php echo esc_html( $defaults['text_color'] ); ?>;
238 - color:var(--text-color)<?php echo esc_html( $important ); ?>;
239 - background-color:<?php echo esc_html( $defaults['bg_color'] . $important ); ?>;
240 - background-color:var(--bg-color)<?php echo esc_html( $important ); ?>;
241 - border-color:<?php echo esc_html( $defaults['border_color'] ); ?>;
242 - border-color:var(--border-color)<?php echo esc_html( $important ); ?>;
243 - border-width:<?php echo esc_html( $defaults['field_border_width'] ); ?>;
244 - border-width:var(--field-border-width)<?php echo esc_html( $important ); ?>;
245 - border-style:<?php echo esc_html( $defaults['field_border_style'] ); ?>;
246 - border-style:var(--field-border-style)<?php echo esc_html( $important ); ?>;
247 - -moz-border-radius:<?php echo esc_html( $defaults['border_radius'] . $important ); ?>;
248 - -webkit-border-radius:<?php echo esc_html( $defaults['border_radius'] . $important ); ?>;
249 - border-radius:<?php echo esc_html( $defaults['border_radius'] ); ?>;
250 - border-radius:var(--border-radius)<?php echo esc_html( $important ); ?>;
251 - width:<?php echo esc_html( $defaults['field_width'] ); ?>;
252 - width:var(--field-width)<?php echo esc_html( $important ); ?>;
253 - max-width:100%;
254 - font-size:<?php echo esc_html( $defaults['field_font_size'] ); ?>;
255 - font-size:var(--field-font-size)<?php echo esc_html( $important ); ?>;
256 - padding:<?php echo esc_html( $defaults['field_pad'] ); ?>;
257 - padding:var(--field-pad)<?php echo esc_html( $important ); ?>;
258 - -webkit-box-sizing:border-box;
259 - -moz-box-sizing:border-box;
260 - box-sizing:border-box;
261 - outline:none<?php echo esc_html( $important ); ?>;
262 - font-weight:<?php echo esc_html( $defaults['field_weight'] ); ?>;
263 - font-weight:var(--field-weight);
264 - box-shadow:var(--box-shadow)<?php echo esc_html( $important ); ?>;
222 +.with_frm_style .frm-card-element.StripeElement {
223 + color: var(--text-color)<?php echo esc_html( $important ); ?>;
224 + background-color: var(--bg-color)<?php echo esc_html( $important ); ?>;
225 + border-color: var(--border-color)<?php echo esc_html( $important ); ?>;
226 + border-width: var(--field-border-width)<?php echo esc_html( $important ); ?>;
227 + border-style: var(--field-border-style)<?php echo esc_html( $important ); ?>;
228 + border-radius: var(--border-radius)<?php echo esc_html( $important ); ?>;
229 + width: var(--field-width)<?php echo esc_html( $important ); ?>;
230 + max-width: 100%;
231 + font-size: var(--field-font-size)<?php echo esc_html( $important ); ?>;
232 + padding: var(--field-pad)<?php echo esc_html( $important ); ?>;
233 + box-sizing: border-box;
234 + outline: none<?php echo esc_html( $important ); ?>;
235 + font-weight: var(--field-weight);
265 236 }
266 237
267 -<?php if ( ! empty( $important ) ) { ?>
238 +.with_frm_style input:-webkit-autofill:focus {
239 + /* Prevent the user agent autofill background color from taking effect on focus. */
240 + transition: background-color 5000s ease-in-out 0s<?php echo esc_html( $important ); ?>;
241 +}
242 +
243 +<?php if ( $important ) : ?>
244 + <?php if ( $use_chosen_js ) { ?>
245 + .with_frm_style .chosen-container-multi .chosen-choices,
246 + .with_frm_style .chosen-container-single .chosen-single,
247 + <?php } ?>
268 248 .with_frm_style input[type=text],
269 249 .with_frm_style input[type=password],
270 250 .with_frm_style input[type=email],
271 251 .with_frm_style input[type=number],
@@ -277,30 +257,25 @@
277 257 .frm_form_fields_style,
278 258 .with_frm_style .frm_scroll_box .frm_opt_container,
279 259 .frm_form_fields_active_style,
280 260 .frm_form_fields_error_style,
281 -.with_frm_style .frm-card-element.StripeElement,
282 -.with_frm_style .chosen-container-multi .chosen-choices,
283 -.with_frm_style .chosen-container-single .chosen-single{
261 +.with_frm_style .frm-card-element.StripeElement {
284 262 background-image:none !important;
285 263 }
286 -<?php } ?>
264 +<?php endif; ?>
287 265
288 266 .with_frm_style select option {
289 - color:<?php echo esc_html( $defaults['text_color'] ); ?>;
290 - color:var(--text-color)<?php echo esc_html( $important ); ?>;
267 + color: var(--text-color)<?php echo esc_html( $important ); ?>;
291 268 }
292 269
293 270 .with_frm_style select option.frm-select-placeholder {
294 - color:<?php echo esc_html( $defaults['text_color_disabled'] ); ?>;
295 - color:var(--text-color-disabled)<?php echo esc_html( $important ); ?>;
271 + color: var(--text-color-disabled)<?php echo esc_html( $important ); ?>;
296 272 }
297 273
298 274 .with_frm_style input[type=radio],
299 275 .with_frm_style input[type=checkbox]{
300 - border-color:<?php echo esc_html( $defaults['border_color'] . $important ); ?>;
301 - border-color:var(--border-color)<?php echo esc_html( $important ); ?>;
302 - box-shadow:var(--box-shadow)<?php echo esc_html( $important ); ?>;
276 + border-color: var(--border-color)<?php echo esc_html( $important ); ?>;
277 + box-shadow: var(--box-shadow)<?php echo esc_html( $important ); ?>;
303 278 float: none;
304 279 }
305 280
306 281 .with_frm_style input[type=radio]:after,
@@ -307,8 +282,18 @@
307 282 .with_frm_style input[type=checkbox]:after {
308 283 display: none; /* 2021 conflict */
309 284 }
310 285
286 +.with_frm_style input[type=radio]:not(:checked):focus,
287 +.with_frm_style input[type=checkbox]:not(:checked):focus {
288 + border-color: var(--border-color) !important;
289 +}
290 +
291 +.with_frm_style input[type=radio]:focus,
292 +.with_frm_style input[type=checkbox]:focus {
293 + box-shadow:0px 0px 0px 3px rgba(<?php echo esc_html( FrmStylesHelper::hex2rgb( $defaults['border_color_active'] ) ); ?>, 0.4) !important;
294 +}
295 +
311 296 .with_frm_style input[type=text],
312 297 .with_frm_style input[type=password],
313 298 .with_frm_style input[type=email],
314 299 .with_frm_style input[type=number],
@@ -317,10 +302,9 @@
317 302 .with_frm_style input[type=file],
318 303 .with_frm_style input[type=search],
319 304 .with_frm_style select,
320 305 .with_frm_style .frm-card-element.StripeElement{
321 - min-height:<?php echo esc_html( $defaults['field_height'] ); ?>;
322 - min-height:var(--field-height)<?php echo esc_html( $important ); ?>;
306 + min-height: var(--field-height)<?php echo esc_html( $important ); ?>;
323 307 line-height:1.3<?php echo esc_html( $important ); ?>;
324 308 }
325 309
326 310 .with_frm_style select[multiple=multiple]{
@@ -335,17 +319,15 @@
335 319 box-shadow:none;
336 320 }
337 321
338 322 .with_frm_style input[type=file]{
339 - color:<?php echo esc_html( $defaults['text_color'] ); ?>;
340 - color:var(--text-color)<?php echo esc_html( $important ); ?>;
341 - padding:0px;
323 + color: var(--text-color)<?php echo esc_html( $important ); ?>;
324 + padding: 0px;
342 325 <?php if ( ! empty( $defaults['font'] ) ) { ?>
343 - font-family:var(--font)<?php echo esc_html( $important ); ?>;
326 + font-family: var(--font)<?php echo esc_html( $important ); ?>;
344 327 <?php } ?>
345 - font-size:<?php echo esc_html( $defaults['field_font_size'] ); ?>;
346 - font-size:var(--field-font-size)<?php echo esc_html( $important ); ?>;
347 - display:initial;
328 + font-size: var(--field-font-size)<?php echo esc_html( $important ); ?>;
329 + display: initial;
348 330 }
349 331
350 332 .with_frm_style input[type=file].frm_transparent{
351 333 color:transparent<?php echo esc_html( $important ); ?>;
@@ -350,11 +332,11 @@
350 332 .with_frm_style input[type=file].frm_transparent{
351 333 color:transparent<?php echo esc_html( $important ); ?>;
352 334 }
353 335
336 +<?php if ( $pro_is_installed ) { ?>
354 337 .with_frm_style .wp-editor-wrap{
355 - width:<?php echo esc_html( $defaults['field_width'] . $important ); ?>;
356 - width:var(--field-width)<?php echo esc_html( $important ); ?>;
338 + width: var(--field-width)<?php echo esc_html( $important ); ?>;
357 339 max-width:100%;
358 340 }
359 341
360 342 .with_frm_style .wp-editor-container textarea{
@@ -362,17 +344,16 @@
362 344 box-shadow:none !important;
363 345 }
364 346
365 347 .with_frm_style .mceIframeContainer{
366 - background-color:<?php echo esc_html( $defaults['bg_color'] . $important ); ?>;
367 - background-color:var(--bg-color)<?php echo esc_html( $important ); ?>;
348 + background-color: var(--bg-color)<?php echo esc_html( $important ); ?>;
368 349 }
350 +<?php } ?>
369 351
370 352 .with_frm_style select{
371 - width:<?php echo esc_html( $defaults['auto_width'] ); ?>;
372 - width:var(--auto-width)<?php echo esc_html( $important ); ?>;
353 + width: var(--auto-width)<?php echo esc_html( $important ); ?>;
373 354 max-width:100%;
374 - background-position-y: center;
355 + background-position-y: calc(50% + 3px);
375 356 }
376 357
377 358 .with_frm_style input[disabled],
378 359 .with_frm_style select[disabled],
@@ -378,15 +359,12 @@
378 359 .with_frm_style select[disabled],
379 360 .with_frm_style textarea[disabled],
380 361 .with_frm_style input[readonly],
381 362 .with_frm_style select[readonly],
382 -.with_frm_style textarea[readonly]{
383 - background-color:<?php echo esc_html( $defaults['bg_color_disabled'] ); ?>;
384 - background-color:var(--bg-color-disabled)<?php echo esc_html( $important ); ?>;
385 - color:<?php echo esc_html( $defaults['text_color_disabled'] ); ?>;
386 - color:var(--text-color-disabled)<?php echo esc_html( $important ); ?>;
387 - border-color:<?php echo esc_html( $defaults['border_color_disabled'] ); ?>;
388 - border-color:var(--border-color-disabled)<?php echo esc_html( $important ); ?>;
363 +.with_frm_style textarea[readonly] {
364 + background-color: var(--bg-color-disabled)<?php echo esc_html( $important ); ?>;
365 + color: var(--text-color-disabled)<?php echo esc_html( $important ); ?>;
366 + border-color: var(--border-color-disabled)<?php echo esc_html( $important ); ?>;
389 367 }
390 368
391 369 .frm_preview_page:before{
392 370 content:normal !important;
@@ -398,30 +376,24 @@
398 376
399 377 .with_frm_style .frm_primary_label{
400 378 max-width:100%;
401 379 <?php if ( ! empty( $defaults['font'] ) ) { ?>
402 - font-family:<?php echo FrmAppHelper::kses( $defaults['font'] ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
403 - font-family:var(--font);
380 + font-family: var(--font);
404 381 <?php } ?>
405 382 <?php if ( ! empty( $defaults['font_size'] ) ) { ?>
406 - font-size:<?php echo esc_html( $defaults['font_size'] . $important ); ?>;
407 - font-size:var(--font-size)<?php echo esc_html( $important ); ?>;
383 + font-size: var(--font-size)<?php echo esc_html( $important ); ?>;
408 384 <?php } ?>
409 385 <?php if ( ! empty( $defaults['label_color'] ) ) { ?>
410 - color:<?php echo esc_html( $defaults['label_color'] . $important ); ?>;
411 - color:var(--label-color)<?php echo esc_html( $important ); ?>;
386 + color: var(--label-color)<?php echo esc_html( $important ); ?>;
412 387 <?php } ?>
413 388 <?php if ( ! empty( $defaults['weight'] ) ) { ?>
414 - font-weight:<?php echo esc_html( $defaults['weight'] . $important ); ?>;
415 - font-weight:var(--weight)<?php echo esc_html( $important ); ?>;
389 + font-weight: var(--weight)<?php echo esc_html( $important ); ?>;
416 390 <?php } ?>
417 391 <?php if ( ! empty( $defaults['align'] ) ) { ?>
418 - text-align:<?php echo esc_html( $defaults['align'] . $important ); ?>;
419 - text-align:var(--align)<?php echo esc_html( $important ); ?>;
392 + text-align: var(--align)<?php echo esc_html( $important ); ?>;
420 393 <?php } ?>
421 394 <?php if ( ! empty( $defaults['label_padding'] ) ) { ?>
422 - padding:<?php echo esc_html( $defaults['label_padding'] . $important ); ?>;
423 - padding:var(--label-padding)<?php echo esc_html( $important ); ?>;
395 + padding: var(--label-padding)<?php echo esc_html( $important ); ?>;
424 396 <?php } ?>
425 397 margin:0;
426 398 width:auto;
427 399 display:block;
@@ -456,11 +428,13 @@
456 428 .frm_none_container .frm_primary_label{
457 429 display:none;
458 430 }
459 431
432 +<?php if ( $pro_is_installed ) { ?>
460 433 .with_frm_style .frm_section_heading.frm_hide_section{
461 434 margin-top:0 !important;
462 435 }
436 +<?php } ?>
463 437
464 438 .with_frm_style .frm_hidden_container .frm_primary_label,
465 439 .with_frm_style .frm_pos_hidden,
466 440 .frm_hidden_container .frm_primary_label{
@@ -474,9 +448,9 @@
474 448
475 449 /* Floating labels */
476 450 .with_frm_style .frm_inside_container {
477 451 position: relative;
478 - padding-top: 16px;
452 + padding-top: 18px;
479 453 padding-top: calc(0.5 * var(--field-height));
480 454 }
481 455
482 456 .with_frm_style .frm_inside_container > input,
@@ -484,21 +458,13 @@
484 458 .with_frm_style .frm_inside_container > textarea {
485 459 display: block;
486 460 }
487 461
488 -/* These do not work if they are combined */
489 -.with_frm_style .frm_inside_container > input::-moz-placeholder,
490 -.with_frm_style .frm_inside_container > textarea::-moz-placeholder {
491 - opacity: 0 !important;
492 - transition: opacity 0.3s ease-in;
462 +.with_frm_style input::placeholder,
463 +.with_frm_style textarea::placeholder {
464 + font-size: var(--field-font-size)<?php echo esc_html( $important ); ?>;
493 465 }
494 466
495 -.with_frm_style .frm_inside_container > input:-ms-input-placeholder,
496 -.with_frm_style .frm_inside_container > textarea:-ms-input-placeholder {
497 - opacity: 0;
498 - transition: opacity 0.3s ease-in;
499 -}
500 -
501 467 .with_frm_style .frm_inside_container > input::placeholder,
502 468 .with_frm_style .frm_inside_container > textarea::placeholder {
503 469 opacity: 0;
504 470 transition: opacity 0.3s ease-in;
@@ -507,9 +473,9 @@
507 473 .with_frm_style .frm_inside_container > label {
508 474 transition: all 0.3s ease-in;
509 475
510 476 position: absolute;
511 - top: 17px;
477 + top: 19px;
512 478 top: calc(1px + .5 * var(--field-height));
513 479 left: 3px;
514 480 width: 100%;
515 481
@@ -517,9 +483,9 @@
517 483 text-overflow: ellipsis;
518 484 overflow: hidden;
519 485 white-space: nowrap;
520 486
521 - padding: 6px 10px;
487 + padding: 8px 12px;
522 488 padding: var(--field-pad);
523 489
524 490 font-size: 14px;
525 491 font-size: var(--field-font-size);
@@ -525,9 +491,8 @@
525 491 font-size: var(--field-font-size);
526 492 font-weight: normal;
527 493 font-weight: var(--field-weight);
528 494
529 - -ms-pointer-events: none;
530 495 pointer-events: none;
531 496 }
532 497
533 498 .with_frm_style.frm_style_lines-no-boxes .frm_inside_container > label {
@@ -541,21 +506,8 @@
541 506 font-size: 12px;
542 507 font-size: calc(0.85 * var(--field-font-size));
543 508 }
544 509
545 -/* These do not work if they are combined */
546 -.with_frm_style .frm_inside_container.frm_label_float_top > input::-moz-placeholder,
547 -.with_frm_style .frm_inside_container.frm_label_float_top > textarea::-moz-placeholder {
548 - opacity: 1 !important;
549 - transition: opacity 0.3s ease-in;
550 -}
551 -
552 -.with_frm_style .frm_inside_container.frm_label_float_top > input:-ms-input-placeholder,
553 -.with_frm_style .frm_inside_container.frm_label_float_top > textarea:-ms-input-placeholder {
554 - opacity: 1;
555 - transition: opacity 0.3s ease-in;
556 -}
557 -
558 510 .with_frm_style .frm_inside_container.frm_label_float_top > input::placeholder,
559 511 .with_frm_style .frm_inside_container.frm_label_float_top > textarea::placeholder {
560 512 opacity: 1;
561 513 transition: opacity 0.3s ease-in;
@@ -566,9 +518,9 @@
566 518 .with_frm_style .frm_pro_max_limit_desc{
567 519 clear:both;
568 520 }
569 521
570 -.with_frm_style input[type=number][readonly]{
522 +.with_frm_style input[type=number][readonly] {
571 523 -moz-appearance: textfield;
572 524 }
573 525
574 526 .with_frm_style select[multiple="multiple"]{
@@ -575,8 +527,9 @@
575 527 height:auto;
576 528 line-height:normal;
577 529 }
578 530
531 +<?php if ( $pro_is_installed ) { ?>
579 532 .with_frm_style .frm_catlevel_2,
580 533 .with_frm_style .frm_catlevel_3,
581 534 .with_frm_style .frm_catlevel_4,
582 535 .with_frm_style .frm_catlevel_5{
@@ -581,9 +534,11 @@
581 534 .with_frm_style .frm_catlevel_4,
582 535 .with_frm_style .frm_catlevel_5{
583 536 margin-left:18px;
584 537 }
538 +<?php } ?>
585 539
540 +<?php if ( $pro_is_installed ) { ?>
586 541 .with_frm_style .wp-editor-container{
587 542 border:1px solid #e5e5e5;
588 543 }
589 544
@@ -593,8 +548,9 @@
593 548
594 549 .with_frm_style .wp-editor-container textarea{
595 550 border:none;
596 551 }
552 +<?php } ?>
597 553
598 554 .with_frm_style .auto_width #loginform input,
599 555 .with_frm_style .auto_width input,
600 556 .with_frm_style input.auto_width,
@@ -602,59 +558,49 @@
602 558 .with_frm_style textarea.auto_width{
603 559 width:auto<?php echo esc_html( $important ); ?>;
604 560 }
605 561
562 +<?php if ( $pro_is_installed ) { ?>
606 563 .with_frm_style .frm_repeat_buttons{
607 564 white-space:nowrap;
608 565 }
566 +<?php } ?>
609 567
610 568 .with_frm_style .frm_button{
611 - text-decoration:none !important;;
569 + text-decoration:none !important;
612 570 border:1px solid #eee;
613 571 display:inline-block;
614 572 <?php if ( ! empty( $defaults['submit_padding'] ) ) { ?>
615 - padding:<?php echo esc_html( $defaults['submit_padding'] . $important ); ?>;
616 - padding:var(--submit-padding)<?php echo esc_html( $important ); ?>;
573 + padding: var(--submit-padding)<?php echo esc_html( $important ); ?>;
617 574 <?php } else { ?>
618 575 padding:5px;
619 576 <?php } ?>
620 577 <?php if ( ! empty( $defaults['border_radius'] ) ) { ?>
621 - -moz-border-radius:<?php echo esc_html( $defaults['border_radius'] . $important ); ?>;
622 - -webkit-border-radius:<?php echo esc_html( $defaults['border_radius'] . $important ); ?>;
623 - border-radius:<?php echo esc_html( $defaults['border_radius'] . $important ); ?>;
624 578 border-radius:var(--border-radius)<?php echo esc_html( $important ); ?>;
625 579 <?php } ?>
626 580 <?php if ( ! empty( $defaults['submit_font_size'] ) ) { ?>
627 - font-size:<?php echo esc_html( $defaults['submit_font_size'] . $important ); ?>;
628 - font-size:var(--submit-font-size)<?php echo esc_html( $important ); ?>;
581 + font-size: var(--submit-font-size)<?php echo esc_html( $important ); ?>;
629 582 <?php } ?>
630 583 <?php if ( ! empty( $defaults['font'] ) ) { ?>
631 - font-family:<?php echo FrmAppHelper::kses( $defaults['font'] . $important ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
632 - font-family:var(--font)<?php echo esc_html( $important ); ?>;
584 + font-family: var(--font)<?php echo esc_html( $important ); ?>;
633 585 <?php } ?>
634 586 <?php if ( ! empty( $defaults['submit_weight'] ) ) { ?>
635 - font-weight:<?php echo esc_html( $defaults['submit_weight'] . $important ); ?>;
636 - font-weight:var(--submit-weight)<?php echo esc_html( $important ); ?>;
587 + font-weight: var(--submit-weight)<?php echo esc_html( $important ); ?>;
637 588 <?php } ?>
638 589 <?php if ( ! empty( $defaults['submit_text_color'] ) ) { ?>
639 - color:<?php echo esc_html( $defaults['submit_text_color'] . $important ); ?>;
640 - color:var(--submit-text-color)<?php echo esc_html( $important ); ?>;
590 + color: var(--submit-text-color)<?php echo esc_html( $important ); ?>;
641 591 <?php } ?>
642 592 <?php if ( ! empty( $defaults['submit_bg_color'] ) ) { ?>
643 - background:<?php echo esc_html( $defaults['submit_bg_color'] . $important ); ?>;
644 - background:var(--submit-bg-color)<?php echo esc_html( $important ); ?>;
593 + background: var(--submit-bg-color)<?php echo esc_html( $important ); ?>;
645 594 <?php } ?>
646 595 <?php if ( ! empty( $defaults['submit_border_width'] ) ) { ?>
647 - border-width:<?php echo esc_html( $defaults['submit_border_width'] ); ?>;
648 - border-width:var(--submit-border-width)<?php echo esc_html( $important ); ?>;
596 + border-width: var(--submit-border-width)<?php echo esc_html( $important ); ?>;
649 597 <?php } ?>
650 598 <?php if ( ! empty( $defaults['submit_border_color'] ) ) { ?>
651 - border-color:<?php echo esc_html( $defaults['submit_border_color'] . $important ); ?>;
652 - border-color:var(--submit-border-color)<?php echo esc_html( $important ); ?>;
599 + border-color: var(--submit-border-color)<?php echo esc_html( $important ); ?>;
653 600 <?php } ?>
654 601 <?php if ( ! empty( $defaults['submit_height'] ) ) { ?>
655 - height:<?php echo esc_html( $defaults['submit_height'] . $important ); ?>;
656 - height:var(--submit-height)<?php echo esc_html( $important ); ?>;
602 + height: var(--submit-height)<?php echo esc_html( $important ); ?>;
657 603 <?php } ?>
658 604 }
659 605
660 606 <?php if ( ! empty( $defaults['submit_text_color'] ) ) { ?>
@@ -687,8 +633,12 @@
687 633 .with_frm_style.frm_center_submit .frm_submit{
688 634 text-align:center;
689 635 }
690 636
637 +.with_frm_style.frm_center_submit .frm_flex.frm_submit {
638 + justify-content: center;
639 +}
640 +
691 641 .with_frm_style .frm_inline_success .frm_submit{
692 642 display: flex;
693 643 flex-direction: row;
694 644 align-items: center;
@@ -710,9 +660,11 @@
710 660 .with_frm_style.frm_center_submit .frm_submit button{
711 661 margin-bottom:8px !important;
712 662 }
713 663
664 +<?php if ( $pro_is_installed ) { ?>
714 665 .with_frm_style .frm-edit-page-btn,
666 +<?php } ?>
715 667 .with_frm_style .frm_submit input[type=submit],
716 668 .with_frm_style .frm_submit input[type=button],
717 669 .with_frm_style .frm_submit button{
718 670 -webkit-appearance: none;
@@ -729,19 +681,22 @@
729 681 /* keep this for reverse compatibility for old HTML */
730 682 visibility:visible !important;
731 683 }
732 684
685 +<?php if ( $pro_is_installed ) { ?>
733 686 .with_frm_style .frm_loading_prev .frm_prev_page,
687 +<?php } ?>
734 688 .with_frm_style .frm_loading_form .frm_button_submit {
735 689 position: relative;
736 - opacity: .8;
737 690 color: transparent !important;
738 691 text-shadow: none !important;
739 692 }
740 693
694 +<?php if ( $pro_is_installed ) { ?>
741 695 .with_frm_style .frm_loading_prev .frm_prev_page:hover,
742 696 .with_frm_style .frm_loading_prev .frm_prev_page:active,
743 697 .with_frm_style .frm_loading_prev .frm_prev_page:focus,
698 +<?php } ?>
744 699 .with_frm_style .frm_loading_form .frm_button_submit:hover,
745 700 .with_frm_style .frm_loading_form .frm_button_submit:active,
746 701 .with_frm_style .frm_loading_form .frm_button_submit:focus {
747 702 cursor: not-allowed;
@@ -749,9 +704,11 @@
749 704 outline: none !important;
750 705 box-shadow: none;
751 706 }
752 707
708 +<?php if ( $pro_is_installed ) { ?>
753 709 .with_frm_style .frm_loading_prev .frm_prev_page::before,
710 +<?php } ?>
754 711 .with_frm_style .frm_loading_form .frm_button_submit:before {
755 712 content: '';
756 713 display: inline-block;
757 714 position: absolute;
@@ -760,9 +717,9 @@
760 717 border-top-color: transparent;
761 718 border-left-color: transparent;
762 719 border-radius: 50%;
763 720 box-sizing: border-box;
764 - <?php $loader_size = 20; ?>
721 + <?php $loader_size = 12; ?>
765 722 top: 50%;
766 723 left: 50%;
767 724 margin-top: -<?php echo absint( $loader_size / 2 ); ?>px;
768 725 margin-left: -<?php echo absint( $loader_size / 2 ); ?>px;
@@ -767,22 +724,30 @@
767 724 margin-top: -<?php echo absint( $loader_size / 2 ); ?>px;
768 725 margin-left: -<?php echo absint( $loader_size / 2 ); ?>px;
769 726 width: <?php echo absint( $loader_size ); ?>px;
770 727 height: <?php echo absint( $loader_size ); ?>px;
771 - -webkit-animation: spin 2s linear infinite;
772 - -moz-animation: spin 2s linear infinite;
773 - -o-animation: spin 2s linear infinite;
774 - animation: spin 2s linear infinite;
728 + animation: spin 2s linear infinite;
775 729 }
776 730
731 +.with_frm_style .frm_submit.frm_flex {
732 + align-items: center;
733 + gap: 2%;
734 +}
735 +
736 +<?php if ( $pro_is_installed ) { ?>
737 +.with_frm_style .frm_submit.frm_flex button.frm_button_submit ~ .frm_prev_page {
738 + order: -1;
739 +}
740 +<?php } ?>
741 +
777 742 <?php
778 743 foreach ( $styles as $style ) {
779 - include( dirname( __FILE__ ) . '/_single_theme.css.php' );
744 + include __DIR__ . '/_single_theme.css.php';
780 745 unset( $style );
781 746 }
782 747
783 748 // Set it again since it may have been overridden.
784 -$important = empty( $defaults['important_style'] ) ? '' : ' !important';
749 +$important = ! empty( $defaults['important_style'] ) ? ' !important' : '';
785 750 ?>
786 751
787 752 .frm_ajax_loading{
788 753 visibility:hidden;
@@ -796,19 +761,18 @@
796 761 a.frm_save_draft{
797 762 cursor:pointer;
798 763 }
799 764
765 +<?php if ( $pro_is_installed ) { ?>
800 766 .with_frm_style a.frm_save_draft,
801 767 .with_frm_style a.frm_start_over{
802 -<?php if ( ! empty( $defaults['font'] ) ) { ?>
803 - font-family:<?php echo FrmAppHelper::kses( $defaults['font'] ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
804 - font-family:var(--font);
768 + <?php if ( ! empty( $defaults['font'] ) ) { ?>
769 + font-family: var(--font);
805 770 <?php } ?>
806 - font-size:<?php echo esc_html( $defaults['submit_font_size'] ); ?>;
807 - font-size:var(--submit-font-size);
808 - font-weight:<?php echo esc_html( $defaults['submit_weight'] ); ?>;
809 - font-weight:var(--submit-weight);
771 + font-size: var(--submit-font-size);
772 + font-weight: var(--submit-weight);
810 773 }
774 +<?php } ?>
811 775
812 776 .horizontal_radio .frm_radio{
813 777 margin:0 5px 0 0;
814 778 }
@@ -814,9 +778,9 @@
814 778 }
815 779
816 780 .horizontal_radio .frm_checkbox{
817 781 margin:0;
818 - margin-right:5px;
782 + margin-right:12px;
819 783 }
820 784
821 785 .vertical_radio .frm_checkbox,
822 786 .vertical_radio .frm_radio,
@@ -831,15 +795,13 @@
831 795 padding-left: 0;
832 796 }
833 797
834 798 .with_frm_style .frm_radio{
835 - display:<?php echo esc_html( $defaults['radio_align'] . $important ); ?>;
836 - display:var(--radio-align)<?php echo esc_html( $important ); ?>;
799 + display: var(--radio-align)<?php echo esc_html( $important ); ?>;
837 800 }
838 801
839 802 .with_frm_style .frm_checkbox{
840 - display:<?php echo esc_html( $defaults['check_align'] . $important ); ?>;
841 - display:var(--check-align)<?php echo esc_html( $important ); ?>;
803 + display: var(--check-align)<?php echo esc_html( $important ); ?>;
842 804 }
843 805
844 806 .with_frm_style .vertical_radio .frm_checkbox,
845 807 .with_frm_style .vertical_radio .frm_radio,
@@ -844,8 +806,9 @@
844 806 .with_frm_style .vertical_radio .frm_checkbox,
845 807 .with_frm_style .vertical_radio .frm_radio,
846 808 .vertical_radio .frm_catlevel_1{
847 809 display:block<?php echo esc_html( $important ); ?>;
810 + margin-bottom: 10px;
848 811 }
849 812
850 813 .with_frm_style .horizontal_radio .frm_checkbox,
851 814 .with_frm_style .horizontal_radio .frm_radio,
@@ -853,40 +816,45 @@
853 816 display:inline-block<?php echo esc_html( $important ); ?>;
854 817 }
855 818
856 819 .with_frm_style .frm_checkbox label,
857 -.with_frm_style .frm_radio label{
858 - display: inline;
820 +.with_frm_style .frm_radio label {
821 + display: inline-block;
822 + vertical-align: middle;
859 823 white-space:normal;
860 824 }
861 825
826 +.with_frm_style .frm_checkbox label input[type=checkbox],
827 +.with_frm_style .frm_radio label input[type=radio] {
828 + margin-right: 4px;
829 +}
830 +
831 +.with_frm_style .frm_checkbox label:not(.frm-label-disabled),
832 +.with_frm_style .frm_radio label:not(.frm-label-disabled) {
833 + cursor: pointer;
834 +}
835 +
862 836 .with_frm_style .vertical_radio .frm_checkbox label,
863 837 .with_frm_style .vertical_radio .frm_radio label{
864 838 display: block;
865 - padding-left: 20px;
866 - text-indent: -20px;
839 + width: 100%;
867 840 }
868 841
869 842 .with_frm_style .frm_radio label,
870 -.with_frm_style .frm_checkbox label{
843 +.with_frm_style .frm_checkbox label {
871 844 <?php if ( ! empty( $defaults['font'] ) ) { ?>
872 - font-family:<?php echo FrmAppHelper::kses( $defaults['font'] ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
873 - font-family:var(--font);
845 + font-family: var(--font);
874 846 <?php } ?>
875 - font-size:<?php echo esc_html( $defaults['check_font_size'] . $important ); ?>;
876 - font-size:var(--check-font-size)<?php echo esc_html( $important ); ?>;
877 - color:<?php echo esc_html( $defaults['check_label_color'] . $important ); ?>;
878 - color:var(--check-label-color)<?php echo esc_html( $important ); ?>;
879 - font-weight:<?php echo esc_html( $defaults['check_weight'] . $important ); ?>;
880 - font-weight:var(--check-weight)<?php echo esc_html( $important ); ?>;
847 + font-size: var(--check-font-size)<?php echo esc_html( $important ); ?>;
848 + color: var(--check-label-color)<?php echo esc_html( $important ); ?>;
849 + font-weight: var(--check-weight)<?php echo esc_html( $important ); ?>;
881 850 line-height: 1.3;
882 851 }
883 852
884 853 .with_frm_style .frm_radio input[type=radio],
885 854 .with_frm_style .frm_checkbox input[type=checkbox] {
886 - font-size:<?php echo esc_html( $defaults['check_font_size'] . $important ); ?>;
887 - font-size:var(--check-font-size)<?php echo esc_html( $important ); ?>;
888 - position:static<?php echo esc_html( $important ); ?>;
855 + font-size: var(--check-font-size)<?php echo esc_html( $important ); ?>;
856 + position: static<?php echo esc_html( $important ); ?>;
889 857 }
890 858
891 859 .frm_file_container .frm_file_link,
892 860 .with_frm_style .frm_radio label .frm_file_container,
@@ -896,9 +864,9 @@
896 864 vertical-align:middle;
897 865 }
898 866
899 867 .with_frm_style .frm_radio input[type=radio]
900 -<?php if ( FrmAppHelper::pro_is_installed() ) : ?>
868 +<?php if ( $pro_is_installed ) : ?>
901 869 , .with_frm_style .frm_scale input[type=radio]
902 870 <?php endif; ?>
903 871 {
904 872 border-radius:50%;
@@ -903,62 +871,96 @@
903 871 {
904 872 border-radius:50%;
905 873 }
906 874
907 -.with_frm_style .frm_checkbox input[type=checkbox]{
908 - border-radius:0;
875 +.with_frm_style .frm_checkbox input[type=checkbox] {
876 + border-radius: calc(var(--border-radius) / 2) !important;
909 877 }
910 878
911 879 .with_frm_style .frm_radio input[type=radio],
912 -<?php if ( FrmAppHelper::pro_is_installed() ) : ?>
880 +<?php if ( $pro_is_installed ) : ?>
913 881 .with_frm_style .frm_scale input[type=radio],
914 882 <?php endif; ?>
915 883 .with_frm_style .frm_checkbox input[type=checkbox]{
916 - -webkit-appearance: none;
917 884 appearance: none;
918 885 background-color: var(--bg-color);
919 886 flex: none;
920 887 display:inline-block !important;
921 - margin: 0 5px 0 0;
888 + width: 16px !important;
889 + min-width: 16px !important;
890 + height: 16px !important;
922 891 color: var(--border-color);
923 - width: 18px;
924 - min-width: 18px;
925 - height: 18px;
926 892 border: 1px solid currentColor;
927 893 border-color: var(--border-color);
928 894 vertical-align: middle;
929 895 position: initial; /* override Bootstrap */
930 896 padding: 0;
897 + margin: 0;
931 898 }
932 899
933 -.with_frm_style .frm_radio input[type=radio]:before,
934 -<?php if ( FrmAppHelper::pro_is_installed() ) : ?>
935 -.with_frm_style .frm_scale input[type=radio]:before,
900 +.frm_forms.with_frm_style .frm_fields_container .frm_radio input[type=radio]:not([disabled]):checked,
901 +<?php if ( $pro_is_installed ) : ?>
902 +.frm_forms.with_frm_style .frm_fields_container .frm_scale input[type=radio]:not([disabled]):checked,
936 903 <?php endif; ?>
937 -.with_frm_style .frm_checkbox input[type=checkbox]:before {
904 +.frm_forms.with_frm_style .frm_fields_container .frm_checkbox input[type=checkbox]:not([disabled]):checked {
905 + border-color: var(--border-color-active) !important;
906 +}
907 +
908 +.frm_forms.with_frm_style .frm_fields_container .frm_checkbox input[type=checkbox]:not([disabled]):checked {
909 + background-color: var(--border-color-active) !important;
910 +}
911 +
912 +.with_frm_style .frm_radio input[type=radio][disabled]:checked,
913 +<?php if ( $pro_is_installed ) : ?>
914 +.with_frm_style .frm_scale input[type=radio][disabled]:checked,
915 +<?php endif; ?>
916 +.with_frm_style .frm_checkbox input[type=checkbox][disabled]:checked {
917 + border-color: var(--border-color) !important; /* Override Style Preview */
918 +}
919 +
920 +.with_frm_style .frm_checkbox input[type=checkbox][disabled]:checked {
921 + background-color: var(--border-color) !important;
922 +}
923 +
924 +.with_frm_style .frm_radio input[type=radio]:checked:before,
925 +<?php if ( $pro_is_installed ) { ?>
926 +.with_frm_style .frm_scale input[type=radio]:checked:before,
927 +<?php } ?>
928 +.with_frm_style .frm_checkbox input[type=checkbox]:checked:before {
929 + position: static !important; /* Override Style Preview */
938 930 content: '';
939 - width: 12px;
940 - height: 12px;
941 - border-radius: 50%;
942 - transform: scale(0);
943 - transition: 120ms transform ease-in-out;
944 - box-shadow: inset 10px 10px var(--text-color);
945 931 display: block;
946 - margin: 2px 0 0 2px;
947 932 }
948 933
949 -.with_frm_style .frm_checkbox input[type=checkbox]:before{
950 - clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
951 - border-radius: 0;
934 +.frm_forms.with_frm_style .frm_checkbox input[type=checkbox]:before {
935 + width: 100% !important;
936 + height: 100% !important;
937 + 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;
938 + background-size: 9px !important;
939 + background-repeat: no-repeat !important;
940 + background-position: center !important;
941 + margin: 0;
952 942 }
953 943
954 -.with_frm_style .frm_radio input[type=radio]:checked:before,
955 -.with_frm_style .frm_checkbox input[type=checkbox]:checked:before {
956 - transform: scale(1);
944 +<?php if ( $pro_is_installed ) { ?>
945 +.with_frm_style .frm_scale input[type=radio]:before,
946 +<?php } ?>
947 +.with_frm_style .frm_radio input[type=radio]:before {
948 + width: 8px;
949 + height: 8px;
950 + border-radius: 50%;
951 + background-color: var(--border-color-active);
952 + margin: 3px;
957 953 }
958 954
955 +<?php if ( $pro_is_installed ) { ?>
956 +.with_frm_style .frm_scale input[type=radio][disabled]:before,
957 +<?php } ?>
958 +.with_frm_style .frm_radio input[type=radio][disabled]:before {
959 + background-color: var(--border-color);
960 +}
961 +
959 962 .with_frm_style :invalid,
960 -.with_frm_style :-moz-submit-invalid,
961 963 .with_frm_style :-moz-ui-invalid{
962 964 box-shadow:none;
963 965 }
964 966
@@ -974,33 +976,29 @@
974 976
975 977 .with_frm_style .frm_error_style,
976 978 .with_frm_style .frm_message,
977 979 .frm_success_style{
978 - -moz-border-radius:4px;
979 - -webkit-border-radius:4px;
980 980 border-radius:4px;
981 981 padding:15px;
982 982 }
983 983
984 -.with_frm_style .frm_message p{
985 - margin-bottom:5px;
986 - color:<?php echo esc_html( $defaults['success_text_color'] ); ?>;
987 - color:var(--success-text-color)<?php echo esc_html( $important ); ?>;
984 +.with_frm_style .frm_message p {
985 + color: var(--success-text-color)<?php echo esc_html( $important ); ?>;
986 + margin-bottom: 0;
988 987 }
989 988
989 +.with_frm_style .frm_message > p:first-of-type {
990 + margin-top: 0;
991 +}
992 +
990 993 .with_frm_style .frm_message,
991 -.frm_success_style{
992 - margin:5px 0 15px;
993 - border:1px solid <?php echo esc_html( $defaults['success_border_color'] ); ?>;
994 - border-color:var(--success-border-color);
995 - background-color:<?php echo esc_html( $defaults['success_bg_color'] ); ?>;
996 - background-color:var(--success-bg-color);
997 - color:<?php echo esc_html( $defaults['success_text_color'] ); ?>;
998 - color:var(--success-text-color)<?php echo esc_html( $important ); ?>;
999 - border-radius:<?php echo esc_html( $defaults['border_radius'] ); ?>;
1000 - border-radius:var(--border-radius);
1001 - font-size:<?php echo esc_html( $defaults['success_font_size'] ); ?>;
1002 - font-size:var(--success-font-size)<?php echo esc_html( $important ); ?>;
994 +.frm_success_style {
995 + margin: 5px 0 15px;
996 + border: 1px solid var(--success-border-color);
997 + background-color: var(--success-bg-color);
998 + color: var(--success-text-color)<?php echo esc_html( $important ); ?>;
999 + border-radius: var(--border-radius);
1000 + font-size: var(--success-font-size)<?php echo esc_html( $important ); ?>;
1003 1001 }
1004 1002
1005 1003 .with_frm_style .frm_plain_success .frm_message {
1006 1004 background-color: transparent;
@@ -1036,10 +1034,9 @@
1036 1034 padding:5px;
1037 1035 border-width:1px;
1038 1036 border-style:solid;
1039 1037 <?php if ( ! empty( $defaults['border_color'] ) ) { ?>
1040 - border-color:<?php echo esc_html( $defaults['border_color'] ); ?>;
1041 - border-color:var(--border-color);
1038 + border-color: var(--border-color);
1042 1039 <?php } ?>
1043 1040 border-top:none;
1044 1041 border-left:none;
1045 1042 border-right:none;
@@ -1054,10 +1051,9 @@
1054 1051 }
1055 1052
1056 1053 <?php if ( ! empty( $defaults['border_color'] ) ) { ?>
1057 1054 .with_frm_style .frm-alt-table{
1058 - border-color:<?php echo esc_html( $defaults['border_color'] ); ?>;
1059 - border-color:var(--border-color);
1055 + border-color: var(--border-color);
1060 1056 }
1061 1057 <?php } ?>
1062 1058
1063 1059 .frm-alt-table th {
@@ -1080,27 +1076,28 @@
1080 1076 .frm-alt-table tr:nth-child(even) {
1081 1077 background-color:<?php echo esc_html( FrmStylesHelper::adjust_brightness( $defaults['border_color'], 45 ) ); ?>;
1082 1078 }
1083 1079
1080 +<?php if ( $pro_is_installed ) { ?>
1084 1081 table.form_results.with_frm_style{
1085 - border:<?php echo esc_html( $defaults['field_border_width'] ); ?> solid <?php echo esc_html( $defaults['border_color'] . $important ); ?>;
1086 - border-width:var(--field-border-width)<?php echo esc_html( $important ); ?>;
1087 - border-color:var(--border-color)<?php echo esc_html( $important ); ?>;
1082 + border-style: solid;
1083 + border-width: var(--field-border-width)<?php echo esc_html( $important ); ?>;
1084 + border-color: var(--border-color)<?php echo esc_html( $important ); ?>;
1088 1085 }
1089 1086
1090 1087 table.form_results.with_frm_style tr td{
1091 1088 text-align:left;
1092 1089 padding:7px 9px;
1093 -<?php if ( ! empty( $defaults['text_color'] ) ) { ?>
1094 - color:<?php echo esc_html( $defaults['text_color'] ); ?>;
1095 - color:var(--text-color)<?php echo esc_html( $important ); ?>;
1090 + <?php if ( ! empty( $defaults['text_color'] ) ) { ?>
1091 + color: var(--text-color)<?php echo esc_html( $important ); ?>;
1096 1092 <?php } ?>
1097 -<?php if ( ! empty( $defaults['border_color'] ) ) { ?>
1098 - border-top:1px solid <?php echo esc_html( $defaults['border_color'] ); ?>;
1099 - border-top-width:var(--field-border-width)<?php echo esc_html( $important ); ?>;
1100 - border-top-color:var(--border-color)<?php echo esc_html( $important ); ?>;
1093 + <?php if ( ! empty( $defaults['border_color'] ) ) { ?>
1094 + border-top-style: solid;
1095 + border-top-width: var(--field-border-width)<?php echo esc_html( $important ); ?>;
1096 + border-top-color: var(--border-color)<?php echo esc_html( $important ); ?>;
1101 1097 <?php } ?>
1102 1098 }
1099 +<?php } ?>
1103 1100
1104 1101 table.form_results.with_frm_style tr.frm_even,
1105 1102 .frm-grid .frm_even{
1106 1103 background-color:#fff;
@@ -1108,11 +1105,10 @@
1108 1105 }
1109 1106
1110 1107 <?php if ( ! empty( $defaults['bg_color'] ) ) { ?>
1111 1108 table.form_results.with_frm_style tr.frm_odd,
1112 -.frm-grid .frm_odd{
1113 - background-color:<?php echo esc_html( $defaults['bg_color'] ); ?>;
1114 - background-color:var(--bg-color)<?php echo esc_html( $important ); ?>;
1109 +.frm-grid .frm_odd {
1110 + background-color: var(--bg-color)<?php echo esc_html( $important ); ?>;
1115 1111 }
1116 1112 <?php } ?>
1117 1113
1118 1114 <?php if ( ! empty( $defaults['border_color'] ) ) { ?>
@@ -1120,18 +1116,23 @@
1120 1116 background-color:<?php echo esc_html( FrmStylesHelper::adjust_brightness( $defaults['border_color'], 45 ) ); ?>;
1121 1117 padding: 40px;
1122 1118 }
1123 1119
1120 + <?php if ( $pro_is_installed ) { ?>
1124 1121 .with_frm_style .frm-show-form .frm_color_block.frm_section_heading h3,
1125 1122 .frm_color_block.frm_section_heading h3 {
1126 1123 border-width: 0 !important;
1127 1124 }
1125 + <?php } ?>
1128 1126 <?php } ?>
1129 1127
1128 +<?php if ( $pro_is_installed ) { ?>
1130 1129 .frm_collapse .ui-icon{
1131 1130 display:inline-block;
1132 1131 }
1132 +<?php } ?>
1133 1133
1134 +<?php if ( $pro_is_installed ) { ?>
1134 1135 .frm_toggle_container{
1135 1136 /* Prevent the slide and bounce */
1136 1137 border:1px solid transparent;
1137 1138 }
@@ -1148,9 +1149,11 @@
1148 1149
1149 1150 .frm_toggle_container .frm_month_listing{
1150 1151 margin-left:40px;
1151 1152 }
1153 +<?php } ?>
1152 1154
1155 +<?php if ( $pro_is_installed ) { ?>
1153 1156 #frm_loading{
1154 1157 display:none;
1155 1158 position:fixed;
1156 1159 top:0;
@@ -1193,28 +1196,30 @@
1193 1196 #frm_loading .progress.active .progress-bar{
1194 1197 animation:2s linear 0s normal none infinite progress-bar-stripes;
1195 1198 }
1196 1199
1197 -<?php if ( ! empty( $defaults['bg_color'] ) ) { ?>
1198 -#frm_loading .progress-striped .progress-bar{
1199 - <?php if ( ! empty( $defaults['border_color'] ) ) { ?>
1200 - 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));
1200 + <?php if ( ! empty( $defaults['bg_color'] ) ) { ?>
1201 +#frm_loading .progress-striped .progress-bar {
1202 + <?php if ( ! empty( $defaults['border_color'] ) ) { ?>
1203 + 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));
1201 1204 <?php } ?>
1202 1205 background-size:40px 40px;
1203 1206 }
1204 1207 <?php } ?>
1205 1208
1206 -#frm_loading .progress-bar{
1207 - background-color:<?php echo esc_html( $defaults['bg_color'] ); ?>;
1208 - background-color:var(--bg-color);
1209 - box-shadow:0 -1px 0 rgba(0, 0, 0, 0.15) inset;
1210 - float:left;
1211 - height:100%;
1212 - line-height:20px;
1213 - text-align:center;
1214 - transition:width 0.6s ease 0s;
1215 - width:100%;
1209 +#frm_loading .progress-bar {
1210 + background-color: var(--bg-color);
1211 + box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15) inset;
1212 + float: left;
1213 + height: 100%;
1214 + line-height: 20px;
1215 + text-align: center;
1216 + transition: width 0.6s ease 0s;
1217 + width: 100%;
1216 1218 }
1219 + <?php
1220 +}//end if
1221 +?>
1217 1222
1218 1223 .frm_image_from_url{
1219 1224 height:50px;
1220 1225 }
@@ -1223,8 +1228,9 @@
1223 1228 background:url(../images/ajax_loader.gif) no-repeat center center;
1224 1229 padding:6px 12px;
1225 1230 }
1226 1231
1232 +<?php if ( $pro_is_installed ) { ?>
1227 1233 select.frm_loading_lookup{
1228 1234 background-image: url(../images/ajax_loader.gif) !important;
1229 1235 background-position: 10px;
1230 1236 background-repeat: no-repeat;
@@ -1229,22 +1235,25 @@
1229 1235 background-position: 10px;
1230 1236 background-repeat: no-repeat;
1231 1237 color: transparent !important;
1232 1238 }
1239 +<?php } ?>
1233 1240
1234 -<?php readfile( dirname( __FILE__ ) . '/frm_grids.css' ); ?>
1241 +<?php readfile( __DIR__ . '/frm_grids.css' ); ?>
1235 1242
1243 +<?php if ( $pro_is_installed ) { ?>
1236 1244 .frm_conf_field.frm_left_container .frm_primary_label{
1237 1245 display:none;
1238 1246 }
1247 +<?php } ?>
1239 1248
1249 +<?php if ( $pro_is_installed ) { ?>
1240 1250 .wp-editor-wrap *,
1241 1251 .wp-editor-wrap *:after,
1242 1252 .wp-editor-wrap *:before{
1243 - -webkit-box-sizing:content-box;
1244 - -moz-box-sizing:content-box;
1245 1253 box-sizing:content-box;
1246 1254 }
1255 +<?php } ?>
1247 1256
1248 1257 .with_frm_style .frm_grid,
1249 1258 .with_frm_style .frm_grid_first,
1250 1259 .with_frm_style .frm_grid_odd{
@@ -1253,10 +1262,9 @@
1253 1262 padding:5px;
1254 1263 border-width:1px;
1255 1264 border-style:solid;
1256 1265 <?php if ( ! empty( $defaults['border_color'] ) ) { ?>
1257 - border-color:<?php echo esc_html( $defaults['border_color'] ); ?>;
1258 - border-color:var(--border-color)<?php echo esc_html( $important ); ?>;
1266 + border-color: var(--border-color)<?php echo esc_html( $important ); ?>;
1259 1267 <?php } ?>
1260 1268 border-left:none;
1261 1269 border-right:none;
1262 1270 }
@@ -1291,18 +1299,16 @@
1291 1299 }
1292 1300
1293 1301 <?php if ( ! empty( $defaults['bg_color'] ) ) { ?>
1294 1302 .frm_grid_first,
1295 -.frm_grid_odd{
1296 - background-color:<?php echo esc_html( $defaults['bg_color'] ); ?>;
1297 - background-color:var(--bg-color);
1303 +.frm_grid_odd {
1304 + background-color: var(--bg-color);
1298 1305 }
1299 1306 <?php } ?>
1300 1307
1301 1308 <?php if ( ! empty( $defaults['bg_color_active'] ) ) { ?>
1302 -.frm_grid{
1303 - background-color:<?php echo esc_html( $defaults['bg_color_active'] . $important ); ?>;
1304 - background-color:var(--bg-color-active)<?php echo esc_html( $important ); ?>;
1309 +.frm_grid {
1310 + background-color: var(--bg-color-active)<?php echo esc_html( $important ); ?>;
1305 1311 }
1306 1312 <?php } ?>
1307 1313
1308 1314 .with_frm_style .frm_grid.frm_blank_field,
@@ -1307,12 +1313,10 @@
1307 1313
1308 1314 .with_frm_style .frm_grid.frm_blank_field,
1309 1315 .with_frm_style .frm_grid_first.frm_blank_field,
1310 1316 .with_frm_style .frm_grid_odd.frm_blank_field{
1311 - background-color:<?php echo esc_html( $defaults['error_bg'] . $important ); ?>;
1312 1317 background-color:var(--error-bg)<?php echo esc_html( $important ); ?>;
1313 - border-color:<?php echo esc_html( $defaults['error_border'] ); ?>;
1314 - border-color:var(--error-bg);
1318 + border-color: var(--error-border);
1315 1319 }
1316 1320
1317 1321 .frm_grid .frm_primary_label,
1318 1322 .frm_grid_first .frm_primary_label,
@@ -1334,9 +1338,10 @@
1334 1338 .frm_grid_odd .frm_radio label,
1335 1339 .frm_grid_first .frm_checkbox label,
1336 1340 .frm_grid .frm_checkbox label,
1337 1341 .frm_grid_odd .frm_checkbox label{
1338 - visibility:hidden;
1342 + color:transparent;
1343 + text-indent: -9999px;
1339 1344 white-space:nowrap;
1340 1345 text-align:left;
1341 1346 }
1342 1347
@@ -1359,111 +1364,24 @@
1359 1364 .frm_grid_odd .frm_checkbox{
1360 1365 display:inline;
1361 1366 }
1362 1367
1363 -.frm_grid_2 .frm_radio,
1364 -.frm_grid_2 .frm_checkbox,
1365 -.frm_grid_2 .frm_primary_label{
1366 - width:48% !important;
1368 +.frm_form_field.frm_inline_container .frm_opt_container,
1369 +.frm_form_field.frm_right_container .frm_opt_container,
1370 +.frm_form_field.frm_left_container .frm_opt_container{
1371 + padding-top:4px;
1367 1372 }
1368 1373
1369 -.frm_grid_2 .frm_radio,
1370 -.frm_grid_2 .frm_checkbox{
1371 - margin-right:4%;
1374 +.with_frm_style .frm_left_container > select.auto_width,
1375 +.with_frm_style .frm_right_container > select.auto_width {
1376 + width: max-content<?php echo esc_html( $important ); ?>;
1372 1377 }
1373 1378
1374 -.frm_grid_3 .frm_radio,
1375 -.frm_grid_3 .frm_checkbox,
1376 -.frm_grid_3 .frm_primary_label{
1377 - width:30% !important;
1379 +.with_frm_style .frm_right_container > .frm_primary_label,
1380 +.with_frm_style .frm_right_container > select.auto_width {
1381 + margin-left: auto<?php echo esc_html( $important ); ?>;
1378 1382 }
1379 1383
1380 -.frm_grid_3 .frm_radio,
1381 -.frm_grid_3 .frm_checkbox{
1382 - margin-right:3%;
1383 -}
1384 -
1385 -.frm_grid_4 .frm_radio,
1386 -.frm_grid_4 .frm_checkbox{
1387 - width:20% !important;
1388 -}
1389 -
1390 -.frm_grid_4 .frm_primary_label{
1391 - width:28% !important;
1392 -}
1393 -
1394 -.frm_grid_4 .frm_radio,
1395 -.frm_grid_4 .frm_checkbox{
1396 - margin-right:4%;
1397 -}
1398 -
1399 -.frm_grid_5 .frm_primary_label,
1400 -.frm_grid_7 .frm_primary_label{
1401 - width:24% !important;
1402 -}
1403 -
1404 -.frm_grid_5 .frm_radio,
1405 -.frm_grid_5 .frm_checkbox{
1406 - width:17% !important;
1407 - margin-right:2%;
1408 -}
1409 -
1410 -.frm_grid_6 .frm_primary_label{
1411 - width:25% !important;
1412 -}
1413 -
1414 -.frm_grid_6 .frm_radio,
1415 -.frm_grid_6 .frm_checkbox{
1416 - width:14% !important;
1417 - margin-right:1%;
1418 -}
1419 -
1420 -.frm_grid_7 .frm_primary_label{
1421 - width:22% !important;
1422 -}
1423 -
1424 -.frm_grid_7 .frm_radio,
1425 -.frm_grid_7 .frm_checkbox{
1426 - width:12% !important;
1427 - margin-right:1%;
1428 -}
1429 -
1430 -.frm_grid_8 .frm_primary_label{
1431 - width:23% !important;
1432 -}
1433 -
1434 -.frm_grid_8 .frm_radio,
1435 -.frm_grid_8 .frm_checkbox{
1436 - width:10% !important;
1437 - margin-right:1%;
1438 -}
1439 -
1440 -.frm_grid_9 .frm_primary_label{
1441 - width:20% !important;
1442 -}
1443 -
1444 -.frm_grid_9 .frm_radio,
1445 -.frm_grid_9 .frm_checkbox{
1446 - width:9% !important;
1447 - margin-right:1%;
1448 -}
1449 -
1450 -.frm_grid_10 .frm_primary_label{
1451 - width:19% !important;
1452 -}
1453 -
1454 -.frm_grid_10 .frm_radio,
1455 -.frm_grid_10 .frm_checkbox{
1456 - width:8% !important;
1457 - margin-right:1%;
1458 -}
1459 -
1460 -.frm_form_field.frm_inline_container .frm_opt_container,
1461 -.frm_form_field.frm_right_container .frm_opt_container,
1462 -.frm_form_field.frm_left_container .frm_opt_container{
1463 - padding-top:4px;
1464 -}
1465 -
1466 1384 .with_frm_style .frm_inline_container.frm_grid_first .frm_primary_label,
1467 1385 .with_frm_style .frm_inline_container.frm_grid .frm_primary_label,
1468 1386 .with_frm_style .frm_inline_container.frm_grid_odd .frm_primary_label,
1469 1387 .with_frm_style .frm_inline_container.frm_grid_first .frm_opt_container,
@@ -1498,11 +1416,9 @@
1498 1416 grid-column-end: span 1;
1499 1417 }
1500 1418
1501 1419 .frm_form_field .frm_checkbox,
1502 -.frm_form_field .frm_checkbox + .frm_checkbox,
1503 -.frm_form_field .frm_radio,
1504 -.frm_form_field .frm_radio + .frm_radio{
1420 +.frm_form_field .frm_radio {
1505 1421 margin-top: 0;
1506 1422 margin-bottom: 0;
1507 1423 }
1508 1424
@@ -1511,36 +1427,24 @@
1511 1427 overflow:auto;
1512 1428 }
1513 1429
1514 1430 .frm_html_container.frm_scroll_box,
1515 -.frm_form_field.frm_html_scroll_box{
1516 - height:100px;
1517 - overflow:auto;
1518 - background-color:<?php echo esc_html( $defaults['bg_color'] ); ?>;
1519 - background-color:var(--bg-color);
1520 - border-color:<?php echo esc_html( $defaults['border_color'] ); ?>;
1521 - border-color:var(--border-color);
1522 - border-width:<?php echo esc_html( $defaults['field_border_width'] ); ?>;
1523 - border-width:var(--field-border-width);
1524 - border-style:<?php echo esc_html( $defaults['field_border_style'] ); ?>;
1525 - border-style:var(--field-border-style);
1526 - -moz-border-radius:<?php echo esc_html( $defaults['border_radius'] ); ?>;
1527 - -webkit-border-radius:<?php echo esc_html( $defaults['border_radius'] ); ?>;
1528 - border-radius:<?php echo esc_html( $defaults['border_radius'] ); ?>;
1529 - border-radius:var(--border-radius);
1530 - width:<?php echo esc_html( $defaults['field_width'] ); ?>;
1531 - width:var(--field-width);
1532 - max-width:100%;
1533 - font-size:<?php echo esc_html( $defaults['field_font_size'] ); ?>;
1534 - font-size:var(--field-font-size);
1535 - padding:<?php echo esc_html( $defaults['field_pad'] ); ?>;
1536 - padding:var(--field-pad);
1537 - -webkit-box-sizing:border-box;
1538 - -moz-box-sizing:border-box;
1539 - box-sizing:border-box;
1540 - outline:none<?php echo esc_html( $important ); ?>;
1541 - font-weight:normal;
1542 - box-shadow:var(--box-shadow);
1431 +.frm_form_field.frm_html_scroll_box {
1432 + height: 100px;
1433 + overflow: auto;
1434 + background-color: var(--bg-color);
1435 + border-color: var(--border-color);
1436 + border-width: var(--field-border-width);
1437 + border-style: var(--field-border-style);
1438 + border-radius: var(--border-radius);
1439 + width: var(--field-width);
1440 + max-width: 100%;
1441 + font-size: var(--field-font-size);
1442 + padding: var(--field-pad);
1443 + box-sizing: border-box;
1444 + outline: none<?php echo esc_html( $important ); ?>;
1445 + font-weight: normal;
1446 + box-shadow: var(--box-shadow);
1543 1447 }
1544 1448
1545 1449 .frm_form_field.frm_total_big input,
1546 1450 .frm_form_field.frm_total_big textarea,
@@ -1549,10 +1453,8 @@
1549 1453 opacity:1;
1550 1454 background-color:transparent !important;
1551 1455 border:none !important;
1552 1456 font-weight:bold;
1553 - -moz-box-shadow:none;
1554 - -webkit-box-shadow:none;
1555 1457 width:auto !important;
1556 1458 height:auto !important;
1557 1459 box-shadow:none !important;
1558 1460 display:inline;
@@ -1572,10 +1474,8 @@
1572 1474 .frm_form_field.frm_total input:focus,
1573 1475 .frm_form_field.frm_total textarea:focus{
1574 1476 background-color:transparent;
1575 1477 border:none;
1576 - -moz-box-shadow:none;
1577 - -webkit-box-shadow:none;
1578 1478 box-shadow:none;
1579 1479 }
1580 1480
1581 1481 .frm_form_field.frm_label_justify .frm_primary_label{
@@ -1600,13 +1500,8 @@
1600 1500 .frm_clearfix{
1601 1501 display:block;
1602 1502 }
1603 1503
1604 -.with_frm_style .frm_repeat_sec .frm_form_field.frm_repeat_buttons .frm_icon_font::before {
1605 - color:<?php echo esc_html( $defaults['repeat_icon_color'] . $important ); ?>;
1606 - color:var(--repeat-icon-color)<?php echo esc_html( $important ); ?>;
1607 -}
1608 -
1609 1504 .with_frm_style .frm_combo_inputs_container > .frm_form_subfield-first,
1610 1505 .with_frm_style .frm_combo_inputs_container > .frm_form_subfield-middle,
1611 1506 .with_frm_style .frm_combo_inputs_container > .frm_form_subfield-last {
1612 1507 margin-bottom: 0 !important;
@@ -1611,15 +1506,15 @@
1611 1506 .with_frm_style .frm_combo_inputs_container > .frm_form_subfield-last {
1612 1507 margin-bottom: 0 !important;
1613 1508 }
1614 1509
1510 +
1615 1511 <?php
1616 -FrmStylesHelper::maybe_include_font_icon_css();
1617 -
1618 1512 /**
1619 1513 * Call action so other plugins can add additional CSS.
1620 1514 *
1621 1515 * @param array $args {
1516 + *
1622 1517 * @type array $defaults
1623 1518 * }
1624 1519 */
1625 1520 do_action( 'frm_include_front_css', compact( 'defaults' ) );
@@ -1626,8 +1521,9 @@
1626 1521 ?>
1627 1522
1628 1523 /* Responsive */
1629 1524
1525 +<?php if ( $pro_is_installed ) { ?>
1630 1526 @media only screen and (max-width: 900px) {
1631 1527 .frm_form_field .frm_repeat_grid .frm_form_field.frm_sixth .frm_primary_label,
1632 1528 .frm_form_field .frm_repeat_grid .frm_form_field.frm_seventh .frm_primary_label,
1633 1529 .frm_form_field .frm_repeat_grid .frm_form_field.frm_eighth .frm_primary_label{
@@ -1633,8 +1529,9 @@
1633 1529 .frm_form_field .frm_repeat_grid .frm_form_field.frm_eighth .frm_primary_label{
1634 1530 display: block !important;
1635 1531 }
1636 1532 }
1533 +<?php } ?>
1637 1534
1638 1535 @media only screen and (max-width: 600px) {
1639 1536 .frm_form_field.frm_four_col .frm_opt_container{
1640 1537 grid-template-columns: repeat(2, 1fr);
@@ -1639,12 +1536,14 @@
1639 1536 .frm_form_field.frm_four_col .frm_opt_container{
1640 1537 grid-template-columns: repeat(2, 1fr);
1641 1538 }
1642 1539
1540 + <?php if ( $pro_is_installed ) { ?>
1643 1541 .with_frm_style .frm_repeat_inline,
1644 1542 .with_frm_style .frm_repeat_grid{
1645 1543 margin: 20px 0;
1646 1544 }
1545 + <?php } ?>
1647 1546 }
1648 1547
1649 1548 @media only screen and (max-width: 500px) {
1650 1549 .frm_form_field.frm_two_col .frm_radio,
@@ -1669,9 +1568,8 @@
1669 1568 max-width:302px;
1670 1569 border-right:1px solid #d3d3d3;
1671 1570 border-radius:4px;
1672 1571 box-shadow:2px 0px 4px -1px rgba(0,0,0,.08);
1673 - -moz-box-shadow:2px 0px 4px -1px rgba(0,0,0,.08);
1674 1572 }
1675 1573
1676 1574 .with_frm_style .g-recaptcha iframe,
1677 1575 .with_frm_style .frm-g-recaptcha iframe{
@@ -1677,7 +1575,18 @@
1677 1575 .with_frm_style .frm-g-recaptcha iframe{
1678 1576 width:100%;
1679 1577 }
1680 1578 }
1579 +
1580 +.frm-card-element .sq-card-wrapper .sq-card-message {
1581 + margin-bottom: 0;
1582 +}
1583 +.frm-card-errors:empty {
1584 + margin: 0;
1585 +}
1681 1586 <?php
1682 1587
1683 -echo strip_tags( FrmStylesController::get_custom_css() ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
1588 +$frm_custom_css = strip_tags( FrmStylesController::get_custom_css() );
1589 +
1590 +if ( $frm_custom_css ) {
1591 + echo FrmStylesHelper::maybe_scope_css_for_admin( $frm_custom_css ) . PHP_EOL; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
1592 +}