We use JoomDonation sometimes to accepts donations.
Currently the donation form has issues where cannot see Font, or Placeholder text, or form field borders, background..
The CSS to resolve this will not take effect because of the MANY !important declaration within the template.css file for LIGHTBOX template...
How best to makes these work together?
create override?
Using custom CSS I can only change colors or height. But deeper customization is not my role but JoomDonation.
Try that it will increase comment field:
#donation_form textarea#comment {min-height: 120px;}
yes, you can use bigger value.
Hi,
Indeed, you have to make override, becuase in that template forms by default were on dark background, use custom.css file or Custom CSS field.
For example, You should to use those lines:
#donation_form input::placeholder,
#donation_form select::placeholder,
#donation_form textarea::placeholder,
#donation_form input[type="text"]::placeholder,
#donation_form input[type="password"]::placeholder,
#donation_form input[type="datetime"]::placeholder,
#donation_form input[type="datetime-local"]::placeholder,
#donation_form input[type="date"]::placeholder,
#donation_form input[type="month"]::placeholder,
#donation_form input[type="time"]::placeholder,
#donation_form input[type="number"]::placeholder,
#donation_form input[type="email"]::placeholder,
#donation_form input[type="url"]::placeholder,
#donation_form input[type="search"]::placeholder,
#donation_form input[type="tel"]::placeholder,
#donation_form .uneditable-input::placeholder {color: #333 !important; }
#donation_form input[type="number"], #donation_form input[type="email"],
#donation_form input[type="url"], #donation_form input[type="search"],
#donation_form input[type="tel"], #donation_form select, input#amount,
#donation_form textarea, #donation_form input[type="text"]
{border-color: #aaa !important; outline:1px solid #ddd;
color: #333 !important; border-radius: 4px !important;}
#donation_form input[type="text"]:hover {border: 1px solid #000 !important;}
.donation-default-switch-amounts label.otheramountlabel {outline: 1px solid #aaa; }Thank you very much...
Syntax is a little different than Im used to..
We will test this today..
Please do not touch template.css file (!) we informed about that in Helix documenation.
Check if JoomDonation has Custom CSS field in Settings/Options, if yes, use it. If not, add inside Custom CSS in Template Options.
Paul,
Thank you for the help.... Looking much better now. Font and field borders are visable now, thank you..
Would you have any thoughts on getting the 'Comment' field working properly..
(Should be able to change the size for the field, holding / Dragging handle at the corner)
?
Great, thank you for resolving this one !!
Paul,
To correct and allow the resizing of the text field, JDONATION is asking that we
remove line 1804 of the template.css...
This line reads:
height: 48px !important;
When we remove this line It DOES resolve the issue...
What is the better way to do this without having to touch the template.css file ?