PluginProbe
Formidable Forms – WordPress Form Builder for Contact Forms, Calculators, Quizzes & More / 6.14
Formidable Forms – WordPress Form Builder for Contact Forms, Calculators, Quizzes & More v6.14
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 +293 -312 6.4.16.14 View file →
@@ -16,12 +16,14 @@
16 16 if ( ! isset( $frm_style ) ) {
17 17 $frm_style = new FrmStyle();
18 18 }
19 19
20 -$styles = $frm_style->get_all();
21 -$default_style = $frm_style->get_default_style( $styles );
22 -$defaults = FrmStylesHelper::get_settings_for_output( $default_style );
23 -$important = empty( $defaults['important_style'] ) ? '' : ' !important';
20 +$styles = $frm_style->get_all();
21 +$default_style = $frm_style->get_default_style( $styles );
22 +$defaults = FrmStylesHelper::get_settings_for_output( $default_style );
23 +$important = empty( $defaults['important_style'] ) ? '' : ' !important';
24 +$pro_is_installed = FrmAppHelper::pro_is_installed();
25 +$use_chosen_js = FrmStylesHelper::use_chosen_js();
24 26
25 27 ?>
26 28 .with_frm_style{
27 29 <?php FrmStylesHelper::output_vars( $defaults ); ?>
@@ -36,12 +38,12 @@
36 38
37 39 .with_frm_style,
38 40 .with_frm_style form,
39 41 .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 ); ?>;
42 + text-align: var(--form-align)<?php echo esc_html( $important ); ?>;
42 43 }
43 44
45 +/* Keep this. This is used for Honeypot */
44 46 input:-webkit-autofill {
45 47 -webkit-box-shadow: 0 0 0 30px white inset;
46 48 }
47 49
@@ -47,32 +49,29 @@
47 49
48 50 /* Form description */
49 51 .with_frm_style .frm-show-form div.frm_description p{
50 52 <?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 ); ?>;
53 + font-size: var(--form-desc-size)<?php echo esc_html( $important ); ?>;
53 54 <?php } ?>
54 55 <?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 ); ?>;
56 + color: var(--form-desc-color)<?php echo esc_html( $important ); ?>;
57 57 <?php } ?>
58 58 <?php if ( ! empty( $defaults['form_desc_margin_top'] ) ) { ?>
59 - margin-top:<?php echo esc_html( $defaults['form_desc_margin_top'] . $important ); ?>;
60 - margin-top:var(--form-desc-margin-top)<?php echo esc_html( $important ); ?>;
59 + margin-top: var(--form-desc-margin-top)<?php echo esc_html( $important ); ?>;
61 60 <?php } ?>
62 61 <?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 ); ?>;
62 + margin-bottom: var(--form-desc-margin-bottom)<?php echo esc_html( $important ); ?>;
65 63 <?php } ?>
66 64 <?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 ); ?>;
65 + padding: var(--form-desc-padding)<?php echo esc_html( $important ); ?>;
69 66 <?php } ?>
70 67 }
71 68
72 -form input.frm_verify{
73 - position:absolute;
74 - left:-3000px;
69 +form .<?php echo esc_html( FrmHoneypot::generate_class_name() ); ?> {
70 + overflow: hidden;
71 + width: 0;
72 + height: 0;
73 + position: absolute;
75 74 }
76 75
77 76 .with_frm_style fieldset{
78 77 min-width:0;
@@ -87,24 +86,20 @@
87 86 }
88 87
89 88 .with_frm_style .frm_form_fields > fieldset{
90 89 <?php if ( isset( $defaults['fieldset'] ) && ( $defaults['fieldset'] || '0' === $defaults['fieldset'] ) ) { ?>
91 - border-width:<?php echo esc_html( $defaults['fieldset'] . $important ); ?>;
92 - border-width:var(--fieldset)<?php echo esc_html( $important ); ?>;
90 + border-width: var(--fieldset)<?php echo esc_html( $important ); ?>;
93 91 <?php } ?>
94 92 border-style:solid;
95 93 <?php if ( ! empty( $defaults['fieldset_color'] ) ) { ?>
96 - border-color:<?php echo esc_html( $defaults['fieldset_color'] . $important ); ?>;
97 - border-color:var(--fieldset-color)<?php echo esc_html( $important ); ?>;
94 + border-color: var(--fieldset-color)<?php echo esc_html( $important ); ?>;
98 95 <?php } ?>
99 96 margin:0;
100 97 <?php if ( ! empty( $defaults['fieldset_padding'] ) ) { ?>
101 - padding:<?php echo esc_html( $defaults['fieldset_padding'] . $important ); ?>;
102 - padding:var(--fieldset-padding)<?php echo esc_html( $important ); ?>;
98 + padding: var(--fieldset-padding)<?php echo esc_html( $important ); ?>;
103 99 <?php } ?>
104 100 <?php if ( ! empty( $defaults['fieldset_bg_color'] ) ) { ?>
105 - background-color:<?php echo esc_html( $defaults['fieldset_bg_color'] ); ?>;
106 - background-color:var(--fieldset-bg-color)<?php echo esc_html( $important ); ?>;
101 + background-color: var(--fieldset-bg-color)<?php echo esc_html( $important ); ?>;
107 102 <?php } ?>
108 103 <?php if ( ! empty( $defaults['font'] ) ) { ?>
109 104 font-family:var(--font);
110 105 <?php } ?>
@@ -128,26 +123,21 @@
128 123
129 124 .with_frm_style legend + h3,
130 125 .with_frm_style h3.frm_form_title{
131 126 <?php if ( ! empty( $defaults['title_size'] ) ) { ?>
132 - font-size:<?php echo esc_html( $defaults['title_size'] . $important ); ?>;
133 - font-size:var(--title-size)<?php echo esc_html( $important ); ?>;
127 + font-size: var(--title-size)<?php echo esc_html( $important ); ?>;
134 128 <?php } ?>
135 129 <?php if ( ! empty( $defaults['title_color'] ) ) { ?>
136 - color:<?php echo esc_html( $defaults['title_color'] . $important ); ?>;
137 - color:var(--title-color)<?php echo esc_html( $important ); ?>;
130 + color: var(--title-color)<?php echo esc_html( $important ); ?>;
138 131 <?php } ?>
139 132 <?php if ( ! empty( $defaults['font'] ) ) { ?>
140 - font-family:<?php echo FrmAppHelper::kses( $defaults['font'] ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
141 - font-family:var(--font);
133 + font-family: var(--font);
142 134 <?php } ?>
143 135 <?php if ( ! empty( $defaults['title_margin_top'] ) ) { ?>
144 - margin-top:<?php echo esc_html( $defaults['title_margin_top'] . $important ); ?>;
145 - margin-top:var(--title-margin-top)<?php echo esc_html( $important ); ?>;
136 + margin-top: var(--title-margin-top)<?php echo esc_html( $important ); ?>;
146 137 <?php } ?>
147 138 <?php if ( ! empty( $defaults['title_margin_bottom'] ) ) { ?>
148 - margin-bottom:<?php echo esc_html( $defaults['title_margin_bottom'] . $important ); ?>;
149 - margin-bottom:var(--title-margin-bottom)<?php echo esc_html( $important ); ?>;
139 + margin-bottom: var(--title-margin-bottom)<?php echo esc_html( $important ); ?>;
150 140 <?php } ?>
151 141 }
152 142
153 143 .with_frm_style .frm_form_field.frm_html_container,
@@ -152,46 +142,42 @@
152 142
153 143 .with_frm_style .frm_form_field.frm_html_container,
154 144 .with_frm_style .frm_form_field .frm_show_it{
155 145 <?php if ( ! empty( $defaults['font'] ) ) { ?>
156 - font-family:<?php echo FrmAppHelper::kses( $defaults['font'] ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
157 - font-family:var(--font);
146 + font-family: var(--font);
158 147 <?php } ?>
159 148 <?php if ( ! empty( $defaults['form_desc_color'] ) ) { ?>
160 - color:<?php echo esc_html( $defaults['form_desc_color'] . $important ); ?>;
161 - color:var(--form-desc-color)<?php echo esc_html( $important ); ?>;
149 + color: var(--form-desc-color)<?php echo esc_html( $important ); ?>;
162 150 <?php } ?>
163 151 }
164 152
165 153 <?php if ( ! empty( $defaults['form_desc_size'] ) ) { ?>
166 154 .with_frm_style .frm_form_field.frm_html_container{
167 - font-size:<?php echo esc_html( $defaults['form_desc_size'] . $important ); ?>;
168 - font-size:var(--form-desc-size)<?php echo esc_html( $important ); ?>;
155 + font-size: var(--form-desc-size)<?php echo esc_html( $important ); ?>;
169 156 }
170 157 <?php } ?>
171 158
172 159 .with_frm_style .frm_form_field .frm_show_it{
173 160 <?php if ( ! empty( $defaults['field_font_size'] ) ) { ?>
174 - font-size:<?php echo esc_html( $defaults['field_font_size'] . $important ); ?>;
175 - font-size:var(--field-font-size)<?php echo esc_html( $important ); ?>;
161 + font-size: var(--field-font-size)<?php echo esc_html( $important ); ?>;
176 162 <?php } ?>
177 163 <?php if ( ! empty( $defaults['field_weight'] ) ) { ?>
178 - font-weight:<?php echo esc_html( $defaults['field_weight'] ); ?>;
179 - font-weight:var(--field-weight)<?php echo esc_html( $important ); ?>;
164 + font-weight: var(--field-weight)<?php echo esc_html( $important ); ?>;
180 165 <?php } ?>
181 166 }
182 167
183 -.with_frm_style .frm_required{
168 +.with_frm_style .frm_required {
184 169 <?php if ( ! empty( $defaults['required_color'] ) ) { ?>
185 - color:<?php echo esc_html( $defaults['required_color'] . $important ); ?>;
186 - color:var(--required-color)<?php echo esc_html( $important ); ?>;
170 + color: var(--required-color)<?php echo esc_html( $important ); ?>;
187 171 <?php } ?>
188 172 <?php if ( ! empty( $defaults['required_weight'] ) ) { ?>
189 - font-weight:<?php echo esc_html( $defaults['required_weight'] . $important ); ?>;
190 - font-weight:var(--required-weight)<?php echo esc_html( $important ); ?>;
173 + font-weight: var(--required-weight)<?php echo esc_html( $important ); ?>;
191 174 <?php } ?>
192 175 }
193 176
177 +<?php if ( $use_chosen_js ) { ?>
178 +.with_frm_style .chosen-container,
179 +<?php } ?>
194 180 .with_frm_style input[type=text],
195 181 .with_frm_style input[type=password],
196 182 .with_frm_style input[type=email],
197 183 .with_frm_style input[type=number],
@@ -199,14 +185,12 @@
199 185 .with_frm_style input[type=tel],
200 186 .with_frm_style input[type=search],
201 187 .with_frm_style select,
202 188 .with_frm_style textarea,
203 -.with_frm_style .frm-card-element.StripeElement,
204 -.with_frm_style .chosen-container{
189 +.with_frm_style .frm-card-element.StripeElement {
205 190 font-family:var(--font)<?php echo esc_html( $important ); ?>;
206 191 <?php if ( ! empty( $defaults['field_font_size'] ) ) { ?>
207 - font-size:<?php echo esc_html( $defaults['field_font_size'] ); ?>;
208 - font-size:var(--field-font-size)<?php echo esc_html( $important ); ?>;
192 + font-size: var(--field-font-size)<?php echo esc_html( $important ); ?>;
209 193 <?php } ?>
210 194 margin-bottom:0<?php echo esc_html( $important ); ?>;
211 195 }
212 196
@@ -229,48 +213,63 @@
229 213 .with_frm_style .frm_scroll_box .frm_opt_container,
230 214 .frm_form_fields_active_style,
231 215 .frm_form_fields_error_style,
232 216 .with_frm_style .frm-card-element.StripeElement,
217 +<?php if ( $use_chosen_js ) { ?>
233 218 .with_frm_style .chosen-container-multi .chosen-choices,
234 -.with_frm_style .chosen-container-single .chosen-single{
235 - color:<?php echo esc_html( $defaults['text_color'] ); ?>;
236 - color:var(--text-color)<?php echo esc_html( $important ); ?>;
237 - background-color:<?php echo esc_html( $defaults['bg_color'] . $important ); ?>;
238 - background-color:var(--bg-color)<?php echo esc_html( $important ); ?>;
239 -<?php if ( ! empty( $important ) ) { ?>
219 +.with_frm_style .chosen-container-single .chosen-single,
220 +<?php } ?>
221 +.with_frm_style .frm_slimselect.ss-main {
222 + color: var(--text-color)<?php echo esc_html( $important ); ?>;
223 + background-color: var(--bg-color)<?php echo esc_html( $important ); ?>;
224 + border-color: var(--border-color)<?php echo esc_html( $important ); ?>;
225 + border-width: var(--field-border-width)<?php echo esc_html( $important ); ?>;
226 + border-style: var(--field-border-style)<?php echo esc_html( $important ); ?>;
227 + border-radius: var(--border-radius)<?php echo esc_html( $important ); ?>;
228 + width: var(--field-width)<?php echo esc_html( $important ); ?>;
229 + max-width: 100%;
230 + font-size: var(--field-font-size)<?php echo esc_html( $important ); ?>;
231 + padding: var(--field-pad)<?php echo esc_html( $important ); ?>;
232 + box-sizing: border-box;
233 + outline: none<?php echo esc_html( $important ); ?>;
234 + font-weight: var(--field-weight);
235 +}
236 +
237 +<?php if ( ! empty( $important ) ) : ?>
238 + <?php if ( $use_chosen_js ) { ?>
239 + .with_frm_style .chosen-container-multi .chosen-choices,
240 + .with_frm_style .chosen-container-single .chosen-single,
241 + <?php } ?>
242 +.with_frm_style input[type=text],
243 +.with_frm_style input[type=password],
244 +.with_frm_style input[type=email],
245 +.with_frm_style input[type=number],
246 +.with_frm_style input[type=url],
247 +.with_frm_style input[type=tel],
248 +.with_frm_style input[type=phone],
249 +.with_frm_style input[type=search],
250 +.with_frm_style textarea,
251 +.frm_form_fields_style,
252 +.with_frm_style .frm_scroll_box .frm_opt_container,
253 +.frm_form_fields_active_style,
254 +.frm_form_fields_error_style,
255 +.with_frm_style .frm-card-element.StripeElement {
240 256 background-image:none !important;
241 -<?php } ?>
242 - border-color:<?php echo esc_html( $defaults['border_color'] ); ?>;
243 - border-color:var(--border-color)<?php echo esc_html( $important ); ?>;
244 - border-width:<?php echo esc_html( $defaults['field_border_width'] ); ?>;
245 - border-width:var(--field-border-width)<?php echo esc_html( $important ); ?>;
246 - border-style:<?php echo esc_html( $defaults['field_border_style'] ); ?>;
247 - border-style:var(--field-border-style)<?php echo esc_html( $important ); ?>;
248 - -moz-border-radius:<?php echo esc_html( $defaults['border_radius'] . $important ); ?>;
249 - -webkit-border-radius:<?php echo esc_html( $defaults['border_radius'] . $important ); ?>;
250 - border-radius:<?php echo esc_html( $defaults['border_radius'] ); ?>;
251 - border-radius:var(--border-radius)<?php echo esc_html( $important ); ?>;
252 - width:<?php echo esc_html( $defaults['field_width'] ); ?>;
253 - width:var(--field-width)<?php echo esc_html( $important ); ?>;
254 - max-width:100%;
255 - font-size:<?php echo esc_html( $defaults['field_font_size'] ); ?>;
256 - font-size:var(--field-font-size)<?php echo esc_html( $important ); ?>;
257 - padding:<?php echo esc_html( $defaults['field_pad'] ); ?>;
258 - padding:var(--field-pad)<?php echo esc_html( $important ); ?>;
259 - -webkit-box-sizing:border-box;
260 - -moz-box-sizing:border-box;
261 - box-sizing:border-box;
262 - outline:none<?php echo esc_html( $important ); ?>;
263 - font-weight:<?php echo esc_html( $defaults['field_weight'] ); ?>;
264 - font-weight:var(--field-weight);
265 - box-shadow:var(--box-shadow)<?php echo esc_html( $important ); ?>;
266 257 }
258 +<?php endif; ?>
267 259
260 +.with_frm_style select option {
261 + color: var(--text-color)<?php echo esc_html( $important ); ?>;
262 +}
263 +
264 +.with_frm_style select option.frm-select-placeholder {
265 + color: var(--text-color-disabled)<?php echo esc_html( $important ); ?>;
266 +}
267 +
268 268 .with_frm_style input[type=radio],
269 269 .with_frm_style input[type=checkbox]{
270 - border-color:<?php echo esc_html( $defaults['border_color'] . $important ); ?>;
271 - border-color:var(--border-color)<?php echo esc_html( $important ); ?>;
272 - box-shadow:var(--box-shadow)<?php echo esc_html( $important ); ?>;
270 + border-color: var(--border-color)<?php echo esc_html( $important ); ?>;
271 + box-shadow: var(--box-shadow)<?php echo esc_html( $important ); ?>;
273 272 float: none;
274 273 }
275 274
276 275 .with_frm_style input[type=radio]:after,
@@ -277,8 +276,18 @@
277 276 .with_frm_style input[type=checkbox]:after {
278 277 display: none; /* 2021 conflict */
279 278 }
280 279
280 +.with_frm_style input[type=radio]:not(:checked):focus,
281 +.with_frm_style input[type=checkbox]:not(:checked):focus {
282 + border-color: var(--border-color) !important;
283 +}
284 +
285 +.with_frm_style input[type=radio]:focus,
286 +.with_frm_style input[type=checkbox]:focus {
287 + box-shadow:0px 0px 0px 3px rgba(<?php echo esc_html( FrmStylesHelper::hex2rgb( $defaults['border_color_active'] ) ); ?>, 0.4) !important;
288 +}
289 +
281 290 .with_frm_style input[type=text],
282 291 .with_frm_style input[type=password],
283 292 .with_frm_style input[type=email],
284 293 .with_frm_style input[type=number],
@@ -287,10 +296,9 @@
287 296 .with_frm_style input[type=file],
288 297 .with_frm_style input[type=search],
289 298 .with_frm_style select,
290 299 .with_frm_style .frm-card-element.StripeElement{
291 - height:<?php echo esc_html( $defaults['field_height'] ); ?>;
292 - height:var(--field-height)<?php echo esc_html( $important ); ?>;
300 + min-height: var(--field-height)<?php echo esc_html( $important ); ?>;
293 301 line-height:1.3<?php echo esc_html( $important ); ?>;
294 302 }
295 303
296 304 .with_frm_style select[multiple=multiple]{
@@ -305,17 +313,15 @@
305 313 box-shadow:none;
306 314 }
307 315
308 316 .with_frm_style input[type=file]{
309 - color:<?php echo esc_html( $defaults['text_color'] ); ?>;
310 - color:var(--text-color)<?php echo esc_html( $important ); ?>;
311 - padding:0px;
317 + color: var(--text-color)<?php echo esc_html( $important ); ?>;
318 + padding: 0px;
312 319 <?php if ( ! empty( $defaults['font'] ) ) { ?>
313 - font-family:var(--font)<?php echo esc_html( $important ); ?>;
320 + font-family: var(--font)<?php echo esc_html( $important ); ?>;
314 321 <?php } ?>
315 - font-size:<?php echo esc_html( $defaults['field_font_size'] ); ?>;
316 - font-size:var(--field-font-size)<?php echo esc_html( $important ); ?>;
317 - display:initial;
322 + font-size: var(--field-font-size)<?php echo esc_html( $important ); ?>;
323 + display: initial;
318 324 }
319 325
320 326 .with_frm_style input[type=file].frm_transparent{
321 327 color:transparent<?php echo esc_html( $important ); ?>;
@@ -321,10 +327,9 @@
321 327 color:transparent<?php echo esc_html( $important ); ?>;
322 328 }
323 329
324 330 .with_frm_style .wp-editor-wrap{
325 - width:<?php echo esc_html( $defaults['field_width'] . $important ); ?>;
326 - width:var(--field-width)<?php echo esc_html( $important ); ?>;
331 + width: var(--field-width)<?php echo esc_html( $important ); ?>;
327 332 max-width:100%;
328 333 }
329 334
330 335 .with_frm_style .wp-editor-container textarea{
@@ -332,17 +337,15 @@
332 337 box-shadow:none !important;
333 338 }
334 339
335 340 .with_frm_style .mceIframeContainer{
336 - background-color:<?php echo esc_html( $defaults['bg_color'] . $important ); ?>;
337 - background-color:var(--bg-color)<?php echo esc_html( $important ); ?>;
341 + background-color: var(--bg-color)<?php echo esc_html( $important ); ?>;
338 342 }
339 343
340 344 .with_frm_style select{
341 - width:<?php echo esc_html( $defaults['auto_width'] ); ?>;
342 - width:var(--auto-width)<?php echo esc_html( $important ); ?>;
345 + width: var(--auto-width)<?php echo esc_html( $important ); ?>;
343 346 max-width:100%;
344 - background-position-y: center;
347 + background-position-y: calc(50% + 3px);
345 348 }
346 349
347 350 .with_frm_style input[disabled],
348 351 .with_frm_style select[disabled],
@@ -348,15 +351,12 @@
348 351 .with_frm_style select[disabled],
349 352 .with_frm_style textarea[disabled],
350 353 .with_frm_style input[readonly],
351 354 .with_frm_style select[readonly],
352 -.with_frm_style textarea[readonly]{
353 - background-color:<?php echo esc_html( $defaults['bg_color_disabled'] ); ?>;
354 - background-color:var(--bg-color-disabled)<?php echo esc_html( $important ); ?>;
355 - color:<?php echo esc_html( $defaults['text_color_disabled'] ); ?>;
356 - color:var(--text-color-disabled)<?php echo esc_html( $important ); ?>;
357 - border-color:<?php echo esc_html( $defaults['border_color_disabled'] ); ?>;
358 - border-color:var(--border-color-disabled)<?php echo esc_html( $important ); ?>;
355 +.with_frm_style textarea[readonly] {
356 + background-color: var(--bg-color-disabled)<?php echo esc_html( $important ); ?>;
357 + color: var(--text-color-disabled)<?php echo esc_html( $important ); ?>;
358 + border-color: var(--border-color-disabled)<?php echo esc_html( $important ); ?>;
359 359 }
360 360
361 361 .frm_preview_page:before{
362 362 content:normal !important;
@@ -368,30 +368,24 @@
368 368
369 369 .with_frm_style .frm_primary_label{
370 370 max-width:100%;
371 371 <?php if ( ! empty( $defaults['font'] ) ) { ?>
372 - font-family:<?php echo FrmAppHelper::kses( $defaults['font'] ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
373 - font-family:var(--font);
372 + font-family: var(--font);
374 373 <?php } ?>
375 374 <?php if ( ! empty( $defaults['font_size'] ) ) { ?>
376 - font-size:<?php echo esc_html( $defaults['font_size'] . $important ); ?>;
377 - font-size:var(--font-size)<?php echo esc_html( $important ); ?>;
375 + font-size: var(--font-size)<?php echo esc_html( $important ); ?>;
378 376 <?php } ?>
379 377 <?php if ( ! empty( $defaults['label_color'] ) ) { ?>
380 - color:<?php echo esc_html( $defaults['label_color'] . $important ); ?>;
381 - color:var(--label-color)<?php echo esc_html( $important ); ?>;
378 + color: var(--label-color)<?php echo esc_html( $important ); ?>;
382 379 <?php } ?>
383 380 <?php if ( ! empty( $defaults['weight'] ) ) { ?>
384 - font-weight:<?php echo esc_html( $defaults['weight'] . $important ); ?>;
385 - font-weight:var(--weight)<?php echo esc_html( $important ); ?>;
381 + font-weight: var(--weight)<?php echo esc_html( $important ); ?>;
386 382 <?php } ?>
387 383 <?php if ( ! empty( $defaults['align'] ) ) { ?>
388 - text-align:<?php echo esc_html( $defaults['align'] . $important ); ?>;
389 - text-align:var(--align)<?php echo esc_html( $important ); ?>;
384 + text-align: var(--align)<?php echo esc_html( $important ); ?>;
390 385 <?php } ?>
391 386 <?php if ( ! empty( $defaults['label_padding'] ) ) { ?>
392 - padding:<?php echo esc_html( $defaults['label_padding'] . $important ); ?>;
393 - padding:var(--label-padding)<?php echo esc_html( $important ); ?>;
387 + padding: var(--label-padding)<?php echo esc_html( $important ); ?>;
394 388 <?php } ?>
395 389 margin:0;
396 390 width:auto;
397 391 display:block;
@@ -444,9 +438,9 @@
444 438
445 439 /* Floating labels */
446 440 .with_frm_style .frm_inside_container {
447 441 position: relative;
448 - padding-top: 16px;
442 + padding-top: 18px;
449 443 padding-top: calc(0.5 * var(--field-height));
450 444 }
451 445
452 446 .with_frm_style .frm_inside_container > input,
@@ -455,8 +449,13 @@
455 449 display: block;
456 450 }
457 451
458 452 /* These do not work if they are combined */
453 +.with_frm_style input::placeholder,
454 +.with_frm_style textarea::placeholder {
455 + font-size: var(--field-font-size)<?php echo esc_html( $important ); ?>;
456 +}
457 +
459 458 .with_frm_style .frm_inside_container > input::-moz-placeholder,
460 459 .with_frm_style .frm_inside_container > textarea::-moz-placeholder {
461 460 opacity: 0 !important;
462 461 transition: opacity 0.3s ease-in;
@@ -477,9 +476,9 @@
477 476 .with_frm_style .frm_inside_container > label {
478 477 transition: all 0.3s ease-in;
479 478
480 479 position: absolute;
481 - top: 17px;
480 + top: 19px;
482 481 top: calc(1px + .5 * var(--field-height));
483 482 left: 3px;
484 483 width: 100%;
485 484
@@ -487,9 +486,9 @@
487 486 text-overflow: ellipsis;
488 487 overflow: hidden;
489 488 white-space: nowrap;
490 489
491 - padding: 6px 10px;
490 + padding: 8px 12px;
492 491 padding: var(--field-pad);
493 492
494 493 font-size: 14px;
495 494 font-size: var(--field-font-size);
@@ -495,9 +494,8 @@
495 494 font-size: var(--field-font-size);
496 495 font-weight: normal;
497 496 font-weight: var(--field-weight);
498 497
499 - -ms-pointer-events: none;
500 498 pointer-events: none;
501 499 }
502 500
503 501 .with_frm_style.frm_style_lines-no-boxes .frm_inside_container > label {
@@ -581,50 +579,39 @@
581 579 text-decoration:none !important;;
582 580 border:1px solid #eee;
583 581 display:inline-block;
584 582 <?php if ( ! empty( $defaults['submit_padding'] ) ) { ?>
585 - padding:<?php echo esc_html( $defaults['submit_padding'] . $important ); ?>;
586 - padding:var(--submit-padding)<?php echo esc_html( $important ); ?>;
583 + padding: var(--submit-padding)<?php echo esc_html( $important ); ?>;
587 584 <?php } else { ?>
588 585 padding:5px;
589 586 <?php } ?>
590 587 <?php if ( ! empty( $defaults['border_radius'] ) ) { ?>
591 - -moz-border-radius:<?php echo esc_html( $defaults['border_radius'] . $important ); ?>;
592 - -webkit-border-radius:<?php echo esc_html( $defaults['border_radius'] . $important ); ?>;
593 588 border-radius:<?php echo esc_html( $defaults['border_radius'] . $important ); ?>;
594 589 border-radius:var(--border-radius)<?php echo esc_html( $important ); ?>;
595 590 <?php } ?>
596 591 <?php if ( ! empty( $defaults['submit_font_size'] ) ) { ?>
597 - font-size:<?php echo esc_html( $defaults['submit_font_size'] . $important ); ?>;
598 - font-size:var(--submit-font-size)<?php echo esc_html( $important ); ?>;
592 + font-size: var(--submit-font-size)<?php echo esc_html( $important ); ?>;
599 593 <?php } ?>
600 594 <?php if ( ! empty( $defaults['font'] ) ) { ?>
601 - font-family:<?php echo FrmAppHelper::kses( $defaults['font'] . $important ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
602 - font-family:var(--font)<?php echo esc_html( $important ); ?>;
595 + font-family: var(--font)<?php echo esc_html( $important ); ?>;
603 596 <?php } ?>
604 597 <?php if ( ! empty( $defaults['submit_weight'] ) ) { ?>
605 - font-weight:<?php echo esc_html( $defaults['submit_weight'] . $important ); ?>;
606 - font-weight:var(--submit-weight)<?php echo esc_html( $important ); ?>;
598 + font-weight: var(--submit-weight)<?php echo esc_html( $important ); ?>;
607 599 <?php } ?>
608 600 <?php if ( ! empty( $defaults['submit_text_color'] ) ) { ?>
609 - color:<?php echo esc_html( $defaults['submit_text_color'] . $important ); ?>;
610 - color:var(--submit-text-color)<?php echo esc_html( $important ); ?>;
601 + color: var(--submit-text-color)<?php echo esc_html( $important ); ?>;
611 602 <?php } ?>
612 603 <?php if ( ! empty( $defaults['submit_bg_color'] ) ) { ?>
613 - background:<?php echo esc_html( $defaults['submit_bg_color'] . $important ); ?>;
614 - background:var(--submit-bg-color)<?php echo esc_html( $important ); ?>;
604 + background: var(--submit-bg-color)<?php echo esc_html( $important ); ?>;
615 605 <?php } ?>
616 606 <?php if ( ! empty( $defaults['submit_border_width'] ) ) { ?>
617 - border-width:<?php echo esc_html( $defaults['submit_border_width'] ); ?>;
618 - border-width:var(--submit-border-width)<?php echo esc_html( $important ); ?>;
607 + border-width: var(--submit-border-width)<?php echo esc_html( $important ); ?>;
619 608 <?php } ?>
620 609 <?php if ( ! empty( $defaults['submit_border_color'] ) ) { ?>
621 - border-color:<?php echo esc_html( $defaults['submit_border_color'] . $important ); ?>;
622 - border-color:var(--submit-border-color)<?php echo esc_html( $important ); ?>;
610 + border-color: var(--submit-border-color)<?php echo esc_html( $important ); ?>;
623 611 <?php } ?>
624 612 <?php if ( ! empty( $defaults['submit_height'] ) ) { ?>
625 - height:<?php echo esc_html( $defaults['submit_height'] . $important ); ?>;
626 - height:var(--submit-height)<?php echo esc_html( $important ); ?>;
613 + height: var(--submit-height)<?php echo esc_html( $important ); ?>;
627 614 <?php } ?>
628 615 }
629 616
630 617 <?php if ( ! empty( $defaults['submit_text_color'] ) ) { ?>
@@ -657,8 +644,12 @@
657 644 .with_frm_style.frm_center_submit .frm_submit{
658 645 text-align:center;
659 646 }
660 647
648 +.with_frm_style.frm_center_submit .frm_flex.frm_submit {
649 + justify-content: center;
650 +}
651 +
661 652 .with_frm_style .frm_inline_success .frm_submit{
662 653 display: flex;
663 654 flex-direction: row;
664 655 align-items: center;
@@ -702,9 +693,8 @@
702 693
703 694 .with_frm_style .frm_loading_prev .frm_prev_page,
704 695 .with_frm_style .frm_loading_form .frm_button_submit {
705 696 position: relative;
706 - opacity: .8;
707 697 color: transparent !important;
708 698 text-shadow: none !important;
709 699 }
710 700
@@ -730,9 +720,9 @@
730 720 border-top-color: transparent;
731 721 border-left-color: transparent;
732 722 border-radius: 50%;
733 723 box-sizing: border-box;
734 - <?php $loader_size = 20; ?>
724 + <?php $loader_size = 12; ?>
735 725 top: 50%;
736 726 left: 50%;
737 727 margin-top: -<?php echo absint( $loader_size / 2 ); ?>px;
738 728 margin-left: -<?php echo absint( $loader_size / 2 ); ?>px;
@@ -737,17 +727,23 @@
737 727 margin-top: -<?php echo absint( $loader_size / 2 ); ?>px;
738 728 margin-left: -<?php echo absint( $loader_size / 2 ); ?>px;
739 729 width: <?php echo absint( $loader_size ); ?>px;
740 730 height: <?php echo absint( $loader_size ); ?>px;
741 - -webkit-animation: spin 2s linear infinite;
742 - -moz-animation: spin 2s linear infinite;
743 - -o-animation: spin 2s linear infinite;
744 - animation: spin 2s linear infinite;
731 + animation: spin 2s linear infinite;
745 732 }
746 733
734 +.with_frm_style .frm_submit.frm_flex {
735 + align-items: center;
736 + gap: 2%;
737 +}
738 +
739 +.with_frm_style .frm_submit.frm_flex button.frm_button_submit ~ .frm_prev_page {
740 + order: -1;
741 +}
742 +
747 743 <?php
748 744 foreach ( $styles as $style ) {
749 - include( dirname( __FILE__ ) . '/_single_theme.css.php' );
745 + include __DIR__ . '/_single_theme.css.php';
750 746 unset( $style );
751 747 }
752 748
753 749 // Set it again since it may have been overridden.
@@ -769,15 +765,12 @@
769 765
770 766 .with_frm_style a.frm_save_draft,
771 767 .with_frm_style a.frm_start_over{
772 768 <?php if ( ! empty( $defaults['font'] ) ) { ?>
773 - font-family:<?php echo FrmAppHelper::kses( $defaults['font'] ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
774 - font-family:var(--font);
769 + font-family: var(--font);
775 770 <?php } ?>
776 - font-size:<?php echo esc_html( $defaults['submit_font_size'] ); ?>;
777 - font-size:var(--submit-font-size);
778 - font-weight:<?php echo esc_html( $defaults['submit_weight'] ); ?>;
779 - font-weight:var(--submit-weight);
771 + font-size: var(--submit-font-size);
772 + font-weight: var(--submit-weight);
780 773 }
781 774
782 775 .horizontal_radio .frm_radio{
783 776 margin:0 5px 0 0;
@@ -784,9 +777,9 @@
784 777 }
785 778
786 779 .horizontal_radio .frm_checkbox{
787 780 margin:0;
788 - margin-right:5px;
781 + margin-right:12px;
789 782 }
790 783
791 784 .vertical_radio .frm_checkbox,
792 785 .vertical_radio .frm_radio,
@@ -801,15 +794,13 @@
801 794 padding-left: 0;
802 795 }
803 796
804 797 .with_frm_style .frm_radio{
805 - display:<?php echo esc_html( $defaults['radio_align'] . $important ); ?>;
806 - display:var(--radio-align)<?php echo esc_html( $important ); ?>;
798 + display: var(--radio-align)<?php echo esc_html( $important ); ?>;
807 799 }
808 800
809 801 .with_frm_style .frm_checkbox{
810 - display:<?php echo esc_html( $defaults['check_align'] . $important ); ?>;
811 - display:var(--check-align)<?php echo esc_html( $important ); ?>;
802 + display: var(--check-align)<?php echo esc_html( $important ); ?>;
812 803 }
813 804
814 805 .with_frm_style .vertical_radio .frm_checkbox,
815 806 .with_frm_style .vertical_radio .frm_radio,
@@ -814,8 +805,9 @@
814 805 .with_frm_style .vertical_radio .frm_checkbox,
815 806 .with_frm_style .vertical_radio .frm_radio,
816 807 .vertical_radio .frm_catlevel_1{
817 808 display:block<?php echo esc_html( $important ); ?>;
809 + margin-bottom: 10px;
818 810 }
819 811
820 812 .with_frm_style .horizontal_radio .frm_checkbox,
821 813 .with_frm_style .horizontal_radio .frm_radio,
@@ -824,39 +816,39 @@
824 816 }
825 817
826 818 .with_frm_style .frm_checkbox label,
827 819 .with_frm_style .frm_radio label{
828 - display: inline;
829 - white-space:normal;
820 + display: flex;
821 + align-items: center;
822 + gap: 9px;
823 + white-space: normal;
830 824 }
831 825
826 +.with_frm_style .frm_checkbox label:not(.frm-label-disabled),
827 +.with_frm_style .frm_radio label:not(.frm-label-disabled) {
828 + cursor: pointer;
829 +}
830 +
832 831 .with_frm_style .vertical_radio .frm_checkbox label,
833 832 .with_frm_style .vertical_radio .frm_radio label{
834 - display: block;
835 - padding-left: 20px;
836 - text-indent: -20px;
833 + width: 100%;
837 834 }
838 835
839 836 .with_frm_style .frm_radio label,
840 -.with_frm_style .frm_checkbox label{
837 +.with_frm_style .frm_checkbox label {
841 838 <?php if ( ! empty( $defaults['font'] ) ) { ?>
842 - font-family:<?php echo FrmAppHelper::kses( $defaults['font'] ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
843 - font-family:var(--font);
839 + font-family: var(--font);
844 840 <?php } ?>
845 - font-size:<?php echo esc_html( $defaults['check_font_size'] . $important ); ?>;
846 - font-size:var(--check-font-size)<?php echo esc_html( $important ); ?>;
847 - color:<?php echo esc_html( $defaults['check_label_color'] . $important ); ?>;
848 - color:var(--check-label-color)<?php echo esc_html( $important ); ?>;
849 - font-weight:<?php echo esc_html( $defaults['check_weight'] . $important ); ?>;
850 - font-weight:var(--check-weight)<?php echo esc_html( $important ); ?>;
841 + font-size: var(--check-font-size)<?php echo esc_html( $important ); ?>;
842 + color: var(--check-label-color)<?php echo esc_html( $important ); ?>;
843 + font-weight: var(--check-weight)<?php echo esc_html( $important ); ?>;
851 844 line-height: 1.3;
852 845 }
853 846
854 847 .with_frm_style .frm_radio input[type=radio],
855 848 .with_frm_style .frm_checkbox input[type=checkbox] {
856 - font-size:<?php echo esc_html( $defaults['check_font_size'] . $important ); ?>;
857 - font-size:var(--check-font-size)<?php echo esc_html( $important ); ?>;
858 - position:static<?php echo esc_html( $important ); ?>;
849 + font-size: var(--check-font-size)<?php echo esc_html( $important ); ?>;
850 + position: static<?php echo esc_html( $important ); ?>;
859 851 }
860 852
861 853 .frm_file_container .frm_file_link,
862 854 .with_frm_style .frm_radio label .frm_file_container,
@@ -866,9 +858,9 @@
866 858 vertical-align:middle;
867 859 }
868 860
869 861 .with_frm_style .frm_radio input[type=radio]
870 -<?php if ( FrmAppHelper::pro_is_installed() ) : ?>
862 +<?php if ( $pro_is_installed ) : ?>
871 863 , .with_frm_style .frm_scale input[type=radio]
872 864 <?php endif; ?>
873 865 {
874 866 border-radius:50%;
@@ -874,59 +866,93 @@
874 866 border-radius:50%;
875 867 }
876 868
877 869 .with_frm_style .frm_checkbox input[type=checkbox]{
878 - border-radius:0;
870 + border-radius: calc(var(--border-radius) / 2);
879 871 }
880 872
881 873 .with_frm_style .frm_radio input[type=radio],
882 -<?php if ( FrmAppHelper::pro_is_installed() ) : ?>
883 -.with_frm_style .frm_scale input[type=radio],
874 +<?php if ( $pro_is_installed ) : ?>
875 +.with_frm_style .frm_scale input[type=radio],
884 876 <?php endif; ?>
885 877 .with_frm_style .frm_checkbox input[type=checkbox]{
886 - -webkit-appearance: none;
887 878 appearance: none;
888 879 background-color: var(--bg-color);
889 880 flex: none;
890 881 display:inline-block !important;
891 - margin: 0 5px 0 0;
882 + width: 16px;
883 + min-width: 16px;
884 + height: 16px;
892 885 color: var(--border-color);
893 - width: 18px;
894 - min-width: 18px;
895 - height: 18px;
896 886 border: 1px solid currentColor;
897 887 border-color: var(--border-color);
898 888 vertical-align: middle;
899 889 position: initial; /* override Bootstrap */
900 890 padding: 0;
891 + margin: 0;
901 892 }
902 893
903 -.with_frm_style .frm_radio input[type=radio]:before,
904 -<?php if ( FrmAppHelper::pro_is_installed() ) : ?>
905 -.with_frm_style .frm_scale input[type=radio]:before,
894 +.frm_forms.with_frm_style .frm_fields_container .frm_radio input[type=radio]:not([disabled]):checked,
895 +<?php if ( $pro_is_installed ) : ?>
896 +.frm_forms.with_frm_style .frm_fields_container .frm_scale input[type=radio]:not([disabled]):checked,
906 897 <?php endif; ?>
907 -.with_frm_style .frm_checkbox input[type=checkbox]:before {
898 +.frm_forms.with_frm_style .frm_fields_container .frm_checkbox input[type=checkbox]:not([disabled]):checked {
899 + border-color: var(--border-color-active) !important;
900 +}
901 +
902 +.frm_forms.with_frm_style .frm_fields_container .frm_checkbox input[type=checkbox]:not([disabled]):checked {
903 + background-color: var(--border-color-active) !important;
904 +}
905 +
906 +.with_frm_style .frm_radio input[type=radio][disabled]:checked,
907 +<?php if ( $pro_is_installed ) : ?>
908 +.with_frm_style .frm_scale input[type=radio][disabled]:checked,
909 +<?php endif; ?>
910 +.with_frm_style .frm_checkbox input[type=checkbox][disabled]:checked {
911 + border-color: var(--border-color) !important; /* Override Style Preview */
912 +}
913 +
914 +.with_frm_style .frm_checkbox input[type=checkbox][disabled]:checked {
915 + background-color: var(--border-color) !important;
916 +}
917 +
918 +.with_frm_style .frm_radio input[type=radio]:checked:before,
919 +<?php if ( $pro_is_installed ) { ?>
920 +.with_frm_style .frm_scale input[type=radio]:checked:before,
921 +<?php } ?>
922 +.with_frm_style .frm_checkbox input[type=checkbox]:checked:before {
923 + position: static !important; /* Override Style Preview */
908 924 content: '';
909 - width: 12px;
910 - height: 12px;
911 - border-radius: 50%;
912 - transform: scale(0);
913 - transition: 120ms transform ease-in-out;
914 - box-shadow: inset 10px 10px var(--text-color);
915 925 display: block;
916 - margin: 2px 0 0 2px;
917 926 }
918 927
919 -.with_frm_style .frm_checkbox input[type=checkbox]:before{
920 - clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
921 - border-radius: 0;
928 +.frm_forms.with_frm_style .frm_checkbox input[type=checkbox]:before {
929 + width: 100% !important;
930 + height: 100% !important;
931 + 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;
932 + background-size: 9px !important;
933 + background-repeat: no-repeat !important;
934 + background-position: center !important;
922 935 }
923 936
924 -.with_frm_style .frm_radio input[type=radio]:checked:before,
925 -.with_frm_style .frm_checkbox input[type=checkbox]:checked:before {
926 - transform: scale(1);
937 +<?php if ( $pro_is_installed ) { ?>
938 +.with_frm_style .frm_scale input[type=radio]:before,
939 +<?php } ?>
940 +.with_frm_style .frm_radio input[type=radio]:before {
941 + width: 8px;
942 + height: 8px;
943 + border-radius: 50%;
944 + background-color: var(--border-color-active);
945 + margin: 3px;
927 946 }
928 947
948 +<?php if ( $pro_is_installed ) { ?>
949 +.with_frm_style .frm_scale input[type=radio][disabled]:before,
950 +<?php } ?>
951 +.with_frm_style .frm_radio input[type=radio][disabled]:before {
952 + background-color: var(--border-color);
953 +}
954 +
929 955 .with_frm_style :invalid,
930 956 .with_frm_style :-moz-submit-invalid,
931 957 .with_frm_style :-moz-ui-invalid{
932 958 box-shadow:none;
@@ -944,33 +970,25 @@
944 970
945 971 .with_frm_style .frm_error_style,
946 972 .with_frm_style .frm_message,
947 973 .frm_success_style{
948 - -moz-border-radius:4px;
949 - -webkit-border-radius:4px;
950 974 border-radius:4px;
951 975 padding:15px;
952 976 }
953 977
954 -.with_frm_style .frm_message p{
955 - margin-bottom:5px;
956 - color:<?php echo esc_html( $defaults['success_text_color'] ); ?>;
957 - color:var(--success-text-color)<?php echo esc_html( $important ); ?>;
978 +.with_frm_style .frm_message p {
979 + margin-bottom: 5px;
980 + color: var(--success-text-color)<?php echo esc_html( $important ); ?>;
958 981 }
959 982
960 983 .with_frm_style .frm_message,
961 -.frm_success_style{
962 - margin:5px 0 15px;
963 - border:1px solid <?php echo esc_html( $defaults['success_border_color'] ); ?>;
964 - border-color:var(--success-border-color);
965 - background-color:<?php echo esc_html( $defaults['success_bg_color'] ); ?>;
966 - background-color:var(--success-bg-color);
967 - color:<?php echo esc_html( $defaults['success_text_color'] ); ?>;
968 - color:var(--success-text-color)<?php echo esc_html( $important ); ?>;
969 - border-radius:<?php echo esc_html( $defaults['border_radius'] ); ?>;
970 - border-radius:var(--border-radius);
971 - font-size:<?php echo esc_html( $defaults['success_font_size'] ); ?>;
972 - font-size:var(--success-font-size)<?php echo esc_html( $important ); ?>;
984 +.frm_success_style {
985 + margin: 5px 0 15px;
986 + border: 1px solid var(--success-border-color);
987 + background-color: var(--success-bg-color);
988 + color: var(--success-text-color)<?php echo esc_html( $important ); ?>;
989 + border-radius: var(--border-radius);
990 + font-size: var(--success-font-size)<?php echo esc_html( $important ); ?>;
973 991 }
974 992
975 993 .with_frm_style .frm_plain_success .frm_message {
976 994 background-color: transparent;
@@ -1006,10 +1024,9 @@
1006 1024 padding:5px;
1007 1025 border-width:1px;
1008 1026 border-style:solid;
1009 1027 <?php if ( ! empty( $defaults['border_color'] ) ) { ?>
1010 - border-color:<?php echo esc_html( $defaults['border_color'] ); ?>;
1011 - border-color:var(--border-color);
1028 + border-color: var(--border-color);
1012 1029 <?php } ?>
1013 1030 border-top:none;
1014 1031 border-left:none;
1015 1032 border-right:none;
@@ -1024,10 +1041,9 @@
1024 1041 }
1025 1042
1026 1043 <?php if ( ! empty( $defaults['border_color'] ) ) { ?>
1027 1044 .with_frm_style .frm-alt-table{
1028 - border-color:<?php echo esc_html( $defaults['border_color'] ); ?>;
1029 - border-color:var(--border-color);
1045 + border-color: var(--border-color);
1030 1046 }
1031 1047 <?php } ?>
1032 1048
1033 1049 .frm-alt-table th {
@@ -1051,11 +1067,11 @@
1051 1067 background-color:<?php echo esc_html( FrmStylesHelper::adjust_brightness( $defaults['border_color'], 45 ) ); ?>;
1052 1068 }
1053 1069
1054 1070 table.form_results.with_frm_style{
1055 - border:<?php echo esc_html( $defaults['field_border_width'] ); ?> solid <?php echo esc_html( $defaults['border_color'] . $important ); ?>;
1056 - border-width:var(--field-border-width)<?php echo esc_html( $important ); ?>;
1057 - border-color:var(--border-color)<?php echo esc_html( $important ); ?>;
1071 + border-style: solid;
1072 + border-width: var(--field-border-width)<?php echo esc_html( $important ); ?>;
1073 + border-color: var(--border-color)<?php echo esc_html( $important ); ?>;
1058 1074 }
1059 1075
1060 1076 table.form_results.with_frm_style tr td{
1061 1077 text-align:left;
@@ -1060,15 +1076,14 @@
1060 1076 table.form_results.with_frm_style tr td{
1061 1077 text-align:left;
1062 1078 padding:7px 9px;
1063 1079 <?php if ( ! empty( $defaults['text_color'] ) ) { ?>
1064 - color:<?php echo esc_html( $defaults['text_color'] ); ?>;
1065 - color:var(--text-color)<?php echo esc_html( $important ); ?>;
1080 + color: var(--text-color)<?php echo esc_html( $important ); ?>;
1066 1081 <?php } ?>
1067 1082 <?php if ( ! empty( $defaults['border_color'] ) ) { ?>
1068 - border-top:1px solid <?php echo esc_html( $defaults['border_color'] ); ?>;
1069 - border-top-width:var(--field-border-width)<?php echo esc_html( $important ); ?>;
1070 - border-top-color:var(--border-color)<?php echo esc_html( $important ); ?>;
1083 + border-top-style: solid;
1084 + border-top-width: var(--field-border-width)<?php echo esc_html( $important ); ?>;
1085 + border-top-color: var(--border-color)<?php echo esc_html( $important ); ?>;
1071 1086 <?php } ?>
1072 1087 }
1073 1088
1074 1089 table.form_results.with_frm_style tr.frm_even,
@@ -1078,11 +1093,10 @@
1078 1093 }
1079 1094
1080 1095 <?php if ( ! empty( $defaults['bg_color'] ) ) { ?>
1081 1096 table.form_results.with_frm_style tr.frm_odd,
1082 -.frm-grid .frm_odd{
1083 - background-color:<?php echo esc_html( $defaults['bg_color'] ); ?>;
1084 - background-color:var(--bg-color)<?php echo esc_html( $important ); ?>;
1097 +.frm-grid .frm_odd {
1098 + background-color: var(--bg-color)<?php echo esc_html( $important ); ?>;
1085 1099 }
1086 1100 <?php } ?>
1087 1101
1088 1102 <?php if ( ! empty( $defaults['border_color'] ) ) { ?>
@@ -1164,26 +1178,25 @@
1164 1178 animation:2s linear 0s normal none infinite progress-bar-stripes;
1165 1179 }
1166 1180
1167 1181 <?php if ( ! empty( $defaults['bg_color'] ) ) { ?>
1168 -#frm_loading .progress-striped .progress-bar{
1182 +#frm_loading .progress-striped .progress-bar {
1169 1183 <?php if ( ! empty( $defaults['border_color'] ) ) { ?>
1170 - 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));
1184 + 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));
1171 1185 <?php } ?>
1172 1186 background-size:40px 40px;
1173 1187 }
1174 1188 <?php } ?>
1175 1189
1176 -#frm_loading .progress-bar{
1177 - background-color:<?php echo esc_html( $defaults['bg_color'] ); ?>;
1178 - background-color:var(--bg-color);
1179 - box-shadow:0 -1px 0 rgba(0, 0, 0, 0.15) inset;
1180 - float:left;
1181 - height:100%;
1182 - line-height:20px;
1183 - text-align:center;
1184 - transition:width 0.6s ease 0s;
1185 - width:100%;
1190 +#frm_loading .progress-bar {
1191 + background-color: var(--bg-color);
1192 + box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15) inset;
1193 + float: left;
1194 + height: 100%;
1195 + line-height: 20px;
1196 + text-align: center;
1197 + transition: width 0.6s ease 0s;
1198 + width: 100%;
1186 1199 }
1187 1200
1188 1201 .frm_image_from_url{
1189 1202 height:50px;
@@ -1200,9 +1213,9 @@
1200 1213 background-repeat: no-repeat;
1201 1214 color: transparent !important;
1202 1215 }
1203 1216
1204 -<?php readfile( dirname( __FILE__ ) . '/frm_grids.css' ); ?>
1217 +<?php readfile( __DIR__ . '/frm_grids.css' ); ?>
1205 1218
1206 1219 .frm_conf_field.frm_left_container .frm_primary_label{
1207 1220 display:none;
1208 1221 }
@@ -1209,10 +1222,8 @@
1209 1222
1210 1223 .wp-editor-wrap *,
1211 1224 .wp-editor-wrap *:after,
1212 1225 .wp-editor-wrap *:before{
1213 - -webkit-box-sizing:content-box;
1214 - -moz-box-sizing:content-box;
1215 1226 box-sizing:content-box;
1216 1227 }
1217 1228
1218 1229 .with_frm_style .frm_grid,
@@ -1223,10 +1234,9 @@
1223 1234 padding:5px;
1224 1235 border-width:1px;
1225 1236 border-style:solid;
1226 1237 <?php if ( ! empty( $defaults['border_color'] ) ) { ?>
1227 - border-color:<?php echo esc_html( $defaults['border_color'] ); ?>;
1228 - border-color:var(--border-color)<?php echo esc_html( $important ); ?>;
1238 + border-color: var(--border-color)<?php echo esc_html( $important ); ?>;
1229 1239 <?php } ?>
1230 1240 border-left:none;
1231 1241 border-right:none;
1232 1242 }
@@ -1261,18 +1271,16 @@
1261 1271 }
1262 1272
1263 1273 <?php if ( ! empty( $defaults['bg_color'] ) ) { ?>
1264 1274 .frm_grid_first,
1265 -.frm_grid_odd{
1266 - background-color:<?php echo esc_html( $defaults['bg_color'] ); ?>;
1267 - background-color:var(--bg-color);
1275 +.frm_grid_odd {
1276 + background-color: var(--bg-color);
1268 1277 }
1269 1278 <?php } ?>
1270 1279
1271 1280 <?php if ( ! empty( $defaults['bg_color_active'] ) ) { ?>
1272 -.frm_grid{
1273 - background-color:<?php echo esc_html( $defaults['bg_color_active'] . $important ); ?>;
1274 - background-color:var(--bg-color-active)<?php echo esc_html( $important ); ?>;
1281 +.frm_grid {
1282 + background-color: var(--bg-color-active)<?php echo esc_html( $important ); ?>;
1275 1283 }
1276 1284 <?php } ?>
1277 1285
1278 1286 .with_frm_style .frm_grid.frm_blank_field,
@@ -1277,12 +1285,10 @@
1277 1285
1278 1286 .with_frm_style .frm_grid.frm_blank_field,
1279 1287 .with_frm_style .frm_grid_first.frm_blank_field,
1280 1288 .with_frm_style .frm_grid_odd.frm_blank_field{
1281 - background-color:<?php echo esc_html( $defaults['error_bg'] . $important ); ?>;
1282 1289 background-color:var(--error-bg)<?php echo esc_html( $important ); ?>;
1283 - border-color:<?php echo esc_html( $defaults['error_border'] ); ?>;
1284 - border-color:var(--error-bg);
1290 + border-color: var(--error-border);
1285 1291 }
1286 1292
1287 1293 .frm_grid .frm_primary_label,
1288 1294 .frm_grid_first .frm_primary_label,
@@ -1468,11 +1474,9 @@
1468 1474 grid-column-end: span 1;
1469 1475 }
1470 1476
1471 1477 .frm_form_field .frm_checkbox,
1472 -.frm_form_field .frm_checkbox + .frm_checkbox,
1473 -.frm_form_field .frm_radio,
1474 -.frm_form_field .frm_radio + .frm_radio{
1478 +.frm_form_field .frm_radio {
1475 1479 margin-top: 0;
1476 1480 margin-bottom: 0;
1477 1481 }
1478 1482
@@ -1481,36 +1485,24 @@
1481 1485 overflow:auto;
1482 1486 }
1483 1487
1484 1488 .frm_html_container.frm_scroll_box,
1485 -.frm_form_field.frm_html_scroll_box{
1486 - height:100px;
1487 - overflow:auto;
1488 - background-color:<?php echo esc_html( $defaults['bg_color'] ); ?>;
1489 - background-color:var(--bg-color);
1490 - border-color:<?php echo esc_html( $defaults['border_color'] ); ?>;
1491 - border-color:var(--border-color);
1492 - border-width:<?php echo esc_html( $defaults['field_border_width'] ); ?>;
1493 - border-width:var(--field-border-width);
1494 - border-style:<?php echo esc_html( $defaults['field_border_style'] ); ?>;
1495 - border-style:var(--field-border-style);
1496 - -moz-border-radius:<?php echo esc_html( $defaults['border_radius'] ); ?>;
1497 - -webkit-border-radius:<?php echo esc_html( $defaults['border_radius'] ); ?>;
1498 - border-radius:<?php echo esc_html( $defaults['border_radius'] ); ?>;
1499 - border-radius:var(--border-radius);
1500 - width:<?php echo esc_html( $defaults['field_width'] ); ?>;
1501 - width:var(--field-width);
1502 - max-width:100%;
1503 - font-size:<?php echo esc_html( $defaults['field_font_size'] ); ?>;
1504 - font-size:var(--field-font-size);
1505 - padding:<?php echo esc_html( $defaults['field_pad'] ); ?>;
1506 - padding:var(--field-pad);
1507 - -webkit-box-sizing:border-box;
1508 - -moz-box-sizing:border-box;
1509 - box-sizing:border-box;
1510 - outline:none<?php echo esc_html( $important ); ?>;
1511 - font-weight:normal;
1512 - box-shadow:var(--box-shadow);
1489 +.frm_form_field.frm_html_scroll_box {
1490 + height: 100px;
1491 + overflow: auto;
1492 + background-color: var(--bg-color);
1493 + border-color: var(--border-color);
1494 + border-width: var(--field-border-width);
1495 + border-style: var(--field-border-style);
1496 + border-radius: var(--border-radius);
1497 + width: var(--field-width);
1498 + max-width: 100%;
1499 + font-size: var(--field-font-size);
1500 + padding: var(--field-pad);
1501 + box-sizing: border-box;
1502 + outline: none<?php echo esc_html( $important ); ?>;
1503 + font-weight: normal;
1504 + box-shadow: var(--box-shadow);
1513 1505 }
1514 1506
1515 1507 .frm_form_field.frm_total_big input,
1516 1508 .frm_form_field.frm_total_big textarea,
@@ -1519,10 +1511,8 @@
1519 1511 opacity:1;
1520 1512 background-color:transparent !important;
1521 1513 border:none !important;
1522 1514 font-weight:bold;
1523 - -moz-box-shadow:none;
1524 - -webkit-box-shadow:none;
1525 1515 width:auto !important;
1526 1516 height:auto !important;
1527 1517 box-shadow:none !important;
1528 1518 display:inline;
@@ -1542,10 +1532,8 @@
1542 1532 .frm_form_field.frm_total input:focus,
1543 1533 .frm_form_field.frm_total textarea:focus{
1544 1534 background-color:transparent;
1545 1535 border:none;
1546 - -moz-box-shadow:none;
1547 - -webkit-box-shadow:none;
1548 1536 box-shadow:none;
1549 1537 }
1550 1538
1551 1539 .frm_form_field.frm_label_justify .frm_primary_label{
@@ -1570,13 +1558,8 @@
1570 1558 .frm_clearfix{
1571 1559 display:block;
1572 1560 }
1573 1561
1574 -.with_frm_style .frm_repeat_sec .frm_form_field.frm_repeat_buttons .frm_icon_font::before {
1575 - color:<?php echo esc_html( $defaults['repeat_icon_color'] . $important ); ?>;
1576 - color:var(--repeat-icon-color)<?php echo esc_html( $important ); ?>;
1577 -}
1578 -
1579 1562 .with_frm_style .frm_combo_inputs_container > .frm_form_subfield-first,
1580 1563 .with_frm_style .frm_combo_inputs_container > .frm_form_subfield-middle,
1581 1564 .with_frm_style .frm_combo_inputs_container > .frm_form_subfield-last {
1582 1565 margin-bottom: 0 !important;
@@ -1581,11 +1564,10 @@
1581 1564 .with_frm_style .frm_combo_inputs_container > .frm_form_subfield-last {
1582 1565 margin-bottom: 0 !important;
1583 1566 }
1584 1567
1568 +
1585 1569 <?php
1586 -FrmStylesHelper::maybe_include_font_icon_css();
1587 -
1588 1570 /**
1589 1571 * Call action so other plugins can add additional CSS.
1590 1572 *
1591 1573 * @param array $args {
@@ -1639,9 +1621,8 @@
1639 1621 max-width:302px;
1640 1622 border-right:1px solid #d3d3d3;
1641 1623 border-radius:4px;
1642 1624 box-shadow:2px 0px 4px -1px rgba(0,0,0,.08);
1643 - -moz-box-shadow:2px 0px 4px -1px rgba(0,0,0,.08);
1644 1625 }
1645 1626
1646 1627 .with_frm_style .g-recaptcha iframe,
1647 1628 .with_frm_style .frm-g-recaptcha iframe{