Post by dragonaz » Sat Jan 30, 2016 8:47 pm

Hello, i have tried some changes in stylesheet.css and i can`t solve this by myself, so please help me to change the default black color of opencart cart button to something else.
I`m using default theme.
As an examle let it be green.
Here you can see how it is displayed right now:

Image

Newbie

Posts

Joined
Wed Dec 02, 2015 8:18 pm

Post by cyclops12 » Sun Jan 31, 2016 12:05 am

look in catalog/view/theme/YOUR_THEME/stylesheet/stylesheet.css around line 503 look for

Code: Select all

.btn-inverse {
	color: #ffffff;
	text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
	background-color: #363636;
	background-image: linear-gradient(to bottom, #444444, #222222);
	background-repeat: repeat-x;
	border-color: #222222 #222222 #000000;
}

Expert Member

Posts

Joined
Sun Sep 27, 2015 1:10 am

Post by dragonaz » Sun Jan 31, 2016 12:51 am

Thank you for your suggestion but nothing has changed after replacing

color #ffffff with #006400
or
background-color: #363636 with #006400

].btn-inverse {
color: #ffffff;
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
background-color: #363636;

Newbie

Posts

Joined
Wed Dec 02, 2015 8:18 pm

Post by cyclops12 » Sun Jan 31, 2016 1:37 am

sorry you also need to comment out or remove background image and repeat so its just

Code: Select all

.btn-inverse {
   color: #ffffff;
   text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
   background-color: #006400;
   border-color: #222222 #222222 #000000;
}
cart_button.JPG

cart_button.JPG (37.42 KiB) Viewed 8869 times


Expert Member

Posts

Joined
Sun Sep 27, 2015 1:10 am

Post by cyclops12 » Sun Jan 31, 2016 2:31 am

You also may have to refresh the cache in bo/extensions/modifications.
Be aware this might put your site in maintenance mode

Expert Member

Posts

Joined
Sun Sep 27, 2015 1:10 am

Post by dragonaz » Sun Jan 31, 2016 3:37 am

Thank you @cyclops12 you are helping me for the second time.
But why it is necessary to refresh my modification cache.
This is just manual intervention in stylesheet.css.
I`m not using ocmod or vqmod extension to change the color.
I just want to know in order to follow best opencart practices with which you are obviously closely familiar.

Newbie

Posts

Joined
Wed Dec 02, 2015 8:18 pm

Post by cyclops12 » Sun Jan 31, 2016 4:04 am

Your welcome, only happy to help if I can.
From what I gather it is something in versions 2 that sometimes if you make changes you need to refresh the cache. You may not need it all the time but just thought I would mention it

Expert Member

Posts

Joined
Sun Sep 27, 2015 1:10 am

Post by viethemes » Mon Feb 01, 2016 11:14 pm

Hi @dragonaz, you may like my extension Live Theme Editor which will help you to customize the default theme visually. No need to know about code :)

http://www.viethemes.com - OpenCart turtorials, news, tips and stricks, extension

Our extensions:
Visual Theme Editor - Powerful tool for customizing style of any theme visually
Live Theme Editor - Customize layout, colors, backgrounds, fonts of the default theme
Theme Animation - Animation Editor for any theme

Extra Positions PRO, Custom JavaScript, Custom CSS and others


User avatar
Active Member

Posts

Joined
Thu Jan 08, 2015 12:17 pm


Post by sunsys » Tue Oct 11, 2016 10:09 am

cyclops12 wrote:look in catalog/view/theme/YOUR_THEME/stylesheet/stylesheet.css around line 503 look for

Code: Select all

.btn-inverse {
	color: #ffffff;
	text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
	background-color: #363636;
	background-image: linear-gradient(to bottom, #444444, #222222);
	background-repeat: repeat-x;
	border-color: #222222 #222222 #000000;
}
Why is the shopping cart top button connected to ".btn-inverse" and why not "#cart > .btn" please kindly explain this.

Thank you for your time.

Regards,
Sun Systems
Industrial Electronics and Instrumentation


User avatar
Active Member

Posts

Joined
Tue Jan 27, 2015 5:19 am

Post by cyclops12 » Tue Oct 11, 2016 10:30 pm

sunsys wrote:
cyclops12 wrote:look in catalog/view/theme/YOUR_THEME/stylesheet/stylesheet.css around line 503 look for

Code: Select all

.btn-inverse {
	color: #ffffff;
	text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
	background-color: #363636;
	background-image: linear-gradient(to bottom, #444444, #222222);
	background-repeat: repeat-x;
	border-color: #222222 #222222 #000000;
}
Why is the shopping cart top button connected to ".btn-inverse" and why not "#cart > .btn" please kindly explain this.

Thank you for your time.
You would have to ask Daniel about that as he built the site :)

Expert Member

Posts

Joined
Sun Sep 27, 2015 1:10 am

Post by sunsys » Wed Oct 12, 2016 2:38 am

cyclops12 wrote:You would have to ask Daniel about that as he built the site :)
Ok fine thank you, at least can you please tell me that apart from ".btn-inverse" which all other buttons are involved in the top cart function.

I thank you for your time.

Regards,
Sun Systems
Industrial Electronics and Instrumentation


User avatar
Active Member

Posts

Joined
Tue Jan 27, 2015 5:19 am

Post by cyclops12 » Wed Oct 12, 2016 4:34 am

okay having looked into this a bit more it seems the cart button has various classes....
.btn
.btn-inverse
.btn-block
.btn-lg
AND id of
#cart.btn

#cart.btn adjusts font size, font color and line height

the rest are for borders,width,padding and background color etc

Hope this helps

Expert Member

Posts

Joined
Sun Sep 27, 2015 1:10 am

Post by sunsys » Wed Oct 12, 2016 1:31 pm

cyclops12 wrote:okay having looked into this a bit more it seems the cart button has various classes....
.btn
.btn-inverse
.btn-block
.btn-lg
AND id of
#cart.btn

#cart.btn adjusts font size, font color and line height

the rest are for borders,width,padding and background color etc

Hope this helps
A complete and absolutely perfect answer, I thank you again for your insight in the matter and your help.

Regards,
Sun Systems
Industrial Electronics and Instrumentation


User avatar
Active Member

Posts

Joined
Tue Jan 27, 2015 5:19 am

Post by cyclops12 » Wed Oct 12, 2016 10:57 pm

Happy to be of some help ;D

Expert Member

Posts

Joined
Sun Sep 27, 2015 1:10 am

Post by franktroy » Tue Sep 10, 2019 5:16 am

OpenCart 3
Since this thread is related to color I thought I would pick up the thread. I have a blue outline that I am trying to fix on a button. I am changing the default blue color theme to gray and dark gray. I got most of colors solved except for this more difficult issue. When I click on a button I get a blue outline.
Graphic is here: https://www.doovertable.com/sandbox/Untitled-1.bmp

Attachments

Capture.PNG

Capture.PNG (6.24 KiB) Viewed 5289 times

Capture.PNG

Capture.PNG (6.24 KiB) Viewed 5289 times


New member

Posts

Joined
Sun Aug 18, 2019 5:32 pm
Who is online

Users browsing this forum: No registered users and 5 guests