Stock Level indication per Variable

[ChrisM187]

Hello, I am trying to figure a way of how to add an indication of stock level to each variant on my product pages.  An example is,  1 variant is out of stock, and would have a red dot on the variable button, and adds a text above the add to cart button, stating that the item is out of stock and would be a pre-order, with a approx.  time of delivery 5-10 business days.
Another Variant would be in stock, so 1 stock or above, and show a green dot on the variable, and add a text above the add to cart button, stating the estimated delivery time is 3-7 business days.

I have a perfect example attached: 

Thank you in advance!

[devcoders]

Hi @ChrisM187 

Please share your store URL and reference website, so I can check and provide the best solution.

[ChrisM187]

Hello, my website URL is Trinitysneakers.com and the reference is from Sneak.eu

[devcoders]

HI @ChrisM187 

I have checked, and we will need to implement custom functionality for this. Just to confirm, do you want the "delivery 5-10 business days" message to be displayed only on the product page?

[ChrisM187]

Preferably, I would like it to be shown in cart and/or at checkout page aswell!

[devcoders]

Hi @ChrisM187 

Are you using the Shopify Plus plan or the Basic plan?

[ChrisM187]

I am using the basic plan.

[devcoders]

Hi @ChrisM187 

We will customize this: if one variant is out of stock, it will have a red dot on the variant button, and for the delivery of 5-10 business days, we need to use an app.

[ChrisM187]

Oh.. i would not want to use an app.. I know the other store uses code and no app for it..
We could start with the variant dots if thats fine with you?

[devcoders]

Hi @ChrisM187 

Yes, that's fine. We can start with the variant dots first and then see how to handle the rest of the customization.

[ChrisM187]

Great, do you want to message me, or how do we start?

[devcoders]

Hi @ChrisM187 

You can message me or email me if you prefer. Let me know how you would like to start!