CodeMirror/budibase
1
0
Fork 0
mirror of synced 2024-09-06 04:31:18 +12:00
Code Issues Projects Releases Wiki Activity

Automations panel now uses the tabs component

Browse source
This commit is contained in:
Keviin Åberg Kultalahti 2021-04-16 11:49:08 +02:00
parent ef74a2fe98
commit 3ccc0a39ff
2 changed files with 26 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

40
packages/builder/src/components/automation/AutomationPanel/AutomationPanel.svelte
View file

@ -1,33 +1,45 @@
<script> <script>
import AutomationList from "./AutomationList.svelte" import AutomationList from "./AutomationList.svelte"
import CreateAutomationModal from "./CreateAutomationModal.svelte" import CreateAutomationModal from "./CreateAutomationModal.svelte"
import { Modal } from "@budibase/bbui" import { Modal, Tabs, Tab } from "@budibase/bbui"
let modal let modal
</script> </script>
<div class="title"> <div class="title">
<h1>Automations</h1> <Tabs selected="Automations">
<Tab title="Automations">
<div class="tab-content-padding">
<AutomationList />
<Modal bind:this={modal}>
<CreateAutomationModal />
</Modal>
</div>
</Tab>
</Tabs>
<i <i
on:click={modal.show} on:click={modal.show}
data-cy="new-automation" data-cy="new-automation"
class="ri-add-circle-fill" /> class="ri-add-circle-fill" />
</div> </div>
<AutomationList />
<Modal bind:this={modal}>
<CreateAutomationModal />
</Modal>
<style> <style>
.tab-content-padding {
padding: 0 var(--spacing-s);
}
i {
font-size: 20px;
position: absolute;
top: var(--spacing-l);
right: var(--spacing-l);
}
.title { .title {
display: flex; display: flex;
flex-direction: row; flex-direction: column;
justify-content: space-between; justify-content: flex-start;
align-items: center; align-items: stretch;
} position: relative;
.title h1 {
font-size: var(--font-size-m);
font-weight: 500;
margin: 0;
} }
.title i { .title i {
font-size: 20px; font-size: 20px;

3
packages/builder/src/pages/builder/[application]/automate/_layout.svelte
View file

@ -28,13 +28,10 @@
.nav { .nav {
overflow-y: auto; overflow-y: auto;
background: var(--background);
padding: var(--spacing-l) var(--spacing-xl);
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: flex-start; justify-content: flex-start;
align-items: stretch; align-items: stretch;
gap: var(--spacing-l);
border-right: var(--border-light); border-right: var(--border-light);
} }