Contact Page Text Size

Classic General
1

Hi guys,

After taking the advice of members here I had great success with updating the PHP on the web host and the Store now working correctly a new problem has arisen.

The Contact page in Rapidweaver has text that is too small. The fields are too large AND the text is too small.

Any ideas please.

James

2

I have tried this as well since Iā€™m using the Corporation Theme from Yazool as well and pasted it into the CSS on the page properties but still no joy:

.form-input-field, .form-input-textarea {
font-size: 1.1em;
}

3

A url would help people take a look.

4

It is not published yet but here is what I mean - the text box on the web in another Yazool theme (Flatty) looks fine but not this.

Ekey_Corp_04_rw.png559Ɨ909 22 KB

5

Without a URL itā€™s difficult for someone to help you as we have nothing to use web tools on. Perhaps @yuzool or @kryten can give a hand.

3 Likes
6

Hi

If using the default contact form page type in ā€œCorporationā€ themeā€¦ then try adding this CSS to the page level CSS container:

label {
	font-size: 1.3em;
}

.message-text {
    font-size: 1.3em;
}

That should get you going. The numerical values in those snippets are just suggestionsā€¦ try adjusting them up and down until you find values compatible with your design.

2 Likes
7

Hi Stuart,

Thanks very much for that. That does alter the size of the text in the form which is great.

It is the actual size of the text you type into the boxes though that is too small and that doesnā€™t help.

I am trying to get the typed text to be around the size of this here: http://demo.yuzoolthemes.com/flatty/contact.php

That is a very cool theme btwā€¦

8

@Sparkoids

Ah. Okayā€¦ sureā€¦ sorryā€¦ I should have read from the beginning of the thread.

Tryā€¦

input.form-input-field {
    font-size: 1.4em;
}

To adjust the text size in the form fields.

Andā€¦ should you need it:

.form-input-field {
    height: 25px;
}

To adjust the height of the fields themselves.

2 Likes
9

Stuart that is absolutely fantastic. Thank you so much for the help. That is perfect looking :-}

Last question for you I promise. How do I make the active fields do this? It isnā€™t important for my site but I just wondered how to do it. I have tried everything in the Flatty theme but canā€™t see how it works.

What happens here is the boxes (with rounded corners) go black when the field is highlighted.

http://demo.yuzoolthemes.com/flatty/contact.php

1 Like
10

Hi @Sparkoids

Glad to help.

What you are asking about is not a built in style option on the ā€˜Corporationā€™ theme, but it can still be achieved with some custom CSS. Try adding this to the CSS container for the contact form page:-

input.form-input-field:focus {
    border: 2px solid red;
}

textarea.form-input-field:focus {
    border: 2px solid red;
}

Naturally you change the ā€˜redā€™ to any valid colour choice you wish.

Hope this helps and thanks for choosing Yuzoolthemes!

4 Likes