#493

eez-open · Aug 26, 2024 · d174146 · d174146
1 parent 6e4fee0
commit d174146
Show file tree

Hide file tree

Showing 4 changed files with 22 additions and 6 deletions.
diff --git a/packages/eez-studio-ui/_stylesheets/project-editor.less b/packages/eez-studio-ui/_stylesheets/project-editor.less
@@ -3243,7 +3243,7 @@
 
         li {
             margin: 5px;
-            border: 2px solid #eee;
+            border: 1px solid @borderColor;
             padding: 5px;
             background-color: @backgroundColor;
             cursor: pointer;

diff --git a/packages/project-editor/features/font/GlyphSelectFieldType.tsx b/packages/project-editor/features/font/GlyphSelectFieldType.tsx
@@ -28,6 +28,7 @@ import {
     setColor
 } from "project-editor/flow/editor/eez-gui-draw";
 import { formatEncoding } from "project-editor/features/font/utils";
+import { settingsController } from "home/settings";
 
 ////////////////////////////////////////////////////////////////////////////////
 
@@ -396,8 +397,14 @@ export const Glyph = observer(
 
         const encoding = data.fontExtract.allEncodings[index];
 
-        setColor("black");
-        setBackColor("white");
+        if (settingsController.isDarkTheme) {
+            setColor("white");
+            setBackColor("black");
+        } else {
+            setColor("black");
+            setBackColor("white");
+        }
+
         const canvas = drawGlyph2(encoding, data.fontExtract);
 
         return (

diff --git a/packages/project-editor/features/font/Glyphs.tsx b/packages/project-editor/features/font/Glyphs.tsx
@@ -17,6 +17,7 @@ import { SearchInput } from "eez-studio-ui/search-input";
 
 import { Font, Glyph } from "project-editor/features/font/font";
 import { ProjectContext } from "project-editor/project/context";
+import { settingsController } from "home/settings";
 
 export const Glyphs = observer(
     class Glyphs
@@ -236,8 +237,15 @@ export const GlyphComponent = observer(
         canvas.width = (glyph.glyphBitmap && glyph.glyphBitmap.width) || 1;
         canvas.height = glyph.font.height || 1;
         let ctx = canvas.getContext("2d")!;
-        setColor("black");
-        setBackColor("white");
+
+        if (settingsController.isDarkTheme) {
+            setColor("white");
+            setBackColor("black");
+        } else {
+            setColor("black");
+            setBackColor("white");
+        }
+
         drawGlyph(ctx, -glyph.x, 0, glyph.encoding, glyph.font);
 
         React.useEffect(() => {

diff --git a/packages/project-editor/features/font/font.tsx b/packages/project-editor/features/font/font.tsx
@@ -68,6 +68,7 @@ import {
 import { generalGroup } from "project-editor/ui-components/PropertyGrid/groups";
 import type { ProjectEditorFeature } from "project-editor/store/features";
 import { getLvglDefaultFontBpp } from "project-editor/lvgl/lvgl-versions";
+import { settingsController } from "home/settings";
 
 ////////////////////////////////////////////////////////////////////////////////
 
@@ -453,7 +454,7 @@ export class Glyph extends EezObject {
         if (this.glyphBitmap) {
             const project = ProjectEditor.getProject(this);
 
-            ctx.fillStyle = "black";
+            ctx.fillStyle = settingsController.isDarkTheme ? "white" : "black";
             for (let y = 0; y < height; y++) {
                 for (let x = 0; x < width; x++) {
                     const pixelValue = getPixel(