Put paid to the paid invoice

[akushyn]

Is there a way to put “paid” on the paid invoice that is attached to the receipt? Right now, you have to look carefully to see that it says “balance due” is $0…

[hillel]

Hi,

I don’t believe it’s currently supported but agree it would be good to add.

cc @david @ben

[ajaj]

@hillel @david @ben

Can we revisit this topic? I think it would be very useful to add a PAID banner or stamp of some sort somewhere on the invoice once paid (invoice attached to the payment email). I’m not using $payments and it does not obvious to client. This should be an easy feature to add, especially if it’s just styled PAID text as white with red background and border radius to round it (just a suggestion).

[david]

An option here is to use a variable, $paid_logo if invoice == paid

i’ll look into it.

[ajaj]

Did you have a chance to look i to it @david? I would try to do what you mentioned myself but am at a loss.

[david]

@ajaj

Something like this?

[david]

In the next release the variable

$status_logo will be availble in both invoices as well as payment email templates.

For the invoice design, you’ll need to insert the variable into a custom design.

The PAID text will translate to the clients Locale.

[ajaj]

Yes this is perfect @david THANK YOU! I’m sure many people will take advantage of this.

[ajaj]

@david
Not sure if its just my template, but the paid image is not rendering properly on my invoice. It’s just showing up like an alt. Its inserted as <div id="statuslogo">$status_logo</div> and the stylesheet is #statuslogo{ float:right;}

Am I missing something? It renders just fine if used on email template. see below:

[david]

right, you may be using a custom design, I updated the design CSS to apply the correct styling to the paid text

you may need to update the css in your custom design with the following:

.stamp {
      transform: rotate(12deg);
        color: #555;
        font-size: 3rem;
        font-weight: 700;
        border: 0.25rem solid #555;
        display: inline-block;
        padding: 0.25rem 1rem;
        text-transform: uppercase;
        border-radius: 1rem;
        font-family: 'Courier';
        mix-blend-mode: multiply;
        z-index:200 !important;
        position:  fixed;
        text-align: center;
    }

    .is-paid {
        color:  #D23;
        border: 1rem double  #D23;
        transform: rotate(-5deg);
        font-size: 6rem;
        font-family: "Open sans", Helvetica, Arial, sans-serif;
        border-radius: 0;
        padding: 0.5rem;
        opacity: 0.2;
        z-index:200 !important;
        position:  fixed;
    } 

[ajaj]

That did it. thank you!