Custom CSS for Billing Portal

You can style the billing profile to match your website or your branding style, using custom CSS (see code sample below). This will allow you to seamlessly style and design your customer's billing profile as you'd like. 



To add custom CSS, from your DepositFix dashboard, click on Settings > Billing Profile, scroll down to Custom CSS, and add your code.


Example of custom billing profile CSS here.

#df-billing-portal {
  font-family: Geneva;
  background-color: #fff;
} #df-billing-portal .df-header-container {
  background-color: #333;
} #df-billing-portal .company-logo {
  width: 24px;
} #df-billing-portal .company-name {
  font-size: 16px;
  color: #fff;
} #df-billing-portal .payment-details-header {
  text-align: center;
} #df-billing-portal .user-info-container {
  background-color: #fff;
  border: 0px solid #cdcdcd;
  margin: 0px;
  padding-left: 0px;
} #df-billing-portal .form-group label {
  font-weight: 100;
} #df-billing-portal .form-group input {
  border: 0px;
  border-bottom: 1px solid #ccc;
  border-radius: 0px;
} #df-billing-portal button.button-dpf {
  background-color: #f50;
  border-radius: 0px;
} .payment-details-subheader {
} #df-billing-portal .table thead {
  background-color: #333;
  color: #fff;
} #df-billing-portal .table th {
  color: #fff;
  font-weight: 100;
} #df-billing-portal .btn-link {
  color: #f50;
  text-decoration: underline;
}
Was this article helpful?

Still puzzling over something?

The agent has read this article — and everything around it. Ask a follow-up and it answers in seconds.