Add CSS classes to FormWizard Pro elements

This is a forum to suggest new features for mojoPortal. 

This thread is closed to new posts. You must sign in to post in the forums.
2/22/2010 1:32:50 PM
Joe Davis
Gravatar
Total Posts 2253
View Posts

Add CSS classes to FormWizard Pro elements

Hi Joe,

Would it be possible to add unique CSS classes to the Form Wizard Pro elements below?

  • Captcha DIV
  • Summary DIV (used to display the required field messages)
  • FormEdit.aspx panelwrapper currently has formwizard class but if it had a unique class like formwizardedit, the formwizard styles wouldn't apply which makes editing the form easier in many cases.

Also, a setting in the FormWizard module settings to specify a CSS class would be a very good addition because it would make it easy to create different styles for different forms.

Thanks,
Joe D.

5/31/2010 7:14:28 AM
Joe Audette
Gravatar
Total Posts 18439
View Posts

Re: Add CSS classes to FormWizard Pro elements

Hi Joe,

I have completed these changes and will be making a new release of Form Wizard Pro at the same time as the coming release of mojoPortal.

Best,

Joe

5/3/2011 4:26:03 AM
Erhan Ünsal
Gravatar
Total Posts 51
View Posts

Re: Add CSS classes to FormWizard Pro elements

Hi,

1. Can we change settings for Submit button in Form Wizard Pro without effecting other buttons in web site (for example in Contact Form)?

2. I used class below to change font settings. I think, it's not the correct way. Do you have any suggestions? 

.qtext, .qcheckboxes, .qradio, .qdropdown, .qdate, .qcb, .qparagraph
{
    font-family: Arial, Helvetica, Sans-Serif;
    font-size: 14px;
    font-style: italic;
}

 

Thanks,

Erhan

5/3/2011 6:39:02 AM
Joe Audette
Gravatar
Total Posts 18439
View Posts

Re: Add CSS classes to FormWizard Pro elements

Hi Erhan,

I will add an extra CSS class on that button for the next release to make it easier.

For now I think you could style it with a selector like this:

.formwizard input[type="submit"] { }

though if it is already styled by the jqueryui button style classes you could style it with a selector like this:

.formwizard input.jqbutton { }

Hope that helps,

Joe

5/3/2011 6:48:28 AM
Joe Audette
Gravatar
Total Posts 18439
View Posts

Re: Add CSS classes to FormWizard Pro elements

For fonts you can probably do something more simple like this, but whatever works is ok:

.formwizard
{
font-family: Arial, Helvetica, Sans-Serif;
font-size: 14px;
font-style: italic;
}

Best,

Joe

5/3/2011 12:21:55 PM
Erhan Ünsal
Gravatar
Total Posts 51
View Posts

Re: Add CSS classes to FormWizard Pro elements

Hi Joe,

Thanks for the answer.

I can style Form Wizard button with a selector as you described (font-size, width etc.). But it doesn't help to arrange the position of the button. You see below the source from the page. I think I need something like "art-button-wrapper" because it works if used for example:

.art-button-wrapper
{
    left:230px;
}

As written before it effects other buttons in web site. Perhaps you have a solution for this problem too.

Best,
Erhan

 

<div class="settingrow">
<span class="settingrow"></span>
<span class="art-button-wrapper"><span class="art-button-l"> </span>
<span class="art-button-r"> </span>
<input type="submit" name="ctl01$mainContent$ctl00$btnSubmit" value="Submit" onclick="javascript:WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions(&quot;ctl01$mainContent$ctl00$btnSubmit&quot;, &quot;&quot;, true, &quot;formwizard&quot;, &quot;&quot;, false, false))" id="ctl01_mainContent_ctl00_btnSubmit" class="art-button" />
</span>
<input type="hidden" name="ctl01$mainContent$ctl00$hdnResponseSetGuid" id="ctl01_mainContent_ctl00_hdnResponseSetGuid" />
</div>

5/3/2011 12:26:28 PM
Joe Audette
Gravatar
Total Posts 18439
View Posts

Re: Add CSS classes to FormWizard Pro elements

.formwizard .art-button-wrapper
{
    left:230px;
}

Hope it helps,

Joe

5/4/2011 2:59:15 AM
Erhan Ünsal
Gravatar
Total Posts 51
View Posts

Re: Add CSS classes to FormWizard Pro elements

Hi Joe,

Sooo easy?
Your answer solved my problem. Thanks a lot.

Best,

Erhan

You must sign in to post in the forums. This thread is closed to new posts.