Add button size as a config option

[Klakurka]

One option is to make specific sizes:

• Small
• Regular (default)
• Large
• X-Large

Another option is to allow entering a number where 100 is the default. Setting it to 10 would mean it's 10% the size.

The parameter name can just be 'size' .

[Vidhanvyrs]

Can you please be specific about which buttons are we talking here and where should the changes nedded to be done
is the changes should be in this
var config = {
to: 'bitcoincash:qrmm7edwuj4jf7tnvygjyztyy0a0qxvl7q9ayphulp',
amount: 4.5,
goalAmount: 300000,
canEdit: false,
currency: 'AUD',
text: 'Tip Us a Coffee!',
size: regular, // Added this inorder to change it according the class that we choose but from where do they choose?
hoverText: 'One BCHinno',
theme: {
palette: {
primary: '#ee8b2b',
secondary: '#fefbf8',
tertiary: '#504030'
}
},
Like i think the way we can fix this is by getting the button id and making it chages it's class by using switch case we can do that but first we do need to write the css code for classes Small large Regular and xlarge
but how to apply this change to the button like suppose our id of the button is dotlasher
var buttonElement = document.getElementById('dotlasher');
switch (config.size) {
case 'Small':
buttonElement.classList.add('small');
break;
case 'Large':
buttonElement.classList.add('large');
break;
case 'X-Large':
buttonElement.classList.add('x-large');
break;
default:
break;
}

[Vidhanvyrs]

Now the code for the css is here but where to add them that is what i am not getting

<style> .button { padding: 10px 20px; font-size: 16px; } .button.small { padding: 5px 10px; font-size: 12px; } .button.large { padding: 15px 30px; font-size: 20px; } .button.x-large { padding: 20px 40px; font-size: 24px; } </style>