Many Issues With LIGHTBOX Template CSS Working Against JDonation - Question | JoomShaper

Many Issues With LIGHTBOX Template CSS Working Against JDonation

P

Preamble

Template 1 day ago

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?

seen here https://navigatingmymidlifecrisis.com/support

0
4 Answers
Paul Frankowski
Paul Frankowski
Accepted Answer
Senior Staff 1 day ago #212948

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.

0
Paul Frankowski
Paul Frankowski
Accepted Answer
Senior Staff 1 day ago #212949

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;  }
0
P
Preamble
Accepted Answer
19 hours ago #212979

Thank you very much... Syntax is a little different than Im used to.. We will test this today..

0
Paul Frankowski
Paul Frankowski
Accepted Answer
Senior Staff 19 hours ago #212981

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.

0