mirrors/dbgate
1
0
Fork 0
mirror of https://github.com/dbgate/dbgate synced 2024-11-07 20:26:23 +00:00
Code Issues Actions 4 Packages Projects Releases Wiki Activity

theme could be in plugin

Browse Source
This commit is contained in:
Jan Prochazka 2022-01-29 18:17:04 +01:00
parent 157325f605
commit a49296e165
7 changed files with 17 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
packages/types/extensions.d.ts vendored
View File

@ -22,9 +22,10 @@ export interface FileFormatDefinition {
}
export interface ThemeDefinition {
className: string;
themeClassName: string;
themeName: string;
themeType: 'light' | 'dark';
themeCss?: string;
}
export interface PluginDefinition {

6
packages/web/src/Screen.svelte
View File

@ -26,6 +26,12 @@
$: currentThemeType = $currentThemeDefinition?.themeType == 'dark' ? 'theme-type-dark' : 'theme-type-light';
</script>
<svelte:head>
{#if $currentThemeDefinition?.themeCss}
{@html `<style id="themePlugin">${$currentThemeDefinition?.themeCss}</style>`}
{/if}
</svelte:head>
<div
class={`${$currentTheme} ${currentThemeType} root dbgate-screen`}
use:dragDropFileTarget

2
packages/web/src/commands/stdCommands.ts
View File

@ -30,7 +30,7 @@ import runCommand from './runCommand';
function themeCommand(theme: ThemeDefinition) {
return {
text: theme.themeName,
onClick: () => currentTheme.set(theme.className),
onClick: () => currentTheme.set(theme.themeClassName),
// onPreview: () => {
// const old = get(currentTheme);
// currentTheme.set(css);

6
packages/web/src/designer/Designer.svelte
View File

@ -695,13 +695,17 @@
if (css) css += '\n';
css += cssItem;
}
if ($currentThemeDefinition?.themeCss) {
if (css) css += '\n';
css += $currentThemeDefinition?.themeCss;
}
saveFileToDisk(async filePath => {
await apiCall('files/export-diagram', {
filePath,
html: domCanvas.outerHTML,
css,
themeType: $currentThemeDefinition?.themeType,
themeClassName: $currentThemeDefinition?.className,
themeClassName: $currentThemeDefinition?.themeClassName,
});
});
}

2
packages/web/src/plugins/ThemeDark.svelte
View File

@ -1,5 +1,5 @@
<script context="module">
export const className = 'theme-dark';
export const themeClassName = 'theme-dark';
export const themeName = 'Dark';
export const themeType = 'dark';
</script>

2
packages/web/src/plugins/ThemeLight.svelte
View File

@ -1,5 +1,5 @@
<script context="module">
export const className = 'theme-light';
export const themeClassName = 'theme-light';
export const themeName = 'Light';
export const themeType = 'light';
</script>

2
packages/web/src/stores.ts
View File

@ -73,7 +73,7 @@ export const loadingPluginStore = writable({
});
export const currentThemeDefinition = derived([currentTheme, extensions], ([$currentTheme, $extensions]) =>
$extensions.themes.find(x => x.className == $currentTheme)
$extensions.themes.find(x => x.themeClassName == $currentTheme)
);
subscribeCssVariable(selectedWidget, x => (x ? 1 : 0), '--dim-visible-left-panel');