@elixirgraphics I mean I want to change primary color for submit button with CSS.
@DLH @dougmon CSS example working when I try to change hover but I want to change also primary color of the submit button. Thats why I used your visited example for submit of course it didn’t worked 
This actually modifies the base link’s color and the link’s visited state color. Notice the comma between the two sets of selectors? I did that because with links, most people want the links to always be the same color regardless of whether the link has been visited, so I set both at the same time.
Just leave off the :visited from the code you used for the submit button to change it’s normal state color.
Btw, is there a reason you are not setting the button’s regular color in the Form stack’s settings?
Yes, Incompatible with the overall colors of my website. So I want to change.
A couple of suggestions.
First, you should probably have set the Brand Colors in the main Foundry stack to the accent colors you use throughout your website. I would have set the grey-blue (#647382), purple, green and red colors that you use in a number of spots on the site to the categories. That would have made it easier to apply that color everywhere you use it and know that’s it’s the same color. It also makes it easier if you decide to adjust that color a bit in the future. You can change it one time and it will change everywhere. After setting the color to one of the categories, when you go to set a color on something, just pick that label instead of applying that color as a custom color.
Next, you can actually use the color picker in the Form stack to set the button’s color. The only thing that you’re trying to customize is the hover color, which we can then do through CSS. Go ahead and set the button color in the form stack to #647382 and use this CSS for the highlight.
/* Set Form Button Hover Color */
#submit:hover {
background-color: red !important;
}
Whenever possible, you should make changes through the framework’s stacks and at the highest level possible. Set things in the Foundry stack first and the override any special cases with stack specific settings. Finally, any additional tweaks with CSS. You did this for a lot of things, but missed the ability to set a color to a label and then applying that label as a color to an item.
Sorry for not getting in here sooner. I seem to have caught a cold or something that is kicking my butt.
That said – @DLH has it right. Using custom CSS is not necessary. There’s plenty of built in settings for this in the stack already.
Thank you. But I don’t want to change overall button colors. Anyway I used these settings without custom class. I just changed the btn-primary color in the form page.
.btn-primary {
color: #fff;
background-color: #8882D0;
border-color: #8882D0;
font-weight: bold;
letter-spacing: 0.05em;
border-radius: 4px;
}
.btn-primary:hover,
.btn-primary:active,
.btn-primary:focus,
.btn-primary.active {
background: #5647AA;
color: #ffffff;
border-color: #5647AA;
}
I published you can see here how it looks;
The Custom functionality in the Button Style setting allows you to do this without using any code. This is an example using just the settings in the Form stack:
You’re definitely making things much more difficult than they need to be, IMHO.
Yes, I know the custom option, before this action I used that setting, but it does not give the color I want on the hover action.
It is not possible the get these colors on custom settings;
These are my settings;
This is the custom option;
No you can’t define a custom hover color as I stated previously. If that is a must for you, use the custom code. Personally I’d just use the stack’s custom settings myself so I didn’t need to separately maintain the custom CSS in the future as well. Just my 2 cents.
Is there any harm I’ve done?
You can’t really “harm” it. You’re just now responsible for maintaining some of your own code.
No, there is no harm in what you’re trying to accomplish. We just want you to see that the basis of Foundry is ease of use and with that you can build a very professional look with the built in stacks. Custom css is difficult to maintain. So, we’re just trying to make you are aware of that.
I want to be clear, that you could have used the Form’s button color setting to set the color you wanted and just used the last code I posted to only override the hover color. I think it’s best to keep as much of the customization done in the settings and only use CSS when you can’t do something with the settings.
Neither is way wrong. It’s just less likely to cause any issues in the future, by keeping as much in the settings as possible.
