<style type="text/css">
* {
font-family: calibri;
}
.item-id {
font-size: 20pt;
white-space: nowrap;
display: block;
width: 100%;
height: 100%;
}
.item-id-medium {
font-size: 15pt;
white-space: nowrap;
display: block;
width: 100%;
height: 100%;
}
.item-id-small {
font-size: 10pt;
white-space: nowrap;
display: block;
width: 100%;
height: 100%;
}
.barcode-large {
width: 90%;
height: 15%;
padding-top: -0.31in;
}
.barcode-medium {
width: 90%;
height: 15%;
padding-top: -0.2in;
}
.barcode-small {
width: 90%;
height: 15%;
padding-top: -0.1in;
}
</style>
<table style="padding-top:7px;">
<tr>
<td style="border: 1px solid black; padding-left: 0.09in; background-color: black; color: white; font-family: Calibri; font-size: 11pt; width: 2.75in; height: 0.3in;">ITEM NUMBER</td>
<td style="border: none; width: 0.23in;"></td> <!--Spacer cell for horizontal spacing-->
<td style="border: 1px solid black; text-align: center; background-color: black; color: white; font-family: Calibri; font-size: 11pt; width: 1.25in; height: 0.3in;">UNITS</td>
</tr>
</table>
<table>
<tr>
<td style="border: 1px solid black; text-align: center; width: 2.75in; height: 0.25in;">
<#assign itemIDClass = "item-id"/>
<#assign barcodeClass = "barcode-large"/>
<#if schemaArr.itemIDforBarCode?length gt 20 && schemaArr.itemIDforBarCode?length lt 30>
<#assign itemIDClass = "item-id-medium"/>
<#assign barcodeClass = "barcode-medium"/>
</#if>
<#if schemaArr.itemIDforBarCode?length gte 30>
<#assign itemIDClass = "item-id-small"/>
<#assign barcodeClass = "barcode-small"/>
</#if>
<p class="${itemIDClass}" style="font-family: Calibri; font-weight: bold; padding-left: 0.09in;">
<#if schemaArr.itemIDforBarCode?length gt 40>${schemaArr.itemIDforBarCode?substring(0, 40)}
<#else>${schemaArr.itemIDforBarCode}
</#if>
</p>
<!-- <p class="fit-text" style="font-family: Calibri; font-weight: bold; font-size: 20pt; padding-left: 0.09in;">${schemaArr.itemID}</p> -->
<barcode class="${barcodeClass}" codetype="code128" showtext="false" value="${schemaArr.itemIDforBarCode}"></barcode>
</td>
<td style="border: none; width: 0.23in;"></td> <!--Spacer cell for horizontal spacing-->
<td style="border: 1px solid black; width: 1.25in; height: 0.25in;">
<p style="font-family: Calibri; font-weight: bold; font-size: 20pt; align: center;">${schemaArr.boxQty}</p>
<barcode style="width: 90%; height: 32%; padding-top: -0.31in; align: center;" codetype="code128" showtext="false" value="${schemaArr.boxQty}"></barcode>
</td>
</tr>
</table>
Here if the itemId length is within the limit 20-30 then font size will be 15 pt. IF the length is greater than or equal to 30 then the font size will be 10pt.
<#if schemaArr.itemIDforBarCode?length gt 40>${schemaArr.itemIDforBarCode?substring(0, 40)}
<#else>${schemaArr.itemIDforBarCode}
the if else statement is used to trim the characters beyond the limit 40.