PluginProbe ʕ •ᴥ•ʔ
Everest Forms – Contact Form, Payment Form, Quiz, Survey & Custom Form Builder with AI / 3.5.2
Everest Forms – Contact Form, Payment Form, Quiz, Survey & Custom Form Builder with AI v3.5.2
3.5.2 3.5.1 3.5.0 3.4.8 3.4.7 3.4.6 1.1.0 1.1.1 1.1.2 1.1.3 1.1.4 1.1.5 1.1.5.1 1.1.6 1.1.7 1.1.8 1.1.9 1.2.0 1.2.1 1.2.2 1.2.3 1.2.4 1.3.0 1.3.1 1.3.2 1.3.3 1.3.4 1.4.0 1.4.1 1.4.2 1.4.3 1.4.4 1.4.5 1.4.6 1.4.7 1.4.8 1.4.9 1.5.0 1.5.1 1.5.10 1.5.2 1.5.3 1.5.4 1.5.5 1.5.6 1.5.7 1.5.8 1.5.9 1.6.0 1.6.1 1.6.2 1.6.3 1.6.4 1.6.5 1.6.6 1.6.6.1 1.6.7 1.7.0 1.7.0.1 1.7.0.2 1.7.0.3 1.7.1 1.7.2 1.7.2.1 1.7.2.2 1.7.3 1.7.4 1.7.5 1.7.5.1 1.7.5.2 1.7.6 1.7.7 1.7.7.1 1.7.7.2 1.7.8 1.7.9 1.8.0 1.8.0.1 1.8.1 1.8.2 1.8.2.1 1.8.2.2 1.8.2.3 1.8.3 1.8.4 1.8.5 1.8.6 1.8.7 1.8.8 1.8.9 1.9.0 1.9.0.1 1.9.1 1.9.2 1.9.3 1.9.4 1.9.4.1 1.9.5 1.9.6 1.9.7 1.9.8 1.9.9 2.0.0 2.0.0.1 2.0.1 2.0.2 2.0.3 2.0.3.1 2.0.4 2.0.4.1 2.0.5 2.0.6 2.0.7 2.0.8 2.0.8.1 2.0.9 3.0.0 3.0.0.1 3.0.1 3.0.2 3.0.3 3.0.3.1 3.0.4 3.0.4.1 3.0.4.2 3.0.5 3.0.5.1 3.0.5.2 3.0.6 3.0.6.1 3.0.7.1 3.0.8 3.0.8.1 3.0.9 3.0.9.1 3.0.9.2 3.0.9.3 3.0.9.4 3.0.9.5 3.1.0 3.1.1 3.1.2 3.2.0 3.2.1 3.2.2 3.2.3 3.2.4 3.2.5 3.2.6 3.3.0 3.4.0 3.4.1 3.4.2 3.4.2.1 3.4.3 3.4.4 3.4.5 trunk 1.0 1.0.1 1.0.2 1.0.3
everest-forms / addons / StyleCustomizer / includes / views / scss.php
everest-forms / addons / StyleCustomizer / includes / views Last commit date
scss.php 4 months ago
scss.php
834 lines
1 <?php
2 /**
3 * EverestForms Style Customizer SCSS
4 *
5 * @package EverestForms_Style_Customizer
6 * @since 1.0.0
7 */
8
9 defined( 'ABSPATH' ) || exit;
10
11
12
13 // Get values.
14 $styles = get_option( 'everest_forms_styles' );
15
16 $palette_key = null;
17 if ( isset( $_REQUEST['action'] ) && $_REQUEST['action'] === 'everest_forms_save_form' ) {
18 if ( isset( $styles[ $form_id ]['color_palette'] ) && is_array( $styles[ $form_id ]['color_palette'] ) ) {
19 $colorPaletteKeys = array_keys( $styles[ $form_id ]['color_palette'] );
20 $colorPaletteKey = $colorPaletteKeys[0];
21 $palette_key = $colorPaletteKey;
22 }
23 }
24
25
26 if ( isset( $_REQUEST['customized'] ) ) {
27 $current_color_palette = json_decode( wp_unslash( $_REQUEST['customized'] ), true );
28 $palette_key = null;
29 foreach ( $current_color_palette as $key => $value ) {
30 if ( preg_match( '/everest_forms_styles\[(\d+)\]\[color_palette\]\[(color_\d+)\]/', $key, $matches ) ) {
31 $form_id = $matches[1];
32 $palette_key = $matches[2];
33 break;
34 }
35 }
36 }
37
38 if ( null === $palette_key && ! isset( $_REQUEST['customized'] ) && ! isset( $_REQUEST['action'] ) ) {
39 if ( isset( $styles[ $form_id ]['color_palette'] ) && is_array( $styles[ $form_id ]['color_palette'] ) ) {
40 $colorPaletteKeys = array_keys( $styles[ $form_id ]['color_palette'] );
41 $colorPaletteKey = $colorPaletteKeys[0];
42 $palette_key = $colorPaletteKey;
43 }
44 }
45
46
47 if ( $form_id && $palette_key && isset( $current_color_palette[ "everest_forms_styles[$form_id][color_palette][$palette_key]" ] ) ) {
48 $new_palette = $current_color_palette[ "everest_forms_styles[$form_id][color_palette][$palette_key]" ];
49 $styles[ $form_id ]['color_palette'] = array(
50 $palette_key => $new_palette,
51 );
52 }
53
54 if ( isset( $styles[ $form_id ] ) && is_array( $styles[ $form_id ] ) ) {
55 $styles[ $form_id ] = array_map(
56 function ( $styles ) {
57 if ( is_array( $styles ) ) {
58 return array_filter( $styles );
59 } else {
60 return $styles;
61 }
62 },
63 $styles[ $form_id ]
64 );
65 }
66
67
68 $styles[ $form_id ] = is_array( $styles[ $form_id ] ) ? array_filter( $styles[ $form_id ] ) : array();
69 $values = array_replace_recursive( $defaults, $styles[ $form_id ] ); // phpcs:ignore PHPCompatibility.PHP.NewFunctions.array_replace_recursiveFound
70 // Search for JSON formatted values and convert it to array format.
71 foreach ( $values as $key => $styles ) {
72 if ( is_array( $styles ) ) {
73 foreach ( $styles as $style => $value ) {
74 if ( is_string( $value ) && evf_is_json( $value ) ) {
75 $values[ $key ][ $style ] = (array) json_decode( $value );
76 }
77 }
78 }
79 }
80
81 if ( $palette_key === 'color_0' ) {
82 $custom_color_palette = get_option( 'everest_forms_custom_color_palettes' );
83 foreach ( $custom_color_palette[0]['colors'] as $color_key => $color_value ) {
84 $values['color_palette'][ $palette_key ][ $color_key ] = $color_value;
85 }
86 }
87
88 $backward_compatibility_color = get_option( 'everest_forms_styles' );
89 $backward_compatibility_color_key = isset( $backward_compatibility_color[ $form_id ]['color_palette']['color_12'] ) ? $backward_compatibility_color[ $form_id ]['color_palette']['color_12'] : '';
90 if ( ! empty( $backward_compatibility_color_key ) ) {
91 $palette_key = 'color_12';
92 $values['color_palette']['color_12'] = $backward_compatibility_color_key;
93 } elseif ( ! $palette_key ) {
94 if ( isset( $backward_compatibility_color[ $form_id ]['color_palette'] ) && is_array( $backward_compatibility_color[ $form_id ]['color_palette'] ) ) {
95 $colorPaletteKeys = array_keys( $backward_compatibility_color[ $form_id ]['color_palette'] );
96 $colorPaletteKey = $colorPaletteKeys[0];
97 $palette_key = $colorPaletteKey;
98 } else {
99 $palette_key = 'color_13';
100 if ( function_exists( 'get_theme_mod' ) ) {
101 $values['color_palette']['color_13'] = array(
102 'form_background' => '#' . get_theme_mod( 'background_color', 'ffffff' ),
103 'field_background' => '#' . get_theme_mod( 'background_color', 'ffffff' ),
104 'field_label' => get_theme_mod( 'text_color', '#333333' ),
105 'field_sublabel' => get_theme_mod( 'text_color', '#666666' ),
106 'button_text' => get_theme_mod( 'button_text_color', '#ffffff' ),
107 'button_background' => get_theme_mod( 'primary_color', '#0073aa' ),
108 );
109 } else {
110 $values['color_palette']['color_13'] = array(
111 'form_background' => '#ffffff',
112 'field_background' => '#ffffff',
113 'field_label' => '#333333',
114 'field_sublabel' => '#666666',
115 'button_text' => '#ffffff',
116 'button_background' => '#0073aa',
117 );
118 }
119 }
120 }
121
122 if ( null === $palette_key && isset( $_COOKIE['color_palette_save'] ) ) {
123 $palette_key = $_COOKIE['color_palette_save'];
124 }
125
126 // Form data.
127 $form_data = EVF()->form->get( $form_id, array( 'content_only' => true ) );
128
129 // Font styles.
130 $font_styles = array(
131 'font-weight' => 'bold',
132 'font-style' => 'italic',
133 'text-decoration' => 'underline',
134 'text-transform' => 'uppercase',
135 );
136 $font_styles_default = array(
137 'font-weight' => 'normal',
138 'font-style' => 'normal',
139 'text-decoration' => 'none',
140 'text-transform' => 'none',
141 );
142
143 // Radio/checkbox separator type.
144 $radio_checkbox_seperator_type = defined( 'EVF_VERSION' ) && version_compare( EVF_VERSION, '1.6.0', '<' ) ? array( 'checkbox_radio_margin', 'checkbox_radio_padding' ) : array( 'checkbox_radio_margin' );
145 ?>
146
147 // Form Container variables.
148 $container_width: <?php echo absint( $values['form_container']['width'] ); ?>;
149 $container_border_type: <?php echo evf_clean( $values['form_container']['border_type'] ); ?>;
150 $container__border_color: <?php echo evf_clean( $values['form_container']['border_color'] ); ?>;
151
152
153 //Field Labels Variables.
154 $field_label_font_color : <?php echo isset( $values['color_palette'][ $palette_key ]['field_label'] ) ? evf_clean( $values['color_palette'][ $palette_key ]['field_label'] ) : ''; ?>;
155 $field_label_font_size: <?php echo evf_clean( $values['typography']['field_labels_font_size'] ); ?>;
156 $field_label_line_height: <?php echo evf_clean( $values['typography']['field_labels_line_height'] ); ?>;
157 $field_label_text_alignment: <?php echo evf_clean( $values['typography']['field_labels_text_alignment'] ); ?>;
158
159 // Field Sublabels Variables.
160 $field_sublabel_font_color: <?php echo isset( $values['color_palette'][ $palette_key ]['field_sublabel'] ) ? evf_clean( $values['color_palette'][ $palette_key ]['field_sublabel'] ) : ''; ?>;
161 $field_sublabel_font_size: <?php echo evf_clean( $values['typography']['field_sublabels_font_size'] ); ?>;
162 $field_sublabel_line_height: <?php echo evf_clean( $values['typography']['field_sublabels_line_height'] ); ?>;
163 $field_sublabel_text_alignment: <?php echo evf_clean( $values['typography']['field_sublabels_text_alignment'] ); ?>;
164
165 // Field Styles Typography.
166 $field_styles_font_color: <?php echo evf_clean( $values['typography']['field_styles_font_color'] ); ?>;
167 $field_styles_border_type: <?php echo evf_clean( $values['field_styles']['border_type'] ); ?>;
168 $field_styles_placeholder_font_color: <?php echo evf_clean( $values['typography']['field_styles_placeholder_font_color'] ); ?>;
169 $field_styles_font_size: <?php echo evf_clean( $values['typography']['field_styles_font_size'] ); ?>;
170 $field_styles_alignment: <?php echo evf_clean( $values['typography']['field_styles_alignment'] ); ?>;
171 $field_styles_border_color: <?php echo evf_clean( $values['typography']['field_styles_border_color'] ); ?>;
172 $field_styles_border_focus_color: <?php echo evf_clean( $values['typography']['field_styles_border_focus_color'] ); ?>;
173
174 // File Uploads styles variables.
175 $file_upload_styles_font_color: <?php echo evf_clean( $values['typography']['file_upload_font_color'] ); ?>;
176 $file_upload_styles_font_size: <?php echo evf_clean( $values['typography']['file_upload_font_size'] ); ?>;
177 $file_upload_styles_border_type: <?php echo evf_clean( $values['file_upload_styles']['border_type'] ); ?>;
178 $file_upload_styles_border_color: <?php echo evf_clean( $values['typography']['file_upload_border_color'] ); ?>;
179 $file_upload_styles_icon_color: <?php echo evf_clean( $values['typography']['file_upload_icon_color'] ); ?>;
180
181 // Field Checkbox and Radio variables.
182 $radio_checkbox_styles__font_color: <?php echo evf_clean( $values['typography']['checkbox_radio_font_color'] ); ?>;
183 $radio_checkbox_styles_alignment: <?php echo evf_clean( $values['typography']['checkbox_radio_alignment'] ); ?>;
184 $radio_checkbox_styles__font_size: <?php echo evf_clean( $values['typography']['checkbox_radio_font_size'] ); ?>;
185 $radio_checkbox_styles__size: <?php echo evf_clean( $values['typography']['checkbox_radio_size'] ); ?>;
186 $radio_checkbox_styles_color: <?php echo evf_clean( $values['typography']['checkbox_radio_color'] ); ?>;
187 $radio_checkbox_styles_checked_color: <?php echo evf_clean( $values['typography']['checkbox_radio_checked_color'] ); ?>;
188
189 // Field description variables.
190 $field_description_font_color: <?php echo evf_clean( $values['typography']['field_description_font_color'] ); ?>;
191 $field_description_font_size: <?php echo evf_clean( $values['typography']['field_description_font_size'] ); ?>;
192 $field_description_line_height: <?php echo evf_clean( $values['typography']['field_description_line_height'] ); ?>;
193 $field_description_text_alignment: <?php echo evf_clean( $values['typography']['field_description_text_alignment'] ); ?>;
194
195 // Section Title styles variables.
196 $section_title_font_color: <?php echo evf_clean( $values['typography']['section_title_font_color'] ); ?>;
197 $section_title_font_size: <?php echo evf_clean( $values['typography']['section_title_font_size'] ); ?>;
198 $section_title_alignment: <?php echo evf_clean( $values['typography']['section_title_text_alignment'] ); ?>;
199 $section_title_line_height: <?php echo evf_clean( $values['typography']['section_title_line_height'] ); ?>;
200
201 // Button styles variables.
202 $button_font_color: <?php echo isset( $values['color_palette'][ $palette_key ]['button_text'] ) ? evf_clean( $values['color_palette'][ $palette_key ]['button_text'] ) : ''; ?>;
203 $button_hover_font_color: <?php echo evf_clean( $values['typography']['button_hover_font_color'] ); ?>;
204 $button_font_size: <?php echo evf_clean( $values['typography']['button_font_size'] ); ?>;
205 $button_line_height: <?php echo evf_clean( $values['typography']['button_line_height'] ); ?>;
206 $button_border_type: <?php echo evf_clean( $values['button']['border_type'] ); ?>;
207 $button_border_color: <?php echo evf_clean( $values['typography']['button_border_color'] ); ?>;
208 $button_border_hover_color: <?php echo evf_clean( $values['typography']['button_border_hover_color'] ); ?>;
209 $button_background_color: <?php echo isset( $values['color_palette'][ $palette_key ]['button_background'] ) ? evf_clean( $values['color_palette'][ $palette_key ]['button_background'] ) : ''; ?>;
210 $button_hover_background_color: <?php echo evf_clean( $values['typography']['button_hover_background_color'] ); ?>;
211
212 // Success Message styles variables.
213 $success_message_font_size: <?php echo evf_clean( $values['success_message']['font_size'] ); ?>;
214 $success_message_text_alignment: <?php echo evf_clean( $values['success_message']['text_alignment'] ); ?>;
215 $success_message_font_color: <?php echo evf_clean( $values['success_message']['font_color'] ); ?>;
216 $success_message_background_color: <?php echo evf_clean( $values['success_message']['background_color'] ); ?>;
217 $success_message_border_type: <?php echo evf_clean( $values['success_message']['border_type'] ); ?>;
218 $success_message_border_color: <?php echo evf_clean( $values['success_message']['border_color'] ); ?>;
219
220 $error_message_font_size: <?php echo evf_clean( $values['error_message']['font_size'] ); ?>;
221 $error_message_text_alignment: <?php echo evf_clean( $values['error_message']['text_alignment'] ); ?>;
222 $error_message_font_color: <?php echo evf_clean( $values['error_message']['font_color'] ); ?>;
223 $error_message_background_color: <?php echo evf_clean( $values['error_message']['background_color'] ); ?>;
224 $error_message_border_type: <?php echo evf_clean( $values['error_message']['border_type'] ); ?>;
225 $error_message_border_color: <?php echo evf_clean( $values['error_message']['border_color'] ); ?>;
226
227 // Validation Message styles variables.
228 $validation_message_font_size: <?php echo evf_clean( $values['validation_message']['font_size'] ); ?>;
229 $validation_message_text_alignment: <?php echo evf_clean( $values['validation_message']['text_alignment'] ); ?>;
230 $validation_message_font_color: <?php echo evf_clean( $values['validation_message']['font_color'] ); ?>;
231 $validation_message_background_color: <?php echo evf_clean( $values['validation_message']['background_color'] ); ?>;
232 $validation_message_border_type: <?php echo evf_clean( $values['validation_message']['border_type'] ); ?>;
233 $validation_message_border_color: <?php echo evf_clean( $values['validation_message']['border_color'] ); ?>;
234
235 /**
236 * Imports.
237 */
238 @import "bourbon";
239
240 /**
241 * Responsive.
242 */
243 @mixin responsive-media( $property, $device, $values ) {
244 @if $device == "desktop" {
245 @include _directional-property( $property, null, $values );
246 } @else if $device == "tablet" {
247 @media only screen and (max-width: 768px) {
248 @include _directional-property( $property, null, $values);
249 }
250 } @else if $device == "mobile" {
251 @media only screen and (max-width: 500px) {
252 @include _directional-property( $property, null, $values);
253 }
254 }
255 }
256
257 /**
258 * Styling begins.
259 */
260 .everest-forms {
261 #evf-#{$form_id} {
262 &.evf-container {
263 width: $container_width + '%';
264 <?php if ( '' !== $values['font']['font_family'] ) : ?>
265 font-family: <?php echo evf_clean( $values['font']['font_family'] ); ?>;
266 <?php endif; ?>
267 <?php if ( isset( $values['color_palette'][ $palette_key ]['form_background'] ) ) : ?>
268 background-color: <?php echo evf_clean( $values['color_palette'][ $palette_key ]['form_background'] ); ?>;
269 <?php endif; ?>
270 <?php if ( ! empty( $values['form_container']['background_image'] ) ) : ?>
271 <?php printf( "background-image: url('%s');", esc_url( $values['form_container']['background_image'] ) ); ?>
272 <?php if ( '' !== $values['form_container']['background_size'] ) : ?>
273 background-size: <?php echo evf_clean( $values['form_container']['background_size'] ); ?>;
274 <?php endif; ?>
275 <?php if ( '' !== $values['form_container']['opacity'] ) : ?>
276 opacity: <?php echo evf_clean( $values['form_container']['opacity'] ); ?>;
277 <?php endif; ?>
278 <?php if ( ! empty( $values['form_container']['background_position_x'] ) && ! empty( $values['form_container']['background_position_y'] ) ) : ?>
279 <?php printf( 'background-position: %s %s;', empty( evf_clean( $values['form_container']['background_position_x'] ) ) ? '' : evf_clean( $values['form_container']['background_position_x'] ), empty( evf_clean( $values['form_container']['background_position_y'] ) ) ? '' : evf_clean( $values['form_container']['background_position_y'] ) ); ?>
280 <?php endif; ?>
281 <?php foreach ( array( 'background_repeat', 'background_attachment' ) as $background_prop ) : ?>
282 <?php if ( ! empty( $values['form_container'][ $background_prop ] ) ) : ?>
283 <?php printf( '%s: %s;', str_replace( '_', '-', $background_prop ), evf_clean( $values['form_container'][ $background_prop ] ) ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
284 <?php endif; ?>
285 <?php endforeach; ?>
286 <?php endif; ?>
287 <?php if ( ! empty( $values['form_container']['border_type'] ) ) : ?>
288 border-style: $container_border_type;
289 <?php if ( 'none' !== $values['form_container']['border_type'] ) : ?>
290 border-color: $container__border_color;
291 <?php printf( '@include border-width(%s);', evf_sanitize_dimension_unit( $values['form_container']['border_width'], 'px' ) ); ?>
292 <?php endif; ?>
293 <?php endif; ?>
294 <?php foreach ( $values['form_container']['border_radius'] as $prop => $value ) : ?>
295 <?php if ( 'unit' !== $prop && ! empty( $value ) ) : ?>
296 <?php printf( '@include border-%s-radius(%s);', $prop, evf_clean( $value . $values['form_container']['border_radius']['unit'] ) ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
297 <?php endif; ?>
298 <?php endforeach; ?>
299 <?php foreach ( array( 'margin', 'padding' ) as $separator_type ) : ?>
300 <?php foreach ( $values['form_container'][ $separator_type ] as $device => $value ) : ?>
301 <?php if ( in_array( $device, array( 'desktop', 'tablet', 'mobille' ), true ) ) : ?>
302 <?php printf( '@include responsive-media(%s, %s, %s);', $separator_type, $device, evf_sanitize_dimension_unit( $value, 'px' ) ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
303 <?php endif; ?>
304 <?php endforeach; ?>
305 <?php endforeach; ?>
306
307
308 label {
309 &.evf-field-label {
310 color: $field_label_font_color;
311 font-size: $field_label_font_size + 'px';
312 line-height: $field_label_line_height;
313 text-align: $field_label_text_alignment;
314 <?php foreach ( array( 'field_labels_margin', 'field_labels_padding' ) as $separator_type ) : ?>
315 <?php foreach ( $values['typography'][ $separator_type ] as $device => $value ) : ?>
316 <?php if ( in_array( $device, array( 'desktop', 'tablet', 'mobille' ), true ) ) : ?>
317 <?php printf( '@include responsive-media(%s, %s, %s);', preg_replace( '/.*_/', '', $separator_type ), $device, evf_sanitize_dimension_unit( $value, 'px' ) ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
318 <?php endif; ?>
319 <?php endforeach; ?>
320 <?php endforeach; ?>
321
322 .evf-label {
323 <?php foreach ( $font_styles as $prop => $value ) : ?>
324 <?php if ( 'yes' === evf_bool_to_string( $values['typography']['field_labels_font_style'][ $value ] ) ) : ?>
325 <?php printf( '%s: %s;', $prop, evf_clean( $value ) ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
326 <?php else : ?>
327 <?php printf( '%s: %s;', $prop, evf_clean( $font_styles_default[ $prop ] ) ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
328 <?php endif; ?>
329 <?php endforeach; ?>
330 }
331 }
332
333 &.everest-forms-field-sublabel {
334 color: $field_sublabel_font_color;
335 font-size: $field_sublabel_font_size + 'px';
336 line-height: $field_sublabel_line_height;
337 text-align: $field_sublabel_text_alignment;
338 <?php foreach ( $font_styles as $prop => $value ) : ?>
339 <?php if ( 'yes' === evf_bool_to_string( $values['typography']['field_sublabels_font_style'][ $value ] ) ) : ?>
340 <?php printf( '%s: %s;', $prop, evf_clean( $value ) ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
341 <?php endif; ?>
342 <?php endforeach; ?>
343 <?php foreach ( array( 'field_sublabels_margin', 'field_sublabels_padding' ) as $separator_type ) : ?>
344 <?php foreach ( $values['typography'][ $separator_type ] as $device => $value ) : ?>
345 <?php if ( in_array( $device, array( 'desktop', 'tablet', 'mobille' ), true ) ) : ?>
346 <?php printf( '@include responsive-media(%s, %s, %s);', preg_replace( '/.*_/', '', $separator_type ), $device, evf_sanitize_dimension_unit( $value, 'px' ) ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
347 <?php endif; ?>
348 <?php endforeach; ?>
349 <?php endforeach; ?>
350 }
351 }
352
353
354 input[type='text'],
355 input[type='email'],
356 input[type='number'],
357 input[type='password'],
358 input[type='datetime'],
359 input[type='datetime-local'],
360 input[type='date'],
361 input[type='time'],
362 input[type='week'],
363 input[type='url'],
364 input[type='tel'],
365 input[type='file'],
366 textarea,
367 select,
368 canvas.evf-signature-canvas,
369 .StripeElement {
370 color: $field_styles_font_color;
371 text-align: $field_styles_alignment;
372 font-size: $field_styles_font_size + 'px';
373 <?php if ( isset( $values['color_palette'][ $palette_key ]['field_background'] ) && '' !== $values['color_palette'][ $palette_key ]['field_background'] ) : ?>
374 background-color: <?php echo evf_clean( $values['color_palette'][ $palette_key ]['field_background'] ); ?>;
375 <?php endif; ?>
376 <?php foreach ( $font_styles as $prop => $value ) : ?>
377 <?php if ( 'yes' === evf_bool_to_string( $values['typography']['field_styles_font_style'][ $value ] ) ) : ?>
378 <?php printf( '%s: %s;', $prop, evf_clean( $value ) ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
379 <?php endif; ?>
380 <?php endforeach; ?>
381 <?php if ( isset( $values['field_styles']['border_type'] ) ) : ?>
382 border-style: $field_styles_border_type;
383 <?php if ( 'none' !== $values['field_styles']['border_type'] ) : ?>
384 border-color: $field_styles_border_color;
385 <?php printf( '@include border-width(%s);', evf_sanitize_dimension_unit( $values['field_styles']['border_width'], 'px' ) ); ?>
386 <?php endif; ?>
387 <?php endif; ?>
388 <?php foreach ( $values['field_styles']['border_radius'] as $prop => $value ) : ?>
389 <?php if ( 'unit' !== $prop && ! empty( $value ) ) : ?>
390 <?php printf( '@include border-%s-radius(%s);', $prop, evf_clean( $value . $values['field_styles']['border_radius']['unit'] ) ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
391 <?php endif; ?>
392 <?php endforeach; ?>
393 <?php foreach ( array( 'field_styles_margin', 'field_styles_padding' ) as $separator_type ) : ?>
394 <?php foreach ( $values['typography'][ $separator_type ] as $device => $value ) : ?>
395 <?php if ( in_array( $device, array( 'desktop', 'tablet', 'mobille' ), true ) ) : ?>
396 <?php printf( '@include responsive-media(%s, %s, %s);', preg_replace( '/.*_/', '', $separator_type ), $device, evf_sanitize_dimension_unit( $value, 'px' ) ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
397 <?php endif; ?>
398 <?php endforeach; ?>
399 <?php endforeach; ?>
400
401 &::placeholder {
402 color: $field_styles_placeholder_font_color;
403 <?php foreach ( $font_styles as $prop => $value ) : ?>
404 <?php if ( 'yes' === evf_bool_to_string( $values['typography']['field_styles_font_style'][ $value ] ) ) : ?>
405 <?php printf( '%s: %s;', $prop, evf_clean( $value ) ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
406 <?php endif; ?>
407 <?php endforeach; ?>
408 }
409
410 &:focus {
411 <?php if ( 'none' !== $values['field_styles']['border_type'] ) : ?>
412 border-color: $field_styles_border_focus_color;
413 <?php endif; ?>
414 }
415 }
416
417
418 .everest-forms-uploader {
419 <?php if ( '#ffffff' !== $values['typography']['file_upload_background_color'] ) : ?>
420 background-color: <?php echo evf_clean( $values['typography']['file_upload_background_color'] ); ?>;
421 <?php endif; ?>
422 <?php if ( isset( $values['file_upload_styles']['border_type'] ) ) : ?>
423 border-style: $file_upload_styles_border_type;
424 <?php if ( 'none' !== $values['file_upload_styles']['border_type'] ) : ?>
425 border-color: $file_upload_styles_border_color;
426 <?php printf( '@include border-width(%s);', evf_sanitize_dimension_unit( $values['file_upload_styles']['border_width'], 'px' ) ); ?>
427 <?php endif; ?>
428 <?php endif; ?>
429 <?php foreach ( $values['file_upload_styles']['border_radius'] as $prop => $value ) : ?>
430 <?php if ( 'unit' !== $prop && ! empty( $value ) ) : ?>
431 <?php printf( '@include border-%s-radius(%s);', $prop, evf_clean( $value . $values['file_upload_styles']['border_radius']['unit'] ) ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
432 <?php endif; ?>
433 <?php endforeach; ?>
434 <?php foreach ( array( 'file_upload_margin', 'file_upload_padding' ) as $separator_type ) : ?>
435 <?php foreach ( $values['typography'][ $separator_type ] as $device => $value ) : ?>
436 <?php if ( in_array( $device, array( 'desktop', 'tablet', 'mobille' ), true ) ) : ?>
437 <?php printf( '@include responsive-media(%s, %s, %s);', preg_replace( '/.*_/', '', $separator_type ), $device, evf_sanitize_dimension_unit( $value, 'px' ) ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
438 <?php endif; ?>
439 <?php endforeach; ?>
440 <?php endforeach; ?>
441
442 .everest-forms-upload-title,
443 .everest-forms-upload-hint,
444 .dz-details,
445 .dz-error-message {
446 font-size: $file_upload_styles_font_size + 'px';
447 }
448
449 .everest-forms-upload-title,
450 .everest-forms-upload-hint,
451 .dz-details span {
452 color: $file_upload_styles_font_color;
453 }
454
455 .dz-message {
456 > svg {
457 <?php if ( '#ffffff' !== $values['typography']['file_upload_icon_background_color'] ) : ?>
458 background-color: <?php echo evf_clean( $values['typography']['file_upload_icon_background_color'] ); ?>;
459 <?php endif; ?>
460 fill: $file_upload_styles_icon_color;
461 }
462 }
463 }
464
465
466 .evf-payment-total,
467 .evf-single-item-price {
468 color: $field_styles_font_color;
469 text-align: $field_styles_alignment;
470 font-size: $field_styles_font_size + 'px';
471 <?php foreach ( $font_styles as $prop => $value ) : ?>
472 <?php if ( 'yes' === evf_bool_to_string( $values['typography']['field_styles_font_style'][ $value ] ) ) : ?>
473 <?php printf( '%s: %s;', $prop, evf_clean( $value ) ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
474 <?php endif; ?>
475 <?php endforeach; ?>
476 <?php foreach ( array( 'field_styles_margin' ) as $separator_type ) : ?>
477 <?php foreach ( $values['typography'][ $separator_type ] as $device => $value ) : ?>
478 <?php if ( in_array( $device, array( 'desktop', 'tablet', 'mobille' ), true ) ) : ?>
479 <?php printf( '@include responsive-media(%s, %s, %s);', preg_replace( '/.*_/', '', $separator_type ), $device, evf_sanitize_dimension_unit( $value, 'px' ) ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
480 <?php endif; ?>
481 <?php endforeach; ?>
482 <?php endforeach; ?>
483 }
484
485 .evf-field-radio,
486 .evf-field-checkbox,
487 .evf-field-payment-multiple,
488 .evf-field-payment-checkbox,
489 .evf-field-privacy-policy {
490 ul {
491 li {
492 text-align: $radio_checkbox_styles_alignment;
493 <?php foreach ( array( 'checkbox_radio_margin' ) as $separator_type ) : ?>
494 <?php foreach ( $values['typography'][ $separator_type ] as $device => $value ) : ?>
495 <?php if ( in_array( $device, array( 'desktop', 'tablet', 'mobille' ), true ) ) : ?>
496 <?php
497 if ( 'margin' === preg_replace( '/.*_/', '', $separator_type ) ) {
498 $value['right'] = 0;
499 $value['left'] = 0;
500 }
501 ?>
502 <?php printf( '@include responsive-media(%s, %s, %s);', preg_replace( '/.*_/', '', $separator_type ), $device, evf_sanitize_dimension_unit( $value, 'px' ) ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
503 <?php endif; ?>
504 <?php endforeach; ?>
505 <?php endforeach; ?>
506
507 input[type="radio"] {
508 border-radius: 50%;
509 <?php if ( 'default' === $values['typography']['checkbox_radio_style_variation'] ) { ?>
510 <?php } elseif ( 'outline' === $values['typography']['checkbox_radio_style_variation'] ) { ?>
511 &:checked {
512 &::before {
513 width: 50%;
514 border-radius: 50%;
515 background: $radio_checkbox_styles_checked_color;
516 }
517 }
518 <?php } elseif ( 'filled' === $values['typography']['checkbox_radio_style_variation'] ) { ?>
519 &:checked {
520 &::before {
521 width: 50%;
522 border-radius: 50%;
523 background: #fff;
524 }
525 }
526 <?php } ?>
527 }
528
529 label {
530 flex: 1;
531 }
532 }
533 }
534 input[type='checkbox'],
535 input[type='radio'] {
536 <?php if ( 'default' === $values['typography']['checkbox_radio_style_variation'] ) { ?>
537 <?php } elseif ( 'outline' === $values['typography']['checkbox_radio_style_variation'] ) { ?>
538 width : $radio_checkbox_styles__size + 'px';
539 height : $radio_checkbox_styles__size + 'px';
540 display : inline-flex;
541 align-items : center;
542 justify-content : center;
543 -webkit-appearance : none;
544 border: 1px solid $radio_checkbox_styles_color;
545
546 &:checked {
547 border-color: $radio_checkbox_styles_checked_color;
548
549 &::before {
550 content: '';
551 height: 50%;
552 }
553 }
554
555 <?php } elseif ( 'filled' === $values['typography']['checkbox_radio_style_variation'] ) { ?>
556 width : $radio_checkbox_styles__size + 'px';
557 height : $radio_checkbox_styles__size + 'px';
558 display : inline-flex;
559 align-items : center;
560 justify-content : center;
561 -webkit-appearance : none;
562 background-color : $radio_checkbox_styles_color;
563
564 &:checked {
565 background-color: $radio_checkbox_styles_checked_color;
566
567 &::before {
568 content: '';
569 height: 50%;
570 }
571 }
572 <?php } ?>
573
574 + label {
575 font-size: $radio_checkbox_styles__font_size + 'px';
576 color: $radio_checkbox_styles__font_color;
577 <?php foreach ( $font_styles as $prop => $value ) : ?>
578 <?php if ( 'yes' === evf_bool_to_string( $values['typography']['checkbox_radio_font_style'][ $value ] ) ) : ?>
579 <?php printf( '%s: %s;', $prop, evf_clean( $value ) ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
580 <?php endif; ?>
581 <?php endforeach; ?>
582 }
583 }
584
585 input[type="checkbox"] {
586 <?php if ( 'default' === $values['typography']['checkbox_radio_style_variation'] ) { ?>
587 <?php } elseif ( 'outline' === $values['typography']['checkbox_radio_style_variation'] ) { ?>
588 &:checked {
589
590 &::before {
591 width: 25%;
592 border: solid $radio_checkbox_styles_checked_color;
593 border-width: 0 2px 2px 0;
594 transform: rotate(45deg);
595 margin-top: -12%;
596 }
597 }
598 <?php } elseif ( 'filled' === $values['typography']['checkbox_radio_style_variation'] ) { ?>
599 &:checked {
600
601 &::before {
602 width: 25%;
603 border: solid #fff;
604 border-width: 0 2px 2px 0;
605 transform: rotate(45deg);
606 margin-top: -12%;
607 }
608 }
609 <?php } ?>
610 }
611
612 }
613
614 .evf-field-description {
615 color: $field_description_font_color;
616 font-size: $field_description_font_size + 'px';
617 <?php foreach ( $font_styles as $prop => $value ) : ?>
618 <?php if ( 'yes' === evf_bool_to_string( $values['typography']['field_description_font_style'][ $value ] ) ) : ?>
619 <?php printf( '%s: %s;', $prop, evf_clean( $value ) ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
620 <?php endif; ?>
621 <?php endforeach; ?>
622 text-align: $field_description_text_alignment;
623 line-height: $field_description_line_height;
624 <?php foreach ( array( 'field_description_margin', 'field_description_padding' ) as $separator_type ) : ?>
625 <?php foreach ( $values['typography'][ $separator_type ] as $device => $value ) : ?>
626 <?php if ( in_array( $device, array( 'desktop', 'tablet', 'mobille' ), true ) ) : ?>
627 <?php printf( '@include responsive-media(%s, %s, %s);', preg_replace( '/.*_/', '', $separator_type ), $device, evf_sanitize_dimension_unit( $value, 'px' ) ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
628 <?php endif; ?>
629 <?php endforeach; ?>
630 <?php endforeach; ?>
631 }
632
633 .evf-field-title h3 {
634 <?php if ( '' !== $values['font']['font_family'] ) : ?>
635 font-family: <?php echo evf_clean( $values['font']['font_family'] ); ?>;
636 <?php endif; ?>
637 font-size: $section_title_font_size + 'px';
638 color: $section_title_font_color;
639 text-align: $section_title_alignment;
640 line-height: $section_title_line_height;
641 <?php foreach ( $font_styles as $prop => $value ) : ?>
642 <?php if ( 'yes' === evf_bool_to_string( $values['typography']['section_title_font_style'][ $value ] ) ) : ?>
643 <?php printf( '%s: %s;', $prop, evf_clean( $value ) ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
644 <?php endif; ?>
645 <?php endforeach; ?>
646 <?php foreach ( array( 'section_title_margin', 'section_title_padding' ) as $separator_type ) : ?>
647 <?php foreach ( $values['typography'][ $separator_type ] as $device => $value ) : ?>
648 <?php if ( in_array( $device, array( 'desktop', 'tablet', 'mobille' ), true ) ) : ?>
649 <?php printf( '@include responsive-media(%s, %s, %s);', preg_replace( '/.*_/', '', $separator_type ), $device, evf_sanitize_dimension_unit( $value, 'px' ) ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
650 <?php endif; ?>
651 <?php endforeach; ?>
652 <?php endforeach; ?>
653 }
654
655 }
656
657 .evf-submit-container,
658 .everest-forms-multi-part-actions {
659 input[type='submit'],
660 button[type='submit'],
661 .everest-forms-part-button {
662 color: $button_font_color;
663 font-size: $button_font_size + 'px';
664 line-height: $button_line_height;
665 background-color: $button_background_color;
666 <?php foreach ( $font_styles as $prop => $value ) : ?>
667 <?php if ( 'yes' === evf_bool_to_string( $values['typography']['button_font_style'][ $value ] ) ) : ?>
668 <?php printf( '%s: %s;', $prop, evf_clean( $value ) ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
669 <?php endif; ?>
670 <?php endforeach; ?>
671 <?php if ( isset( $values['button']['border_type'] ) ) : ?>
672 border-style: $button_border_type;
673 <?php if ( 'none' !== $values['button']['border_type'] ) : ?>
674 border-color: $button_border_color;
675 <?php printf( '@include border-width(%s);', evf_sanitize_dimension_unit( $values['button']['border_width'], 'px' ) ); ?>
676 <?php endif; ?>
677 <?php endif; ?>
678 <?php foreach ( $values['button']['border_radius'] as $prop => $value ) : ?>
679 <?php if ( 'unit' !== $prop && ! empty( $value ) ) : ?>
680 <?php printf( '@include border-%s-radius(%s);', $prop, evf_clean( $value . $values['button']['border_radius']['unit'] ) ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
681 <?php endif; ?>
682 <?php endforeach; ?>
683 <?php foreach ( array( 'button_margin', 'button_padding' ) as $type ) : // phpcs:ignore WordPress.WP.GlobalVariablesOverride.Prohibited ?>
684 <?php foreach ( $values['typography'][ $type ] as $device => $value ) : ?>
685 <?php if ( in_array( $device, array( 'desktop', 'tablet', 'mobille' ), true ) ) : ?>
686 <?php printf( '@include responsive-media(%s, %s, %s);', preg_replace( '/^[^_]+_/', '', $type ), $device, evf_sanitize_dimension_unit( $value, 'px' ) ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
687 <?php endif; ?>
688 <?php endforeach; ?>
689 <?php endforeach; ?>
690
691 &:hover,
692 &:active {
693 color: $button_hover_font_color;
694 background-color: $button_hover_background_color;
695 <?php if ( 'none' !== $values['button']['border_type'] ) : ?>
696 border-color: $button_border_hover_color;
697 <?php endif; ?>
698 }
699 }
700 }
701
702 .evf-submit-container {
703 &:not(.everest-forms-multi-part-actions) {
704 display: block;
705 <?php if ( isset( $values['typography']['button_alignment'] ) && ! ( isset( $form_data['settings']['enable_multi_part'] ) && evf_string_to_bool( $form_data['settings']['enable_multi_part'] ) ) ) : ?>
706 text-align: <?php echo evf_clean( $values['typography']['button_alignment'] ); ?>;
707 <?php endif; ?>
708 }
709 }
710
711 .evf-error {
712 background-color: $validation_message_background_color;
713 color: $validation_message_font_color;
714 font-size: $validation_message_font_size + 'px';
715 <?php foreach ( $font_styles as $prop => $value ) : ?>
716 <?php if ( 'yes' === evf_bool_to_string( $values['validation_message']['font_style'][ $value ] ) ) : ?>
717 <?php printf( '%s: %s;', $prop, evf_clean( $value ) ); ?>
718 <?php else : ?>
719 <?php printf( '%s: %s;', $prop, evf_clean( $font_styles_default[ $prop ] ) ); ?>
720 <?php endif; ?>
721 <?php endforeach; ?>
722 text-align: $validation_message_text_alignment;
723
724 <?php if ( isset( $values['validation_message']['border_type'] ) ) : ?>
725 border-style: $validation_message_border_type;
726 <?php if ( 'none' !== $values['validation_message']['border_type'] ) : ?>
727 border-color: $validation_message_border_color;
728 <?php printf( '@include border-width(%s);', evf_sanitize_dimension_unit( $values['validation_message']['border_width'], 'px' ) ); ?>
729 <?php endif; ?>
730 <?php endif; ?>
731 <?php foreach ( $values['validation_message']['border_radius'] as $prop => $value ) : ?>
732 <?php if ( 'unit' !== $prop && ! empty( $value ) ) : ?>
733 <?php printf( '@include border-%s-radius(%s);', $prop, evf_clean( $value . $values['validation_message']['border_radius']['unit'] ) ); ?>
734 <?php endif; ?>
735 <?php endforeach; ?>
736 }
737
738 &.layout-two {
739 input[type='text'],
740 input[type='email'],
741 input[type='number'],
742 input[type='password'],
743 input[type='datetime'],
744 input[type='datetime-local'],
745 input[type='date'],
746 input[type='time'],
747 input[type='week'],
748 input[type='url'],
749 input[type='tel'],
750 input[type='file'],
751 textarea,
752 select,
753 canvas.evf-signature-canvas {
754 border-top: transparent;
755 border-left: transparent;
756 border-right: transparent;
757 border-radius: 0;
758 }
759 }
760
761 &.evf-gutenberg-form-selector {
762 .evf-submit-container {
763 button,
764 input[type=submit],
765 input[type="reset"] {
766 color: $button_font_color !important;
767 background-color: $button_background_color !important;
768 <?php if ( 'none' !== $values['button']['border_type'] ) : ?>
769 border-color: $button_border_color !important;
770 <?php endif; ?>
771 }
772 }
773 }
774
775 }
776
777 .everest-forms-notice {
778 &.everest-forms-notice--success {
779 background-color: $success_message_background_color;
780 color: $success_message_font_color;
781 font-size: $success_message_font_size + 'px';
782 <?php foreach ( $font_styles as $prop => $value ) : ?>
783 <?php if ( 'yes' === evf_bool_to_string( $values['success_message']['font_style'][ $value ] ) ) : ?>
784 <?php printf( '%s: %s;', $prop, evf_clean( $value ) ); ?>
785 <?php else : ?>
786 <?php printf( '%s: %s;', $prop, evf_clean( $font_styles_default[ $prop ] ) ); ?>
787 <?php endif; ?>
788 <?php endforeach; ?>
789 text-align: $success_message_text_alignment;
790
791 <?php if ( isset( $values['success_message']['border_type'] ) ) : ?>
792 border-style: $success_message_border_type;
793 <?php if ( 'none' !== $values['success_message']['border_type'] ) : ?>
794 border-color: $success_message_border_color;
795 <?php printf( '@include border-width(%s);', evf_sanitize_dimension_unit( $values['success_message']['border_width'], 'px' ) ); ?>
796 <?php endif; ?>
797 <?php endif; ?>
798 <?php foreach ( $values['success_message']['border_radius'] as $prop => $value ) : ?>
799 <?php if ( 'unit' !== $prop && ! empty( $value ) ) : ?>
800 <?php printf( '@include border-%s-radius(%s);', $prop, evf_clean( $value . $values['success_message']['border_radius']['unit'] ) ); ?>
801 <?php endif; ?>
802 <?php endforeach; ?>
803 }
804
805 &.everest-forms-notice--error {
806 background-color: $error_message_background_color;
807 color: $error_message_font_color;
808 font-size: $error_message_font_size + 'px';
809 <?php foreach ( $font_styles as $prop => $value ) : ?>
810 <?php if ( 'yes' === evf_bool_to_string( $values['error_message']['font_style'][ $value ] ) ) : ?>
811 <?php printf( '%s: %s;', $prop, evf_clean( $value ) ); ?>
812 <?php else : ?>
813 <?php printf( '%s: %s;', $prop, evf_clean( $font_styles_default[ $prop ] ) ); ?>
814 <?php endif; ?>
815 <?php endforeach; ?>
816 text-align: $error_message_text_alignment;
817
818 <?php if ( isset( $values['error_message']['border_type'] ) ) : ?>
819 border-style: $error_message_border_type;
820 <?php if ( 'none' !== $values['error_message']['border_type'] ) : ?>
821 border-color: $error_message_border_color;
822 <?php printf( '@include border-width(%s);', evf_sanitize_dimension_unit( $values['error_message']['border_width'], 'px' ) ); ?>
823 <?php endif; ?>
824 <?php endif; ?>
825 <?php foreach ( $values['error_message']['border_radius'] as $prop => $value ) : ?>
826 <?php if ( 'unit' !== $prop && ! empty( $value ) ) : ?>
827 <?php printf( '@include border-%s-radius(%s);', $prop, evf_clean( $value . $values['error_message']['border_radius']['unit'] ) ); ?>
828 <?php endif; ?>
829 <?php endforeach; ?>
830 }
831 }
832
833 }
834