Merge branches 'master' and 'reuse-containers' of github.com:budibase/budibase into reuse-containers
This commit is contained in:
commit
c5dfd0c9ba
8 changed files with 40 additions and 18 deletions
10
.github/workflows/budibase_ci.yml
vendored
10
.github/workflows/budibase_ci.yml
vendored
|
@ -264,7 +264,15 @@ jobs:
|
||||||
token: ${{ secrets.PERSONAL_ACCESS_TOKEN || github.token }}
|
token: ${{ secrets.PERSONAL_ACCESS_TOKEN || github.token }}
|
||||||
fetch-depth: 0
|
fetch-depth: 0
|
||||||
|
|
||||||
- name: Check account portal commit
|
- uses: dorny/paths-filter@v3
|
||||||
|
id: changes
|
||||||
|
with:
|
||||||
|
filters: |
|
||||||
|
src:
|
||||||
|
- packages/account-portal/**
|
||||||
|
|
||||||
|
- if: steps.changes.outputs.src == 'true'
|
||||||
|
name: Check account portal commit
|
||||||
id: get_accountportal_commits
|
id: get_accountportal_commits
|
||||||
run: |
|
run: |
|
||||||
cd packages/account-portal
|
cd packages/account-portal
|
||||||
|
|
|
@ -371,6 +371,7 @@
|
||||||
<style>
|
<style>
|
||||||
.binding-panel {
|
.binding-panel {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
.binding-panel,
|
.binding-panel,
|
||||||
.tabs {
|
.tabs {
|
||||||
|
|
|
@ -249,7 +249,7 @@
|
||||||
<div class="component-container">
|
<div class="component-container">
|
||||||
{#if loading}
|
{#if loading}
|
||||||
<div
|
<div
|
||||||
class={`loading ${$themeStore.theme}`}
|
class={`loading ${$themeStore.baseTheme} ${$themeStore.theme}`}
|
||||||
class:tablet={$previewStore.previewDevice === "tablet"}
|
class:tablet={$previewStore.previewDevice === "tablet"}
|
||||||
class:mobile={$previewStore.previewDevice === "mobile"}
|
class:mobile={$previewStore.previewDevice === "mobile"}
|
||||||
>
|
>
|
||||||
|
|
|
@ -20,7 +20,7 @@
|
||||||
import { sdk } from "@budibase/shared-core"
|
import { sdk } from "@budibase/shared-core"
|
||||||
import { API } from "api"
|
import { API } from "api"
|
||||||
import ErrorSVG from "./ErrorSVG.svelte"
|
import ErrorSVG from "./ErrorSVG.svelte"
|
||||||
import { ClientAppSkeleton } from "@budibase/frontend-core"
|
import { getBaseTheme, ClientAppSkeleton } from "@budibase/frontend-core"
|
||||||
|
|
||||||
$: app = $enrichedApps.find(app => app.appId === $params.appId)
|
$: app = $enrichedApps.find(app => app.appId === $params.appId)
|
||||||
$: iframeUrl = getIframeURL(app)
|
$: iframeUrl = getIframeURL(app)
|
||||||
|
@ -137,7 +137,9 @@
|
||||||
class:hide={!loading || !app?.features?.skeletonLoader}
|
class:hide={!loading || !app?.features?.skeletonLoader}
|
||||||
class="loading"
|
class="loading"
|
||||||
>
|
>
|
||||||
<div class={`loadingThemeWrapper ${app.theme}`}>
|
<div
|
||||||
|
class={`loadingThemeWrapper ${getBaseTheme(app.theme)} ${app.theme}`}
|
||||||
|
>
|
||||||
<ClientAppSkeleton
|
<ClientAppSkeleton
|
||||||
noAnimation
|
noAnimation
|
||||||
hideDevTools={app?.status === "published"}
|
hideDevTools={app?.status === "published"}
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import { writable, get } from "svelte/store"
|
import { writable, get } from "svelte/store"
|
||||||
import { API } from "api"
|
import { API } from "api"
|
||||||
|
import { getBaseTheme } from "@budibase/frontend-core"
|
||||||
|
|
||||||
const INITIAL_THEMES_STATE = {
|
const INITIAL_THEMES_STATE = {
|
||||||
theme: "",
|
theme: "",
|
||||||
|
@ -12,11 +13,15 @@ export const themes = () => {
|
||||||
})
|
})
|
||||||
|
|
||||||
const syncAppTheme = app => {
|
const syncAppTheme = app => {
|
||||||
store.update(state => ({
|
store.update(state => {
|
||||||
...state,
|
const theme = app.theme || "spectrum--light"
|
||||||
theme: app.theme || "spectrum--light",
|
return {
|
||||||
customTheme: app.customTheme,
|
...state,
|
||||||
}))
|
theme,
|
||||||
|
baseTheme: getBaseTheme(theme),
|
||||||
|
customTheme: app.customTheme,
|
||||||
|
}
|
||||||
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
const save = async (theme, appId) => {
|
const save = async (theme, appId) => {
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
import { derived } from "svelte/store"
|
import { derived } from "svelte/store"
|
||||||
import { appStore } from "./app"
|
import { appStore } from "./app"
|
||||||
import { builderStore } from "./builder"
|
import { builderStore } from "./builder"
|
||||||
import { Constants } from "@budibase/frontend-core"
|
import { getBaseTheme } from "@budibase/frontend-core"
|
||||||
|
|
||||||
// This is the good old acorn bug where having the word "g l o b a l" makes it
|
// This is the good old acorn bug where having the word "g l o b a l" makes it
|
||||||
// think that this is not ES6 compatible and starts throwing errors when using
|
// think that this is not ES6 compatible and starts throwing errors when using
|
||||||
|
@ -29,13 +29,6 @@ const createThemeStore = () => {
|
||||||
// Ensure theme is set
|
// Ensure theme is set
|
||||||
theme = theme || defaultTheme
|
theme = theme || defaultTheme
|
||||||
|
|
||||||
// Get base theme
|
|
||||||
let base =
|
|
||||||
Constants.Themes.find(x => `spectrum--${x.class}` === theme)?.base || ""
|
|
||||||
if (base) {
|
|
||||||
base = `spectrum--${base}`
|
|
||||||
}
|
|
||||||
|
|
||||||
// Delete and nullish keys from the custom theme
|
// Delete and nullish keys from the custom theme
|
||||||
if (customTheme) {
|
if (customTheme) {
|
||||||
Object.entries(customTheme).forEach(([key, value]) => {
|
Object.entries(customTheme).forEach(([key, value]) => {
|
||||||
|
@ -59,7 +52,7 @@ const createThemeStore = () => {
|
||||||
|
|
||||||
return {
|
return {
|
||||||
theme,
|
theme,
|
||||||
baseTheme: base,
|
baseTheme: getBaseTheme(theme),
|
||||||
customTheme,
|
customTheme,
|
||||||
customThemeCss,
|
customThemeCss,
|
||||||
}
|
}
|
||||||
|
|
|
@ -7,3 +7,4 @@ export * as RowUtils from "./rows"
|
||||||
export { memo, derivedMemo } from "./memo"
|
export { memo, derivedMemo } from "./memo"
|
||||||
export { createWebsocket } from "./websocket"
|
export { createWebsocket } from "./websocket"
|
||||||
export * from "./download"
|
export * from "./download"
|
||||||
|
export * from "./theme"
|
||||||
|
|
12
packages/frontend-core/src/utils/theme.js
Normal file
12
packages/frontend-core/src/utils/theme.js
Normal file
|
@ -0,0 +1,12 @@
|
||||||
|
import { Themes } from "../constants.js"
|
||||||
|
|
||||||
|
export const getBaseTheme = theme => {
|
||||||
|
if (!theme) {
|
||||||
|
return ""
|
||||||
|
}
|
||||||
|
let base = Themes.find(x => `spectrum--${x.class}` === theme)?.base || ""
|
||||||
|
if (base) {
|
||||||
|
base = `spectrum--${base}`
|
||||||
|
}
|
||||||
|
return base
|
||||||
|
}
|
Loading…
Reference in a new issue