Hi!
1. At the "File upload" button in the account, if the hover also works, why isn't the active one?:
#wpforo #wpforo-wrap .wpforo-profile-account .wpf-field-type-avatar input[type="file"]::file-selector-button {
color: #643c14;
background: black;
border: 2px dashed #007800;
}
#wpforo #wpforo-wrap .wpforo-profile-account .wpf-field-type-avatar input[type="file"]::file-selector-button:hover {
color: #007800;
background: black;
border: 2px dashed #643c14;
}
#wpforo #wpforo-wrap .wpforo-profile-account .wpf-field-type-avatar input[type="file"]::file-selector-botton:active {
color: #007800;
background: black;
border: 2px dashed #007800!important;
}
2. Here, too, is an intractable problem (for me)....
For example: "Add answer" button. Here only the hover works perfectly...
#wpforo #wpforo-wrap input[type="submit"], #wpforo #wpforo-wrap input[type="reset"] {
color: #007800!important;
background: black!important;
border: 3px dashed #643c14!important;
font-weight: normal!important;
border-radius: 15px!important;
box-shadow: 0px 0px 20px 5px #a00000!important;
padding: 13px 10px!important;
font-size: 15px!important;
line-height: 0px!important;
}
#wpforo #wpforo-wrap input[type="submit"]:hover, #wpforo #wpforo-wrap input[type="reset"]:hover {
color: #007800!important;
background: black!important;
border: 3px dashed #643c14!important;
font-weight: normal!important;
border-radius: 15px!important;
box-shadow: 0px 0px 20px 5px #232396!important;
padding: 13px 10px!important;
font-size: 15px!important;
line-height: 0px!important;
}
#wpforo #wpforo-wrap input[type="submit"]:active, #wpforo #wpforo-wrap input[type="reset"]:active {
color: #007800!important;
background: black!important;
border: 3px dashed #643c14!important;
font-weight: normal!important;
border-radius: 15px!important;
box-shadow: 0px 0px 20px 5px #00780!important;
padding: 13px 10px!important;
font-size: 15px!important;
line-height: 0px!important;
}
Thank you in advance for your help!
Hi @zit3k,
Check this CSS Doc: https://www.w3schools.com/cssref/css_selectors.php
I managed to solve the smooth look, BUT the ACTIVE part does not want to work for the following.
Please check them out, thank you very much.
One is:
Account / "Add file button"
#wpforo #wpforo-wrap .wpforo-profile-account .wpf-field-type-avatar input[type="file"]::file-selector-button:active {
color: #007800;
background: black;
border: 2px dashed #007800 !important;
}
Another:
Forum / "Add answer button"
#wpforo #wpforo-wrap.wpf-dark input[type="submit"]:active,
#wpforo #wpforo-wrap.wpf-dark input[type="reset"]:active {
color: #007800 !important;
background: black !important;
border: 3px dashed #643c14 !important;
font-weight: normal!important;
border-radius: 15px !important;
box-shadow: 0px 0px 20px 5px #00780 !important;
padding: 13px 10px !important;
font-size: 15px !important;
line-height: 0px !important;
}
Thank you very much.
Edited your post with correct Codes,
In the First one, you have made a mistake and wrote
"file-selector-botton", need to be "file-selector-button".
In the Second one you need to add .wpf-dark class next to #wpforo-wrap as you are using dark theme.
@chris
I understand, thank you very much for that too!
For Chrome/Developer Tools:
For "Element status/disabling", yes, I can see that the code is changing.
However, for some reason it does not accept the "box-shadow" command, what can be the solution?
#wpforo #wpforo-wrap.wpf-dark input[type="submit"]:active,
#wpforo #wpforo-wrap.wpf-dark input[type="reset"]:active {
color: #007800 !important;
background: black !important;
border: 3px dashed #643c14 !important;
font-weight: normal !important;
border-radius: 15px !important;
box-shadow: 0px 0px 20px 5px #00780 !important;
padding: 13px 10px !important;
font-size: 15px !important;
line-height: 0px !important; }
Hi, can you please help me with this button activity?
The active option does not want to work. 🙁
Thank you in advance for your help!
Please read about ":active" selector: https://www.w3schools.com/cssref/sel_active.php
I did it well, only 1 "0" was missing from the color code in the active line....
Thanks for the link, I understand these, hover and the rest, only because I didn't write the website here, so it's difficult to find how I can refer to a specific thing, since everything overwrites everything.
If all I had to do was look up the id or class code of one of them and write down that, for example, :hover and then the css code works, then it would be easy, I just have to find out from someone else's work how exactly I can refer to 1 specific thing, that's difficult so that I don't I am a web developer.
I will ask for 2 more buttons, then there are 1-2 small things next to each other (bold, selection, etc.) and everything is ready. 😐
