make the boxes for the form fields darker

Brandy Hurley
Topic Author
Offline
Junior Member

More

12 years 9 months ago #22058 by Brandy Hurley

make the boxes for the form fields darker was created by Brandy Hurley

Is there a way to make the boxes for the form fields darker? I have a larger monitor and sometimes I can barely see the box outlines for each fill-in field. Only the ones directly in my line of sight in the middle of the screen.
In the confirmation page, I really can't see it well at all.

Can I adjust that? Make the outline a darker grey?

Please Log in or Create an account to join the conversation.

Tuan Pham Ngoc
Offline
Administrator

More

12 years 9 months ago #22171 by Tuan Pham Ngoc

Replied by Tuan Pham Ngoc on topic Re: make the boxes for the form fields darker

Hi Brandy

Basically, the inputbox use Joomla core inputbox css class, so you will need to edit that css class in your template to make the boxes for form fields darker. If you send me the link to the donation page on your site, I will be able to tell you which files and which line in that file need to modified.

Regards,

Tuan

Please Log in or Create an account to join the conversation.

Brandy Hurley
Topic Author
Offline
Junior Member

More

12 years 9 months ago #22232 by Brandy Hurley

Replied by Brandy Hurley on topic Re: make the boxes for the form fields darker

www.wplf.org/index.php/donate-today

thank you!

Please Log in or Create an account to join the conversation.

Tuan Pham Ngoc
Offline
Administrator

More

12 years 9 months ago #22299 by Tuan Pham Ngoc

Replied by Tuan Pham Ngoc on topic Re: make the boxes for the form fields darker

Hi Brandy

I looked at the page and found that the css for the inputbox is located line 44 of the file templates/fontaine_j25/css/extensions.css. The code is :

Code:

input[type="text"],
	input[type="password"],
	input[type="email"],
	input[type="url"],
	textarea,
	.searchbox {
		border-color: #E0E0E0;
		border-style: solid;
		border-width: 0 1px 1px;
		padding:4px 13px 3px;   
		outline: none;
		color:#939393;
		margin:1px 0 3px;
		line-height: 1.5em;
		min-height:19px;
		-webkit-box-shadow: 1px 1px 0 rgba(255, 255, 255, .5), 0 0 0 2px rgba(0, 0, 0, 0.05);
		   -moz-box-shadow: 1px 1px 0 rgba(255, 255, 255, .5), 0 0 0 2px rgba(0, 0, 0, 0.05);
		        box-shadow: 1px 1px 0 rgba(255, 255, 255, .5), 0 0 0 2px rgba(0, 0, 0, 0.05);
	}

Maybe you can try to change it to (make the border of the box become 2px) :

Code:

input[type="text"],
	input[type="password"],
	input[type="email"],
	input[type="url"],
	textarea,
	.searchbox {
		border: 2px solid #000;		
		padding:4px 13px 3px;   		
		color:#939393;
		margin:1px 0 3px;
		line-height: 1.5em;
		min-height:19px;
		-webkit-box-shadow: 1px 1px 0 rgba(255, 255, 255, .5), 0 0 0 2px rgba(0, 0, 0, 0.05);
		   -moz-box-shadow: 1px 1px 0 rgba(255, 255, 255, .5), 0 0 0 2px rgba(0, 0, 0, 0.05);
		        box-shadow: 1px 1px 0 rgba(255, 255, 255, .5), 0 0 0 2px rgba(0, 0, 0, 0.05);
	}

Please try to make the change and let me know the result !

Tuan

Please Log in or Create an account to join the conversation.

Moderators: Dang Thuc Dam, Dang Dam

Powered by Kunena Forum

make the boxes for the form fields darker

Support

Documentation

Information

Connect Us