MirrorSave
/
budibase
mirror of https://github.com/Budibase/budibase.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Updating icon context if check as per Martins discussion point

This commit is contained in:
Conor Mack 2020-02-03 21:10:47 +00:00
parent 7189643710
commit 3d743122d2
1 changed files with 26 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

52
packages/materialdesign-components/src/Button/Button.svelte
View File

@ -1,42 +1,36 @@
<script>
import { setContext, getContext } from "svelte";
import Icon from "../Icon.svelte";
import ripple from "../Ripple.js";
import ClassBuilder from "../ClassBuilder.js";
import { setContext, getContext } from "svelte"
import Icon from "../Icon.svelte"
import ripple from "../Ripple.js"
import ClassBuilder from "../ClassBuilder.js"
const cb = new ClassBuilder("button", ["primary", "medium"]);
const cb = new ClassBuilder("button", ["primary", "medium"])
export let variant = "raised";
export let colour = "primary";
export let size = "medium";
export let variant = "raised"
export let colour = "primary"
export let size = "medium"
export let href = "";
export let icon = "";
export let trailingIcon = false;
export let fullBleed = false;
export let href = ""
export let icon = ""
export let trailingIcon = false
export let fullBleed = false
export let text = "";
export let disabled = false;
export let text = ""
export let disabled = false
$: if (!!icon) {
setContext("BBMD:icon:context", "button");
$: if (icon) {
setContext("BBMD:icon:context", "button")
}
$: renderLeadingIcon = !!icon && !trailingIcon;
$: renderTrailingIcon = !!icon && trailingIcon;
$: renderLeadingIcon = !!icon && !trailingIcon
$: renderTrailingIcon = !!icon && trailingIcon
let blockClasses = cb.blocks({
modifiers: !href ? [variant] : null,
customs: { size, colour }
});
customs: { size, colour },
})
</script>
<style>
.fullBleed {
width: 100%;
}
</style>
<!-- TODO: Activated colour on primary elevated buttons seems to be rendering weird -->
{#if href}
<a class={blockClasses} {href} on:click>
@ -58,3 +52,9 @@
{/if}
</button>
{/if}
<style>
.fullBleed {
width: 100%;
}
</style>