fix erroneous class usage
This commit is contained in:
parent
9e2cf66173
commit
a44a208391
|
@ -3,19 +3,14 @@
|
||||||
import { createEventDispatcher } from "svelte"
|
import { createEventDispatcher } from "svelte"
|
||||||
const dispatch = createEventDispatcher()
|
const dispatch = createEventDispatcher()
|
||||||
|
|
||||||
export let disabled = false
|
|
||||||
|
|
||||||
/** @type {('S', 'M', 'L', 'XL')} Size of button */
|
/** @type {('S', 'M', 'L', 'XL')} Size of button */
|
||||||
export let size = "M";
|
export let size = "M";
|
||||||
/** @type {('cta','primary','secondary','warning', 'overBackground')} Type of button */
|
|
||||||
export let type = "primary"
|
|
||||||
|
|
||||||
export let quiet = false;
|
export let quiet = false;
|
||||||
|
export let emphasized = false;
|
||||||
export let selected = false;
|
export let selected = false
|
||||||
|
|
||||||
export let longPressable = false;
|
export let longPressable = false;
|
||||||
|
export let disabled = false
|
||||||
export let icon = '';
|
export let icon = '';
|
||||||
|
|
||||||
function longPress(element) {
|
function longPress(element) {
|
||||||
|
@ -42,7 +37,10 @@
|
||||||
|
|
||||||
<button
|
<button
|
||||||
use:longPress
|
use:longPress
|
||||||
class="spectrum-ActionButton spectrum-ActionButton--size{size.toUpperCase()} spectrum-ActionButton--{type} {quiet && 'spectrum-ActionButton--quiet'}"
|
class:spectrum-ActionButton--quiet={quiet}
|
||||||
|
class:spectrum-ActionButton--emphasized={emphasized}
|
||||||
|
class:is-selected={selected}
|
||||||
|
class="spectrum-ActionButton spectrum-ActionButton--size{size.toUpperCase()}"
|
||||||
{disabled}
|
{disabled}
|
||||||
on:longPress
|
on:longPress
|
||||||
on:click|preventDefault>
|
on:click|preventDefault>
|
||||||
|
|
|
@ -14,10 +14,11 @@
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<div use:group class="spectrum-ActionGroup
|
<div use:group
|
||||||
{vertical && 'spectrum-ActionGroup--vertical'}
|
class:spectrum-ActionGroup--vertical={vertical}
|
||||||
{justified && 'spectrum-ActionGroup--justified'}
|
class:spectrum-ActionGroup--justified={justified}
|
||||||
{quiet && 'spectrum-ActionGroup--quiet'}
|
class:spectrum-ActionGroup--quiet={quiet}
|
||||||
{compact && 'spectrum-ActionGroup--compact'}">
|
class:spectrum-ActionGroup--compact={compact}
|
||||||
|
class="spectrum-ActionGroup">
|
||||||
<slot />
|
<slot />
|
||||||
</div>
|
</div>
|
|
@ -9,9 +9,9 @@
|
||||||
export let overBackground = false
|
export let overBackground = false
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<a {href} class="spectrum-Link
|
<a {href}
|
||||||
spectrum-Link--size{size}
|
class:spectrum-Link--primary={primary}
|
||||||
{primary && 'spectrum-Link--primary'}
|
class:spectrum-Link--secondary={secondary}
|
||||||
{secondary && 'spectrum-Link--secondary'}
|
class:spectrum-Link--overBackground={overBackground}
|
||||||
{overBackground && 'spectrum-Link--overBackground'}
|
class:spectrum-Link--quiet={quiet}
|
||||||
{quiet && 'spectrum-Link--quiet'}"><slot /></a>
|
class="spectrum-Link spectrum-Link--size{size}"><slot /></a>
|
Loading…
Reference in New Issue