diff --git a/public/index.css b/public/index.css
index 6abbfa849..4934fe73e 100644
--- a/public/index.css
+++ b/public/index.css
@@ -254,6 +254,14 @@ h1 {
margin-bottom: 2rem;
}
+h2 {
+ margin: 1.5rem 0;
+}
+
+h3 {
+ margin: 1rem 0;
+}
+
p {
margin: 0.5rem 0;
}
diff --git a/src/Modal.svelte b/src/Modal.svelte
index d3564d5e9..38c2990a7 100644
--- a/src/Modal.svelte
+++ b/src/Modal.svelte
@@ -42,7 +42,7 @@
}
.modal-title {
font-size: 1.75rem;
- line-height: 1.75rem;
+ line-height: 2.625rem;
margin-bottom: 2rem;
color: var(--color-secondary);
text-align: center;
@@ -72,9 +72,11 @@
-
-
-
+ {#if $$slots.body}
+
+
+
+ {/if}
diff --git a/src/Options.svelte b/src/Options.svelte
new file mode 100644
index 000000000..658b1a1b0
--- /dev/null
+++ b/src/Options.svelte
@@ -0,0 +1,49 @@
+
+
+
+
+
+
+ {#each options as option}
+
+ {/each}
+
+
diff --git a/src/base/orgs/CreateOrg.svelte b/src/base/orgs/CreateOrg.svelte
index 7f3759c3c..9659b4ba2 100644
--- a/src/base/orgs/CreateOrg.svelte
+++ b/src/base/orgs/CreateOrg.svelte
@@ -5,6 +5,8 @@
import type { Err } from '@app/error';
import { Org } from '@app/base/orgs/Org';
import type { Config } from '@app/config';
+ import Loading from '@app/Loading.svelte';
+ import Options from '@app/Options.svelte';
export let config: Config;
export let owner: string;
@@ -16,9 +18,15 @@
Success,
}
+ const orgTypes = [
+ { label: "Single signer", value: "bdfl" },
+ { label: "Quorum", value: "dao" },
+ ];
+
let state = State.Idle;
let error: Err | null = null;
let org: Org | null = null;
+ let governance: string = "bdfl";
const dispatch = createEventDispatcher();
const createOrg = async () => {
@@ -38,6 +46,10 @@
error = e;
}
};
+
+ const onGovernanceChanged = (event: { detail: string }) => {
+ governance = event.detail;
+ };
{#if error}
@@ -45,16 +57,21 @@
{:else}
- {#if !org}
- Create an Org
- {:else}
- 🎉
- {/if}
+ {#if org}🎉{:else}✨{/if}
{#if org}
Your org was successfully created.
+ {:else}
+ Create an Org
+ {#if state === State.Idle}
+ Select a governance model
+ {:else if state === State.Signing}
+ Confirm transaction in your wallet
+ {:else if state === State.Pending}
+ Waiting for transaction to be processed
+ {/if}
{/if}
@@ -64,31 +81,31 @@
| Address | {org.address} |
| Owner | {org.safe} |
- {:else}
-
+ {:else if state === State.Idle}
+
{/if}
{#if !org}
-
- dispatch('close')} class="text">
- Cancel
-
+ dispatch('close')} class="text">
+ Cancel
+
+ {:else}
+
+ {/if}
{:else}
dispatch('close')}>
Done