github/directus
1
1
Fork 0
mirror of https://github.com/directus/directus.git synced 2026-04-25 03:00:53 -04:00
Code Issues Packages Projects Releases Wiki Activity

Use server store for public theme information (#20324)

Browse Source 
* from rainbow to lava lamp

* svg paths to divs for performance

* Clean up styles

* Public view themable options

* Make speed themable

* Use server store info for public theming

* Add changeset

---------

Co-authored-by: Ben Haynes <ben@rngr.org>
This commit is contained in:
Rijk van Zanten
2023-11-03 15:21:33 -04:00
committed by GitHub
parent 3faab8d8ae
commit 40e7046ba8
5 changed files with 22 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
.changeset/grumpy-pandas-wink.md Normal file
View File

@@ -0,0 +1,6 @@
---
'@directus/api': minor
'@directus/app': minor
---
Return theme information from server project info endpoint

4
api/src/services/server.ts
View File

@@ -41,6 +41,10 @@ export class ServerService {
'project_logo',
'project_color',
'default_appearance',
'default_theme_light',
'default_theme_dark',
'theme_light_overrides',
'theme_dark_overrides',
'default_language',
'public_foreground',
'public_background',

13
app/src/composables/use-theme-configuration.ts
View File

@@ -1,11 +1,12 @@
import { useSettingsStore } from '@/stores/settings';
import type { Info } from '@/stores/server';
import { useServerStore } from '@/stores/server';
import { useUserStore } from '@/stores/user';
import type { Settings, User } from '@directus/types';
import type { User } from '@directus/types';
import { merge } from 'lodash';
import { computed, ref } from 'vue';
export const useThemeConfiguration = () => {
const settingsStore = useSettingsStore();
const serverStore = useServerStore();
const userStore = useUserStore();
const browserAppearance = ref<'dark' | 'light'>(
@@ -17,10 +18,10 @@ export const useThemeConfiguration = () => {
});
const systemSettings = computed(() => {
let system: Settings | null = null;
let system: Info['project'] | null = null;
if (settingsStore.settings) {
system = settingsStore.settings;
if (serverStore.info?.project) {
system = serverStore.info.project;
}
return system;

4
app/src/stores/server.ts
View File

@@ -23,6 +23,10 @@ export type Info = {
project_color: string | null;
default_language: string | null;
default_appearance: 'light' | 'dark' | 'auto';
default_theme_light: string;
default_theme_dark: string;
theme_light_overrides: Record<string, unknown> | null;
theme_dark_overrides: Record<string, unknown> | null;
public_foreground: string | null;
public_background: string | null;
public_favicon: string | null;

2
app/src/stores/settings.ts
View File

@@ -2,9 +2,9 @@ import api from '@/api';
import { i18n } from '@/lang';
import { notify } from '@/utils/notify';
import { unexpectedError } from '@/utils/unexpected-error';
import { Settings } from '@directus/types';
import { merge } from 'lodash';
import { defineStore } from 'pinia';
import { Settings } from '@directus/types';
import { useUserStore } from './user';
export const useSettingsStore = defineStore({