From 2663860ec10575cf2b764c72ebdb4c3fe40d87a7 Mon Sep 17 00:00:00 2001 From: Andrew Kingston Date: Thu, 23 Jun 2022 12:05:05 +0100 Subject: [PATCH] Update styles to use spectrum components --- packages/bbui/src/Typography/Detail.svelte | 2 - .../modals/CreateDatasourceModal.svelte | 89 ++++++++----------- 2 files changed, 38 insertions(+), 53 deletions(-) diff --git a/packages/bbui/src/Typography/Detail.svelte b/packages/bbui/src/Typography/Detail.svelte index bb5c78c11e..76437ffb3c 100644 --- a/packages/bbui/src/Typography/Detail.svelte +++ b/packages/bbui/src/Typography/Detail.svelte @@ -1,9 +1,7 @@ diff --git a/packages/builder/src/components/backend/DatasourceNavigator/modals/CreateDatasourceModal.svelte b/packages/builder/src/components/backend/DatasourceNavigator/modals/CreateDatasourceModal.svelte index d11c285783..6d9c9fce80 100644 --- a/packages/builder/src/components/backend/DatasourceNavigator/modals/CreateDatasourceModal.svelte +++ b/packages/builder/src/components/backend/DatasourceNavigator/modals/CreateDatasourceModal.svelte @@ -131,53 +131,48 @@ chooseNextModal() }} > - - - - All apps need data. You can connect to a data source below, or add - data to your app using Budibase's built-in database. - -
selectIntegration(IntegrationTypes.INTERNAL)} - class="item hoverable" - > -
- -
-
Budibase DB
-
Non-relational
-
+ + Get started with Budibase DB +
selectIntegration(IntegrationTypes.INTERNAL)} + class="item hoverable" + > +
+ +
+ Budibase DB + Non-relational
- +
+ - -
Connect to data source
-
- {#each Object.entries(integrations).filter(([key]) => key !== IntegrationTypes.INTERNAL) as [integrationType, schema]} -
selectIntegration(integrationType)} - class="item hoverable" - > -
- -
-
{schema.friendlyName}
- {#if schema.type} -
{schema.type || ""}
- {/if} -
+ + Connect to an external data source +
+ {#each Object.entries(integrations).filter(([key]) => key !== IntegrationTypes.INTERNAL) as [integrationType, schema]} +
selectIntegration(integrationType)} + class="item hoverable" + > +
+ +
+ {schema.friendlyName} + {#if schema.type} + {schema.type || ""} + {/if}
- {/each} -
- +
+ {/each} +
@@ -221,15 +216,7 @@ margin-top: 4px; } - .name { - color: var(--spectrum-global-color-gray-900); - font-weight: 600; - } - .type { - font-weight: 600; - margin-top: 4px; - text-transform: uppercase; - font-size: 11px; + .text :global(.spectrum-Detail) { color: var(--spectrum-global-color-gray-700); }