Color changes

technova76

1) How Can I change the color of the button in the error page?
2) I would like to test a different image with text for the error page. But I see that the shape with the text in the template, is separated from the image. How can I hide this shape? (I will change the image from ftp)
3) I would also like to change the blue color of the button at the "Login" page, and the color of the "Submit" button when you click at "Forgot your password?" or "Forgot your username?".
4) The same change in the color I would like to make at the "Become a Volunteer" and "Donate Now", at the "About Donante." It's at the buttom of the main page.
Also at the link in "Contact Us" page.
5) At the "Search" page, I could like to change the color in the icon at the search bar, when it becomes blue.
The Smart search button is not working.
6) In the offline page, I would like to change the color of the button and the image.
7) In the error page, can we add the style that shows the image and the active "Home" button. It's much better and practical for the user...

Give me instructions of how I will change all the above!

saguaros

technova76 1) How Can I change the color of the button in the error page?
2) I would like to test a different image with text for the error page. But I see that the shape with the text in the template, is separated from the image. How can I hide this shape? (I will change the image from ftp)

Do you mean the 'Homepage' button on error page?

Here is css code for it:

.btn-home-page {
    background-color: rgba(255, 255, 255, 0.05);
    border: 2px solid rgba(255, 255, 255, 0.1);
    border-radius: 50px;
    color: #fff;

/*hover color*/
.btn-home-page:hover, .btn-home-page:focus, .btn-home-page:active {
    background-color: #c36349;
    border-color: #c36349;
}

You can change to your desired color

I see that the shape with the text in the template

Which shape are you referring to? could you share screenshot?

technova76

Hello.
I'm talking about this shape...

As for the codes you send me, I will add them in the "custom" file, at css folder?
What about the other questions you didn't answer?

saguaros

technova76

That 'shape' is set via css:

.error-code::after {
    background-image: url('../images/pattern/bg-title-lead.png');
}

The path of background image is: /templates/ja_donate/images/pattern/bg-title-lead.png

If you want to remove this, you can use this css:

.error-code::after {
    background-image: none !important;
}

All custom css should be added to the file: /templates/ja_donate (your default template)/css/custom.css (Create this file if it doesn't exist)

For other questions, as I mentioned in your other topic, pls separate it in different topics so if it will be easier to follow and helpful if others have the same question.

technova76

Can you please be more specific about each code?
For what is it and where I have to add it...

technova76

Good morning.
I have added the code for removing the pattern in error page, and change the homepage button, but it didn't worked.

saguaros

technova76

Kindly share the URL of that page, I will take a look.

technova76

https://piggybankaction.org/action/index.php?Itemid=105

saguaros

technova76

There was wrong syntax in your custom code (missing some closing tag), I updated for you.

technova76

Thank you.

The dimension of the background image in the error page, is something standard?
Does it have to do with the text?

Because I see that it creates a scroll bar, while it could fit on the screen ...

saguaros

technova76

Try this custom css:

body.page-error {
    margin: auto;
}

technova76

Good morning.
I added it, but I don't see any change.
What I should expect to see?

saguaros

technova76

It turns out that the error page doesn't include 'custom.css' file, you need to put it directly into the file: /templates/ja_donate/css/error.css

I updated for you.

technova76

Thank you.
But I still see the scroll. Is this code about the scroll or something else?

saguaros

technova76

Try to clear your browser's cache as it looks fine at my end - no scroll bar appears now.

technova76

I still see it, even if I cleaned it.

What about the rest of my questions?

saguaros

technova76 I still see it, even if I cleaned it.

Here is screenshot at my end, I tried with different browsers: https://prnt.sc/qhee0p and there is no scroll bar

#107186 For other questions, as I mentioned in your other topic, pls separate it in different topics so if it will be easier to follow and helpful if others have the same question.

technova76

Maybe because my display resolution is at 1280x800.
It's ok.