Tweak buttons

This commit is contained in:
Jonathan Staab 2023-03-16 15:53:50 -05:00
parent e775e4959c
commit 85427833e5
6 changed files with 9 additions and 8 deletions

2
.env
View File

@ -1,2 +1,2 @@
VITE_THEME_DARK=transparent:transparent,black:#0f0f0e,white:#FFFFFF,accent:#EB5E28,accent-light:#FB652C,gray-1:#FFFFFF,gray-2:#FAF6F1,gray-3:#F2EBE1,gray-4:#E9E0D3,gray-5:#B3AA98,gray-6:#565249,gray-7:#393530,gray-8:#252422,danger:#ff0000,warning:#ebd112,success:#37ab51,input:#F2EBE1,input-hover:#FAF6F1
VITE_THEME_DARK=transparent:transparent,black:#0f0f0e,white:#FFFFFF,accent:#EB5E28,accent-light:#FB652C,gray-1:#FFFFFF,gray-2:#FAF6F1,gray-3:#F2EBE1,gray-4:#E9E0D3,gray-5:#B3AA98,gray-6:#565249,gray-7:#393530,gray-8:#252422,danger:#ff0000,warning:#ebd112,success:#37ab51,input:#FAF6F1,input-hover:#F2EBE1
VITE_THEME_LIGHT=transparent:transparent,black:#0f0f0e,white:#FFFFFF,accent:#EB5E28,accent-light:#FB652C,gray-8:#FFFFFF,gray-7:#FAF6F1,gray-6:#F2EBE1,gray-5:#E9E0D3,gray-4:#B3AA98,gray-3:#565249,gray-2:#393530,gray-1:#252422,danger:#ff0000,warning:#ebd112,success:#37ab51,input:#FAF6F1,input-hover:#F2EBE1

View File

@ -15,9 +15,10 @@
{"opacity-50": loading},
switcher(type, {
anchor: "underline",
button: "py-2 px-4 rounded bg-input text-accent whitespace-nowrap",
button:
"py-2 px-4 rounded bg-input text-accent whitespace-nowrap border border-solid border-gray-6 hover:bg-input-hover",
"button-circle":
"w-10 h-10 flex justify-center items-center rounded-full bg-input text-accent whitespace-nowrap border border-solid border-gray-5",
"w-10 h-10 flex justify-center items-center rounded-full bg-input text-accent whitespace-nowrap border border-solid border-gray-6 hover:bg-input-hover",
"button-accent":
"py-2 px-4 rounded bg-accent text-white whitespace-nowrap border border-solid border-accent-light hover:bg-accent-light",
})

View File

@ -10,7 +10,7 @@
"py-2 px-4 rounded cursor-pointer border border-solid transition-all",
{"text-gray-5": disabled},
switcher(theme, {
default: "bg-input text-accent border-gray-5 hover:bg-input-hover",
default: "bg-input text-accent border-gray-6 hover:bg-input-hover",
accent: "text-white bg-accent border-accent-light hover:bg-accent-light",
})
)

View File

@ -7,7 +7,7 @@
const className = cx(
$$props.class,
"rounded shadow-inset py-2 px-4 pr-10 w-full placeholder:text-gray-5",
"rounded shadow-inset py-2 px-4 pr-10 w-full placeholder:text-gray-4",
"bg-input border border-solid border-gray-3 text-black",
{"pl-10": $$slots.before, "pr-10": $$slots.after}
)

View File

@ -20,7 +20,7 @@
</script>
<div
class="m-auto flex max-w-sm flex-col gap-4 rounded border border-solid border-gray-6 bg-gray-7 p-4">
class="m-auto flex max-w-sm flex-col gap-4 rounded border border-solid border-gray-6 bg-gray-8 p-4">
<canvas class="m-auto rounded" bind:this={canvas} />
<Input value={code}>
<button slot="after" class="fa fa-copy" on:click={copy} />

View File

@ -8,8 +8,8 @@
const className = cx(
$$props.class,
"rounded shadow-inset py-2 px-4 pr-10 w-full bg-gray-3 text-gray-8",
"placeholder:text-gray-7 placeholder:opacity-75"
"rounded shadow-inset py-2 px-4 pr-10 w-full bg-input text-black",
"placeholder:text-gray-4 border border-solid border-gray-3"
)
</script>