From 07e49f44366ff9e14b6794a58649b0b89b43f582 Mon Sep 17 00:00:00 2001 From: Andrew Kingston Date: Wed, 23 Aug 2023 16:46:32 +0100 Subject: [PATCH] Standardise info boxes between theme and navigation --- .../_components/Navigation/index.svelte | 22 ++++--------- .../_components/Screen/ThemePanel.svelte | 33 +++++-------------- .../_components/Screen/index.svelte | 4 +-- 3 files changed, 17 insertions(+), 42 deletions(-) diff --git a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/[componentId]/_components/Navigation/index.svelte b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/[componentId]/_components/Navigation/index.svelte index 97622098cd..383026c4f8 100644 --- a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/[componentId]/_components/Navigation/index.svelte +++ b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/[componentId]/_components/Navigation/index.svelte @@ -64,10 +64,8 @@ Customize
-
- - These settings apply to all screens -
+ + These settings apply to all screens
@@ -210,22 +208,14 @@ .info { background-color: var(--background-alt); padding: 12px; - margin-bottom: 12px; - } - - .infoHeader { display: flex; - margin-bottom: 5px; border-radius: 4px; + gap: 4px; + margin-bottom: 16px; } - - .infoHeader :global(svg) { + .info :global(svg) { margin-right: 5px; - color: var(--grey-6); - } - - .infoHeader :global(p) { - color: var(--grey-7); + color: var(--spectrum-global-color-gray-600); } .configureLinks :global(button) { diff --git a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/[componentId]/_components/Screen/ThemePanel.svelte b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/[componentId]/_components/Screen/ThemePanel.svelte index f3f2e63cce..13a008fae0 100644 --- a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/[componentId]/_components/Screen/ThemePanel.svelte +++ b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/[componentId]/_components/Screen/ThemePanel.svelte @@ -29,13 +29,8 @@
-
- - CHANGES WILL APPLY TO ALL SCREENS -
- - Your theme is configured for all the screens within your app. - + + These settings apply to all screens
@@ -68,26 +63,16 @@ /> - diff --git a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/[componentId]/_components/Screen/index.svelte b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/[componentId]/_components/Screen/index.svelte index d9c98bda66..778fa303cc 100644 --- a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/[componentId]/_components/Screen/index.svelte +++ b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/[componentId]/_components/Screen/index.svelte @@ -6,8 +6,8 @@ import { capitalise } from "helpers" import { ActionButton, Layout } from "@budibase/bbui" - let activeTab = "settings" - const tabs = ["settings", "theme"] + let activeTab = "general" + const tabs = ["general", "theme"]