OpenSource/paimon-moe
OpenSource/paimon-moe
1
0
Fork 0
mirror of https://github.com/MadeBaruna/paimon-moe.git synced 2025-03-20 13:58:58 +01:00
Code Issues Projects Releases Packages Wiki Activity

Fix button styling

Browse source
This commit is contained in:
I Made Setia Baruna 2021-02-01 16:15:28 +08:00
parent 4487c068ec
commit e275eb8a16
1 changed files with 7 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
src/components/Button.svelte
View file

@ -5,8 +5,8 @@
export let color = 'blue'; export let color = 'blue';
export let rounded = true; export let rounded = true;
let px = 4; let px = 'px-4';
let py = 2; let py = 'py-2';
let textColor = 'white'; let textColor = 'white';
let borderColor = 'white'; let borderColor = 'white';
@ -27,18 +27,18 @@
$: switch (size) { $: switch (size) {
case 'md': case 'md':
px = 4; px = 'px-4';
py = 2; py = 'py-2';
break; break;
case 'sm': case 'sm':
px = 1; px = 'px-1';
py = 1; py = 'py-1';
break; break;
} }
</script> </script>
<button <button
{disabled} {disabled}
class={`text-${textColor} border-2 border-white border-opacity-25 ${rounded ? 'rounded-xl' : 'rounded-none'} px-${px} py-${py} transition duration-100 class={`text-${textColor} border-2 border-white border-opacity-25 ${rounded ? 'rounded-xl' : 'rounded-none'} ${px} ${py} transition duration-100
hover:border-${borderColor} focus:outline-none focus:border-${borderColor} disabled:opacity-50 disabled:border-gray-600 ${className}`} hover:border-${borderColor} focus:outline-none focus:border-${borderColor} disabled:opacity-50 disabled:border-gray-600 ${className}`}
on:click><slot /></button> on:click><slot /></button>