formatting
This commit is contained in:
parent
63882727de
commit
a416ecc789
|
@ -30,8 +30,8 @@
|
||||||
|
|
||||||
.alert {
|
.alert {
|
||||||
color: white;
|
color: white;
|
||||||
background: #E26D69;
|
background: #e26d69;
|
||||||
border: solid 1px #E26D69;
|
border: solid 1px #e26d69;
|
||||||
}
|
}
|
||||||
|
|
||||||
.cancel {
|
.cancel {
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script>
|
<script>
|
||||||
import {onMount} from "svelte"
|
import { onMount } from "svelte"
|
||||||
import { buildStyle } from "../../helpers.js"
|
import { buildStyle } from "../../helpers.js"
|
||||||
export let value = ""
|
export let value = ""
|
||||||
export let textAlign = "left"
|
export let textAlign = "left"
|
||||||
|
@ -18,11 +18,19 @@
|
||||||
onChange(_value)
|
onChange(_value)
|
||||||
}
|
}
|
||||||
|
|
||||||
$: displayValue = suffix && value && value.endsWith(suffix) ? value.replace(new RegExp(`${suffix}$`), "") : (value || "")
|
$: displayValue =
|
||||||
|
suffix && value && value.endsWith(suffix)
|
||||||
|
? value.replace(new RegExp(`${suffix}$`), "")
|
||||||
|
: value || ""
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<input class:centerPlaceholder type="text" value={displayValue} {placeholder} {style} on:change={e => handleChange(e.target.value)} />
|
<input
|
||||||
|
class:centerPlaceholder
|
||||||
|
type="text"
|
||||||
|
value={displayValue}
|
||||||
|
{placeholder}
|
||||||
|
{style}
|
||||||
|
on:change={e => handleChange(e.target.value)} />
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
input {
|
input {
|
||||||
|
|
|
@ -13,7 +13,9 @@
|
||||||
value.splice(idx, 1, val !== "auto" ? val + suffix : val)
|
value.splice(idx, 1, val !== "auto" ? val + suffix : val)
|
||||||
|
|
||||||
value = value
|
value = value
|
||||||
let _value = value.map(v => (!v.endsWith(suffix) && v !== "auto" ? v + suffix : v))
|
let _value = value.map(v =>
|
||||||
|
!v.endsWith(suffix) && v !== "auto" ? v + suffix : v
|
||||||
|
)
|
||||||
onChange(_value)
|
onChange(_value)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -44,5 +46,4 @@
|
||||||
.inputs-group {
|
.inputs-group {
|
||||||
flex: 1;
|
flex: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
|
|
|
@ -160,6 +160,4 @@
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: flex-end;
|
justify-content: flex-end;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
|
|
|
@ -43,7 +43,7 @@
|
||||||
<i class="ri-eye-line button--toggled" />
|
<i class="ri-eye-line button--toggled" />
|
||||||
<h3 class="budibase__title--3">Create / Edit View</h3>
|
<h3 class="budibase__title--3">Create / Edit View</h3>
|
||||||
</div>
|
</div>
|
||||||
<form on:submit|preventDefault class="uk-form-stacked root">
|
<form on:submit|preventDefault class="uk-form-stacked root">
|
||||||
{#if $store.errors && $store.errors.length > 0}
|
{#if $store.errors && $store.errors.length > 0}
|
||||||
<ErrorsBox errors={$store.errors} />
|
<ErrorsBox errors={$store.errors} />
|
||||||
{/if}
|
{/if}
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script>
|
<script>
|
||||||
import {buildStyle} from "../../helpers.js"
|
import { buildStyle } from "../../helpers.js"
|
||||||
export let value = ""
|
export let value = ""
|
||||||
export let text = ""
|
export let text = ""
|
||||||
export let icon = ""
|
export let icon = ""
|
||||||
|
@ -8,19 +8,24 @@
|
||||||
export let selected = false
|
export let selected = false
|
||||||
export let fontWeight = ""
|
export let fontWeight = ""
|
||||||
|
|
||||||
$: style = buildStyle({padding, fontWeight})
|
$: style = buildStyle({ padding, fontWeight })
|
||||||
$: useIcon = !!icon
|
$: useIcon = !!icon
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<div class="flatbutton" {style} class:selected on:click={() => onClick(value || text)}>
|
<div
|
||||||
|
class="flatbutton"
|
||||||
|
{style}
|
||||||
|
class:selected
|
||||||
|
on:click={() => onClick(value || text)}>
|
||||||
{#if useIcon}
|
{#if useIcon}
|
||||||
<i class={icon} />
|
<i class={icon} />
|
||||||
{:else}
|
{:else}
|
||||||
<span>{@html text}</span>
|
<span>
|
||||||
|
{@html text}
|
||||||
|
</span>
|
||||||
{/if}
|
{/if}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
.flatbutton {
|
.flatbutton {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
@ -42,7 +47,7 @@
|
||||||
color: #ffffff;
|
color: #ffffff;
|
||||||
}
|
}
|
||||||
|
|
||||||
i{
|
i {
|
||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
@ -28,10 +28,8 @@
|
||||||
onChange(val)
|
onChange(val)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
const checkSelected = val =>
|
const checkSelected = val =>
|
||||||
isMultiSelect ? value.includes(val) : value === val
|
isMultiSelect ? value.includes(val) : value === val
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<div class="flatbutton-group">
|
<div class="flatbutton-group">
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
<script>
|
<script>
|
||||||
import { onMount, beforeUpdate } from "svelte"
|
import { onMount, beforeUpdate } from "svelte"
|
||||||
import {buildStyle} from "../../helpers.js"
|
import { buildStyle } from "../../helpers.js"
|
||||||
export let options = []
|
export let options = []
|
||||||
export let value = ""
|
export let value = ""
|
||||||
export let styleBindingProperty
|
export let styleBindingProperty
|
||||||
|
@ -214,10 +214,10 @@
|
||||||
height: auto;
|
height: auto;
|
||||||
padding: 5px 0px;
|
padding: 5px 0px;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
padding-left: 10px
|
padding-left: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
li:hover {
|
li:hover {
|
||||||
background-color:#e6e6e6
|
background-color: #e6e6e6;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
Loading…
Reference in New Issue