Joomla Templates Club 406,261 posts

[vojkanbg Friend vojkanbgJoin date: November 2010Posts: 38Downloads:0Uploads:3 Thanks: 10]

#169380

Is there styling in Joomlart’s template JA Teline IV I can use with web forms?
I’ve created web forms using ChronoForms V4 RC2.0, but they look somehow unfinished, as they need some pimping 🙂

Is there way to make them look more modern and user friendly.
For example:
1. some hover effect when user points his mouse over text box or any other form component.
2. edges rounded etc…

[khoand Friend khoandJoin date: February 2011Posts: 4500Downloads:0Uploads:179 Thanks: 169 Thanked: 1166 times in 1060 posts]

#417308

Hi,
Could you give me a snapshot with your annotation? Could you give me a link to your page as you said?

[vojkanbg Friend vojkanbgJoin date: November 2010Posts: 38Downloads:0Uploads:3 Thanks: 10]

#417478

My website is still on localhost.
Here are some examples of styled forms using ChronoForms V3 (I am using V4):
– http://www.promoteamsrbija.rs/web-ra…eb-razvoj.html
– http://www.ogosense.com/joomla-designers

Here is the look of the form with default chronoforms styling that I took from my website.
http://imageshack.us/photo/my-images…ojoomlart.png/

As you can see on the image of default form, it is basic form, no advanced stuff.
On examples provided, on mouse hover textbox changes colour or text box background changes colour, edges are rounded,… all in all it looks much more user friendly.

[khoand Friend khoandJoin date: February 2011Posts: 4500Downloads:0Uploads:179 Thanks: 169 Thanked: 1166 times in 1060 posts]

#417898

Basically, you can apply any styles to form. But you must modify source code (.php file)and styling file (.css file).

[vojkanbg Friend vojkanbgJoin date: November 2010Posts: 38Downloads:0Uploads:3 Thanks: 10]

#417978

Is there some style suitable for textboxes already built in JA Teline IV?
Basically, I need code to input in text box and other elements like radio buttons, check boxes, ….

[khoand Friend khoandJoin date: February 2011Posts: 4500Downloads:0Uploads:179 Thanks: 169 Thanked: 1166 times in 1060 posts]

#418280

I’m not sure.
Do you give me a link to your website use ChronoForms and teline_iv? I will check it.

[vojkanbg Friend vojkanbgJoin date: November 2010Posts: 38Downloads:0Uploads:3 Thanks: 10]

#418302

http://www.cvius.com/
Look for Chrono Form item in main menu which opens Chrono Form I created.
You can also take a look at a backend with parameters I’ll send you to PM.

[khoand Friend khoandJoin date: February 2011Posts: 4500Downloads:0Uploads:179 Thanks: 169 Thanked: 1166 times in 1060 posts]

#418423

To input have rounded border, shadow effect, you replace this code from http://www.cvius.com/components/com_chronoforms/css/frontforms.css


.ccms_form_element input, textarea, input {
padding: 6px !important;
border: 1px solid lightGrey;
margin-bottom: 5px;
}
with


.ccms_form_element input, textarea, input {
padding: 6px !important;
border: 1px solid lightGrey;
margin-bottom: 5px;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
box-shadow: 0 0 3px rgba(0, 0, 0, .2) inset;
-moz-box-shadow: 0 0 3px rgba(0, 0, 0, .2) inset;
-webkit-box-shadow: 0 0 3px rgba(0, 0, 0, .2) inset;
}

some hover effect when user points his mouse over text box or any other form component.

Add this code into http://www.cvius.com/components/com_chronoforms/css/frontforms.css


.ccms_form_element input:hover, textarea:hover {
border: 1px solid #C00;
}

1 user says Thank You to khoand for this useful post

1. vojkanbg

[vojkanbg Friend vojkanbgJoin date: November 2010Posts: 38Downloads:0Uploads:3 Thanks: 10]

#418435

Thank you. You’ve helped me a lot.
Wish you all the best.

[Author]

Posts