Fix theme resetting navigation background and update layout UI
This commit is contained in:
parent
1c93d9bd91
commit
c3b39d5953
|
@ -1,31 +1,25 @@
|
||||||
<script>
|
<script>
|
||||||
import Panel from "components/design/Panel.svelte"
|
import Panel from "components/design/Panel.svelte"
|
||||||
import { Banner, Layout } from "@budibase/bbui"
|
import { Layout } from "@budibase/bbui"
|
||||||
import NavItem from "components/common/NavItem.svelte"
|
import NavItem from "components/common/NavItem.svelte"
|
||||||
import { store } from "builderStore"
|
import { store } from "builderStore"
|
||||||
import LayoutDropdownMenu from "./LayoutDropdownMenu.svelte"
|
import LayoutDropdownMenu from "./LayoutDropdownMenu.svelte"
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<Panel title="Layouts" borderRight>
|
<Panel title="Layouts" borderRight>
|
||||||
<Layout paddingX="L" paddingY="XL" gap="S">
|
<Layout paddingY="XL" paddingX="">
|
||||||
<Banner
|
<div>
|
||||||
type="warning"
|
{#each $store.layouts as layout (layout._id)}
|
||||||
showCloseButton={false}
|
<NavItem
|
||||||
extraButtonText="View details"
|
icon="Experience"
|
||||||
extraButtonAction={() => {}}
|
indentLevel={0}
|
||||||
>
|
selected={$store.selectedLayoutId === layout._id}
|
||||||
Custom layouts are being deprecated. They will be removed on [date].
|
text={layout.name}
|
||||||
</Banner>
|
on:click={() => ($store.selectedLayoutId = layout._id)}
|
||||||
|
>
|
||||||
|
<LayoutDropdownMenu {layout} />
|
||||||
|
</NavItem>
|
||||||
|
{/each}
|
||||||
|
</div>
|
||||||
</Layout>
|
</Layout>
|
||||||
{#each $store.layouts as layout (layout._id)}
|
|
||||||
<NavItem
|
|
||||||
icon="Experience"
|
|
||||||
indentLevel={0}
|
|
||||||
selected={$store.selectedLayoutId === layout._id}
|
|
||||||
text={layout.name}
|
|
||||||
on:click={() => ($store.selectedLayoutId = layout._id)}
|
|
||||||
>
|
|
||||||
<LayoutDropdownMenu {layout} />
|
|
||||||
</NavItem>
|
|
||||||
{/each}
|
|
||||||
</Panel>
|
</Panel>
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
<script>
|
<script>
|
||||||
import Panel from "components/design/Panel.svelte"
|
import Panel from "components/design/Panel.svelte"
|
||||||
import { store, selectedLayout } from "builderStore"
|
import { store, selectedLayout } from "builderStore"
|
||||||
import { Layout, Body, Button, notifications } from "@budibase/bbui"
|
import { Layout, Body, Button, Banner, notifications } from "@budibase/bbui"
|
||||||
import { Component } from "builderStore/store/screenTemplates/utils/Component"
|
import { Component } from "builderStore/store/screenTemplates/utils/Component"
|
||||||
|
|
||||||
const copyLayout = () => {
|
const copyLayout = () => {
|
||||||
|
@ -37,6 +37,14 @@
|
||||||
|
|
||||||
<Panel title={$selectedLayout?.name} icon="Experience" borderLeft>
|
<Panel title={$selectedLayout?.name} icon="Experience" borderLeft>
|
||||||
<Layout paddingX="L" paddingY="XL" gap="S">
|
<Layout paddingX="L" paddingY="XL" gap="S">
|
||||||
|
<Banner
|
||||||
|
type="warning"
|
||||||
|
showCloseButton={false}
|
||||||
|
extraButtonText="View details"
|
||||||
|
extraButtonAction={() => {}}
|
||||||
|
>
|
||||||
|
Custom layouts are being deprecated. They will be removed on [date].
|
||||||
|
</Banner>
|
||||||
<Body size="S">
|
<Body size="S">
|
||||||
You can save the content of this layout by pressing the button below.
|
You can save the content of this layout by pressing the button below.
|
||||||
</Body>
|
</Body>
|
||||||
|
|
|
@ -16,13 +16,6 @@
|
||||||
try {
|
try {
|
||||||
const theme = ThemeOptions[e.detail] ?? ThemeOptions[2]
|
const theme = ThemeOptions[e.detail] ?? ThemeOptions[2]
|
||||||
await store.actions.theme.save(theme)
|
await store.actions.theme.save(theme)
|
||||||
await store.actions.navigation.save({
|
|
||||||
...get(store).navigation,
|
|
||||||
navBackground:
|
|
||||||
theme === "spectrum--light"
|
|
||||||
? "var(--spectrum-global-color-gray-50)"
|
|
||||||
: "var(--spectrum-global-color-gray-100)",
|
|
||||||
})
|
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
notifications.error("Error updating theme")
|
notifications.error("Error updating theme")
|
||||||
}
|
}
|
||||||
|
|
|
@ -276,7 +276,7 @@ const performAppCreate = async (ctx: any) => {
|
||||||
navigation: "Top",
|
navigation: "Top",
|
||||||
title: name,
|
title: name,
|
||||||
navWidth: "Large",
|
navWidth: "Large",
|
||||||
navBackground: "var(--spectrum-global-color-gray-50)",
|
navBackground: "var(--spectrum-global-color-gray-100)",
|
||||||
links: [
|
links: [
|
||||||
{
|
{
|
||||||
url: "/home",
|
url: "/home",
|
||||||
|
|
Loading…
Reference in New Issue