-
AuthorPosts
-
December 22, 2014 at 2:03 pm #203747
Hi,
I would like to change the color of buttons (I am using blue theme for Uber Restaurant) from blue to gray. I would like also to change back-color for the info box (the one on the map) and other parts of the template. May I do this?
Thank you,
VittorioTomC ModeratorTomC
- Join date:
- October 2014
- Posts:
- 14077
- Downloads:
- 58
- Uploads:
- 137
- Thanks:
- 948
- Thanked:
- 3155 times in 2495 posts
December 22, 2014 at 5:14 pm #559362You absolutely can – though it will help us help you if you can specify the “other parts of the template” you want to modify as well.
As for the button background color issue . . . . .
If you haven’t yet already done so, create a new file called “custom.css” within file path –> /templates/ja_uber/css/
Within that custom.css file, paste the following CSS rule:
.btn-primary {
background-color: #039be5;
border-color: #039be5;
color: #ffffff;
}Modify the “background-color” and “border-color” properties to whatever color hex code you wish.
Similarly, for the contact box background info (within the “map” section) . . . .
Paste the following within the custom.css file:
.uber-contact-info.style-2 .info, .uber-contact-info.style-1 .info {
background-color: #039be5;
color: #ffffff;
padding: 26px;
position: absolute;
width: auto;
}Again, modify the “background-color” property to whatever color code you wish.
SAVE CHANGES – CLEAR CACHE – REFRESH PAGE
Hope That Helps.
December 22, 2014 at 6:55 pm #559384Hi Tom
Thank you for so quick answer. I have followed your instructions but colors don’t change. Let resume my steps:
1- Created file custom.css (with new colors)
2- Saved it on /templates/uber/css
3- Cleared browser cache (Mozilla, IE, Chrome)
4- Refreshed pageI may wrong somewhere… but where?
I take the occasion to specify the other parts of the template I would like to modify:
– I would change main menu colors (my clients have identity and log in dark and light gray)
– I would like to use different font (google font)Thank you for your support,
VittorioTomC ModeratorTomC
- Join date:
- October 2014
- Posts:
- 14077
- Downloads:
- 58
- Uploads:
- 137
- Thanks:
- 948
- Thanked:
- 3155 times in 2495 posts
December 22, 2014 at 7:00 pm #559385Do me a favor …. temporarily set “Optimize CSS” to “off” within your Template Manager–General settings.
Let me know when you’ve done this.
December 22, 2014 at 7:03 pm #559386Hi Tom,
Done. the button is now gray, hover is sttill blu andf contact is still blue.
Thank you
TomC ModeratorTomC
- Join date:
- October 2014
- Posts:
- 14077
- Downloads:
- 58
- Uploads:
- 137
- Thanks:
- 948
- Thanked:
- 3155 times in 2495 posts
December 22, 2014 at 7:08 pm #559387Add this to your custom.css file . . .
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .open > .dropdown-toggle.btn-primary {
background-color: #bebebe;
border-color: #595959;
}and the following as well . . .
.uber-contact-info.style-2 .info, .uber-contact-info.style-1 .info {
background-color: #bebebe;
SAVE CHANGES – CLEAR CACHE – REFRESH PAGE
December 22, 2014 at 7:12 pm #559388Sorry, Tom, nothing changes.
TomC ModeratorTomC
- Join date:
- October 2014
- Posts:
- 14077
- Downloads:
- 58
- Uploads:
- 137
- Thanks:
- 948
- Thanked:
- 3155 times in 2495 posts
December 22, 2014 at 7:14 pm #559389<em>@vitweb 458540 wrote:</em><blockquote>Sorry, Tom, nothing changes.</blockquote>
Can you send me a temporary admin login – via PM ??
TomC ModeratorTomC
- Join date:
- October 2014
- Posts:
- 14077
- Downloads:
- 58
- Uploads:
- 137
- Thanks:
- 948
- Thanked:
- 3155 times in 2495 posts
December 22, 2014 at 8:08 pm #559395Firstly, you were missing a couple of important semi-colons after some color codes within your custom.css file.
I fixed them for you.As for the contact box background color, here is what I did . . . . .
Within file path —> /templates/uber/acm/contact-info/css/style.css
at line 87, modified as follows:
.uber-contact-info.style-2 .info, .uber-contact-info.style-1 .info {
background-color: #bebebe
color: #ffffff
padding: 26px;
position: absolute;
width: auto;
}Better ??
P.S. (For some annoying reason, the Forum software is removing the semi-colons from after the color codes. Always remember to include a semi-colon at the end of any CSS property)
1 user says Thank You to TomC for this useful post
December 23, 2014 at 8:51 am #559454Thank you Tom,
It much better now! Just I see that the button “ORDINA” on the slideshow doesn’t change hover color. How can I solve this?
I know I am asking too many questions on the same post, but I would like to take the occasion to ask how I can change the font for all the template (I want to use Google fonts).
Thank you for your support.
-
AuthorPosts
This topic contains 11 replies, has 2 voices, and was last updated by vitweb 9 years, 11 months ago.
We moved to new unified forum. Please post all new support queries in our New Forum