Shopify - change product option drop down list for buttons

Website tblon.com
We sell shoes and use the Shopify platform. Narrative theme.
We want to change the product page
Please use this one to test:
https://tblon.com/products/madison-derby-wingtip-brogue-chestnut
Instead of drop down list we want option boxes
eg similar to
https://www.mrporter.com/en-gb/mens/product/stone-island/shoes/low-top-sneakers/grime-rubber-trimmed-printed-mesh-sneakers/1647597300713334

Most products have 8 or 9 options, so rows of 4 or 5 if not too small for mobile.
No default initially selected, so add to basket disabled/grey colour
Out of stock greyed out with a slash, not selectable/add to basket, but you can select to create an out of stock email as now
Have to pick an in stock size to allow add to basket to be active/change colour, from say non active grey to current blue/active

We use the shopify active currency through country selection to do extra labelling
getcurrency.js to get variable 'currency'
Is this the best way??

Our sizes are European eg 44.
The buttons would show extra text if the currency is GBP or USD
If GBP
39 becomes 39/UK 6
40 becomes 40/UK 6.5
41 becomes 41/UK 7
42 becomes 42/UK 8
43 becomes 43/UK 9
44 becomes 44/UK 10
45 becomes 45/UK 11
46 becomes 46/UK 12
47 becomes 47/UK 12.5

If USD
39 becomes 39/US 7
40 becomes 40/US 7.5
41 becomes 41/US 8
42 becomes 42/US 9
43 becomes 43/US 10
44 becomes 44/US 11
45 becomes 45/US 12
46 becomes 46/US 13
47 becomes 47/US 13.5

If neater or less cramped the other size could appear below
eg
44
US 11 (slightly smaller or softer text)