Integration with Salient Theme Ascend – displaces text

[GraemePBellParticipant]

Hi

I’m having a nightmare trying to style the search box properly. the search is located on the Advanced Search page.

When I click into the field – the elements shift upwards, and the styling is all over the place – I’ve added :

input[type=text], textarea, input[type=email], input[type=password], input[type=tel] {
transition: none!important;
}

to the css in the Salient Theme General Admin area CSS box, it improves slightly but doesn’t get round my issue – any help would be appreciated
many thanks
Graeme

[Ernest MarcinkoKeymaster]

Hi!

Well, there are indeed some nasty rules overriding the search input style. This custom CSS seemed to help, when I put it together on the console panel:

.proinput input.orig, .proinput input.autocomplete {
    padding: 0 !important;
    line-height: normal !important;
    color: white !important;
    border: 0 !important;
    font-size: 12px !important;
}

The cause of the problem is the following lines in the ascend.css file:

.container-wrap input[type="text"], .container-wrap textarea, .container-wrap input[type="email"], .container-wrap input[type="password"], .container-wrap input[type="tel"], .container-wrap input[type="url"], .container-wrap input[type="search"], .container-wrap input[type="date"] {
	background-color: transparent!important;
	border: 1px solid #ccc!important;
	box-shadow: none!important;
	-webkit-box-shadow: none!important;
	font-size: 16px!important;
	-o-box-shadow: none!important;
	padding: 16px!important;
}

This basically forces padding, mfont size, background and a border to the input field. No wonder the search style was overwritten, as these are forced with the !important modifier, which should be avoided, but I guess the developer had a good reason to use it this case.

Anyways, I’m hoping it helps 🙂

Best,
Ernest Marcinko
If you like my products, don't forget to rate them on codecanyon :)

[GraemePBellParticipant]

Thanks for the awesome support and quick reply!! I love this plugin and really want to use it

this will be the same for anyone using Salient theme with the Ascend profile settings, so it may be good for the knowledgebase

Going to update now and will let you know

thanks again
Graeme

[Author]

Posts