Add second panel for navigation tab

4 years ago · 6f382b84c1
4 changed files with 19 additions and 8 deletions
--- a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/navigation/_components/NavigationInfoPanel.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/navigation/_components/NavigationInfoPanel.svelte
@ -0,0 +1,16 @@
+<script>
+  import Panel from "components/design/Panel.svelte"
+  import { Body, Layout } from "@budibase/bbui"
+</script>
+
+<Panel borderLeft title="Navigation" icon="InfoOutline">
+  <Layout paddingX="L" paddingY="XL" gap="S">
+    <Body size="S">
+      Your navigation is configured for all the screens within your app.
+    </Body>
+    <Body size="S">
+      You can hide and show your navigation for each screen in the screen
+      settings.
+    </Body>
+  </Layout>
+</Panel>
--- a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/navigation/_components/NavigationSettingsPanel.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/navigation/_components/NavigationSettingsPanel.svelte
@ -29,13 +29,6 @@

 <Panel title="Navigation" borderRight>
  <Layout paddingX="L" paddingY="XL" gap="S">
-    <Body size="S">
-      Your navigation is configured for all the screens within your app.
-    </Body>
-    <Body size="S">
-      You can hide and show your navigation for each screen in the screen
-      settings.
-    </Body>
    <NavigationLinksEditor />
    <Layout noPadding gap="XS">
      <Label>Position</Label>
--- a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/navigation/index.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/navigation/index.svelte
@ -1,5 +1,7 @@
 <script>
  import NavigationSettingsPanel from "./_components/NavigationSettingsPanel.svelte"
+  import NavigationInfoPanel from "./_components/NavigationInfoPanel.svelte"
 </script>

 <NavigationSettingsPanel />
+<NavigationInfoPanel />
--- a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/theme/_components/ThemeInfoPanel.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/theme/_components/ThemeInfoPanel.svelte
@ -3,7 +3,7 @@
  import { Body, Layout } from "@budibase/bbui"
 </script>

-<Panel borderLeft title="Theme" icon="Brush">
+<Panel borderLeft title="Theme" icon="InfoOutline">
  <Layout paddingX="L" paddingY="XL">
    <Body size="S">
      Your theme is set across all the screens within your app.