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

Adding a bit of padding to bottom of rest interface in case scrolling occurs.

This commit is contained in:
mike12345567 2021-12-08 18:06:11 +00:00
parent 82fd691ec7
commit 8077ba8d37
1 changed files with 67 additions and 62 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

129
packages/builder/src/pages/builder/app/[application]/data/datasource/[selectedDatasource]/rest/[query]/index.svelte
View File

@ -236,70 +236,72 @@
</Tabs> </Tabs>
</Layout> </Layout>
</div> </div>
<Layout paddingY="S" gap="S"> <div class="bottom">
<Divider size="S" /> <Layout paddingY="S" gap="S">
{#if !response} <Divider size="S" />
<Heading size="M">Response</Heading> {#if !response}
<div class="placeholder"> <Heading size="M">Response</Heading>
<div class="placeholder-internal"> <div class="placeholder">
<img alt="placeholder" src={Placeholder} /> <div class="placeholder-internal">
<Body size="XS" textAlign="center" <img alt="placeholder" src={Placeholder} />
>{"enter a url in the textbox above and click send to get a response".toUpperCase()}</Body <Body size="XS" textAlign="center"
> >{"enter a url in the textbox above and click send to get a response".toUpperCase()}</Body
</div> >
</div>
{:else}
<Tabs selected="JSON" quiet noPadding noHorizPadding>
<Tab title="JSON">
<div>
<JSONPreview height="300" data={response.rows[0]} />
</div> </div>
</Tab>
<Tab title="Schema">
<KeyValueBuilder
bind:object={response.schema}
name="header"
headings
options={SchemaTypeOptions}
/>
</Tab>
<Tab title="Raw">
<TextArea disabled value={response.raw} height="300" />
</Tab>
<Tab title="Preview">
{#if response}
<Table
schema={response?.schema}
data={response?.rows}
allowEditColumns={false}
allowEditRows={false}
allowSelectRows={false}
/>
{/if}
</Tab>
<div class="stats">
<Label size="L">
Status: <span class={responseSuccess ? "green" : "red"}
>{response?.info.code}</span
>
</Label>
<Label size="L">
Time: <span class={responseSuccess ? "green" : "red"}
>{response?.info.time}</span
>
</Label>
<Label size="L">
Size: <span class={responseSuccess ? "green" : "red"}
>{response?.info.size}</span
>
</Label>
<Button disabled={!responseSuccess} cta on:click={saveQuery}
>Save query</Button
>
</div> </div>
</Tabs> {:else}
{/if} <Tabs selected="JSON" quiet noPadding noHorizPadding>
</Layout> <Tab title="JSON">
<div>
<JSONPreview height="300" data={response.rows[0]} />
</div>
</Tab>
<Tab title="Schema">
<KeyValueBuilder
bind:object={response.schema}
name="header"
headings
options={SchemaTypeOptions}
/>
</Tab>
<Tab title="Raw">
<TextArea disabled value={response.raw} height="300" />
</Tab>
<Tab title="Preview">
{#if response}
<Table
schema={response?.schema}
data={response?.rows}
allowEditColumns={false}
allowEditRows={false}
allowSelectRows={false}
/>
{/if}
</Tab>
<div class="stats">
<Label size="L">
Status: <span class={responseSuccess ? "green" : "red"}
>{response?.info.code}</span
>
</Label>
<Label size="L">
Time: <span class={responseSuccess ? "green" : "red"}
>{response?.info.time}</span
>
</Label>
<Label size="L">
Size: <span class={responseSuccess ? "green" : "red"}
>{response?.info.size}</span
>
</Label>
<Button disabled={!responseSuccess} cta on:click={saveQuery}
>Save query</Button
>
</div>
</Tabs>
{/if}
</Layout>
</div>
</div> </div>
{/if} {/if}
@ -322,6 +324,9 @@
.top { .top {
min-height: 50%; min-height: 50%;
} }
.bottom {
padding-bottom: 50px;
}
.stats { .stats {
display: flex; display: flex;
gap: var(--spacing-xl); gap: var(--spacing-xl);