Change IO text background color to white (#2726)

Co-authored-by: Glutanimate <glutanimate@users.noreply.github.com>
This commit is contained in:
Aristotelis 2023-10-13 00:49:31 +02:00 committed by GitHub
parent 7ce1c4439a
commit a7e5d2a663
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 7 additions and 6 deletions

View File

@ -10,7 +10,7 @@ import { extractShapesFromRenderedClozes } from "./shapes/from-cloze";
import { Polygon } from "./shapes/polygon"; import { Polygon } from "./shapes/polygon";
import { Rectangle } from "./shapes/rectangle"; import { Rectangle } from "./shapes/rectangle";
import { Text } from "./shapes/text"; import { Text } from "./shapes/text";
import { TEXT_FONT_FAMILY, TEXT_PADDING } from "./tools/lib"; import { TEXT_BACKGROUND_COLOR, TEXT_FONT_FAMILY, TEXT_PADDING } from "./tools/lib";
import type { Size } from "./types"; import type { Size } from "./types";
export function setupImageCloze(): void { export function setupImageCloze(): void {
@ -136,7 +136,7 @@ function drawShape(
ctx.textBaseline = "top"; ctx.textBaseline = "top";
ctx.scale(shape.scaleX, shape.scaleY); ctx.scale(shape.scaleX, shape.scaleY);
const textMetrics = ctx.measureText(shape.text); const textMetrics = ctx.measureText(shape.text);
ctx.fillStyle = properties.inActiveShapeColor; ctx.fillStyle = TEXT_BACKGROUND_COLOR;
ctx.fillRect( ctx.fillRect(
shape.left / shape.scaleX, shape.left / shape.scaleX,
shape.top / shape.scaleY, shape.top / shape.scaleY,

View File

@ -3,7 +3,7 @@
import { fabric } from "fabric"; import { fabric } from "fabric";
import { SHAPE_MASK_COLOR, TEXT_FONT_FAMILY, TEXT_PADDING } from "../tools/lib"; import { TEXT_BACKGROUND_COLOR, TEXT_FONT_FAMILY, TEXT_PADDING } from "../tools/lib";
import type { ConstructorParams, Size } from "../types"; import type { ConstructorParams, Size } from "../types";
import type { ShapeDataForCloze } from "./base"; import type { ShapeDataForCloze } from "./base";
import { Shape } from "./base"; import { Shape } from "./base";
@ -41,7 +41,7 @@ export class Text extends Shape {
return new fabric.IText(this.text, { return new fabric.IText(this.text, {
...this, ...this,
fontFamily: TEXT_FONT_FAMILY, fontFamily: TEXT_FONT_FAMILY,
backgroundColor: SHAPE_MASK_COLOR, backgroundColor: TEXT_BACKGROUND_COLOR,
padding: TEXT_PADDING, padding: TEXT_PADDING,
}); });
} }

View File

@ -9,6 +9,7 @@ import { zoomResetValue } from "../store";
export const SHAPE_MASK_COLOR = "#ffeba2"; export const SHAPE_MASK_COLOR = "#ffeba2";
export const BORDER_COLOR = "#212121"; export const BORDER_COLOR = "#212121";
export const TEXT_BACKGROUND_COLOR = "#ffffff";
export const TEXT_FONT_FAMILY = "Arial"; export const TEXT_FONT_FAMILY = "Arial";
export const TEXT_PADDING = 5; export const TEXT_PADDING = 5;

View File

@ -6,8 +6,8 @@ import { fabric } from "fabric";
import { import {
disableRotation, disableRotation,
enableUniformScaling, enableUniformScaling,
SHAPE_MASK_COLOR,
stopDraw, stopDraw,
TEXT_BACKGROUND_COLOR,
TEXT_FONT_FAMILY, TEXT_FONT_FAMILY,
TEXT_PADDING, TEXT_PADDING,
} from "./lib"; } from "./lib";
@ -32,7 +32,7 @@ export const drawText = (canvas: fabric.Canvas): void => {
strokeWidth: 1, strokeWidth: 1,
noScaleCache: false, noScaleCache: false,
fontFamily: TEXT_FONT_FAMILY, fontFamily: TEXT_FONT_FAMILY,
backgroundColor: SHAPE_MASK_COLOR, backgroundColor: TEXT_BACKGROUND_COLOR,
padding: TEXT_PADDING, padding: TEXT_PADDING,
}); });
disableRotation(text); disableRotation(text);