Font size and weight help in a custom liquid code

[Pfunk]

Hello!

Im using this code to add in an inventory count to a specific product. Is it possible to add weight and font size to it that will only affect the specific Text contained in the code?

{% assign current_variant = product.selected_or_first_available_variant %}
<div class="inventoryNote form__label">
{% if current_variant.available %}
{% if current_variant.inventory_quantity > 0 and current_variant.inventory_quantity <= 10 %}We have {{ current_variant.inventory_quantity }} in stock
{% elsif current_variant.inventory_quantity > 10 %}We have more than 10 in stock

{% endif %}
{% endif %}
</div>

[BSS-Commerce]

Hi @Pfunk ,

You can use HTML and inline CSS to style the specific text contained in your code. Here's an example where I've added weight and font size to the inventory count text:

{% assign current_variant = product.selected_or_first_available_variant %}
<div class="inventoryNote form__label">
  {% if current_variant.available %}
    {% if current_variant.inventory_quantity > 0 and current_variant.inventory_quantity <= 10 %}
      We have <span style="font-weight: bold; font-size: 16px;">{{ current_variant.inventory_quantity }}</span> in stock
    {% elsif current_variant.inventory_quantity > 10 %}
      We have more than 10 in stock
    {% endif %}
  {% endif %}
</div>

In this example, I wrapped the {{ current_variant.inventory_quantity }} in a <span> tag and applied inline styles to it. You can adjust the font-weight and font-size values to suit your design preferences. Feel free to modify the styles as needed.

If my solution helps, please tick marked as solutions. Thanks and have a nice day! @Pfunk 

[Pfunk]

Thank you so much for the help!

That worked on the actual number value but not the text around it.  Is it possible to also include a font/weight to the text?

This is an example of what that code did  (We have 1 in stock)

Once again I wanted to thank you for the quick reply and help with the issue!

[Ole_Visionz]

If you want the whole line of text to look like the number in the example, then change this line

 We have <span style="font-weight: bold; font-size: 16px;">{{ current_variant.inventory_quantity }}</span> in stock

to this:

 <span style="font-weight: bold; font-size: 16px;">We have {{ current_variant.inventory_quantity }} in stock</span>