Browse Source

Adjust form styles in line with new designs

gh-pages
Andrew Kingston 6 years ago
parent
commit
ffb73b15dd
  1. 7
      packages/standard-components/src/Form.svelte

7
packages/standard-components/src/Form.svelte

@ -23,9 +23,7 @@
{#each fields as field} {#each fields as field}
<div class="form-field" class:wide> <div class="form-field" class:wide>
{#if !(schema[field].type === 'boolean' && !wide)} {#if !(schema[field].type === 'boolean' && !wide)}
<Label extraSmall={!wide} grey={!wide}> <Label extraSmall={!wide} grey>{capitalise(schema[field].name)}</Label>
{capitalise(schema[field].name)}
</Label>
{/if} {/if}
{#if schema[field].type === 'options'} {#if schema[field].type === 'options'}
<Select secondary bind:value={$store.data[field]}> <Select secondary bind:value={$store.data[field]}>
@ -65,7 +63,6 @@
} }
.form-content { .form-content {
margin-bottom: var(--spacing-xl);
display: grid; display: grid;
gap: var(--spacing-xl); gap: var(--spacing-xl);
width: 100%; width: 100%;
@ -76,7 +73,7 @@
} }
.form-field.wide { .form-field.wide {
align-items: center; align-items: center;
grid-template-columns: 30% 1fr; grid-template-columns: 20% 1fr;
gap: var(--spacing-xl); gap: var(--spacing-xl);
} }
.form-field.wide :global(label) { .form-field.wide :global(label) {

Loading…
Cancel
Save