resource(); $formatter = Wpw::inst()->formatter(); $primary_text_color = '#555'; $divider_color = 'rgba(0,0,0,.3)'; $accent_color = '#ffab00'; $secondary_color = 'rgba(0,0,0,0.6)'; $disabled_color = 'rgba(0,0,0,.3)'; $class_name = !empty($config['class_name']) ? '.' . $config['class_name'] : '.project-input_radio-primary'; $default_paddings = [ 'top' => [ 'number' => 10, ], 'bottom' => [ 'number' => 10, ], 'right' => [ 'number' => 10, ], 'left' => [ 'number' => 10, ], ]; $default_border = [ 'top' => [ 'number' => 1, ], 'bottom' => [ 'number' => 1, ], 'right' => [ 'number' => 1, ], 'left' => [ 'number' => 1, ], ]; $default_border_radius = [ 'top' => [ 'number' => 50, 'units' => '%', ], 'bottom' => [ 'number' => 50, 'units' => '%', ], 'right' => [ 'number' => 50, 'units' => '%', ], 'left' => [ 'number' => 50, 'units' => '%', ], ]; /** * Form defaults */ // indents $form_default_padding = $default_paddings; $form_default_margins = []; // border $form_default_border_style = 'solid'; $form_default_border_model = $default_border; $form_default_border_radius = $default_border_radius; $form_default_border_style_hover = 'solid'; $form_default_border_model_hover = $default_border; $form_default_border_radius_hover = $default_border_radius; $form_default_border_style_focus = 'solid'; $form_default_border_model_focus = $default_border; $form_default_border_radius_focus = $default_border_radius; // colors $form_default_border_color = $divider_color; $form_default_control_color = $accent_color; $form_default_border_color_hover = $divider_color; $form_default_control_color_hover = $accent_color; $form_default_border_color_focus = $divider_color; $form_default_control_color_focus = $accent_color; // shadow $form_default_bs_hl = ''; $form_default_bs_vl = ''; $form_default_bs_br = ''; $form_default_bs_sr = ''; $form_default_bs_color = ''; $form_default_bs_hl_hover = ''; $form_default_bs_vl_hover = ''; $form_default_bs_br_hover = ''; $form_default_bs_sr_hover = ''; $form_default_bs_color_hover = ''; $form_default_bs_hl_focus = ''; $form_default_bs_vl_focus = ''; $form_default_bs_br_focus = ''; $form_default_bs_sr_focus = ''; $form_default_bs_color_focus = ''; // font size $size = '%7B%22number%22%3A%2214%22%2C%22unit%22%3A%22%22%7D'; // icons $default_icons = $formatter->parse_mod('wpw_form_icons'); $form_default_icon_size = !empty($default_icons['form_icon_size']) ? $default_icons['form_icon_size'] : $size; $radio_padding = !empty($config['radio_padding']) ? $config['radio_padding'] : $form_default_padding; $radio_padding = $formatter->css_spacing($radio_padding); $radio_margin = !empty($config['radio_margin']) ? $config['radio_margin'] : $form_default_margins; $radio_margin = $formatter->css_spacing($radio_margin); $radio_icon_size = !empty($config['radio_icon_size']) ? $config['radio_icon_size'] : $form_default_icon_size; $radio_icon_size = $formatter->css_scalar($radio_icon_size); $radio_use_icon_glyph = !empty($config['radio_use_icon_glyph']) ? $config['radio_use_icon_glyph'] : 'on'; $radio_glyph = $radio_hover_glyph = $radio_focus_glyph = ''; // default =========================================== // border $radio_border_style = !empty($config['radio_border_style']) ? $config['radio_border_style'] : $form_default_border_style; $radio_border_model = !empty($config['radio_border_model']) ? $config['radio_border_model'] : $form_default_border_model; $border_model_alter = $formatter->from_spacing($radio_border_model); $radio_border_model = $formatter->css_spacing($radio_border_model); $radio_border_radius = !empty($config['radio_border_radius']) ? $config['radio_border_radius'] : $form_default_border_radius; $radio_border_radius = $formatter->css_spacing($radio_border_radius); // color $radio_use_default_color = !empty($config['radio_use_default_color']) ? $config['radio_use_default_color'] : 'on'; $radio_border_color = !empty($config['radio_border_color']) ? $config['radio_border_color'] : ''; $radio_border_color = Wpw::inst()->storage()->get($radio_border_color); $radio_control_color = !empty($config['radio_control_color']) ? $config['radio_control_color'] : ''; $radio_control_color = Wpw::inst()->storage()->get($radio_control_color); // bg $radio_bg = !empty($config['radio_bg']) ? $config['radio_bg'] : ''; $radio_bg = $formatter->from_bg($radio_bg); // shadow $radio_bs_hl = !empty($config['radio_bs_hl']) ? $config['radio_bs_hl'] : $form_default_bs_hl; $radio_bs_hl = $formatter->css_scalar($radio_bs_hl); $radio_bs_vl = !empty($config['radio_bs_vl']) ? $config['radio_bs_vl'] : $form_default_bs_vl; $radio_bs_vl = $formatter->css_scalar($radio_bs_vl); $radio_bs_br = !empty($config['radio_bs_br']) ? $config['radio_bs_br'] : $form_default_bs_br; $radio_bs_br = $formatter->css_scalar($radio_bs_br); $radio_bs_sr = !empty($config['radio_bs_sr']) ? $config['radio_bs_sr'] : $form_default_bs_sr; $radio_bs_sr = $formatter->css_scalar($radio_bs_sr); $radio_bs_color = !empty($config['radio_bs_color']) ? $config['radio_bs_color'] : ''; $radio_bs_color = Wpw::inst()->storage()->get($radio_bs_color); $radio_bs = " box-shadow: {$radio_bs_hl} {$radio_bs_vl} {$radio_bs_br} {$radio_bs_sr} {$radio_bs_color}; "; // hover =========================================== // border $radio_hover_border_style = !empty($config['radio_hover_border_style']) ? $config['radio_hover_border_style'] : $form_default_border_style_hover; $radio_hover_border_model = !empty($config['radio_hover_border_model']) ? $config['radio_hover_border_model'] : $form_default_border_model_hover; $border_model_hover_alter = $formatter->from_spacing($radio_hover_border_model); $radio_hover_border_model = $formatter->css_spacing($radio_hover_border_model); $radio_hover_border_radius = !empty($config['radio_hover_border_radius']) ? $config['radio_hover_border_radius'] : $form_default_border_radius_hover; $radio_hover_border_radius = $formatter->css_spacing($radio_hover_border_radius); // color $radio_hover_use_default_color = !empty($config['radio_hover_use_default_color']) ? $config['radio_hover_use_default_color'] : 'on'; $radio_hover_border_color = !empty($config['radio_hover_border_color']) ? $config['radio_hover_border_color'] : ''; $radio_hover_border_color = Wpw::inst()->storage()->get($radio_hover_border_color); $radio_hover_control_color = !empty($config['radio_hover_control_color']) ? $config['radio_hover_control_color'] : ''; $radio_hover_control_color = Wpw::inst()->storage()->get($radio_hover_control_color); // bg $radio_hover_bg = !empty($config['radio_hover_bg']) ? $config['radio_hover_bg'] : ''; $radio_hover_bg = $formatter->from_bg($radio_hover_bg); // shadow $radio_hover_bs_hl = !empty($config['radio_hover_bs_hl']) ? $config['radio_hover_bs_hl'] : $form_default_bs_hl_hover; $radio_hover_bs_hl = $formatter->css_scalar($radio_hover_bs_hl); $radio_hover_bs_vl = !empty($config['radio_hover_bs_vl']) ? $config['radio_hover_bs_vl'] : $form_default_bs_vl_hover; $radio_hover_bs_vl = $formatter->css_scalar($radio_hover_bs_vl); $radio_hover_bs_br = !empty($config['radio_hover_bs_br']) ? $config['radio_hover_bs_br'] : $form_default_bs_color_hover; $radio_hover_bs_br = $formatter->css_scalar($radio_hover_bs_br); $radio_hover_bs_sr = !empty($config['radio_hover_bs_sr']) ? $config['radio_hover_bs_sr'] : $form_default_bs_sr_hover; $radio_hover_bs_sr = $formatter->css_scalar($radio_hover_bs_sr); $radio_hover_bs_color = !empty($config['radio_hover_bs_color']) ? $config['radio_hover_bs_color'] : ''; $radio_hover_bs_color = Wpw::inst()->storage()->get($radio_hover_bs_color); $radio_hover_bs = " box-shadow: {$radio_hover_bs_hl} {$radio_hover_bs_vl} {$radio_hover_bs_br} {$radio_hover_bs_sr} {$radio_hover_bs_color}; "; // focus =========================================== // border $radio_focus_border_style = !empty($config['radio_focus_border_style']) ? $config['radio_focus_border_style'] : $form_default_border_style_focus; $radio_focus_border_model = !empty($config['radio_focus_border_model']) ? $config['radio_focus_border_model'] : $form_default_border_model_focus; $border_focus_hover_alter = $formatter->from_spacing($radio_focus_border_model); $radio_focus_border_model = $formatter->css_spacing($radio_focus_border_model); $radio_focus_border_radius = !empty($config['radio_focus_border_radius']) ? $config['radio_focus_border_radius'] : $form_default_border_radius_focus; $radio_focus_border_radius = $formatter->css_spacing($radio_focus_border_radius); // color $radio_focus_use_default_color = !empty($config['radio_focus_use_default_color']) ? $config['radio_focus_use_default_color'] : 'on'; $radio_focus_border_color = !empty($config['radio_focus_border_color']) ? $config['radio_focus_border_color'] : ''; $radio_focus_border_color = Wpw::inst()->storage()->get($radio_focus_border_color); $radio_focus_control_color = !empty($config['radio_focus_control_color']) ? $config['radio_focus_control_color'] : ''; $radio_focus_control_color = Wpw::inst()->storage()->get($radio_focus_control_color); // bg $radio_focus_bg = !empty($config['radio_focus_bg']) ? $config['radio_focus_bg'] : ''; $radio_focus_bg = $formatter->from_bg($radio_focus_bg); // shadow $radio_focus_bs_hl = !empty($config['radio_focus_bs_hl']) ? $config['radio_focus_bs_hl'] : $form_default_bs_hl_focus; $radio_focus_bs_hl = $formatter->css_scalar($radio_focus_bs_hl); $radio_focus_bs_vl = !empty($config['radio_focus_bs_vl']) ? $config['radio_focus_bs_vl'] : $form_default_bs_vl_focus; $radio_focus_bs_vl = $formatter->css_scalar($radio_focus_bs_vl); $radio_focus_bs_br = !empty($config['radio_focus_bs_br']) ? $config['radio_focus_bs_br'] : $form_default_bs_br_focus; $radio_focus_bs_br = $formatter->css_scalar($radio_focus_bs_br); $radio_focus_bs_sr = !empty($config['radio_focus_bs_sr']) ? $config['radio_focus_bs_sr'] : $form_default_bs_sr_focus; $radio_focus_bs_sr = $formatter->css_scalar($radio_focus_bs_sr); $radio_focus_bs_color = !empty($config['radio_focus_bs_color']) ? $config['radio_focus_bs_color'] : ''; $radio_focus_bs_color = Wpw::inst()->storage()->get($radio_focus_bs_color); $radio_focus_bs = " box-shadow: {$radio_focus_bs_hl} {$radio_focus_bs_vl} {$radio_focus_bs_br} {$radio_focus_bs_sr} {$radio_focus_bs_color}; "; $radio_glyph = !empty($config['radio_glyph']) ? $config['radio_glyph'] : ''; $radio_glyph = $formatter->get_media_url($radio_glyph); $radio_hover_glyph = $formatter->prepare_svg_bg($radio_glyph, $radio_hover_control_color); $radio_focus_glyph = $formatter->prepare_svg_bg($radio_glyph, $radio_focus_control_color); $radio_glyph = $formatter->prepare_svg_bg($radio_glyph, $radio_control_color); echo /** @lang CSS */ ' '.$class_name.'.project-input.project-input_radio .project-input__radio { height: ' . $radio_icon_size . '; width: ' . $radio_icon_size . '; } '.$class_name.'.project-input.project-input_radio .project-input__radio i[class*="ib-"] { font-size: ' . $radio_icon_size . '; } '.$class_name.'.project-input.project-input_radio { padding: ' . $radio_padding . '; margin: ' . $radio_margin . '; } '.$class_name.'.project-input.project-input_radio .background { border-style: ' . $radio_border_style . '; border-width: ' . $radio_border_model . '; border-color: ' . $radio_border_color . '; border-radius: ' . $radio_border_radius . '; ' . $radio_bs . ' } '.$class_name.'.project-input.project-input_radio .background > .color-layer { ' . $radio_bg['fill'] . ' } '.$class_name.'.project-input.project-input_radio .background > .image-layer { background-image: url("' . $radio_bg['image'] . '"); } '.$class_name.'.project-input.project-input_radio .project-input__radio { color:' . $radio_control_color . '; fill: ' . $radio_control_color . '; } '.$class_name.'.project-input.project-input_radio .default-radio { color:' . $radio_control_color . '; fill: ' . $radio_control_color . '; height: ' . $radio_icon_size . '; width: ' . $radio_icon_size . '; background-image: url("' . $radio_glyph . '"); } '.$class_name.'.project-input.project-input_radio .project-input__radio:before { background-color: ' . $radio_control_color . '; } '.$class_name.'.project-input.project-input_radio:hover .project-input__radio:before { background-color: ' . $radio_hover_control_color . '; } '.$class_name.'.project-input.project-input_radio.project-input_active .project-input__radio:before, .project-input.project-input_radio.project-input_focused .project-input__radio:before { background-color: ' . $radio_focus_control_color . '; } '.$class_name.'.project-input.project-input_radio:hover { padding: ' . $radio_padding . '; margin: ' . $radio_margin . '; } '.$class_name.'.project-input.project-input_radio:hover .background { border-style: ' . $radio_hover_border_style . '; border-width: ' . $radio_hover_border_model . '; border-color: ' . $radio_hover_border_color . '; border-radius: ' . $radio_hover_border_radius . '; ' . $radio_hover_bs . ' } '.$class_name.'.project-input.project-input_radio:hover .background > .color-layer { ' . $radio_hover_bg['fill'] . ' } '.$class_name.'.project-input.project-input_radio:hover .background > .image-layer { background-image: url("' . $radio_hover_bg['image'] . '"); } '.$class_name.'.project-input.project-input_radio:hover .project-input__radio { color:' . $radio_hover_control_color . '; fill: ' . $radio_hover_control_color . '; } '.$class_name.'.project-input.project-input_radio .hover-radio { color:' . $radio_hover_control_color . '; fill: ' . $radio_hover_control_color . '; height: ' . $radio_icon_size . '; width: ' . $radio_icon_size . '; background-image: url("' . $radio_hover_glyph . '"); } '.$class_name.'.project-input.project-input_radio.project-input_focused { padding: ' . $radio_padding . '; margin: ' . $radio_margin . '; } '.$class_name.'.project-input.project-input_radio.project-input_focused .background { border-style: ' . $radio_focus_border_style . '; border-width: ' . $radio_focus_border_model . '; border-color: ' . $radio_focus_border_color . '; border-radius: ' . $radio_focus_border_radius . '; ' . $radio_focus_bs . ' } '.$class_name.'.project-input.project-input_radio.project-input_focused .background > .color-layer { ' . $radio_focus_bg['fill'] . ' } '.$class_name.'.project-input.project-input_radio.project-input_focused .background > .image-layer { background-image: url("' . $radio_focus_bg['image'] . '"); } '.$class_name.'.project-input.project-input_radio:focus .project-input__radio { color:' . $radio_focus_control_color . '; fill: ' . $radio_focus_control_color . '; } '.$class_name.'.project-input.project-input_radio.project-input_radio .focused-radio { color:' . $radio_focus_control_color . '; fill: ' . $radio_focus_control_color . '; height: ' . $radio_icon_size . '; width: ' . $radio_icon_size . '; background-image: url("' . $radio_focus_glyph . '"); } '.$class_name.'.project-input.project-input_radio + *, '.$class_name.'.project-input.project-input_radio + *:last-child { margin: ' . $radio_margin . '; display: inline-block; vertical-align: middle; } '.$class_name.'.project-input.project-input_radio .project-input__icon i[class*="ib-"], '.$class_name.'.project-input.project-input_radio .project-input__radio i[class*="ib-"], '.$class_name.'.project-input.project-input_radio .project-input__radio:before { color: ' . $radio_control_color . '; font-size: ' . $radio_icon_size . '; } '.$class_name.'.project-input.project-input_radio:hover .project-input__icon i[class*="ib-"], '.$class_name.'.project-input.project-input_radio:hover .project-input__radio i[class*="ib-"], '.$class_name.'.project-input.project-input_radio:hover .project-input__radio:before { color: ' . $radio_hover_control_color . '; font-size: ' . $radio_icon_size . '; } '.$class_name.'.project-input.project-input_radio.project-input_active .project-input__icon i[class*="ib-"], '.$class_name.'.project-input.project-input_radio.project-input_active .project-input__radio i[class*="ib-"], '.$class_name.'.project-input.project-input_radio.project-input_active .project-input__radio:before { color: ' . $radio_focus_control_color . '; font-size: ' . $radio_icon_size . '; } ';