budibase/packages/standard-components/src/Button.svelte

37 lines
736 B
Svelte
Raw Normal View History

2019-08-19 22:18:23 +02:00
<script>
import { getContext } from "svelte"
const { styleable } = getContext("sdk")
const component = getContext("component")
2020-02-03 10:50:30 +01:00
export let className = "default"
export let disabled = false
export let text = ""
export let onClick
2019-08-19 22:18:23 +02:00
</script>
<button
class="default"
disabled={disabled || false}
use:styleable={$component.styles}
on:click={onClick}>
{text}
2019-08-27 08:32:56 +02:00
</button>
<style>
2020-02-03 10:50:30 +01:00
.default {
2020-06-03 23:49:55 +02:00
align-items: center;
padding: var(--spacing-s) var(--spacing-l);
2020-02-03 10:50:30 +01:00
box-sizing: border-box;
2020-06-03 23:49:55 +02:00
border-radius: 4px;
2020-02-03 10:50:30 +01:00
outline: none;
2020-06-03 23:49:55 +02:00
cursor: pointer;
transition: all 0.2s ease 0s;
overflow: hidden;
outline: none;
user-select: none;
white-space: nowrap;
text-align: center;
2020-02-03 10:50:30 +01:00
}
</style>