Ecommerce software home
Shopping Cart Software Forum for Ecommerce Templates
 
Home | Profile | Register | Active Topics | Members | Search | FAQ
Username:
Password:
Save Password
Forgot your Password?


Find us on Facebook Follow us on Twitter View our YouTube channel
Search our site

 All Forums
 General
 CSS and Responsive Designs
 I think I'm losing my mind...
 New Topic  Reply to Topic
 Printer Friendly
Author  Topic   

cooper
Ecommerce Template Guru

USA
2763 Posts

Pre-sales questions only
(More Details...)

Posted - 05/11/2020 :  05:01:02  
I've been working through style issues on one of my sites. I got the buttons to look right (http://www.champsportinggoods.com/products.asp?cat=171) with the dark blue style and then the red when you hover.

However, I woke up this morning, hit the product detail page (http://www.champsportinggoods.com/proddetail.asp?prod=CO078P) and email a friend, ask a question and add to cart buttons are all different!

Here is what I have in ectstyle3.css:

input.ectbutton{
background:#003366;
color:#fff;
padding:4px 12px;
border:0;
border-radius:4px;
-webkit-appearance: none;
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.6);
font-family:FontAwesome, sans-serif
}

input.ectbutton:hover{
background:#B61818;
color:#fff;
cursor:pointer;
-webkit-appearance: none;
text-shadow: 0 1px 1px rgba(75, 75, 75, 0.6);
font-family:FontAwesome, sans-serif
}


Have I lost my mind? I didn't upload any style sheet changes over the weekend and this looked perfect on Friday!


Bill

Marshall
Ecommerce Template Guru

USA
1576 Posts

Posted - 05/11/2020 :  07:01:05  
That button's classes are buybutton and detailbuybutton so you would need

input.detailbuybutton{
background:#003366;
color:#fff;
padding:4px 12px;
border:0;
border-radius:4px;
-webkit-appearance: none;
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.6);
font-family:FontAwesome, sans-serif
}

input.detailbuybutton:hover{
background:#B61818;
color:#fff;
cursor:pointer;
-webkit-appearance: none;
text-shadow: 0 1px 1px rgba(75, 75, 75, 0.6);
font-family:FontAwesome, sans-serif
}

As for the products.asp?cat=171 page, the button styling in your ectstyle3.css sheet is
input.detaillink, input.qbuybutton{
float:left;
width:100%;
text-align:center;
padding:6px;
margin:0px;
background:#003366;
border:0px;
color:#fff;
border:0;
border-radius:4px;
-webkit-appearance: none;
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.6);
font-family: FontAwesome, sans-serif;
}

input.detaillink:hover, input.qbuybutton:hover{
background:#B61818;
color:#FFF !important;
cursor:pointer;
-webkit-appearance: none;
text-shadow: 0 1px 1px rgba(75, 75, 75, 0.6);
border:0;
}

You could add the input.detailbuybutton and input.detailbuybutton:hover to those existing styles. And the class ectbutton does not exist on page.

Marshall
CENLYT Productions - ms designs
Affordable Web Design
Custom Ecommerce Designs
Responsive Websites
Cenlyt.com

cooper
Ecommerce Template Guru

USA
2763 Posts

Pre-sales questions only
(More Details...)

Posted - 05/11/2020 :  11:51:40  
Thank you, AGAIN Marshall!

Bill

dbdave
ECT Moderator

USA
8801 Posts

Posted - 05/11/2020 :  12:17:59  
Hi, I wanted to mention here that in a recent update - https://www.ecommercetemplates.com/support/topic.asp?TOPIC_ID=112252 there was a new class added to virtually all buttons on the site.
It should allow you you style all (ect generated) buttons on the site with one class.

quote:
New class "ectbutton" for buttons
A new class has been added for all buttons on your site, ectbutton making it easier to provide a consistent theme for buttons throughout your site. A smart default style has been set for these buttons which you can override in the cart style sheet if required to match your site style.
To change the default button style, add the following to your site style sheet using your preferred background and text color. (You should not edit the ectcart.css file as that makes it harder to update in the future.)
input.ectbutton,button.ectbutton{
background:#006ABA;
color:#FFF;
}


Of course old classes are still there too - giving flexibility to style the buttons individually.

Thanks,
David

Marshall
Ecommerce Template Guru

USA
1576 Posts

Posted - 05/11/2020 :  12:54:13  
David,

The site Bill is referring to in this thread does not have the ectbutton class.

Marshall
CENLYT Productions - ms designs
Affordable Web Design
Custom Ecommerce Designs
Responsive Websites
Cenlyt.com

dbdave
ECT Moderator

USA
8801 Posts

Posted - 05/11/2020 :  13:05:06  
I see Marshall, I guess I was going off this thread where it says Vince's suggestion worked.
https://www.ecommercetemplates.com/support/topic.asp?TOPIC_ID=112832

Thanks for the clarification.

David
   Topic   
 New Topic  Reply to Topic
 Printer Friendly
Jump To:
Shopping Cart Software Forum for Ecommerce Templates © 2002-2020 ecommercetemplates.com
This page was generated in 0.03 seconds. Snitz Forums 2000