Improve styles in data source page to be more in line with the portal

This commit is contained in:
Andrew Kingston 2021-06-28 10:56:17 +01:00
parent cdd9bed7ad
commit 39197b318b
2 changed files with 22 additions and 20 deletions

View File

@ -62,6 +62,7 @@
{#if datasource && integration} {#if datasource && integration}
<section> <section>
<Layout> <Layout>
<Layout gap="XS" noPadding>
<header> <header>
<svelte:component <svelte:component
this={ICONS[datasource.source]} this={ICONS[datasource.source]}
@ -70,7 +71,8 @@
/> />
<Heading size="M">{datasource.name}</Heading> <Heading size="M">{datasource.name}</Heading>
</header> </header>
<Body size="S" grey lh>{integration.description}</Body> <Body size="M">{integration.description}</Body>
</Layout>
<Divider /> <Divider />
<div class="container"> <div class="container">
<div class="config-header"> <div class="config-header">
@ -139,7 +141,6 @@
} }
header { header {
margin: 0 0 var(--spacing-xs) 0;
display: flex; display: flex;
gap: var(--spacing-l); gap: var(--spacing-l);
align-items: center; align-items: center;

View File

@ -14,14 +14,16 @@
<section> <section>
<Layout> <Layout>
<Layout gap="XS" noPadding>
<header> <header>
<svelte:component this={ICONS.BUDIBASE} height="26" width="26" /> <svelte:component this={ICONS.BUDIBASE} height="26" width="26" />
<Heading size="M">Budibase Internal</Heading> <Heading size="M">Budibase Internal</Heading>
</header> </header>
<Body size="S" grey lh <Body size="M">
>Budibase internal tables are part of your app, the data will be stored in Budibase internal tables are part of your app, so the data will be
your apps context.</Body stored in your apps context.
> </Body>
</Layout>
<Divider /> <Divider />
<Heading size="S">Tables</Heading> <Heading size="S">Tables</Heading>
<div class="table-list"> <div class="table-list">
@ -32,7 +34,7 @@
> >
<Body size="S">{table.name}</Body> <Body size="S">{table.name}</Body>
{#if table.primaryDisplay} {#if table.primaryDisplay}
<Body size="S">display column: {table.primaryDisplay}</Body> <Body size="S">Display column: {table.primaryDisplay}</Body>
{/if} {/if}
</div> </div>
{/each} {/each}
@ -50,7 +52,6 @@
} }
header { header {
margin: 0 0 var(--spacing-xs) 0;
display: flex; display: flex;
gap: var(--spacing-l); gap: var(--spacing-l);
align-items: center; align-items: center;