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

Formatting and linting done

This commit is contained in:
Joe 2020-06-29 19:55:27 +01:00
parent 5f7186106e
commit 290b1cce14
3 changed files with 76 additions and 76 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
packages/standard-components/src/DataForm.svelte
View File

@ -7,7 +7,7 @@
const TYPE_MAP = { const TYPE_MAP = {
string: "text", string: "text",
boolean: "checkbox", boolean: "checkbox",
number: "number" number: "number",
} }
let username let username
@ -70,7 +70,7 @@
{#each fields as field} {#each fields as field}
<div class="form-item"> <div class="form-item">
<label class="form-label" for="form-stacked-text">{field}</label> <label class="form-label" for="form-stacked-text">{field}</label>
{#if schema[field].type === "string" && schema[field].constraints.inclusion} {#if schema[field].type === 'string' && schema[field].constraints.inclusion}
<select on:blur={handleInput(field)}> <select on:blur={handleInput(field)}>
{#each schema[field].constraints.inclusion as opt} {#each schema[field].constraints.inclusion as opt}
<option>{opt}</option> <option>{opt}</option>
@ -156,12 +156,12 @@
text-align: center; text-align: center;
} }
button:hover { button:hover {
box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1),
0 4px 6px -2px rgba(0, 0, 0, 0.05);
} }
input[type=checkbox] { input[type="checkbox"] {
width: 32px; width: 32px;
height: 32px; height: 32px;
padding: 0; padding: 0;
@ -170,7 +170,6 @@ input[type=checkbox] {
position: relative; position: relative;
top: -1px; top: -1px;
*overflow: hidden; *overflow: hidden;
} }
select::-ms-expand { select::-ms-expand {
@ -191,10 +190,9 @@ select {
-ms-appearance: none; -ms-appearance: none;
appearance: none; appearance: none;
background-repeat: no-repeat; background-repeat: no-repeat;
background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%); background-image: linear-gradient(45deg, transparent 50%, currentColor 50%),
linear-gradient(135deg, currentColor 50%, transparent 50%);
background-position: right 17px top 1.5em, right 10px top 1.5em; background-position: right 17px top 1.5em, right 10px top 1.5em;
background-size: 7px 7px, 7px 7px; background-size: 7px 7px, 7px 7px;
} }
</style> </style>

16
packages/standard-components/src/DataFormWide.svelte
View File

@ -6,7 +6,7 @@
const TYPE_MAP = { const TYPE_MAP = {
string: "text", string: "text",
boolean: "checkbox", boolean: "checkbox",
number: "number" number: "number",
} }
let username let username
@ -52,6 +52,7 @@
newModel[field] = value newModel[field] = value
} }
</script> </script>
<form class="form" on:submit|preventDefault> <form class="form" on:submit|preventDefault>
<h1>{modelDef.name} Form</h1> <h1>{modelDef.name} Form</h1>
<hr /> <hr />
@ -59,7 +60,7 @@
{#each fields as field} {#each fields as field}
<div class="form-item"> <div class="form-item">
<label class="form-label" for="form-stacked-text">{field}</label> <label class="form-label" for="form-stacked-text">{field}</label>
{#if schema[field].type === "string" && schema[field].constraints.inclusion} {#if schema[field].type === 'string' && schema[field].constraints.inclusion}
<select on:blur={handleInput(field)}> <select on:blur={handleInput(field)}>
{#each schema[field].constraints.inclusion as opt} {#each schema[field].constraints.inclusion as opt}
<option>{opt}</option> <option>{opt}</option>
@ -79,6 +80,7 @@
</div> </div>
</div> </div>
</form> </form>
<style> <style>
.form { .form {
display: flex; display: flex;
@ -136,10 +138,11 @@
} }
button:hover { button:hover {
box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1),
0 4px 6px -2px rgba(0, 0, 0, 0.05);
} }
input[type=checkbox] { input[type="checkbox"] {
transform: scale(2); transform: scale(2);
cursor: pointer; cursor: pointer;
} }
@ -162,10 +165,9 @@ select {
-ms-appearance: none; -ms-appearance: none;
appearance: none; appearance: none;
background-repeat: no-repeat; background-repeat: no-repeat;
background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%); background-image: linear-gradient(45deg, transparent 50%, currentColor 50%),
linear-gradient(135deg, currentColor 50%, transparent 50%);
background-position: right 17px top 1.5em, right 10px top 1.5em; background-position: right 17px top 1.5em, right 10px top 1.5em;
background-size: 7px 7px, 7px 7px; background-size: 7px 7px, 7px 7px;
} }
</style> </style>