Dark Mode Form Stil

Hello @pexel

Please enter the CSS rules with the !important modifier. Ex.

<strong><font style="color:RoyalBlue !important;">Gün:</font></strong>

Best regards.

When the selector area is clicked in dark mode, the font color does not appear again. What area is this?

I have a cp_cff_custom #fbuilder style, what should I do next to write the font color in this field? I have no other questions, thank you

Hello @pexel

You entered the tags directly in the fields labels.

However, I see you created a custom template and entered the style definitions with !important modifier, and the new CSS rules are being assigned to the fields in light and dark modes.

Best regards.

Yes, we created a special template. The only problem now is that when going up and down in the dropdown menu in dark mode, the background fonts are not visible. I need to write some CSS in this area, but which area is it?

It should be something like cp_cff_custom #fbuilder label Do you have any ideas? I only have that space left.

Hello @pexel

I tested your form and all texts are visible in dark mode. Please look at the screenshot:

What text is not visible exactly?

Best regards.

hi;

Hello @pexel

Please enter the style definition:

.cp_cff_custom #fbuilder select option{color: #f90f2a !important;}

Best regards.

Thank you for your excellent support. I have one last question, so as not to disturb you any further.

Our calculate button is active, but we configured it according to a code you provided before. Our code is as follows;

if (fbuilderjQuery(this.form).valid()) {
        my_counter = 0,
        my_interval = setInterval(function(){
            jQuery(".counter").html("Hesapl?yoruz : " + my_counter + " saniye");
            if(my_counter == 0){
                clearInterval(my_interval);
                jQuery(".counter").html("");
                EVALEQUATIONS();
                if(/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)){
                jQuery('html, body').animate({
                    scrollTop: jQuery('[data-id="pex32pe87"]').offset().top
                }, 2000);
                }
            }
            my_counter--;
        }, 1000);
  }

There is an error here. When you click calculate twice, it starts counting down. Can we prevent this?

We also print a results screen as you know. In this first stage, we want it to be loaded invisible.

We want the result screen to load when the calculate button on the form is pressed.
Is something like this possible?
If you solve this, we will have a timeless form structure.

Thanks

• This reply was modified 6 months, 3 weeks ago by pexel.

Hello @pexel

As part of the onclick event you should check a global variable, to know if the button was pressed previously. Something like:

if(typeof button_pressed != 'undefined') return;
button_pressed = true;

And you must remove the variable when counter reaches zero:

delete button_pressed;

It ensures the button is pressed only once until the counter finalize.

Regarding your second question about displaying some form fields when printing the form but not on the web, you can assign a custom class name to these fields, ex. fields-for-printing

The class names are assigned to the fields through their “Add CSS Layout Keywords” attributes.

Then you can enter the following style definition through the “Customize Form Design” attribute in the “Form Settings” tab:

.fields-for-printing{display:none !important;}
@media print{
.fields-for-printing{display:block !important;}
}

Please note the support does not include developing the users’ projects. Your questions are not about the plugin but the custom behavior of your form. We can offer you a custom coding service directly from the plugin website for additional questions about these subjects. Contact Us.

Best regards.

In this case, is it possible for you to share the final version of the onclick event edited with my code? I don’t want to create a complicated situation. I will get back to you regarding the second question since it is commercial. Thanks

Hello @pexel

The custom behavior is the button code, not the CSS class definitions. You are requesting us to implement the custom behavior of your buttons and counters as part of the plugin support. But that is specific to your project, not the plugin.

Best regards.