How to add a 'tick' mark to 'In Stock' and 'cross' mark for 'Out of Stock'- Phoca Cart
Posted: 05 May 2023, 11:28
Hi
A simple way to add a tick mark in CSS for your Phoca Cart stores (tested in 4.0.6 and 4.0.7)
Then just simply comment out/delete the unwanted version
example
For a cross mark for 'out of stock' items, use the following
Again, simply comment out the unused options
The '\0020' adds in a space character for you
Hope this helps others
PS, there may be other tick or cross unicodes out there, these are just ones that I found
example:
https://www.w3schools.com/charsets/ref_utf_dingbats.asp
https://en.wikipedia.org/wiki/List_of_U ... characters
A simple way to add a tick mark in CSS for your Phoca Cart stores (tested in 4.0.6 and 4.0.7)
Code: Select all
.ph-stock.pc-status-in-stock:before {
content: "\2705\0020";
content: "\2611\0020";
content: "\2714\0020";
content: "\2713\0020";
}example
Code: Select all
.ph-stock.pc-status-in-stock:before {
content: "\2705\0020";
// content: "\2611\0020";
//content: "\2714\0020";
// content: "\2713\0020";
}Code: Select all
.ph-stock.pc-status-out-of-stock:before {
content: "\274C\0020";
content: "\2715\0020";
content: "\2716\0020";
content: "\2717\0020";
content: "\2718\0020";
}The '\0020' adds in a space character for you
Hope this helps others
PS, there may be other tick or cross unicodes out there, these are just ones that I found
example:
https://www.w3schools.com/charsets/ref_utf_dingbats.asp
https://en.wikipedia.org/wiki/List_of_U ... characters
