Dockery/Trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-12-20 15:19:56 +01:00
Code Issues Packages Projects Releases Activity

client/note color picker: refactor

Browse Source
This commit is contained in:
Adorian Doran
2025-11-20 23:10:36 +02:00
parent e4c928ae87
commit 926f0f85f3
3 changed files with 17 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
apps/client/src/menus/custom-items/NoteColorPicker.tsx
View File

@@ -3,6 +3,7 @@ import { t } from "../../services/i18n";
import { useCallback, useEffect, useRef, useState} from "preact/hooks";
import {ComponentChildren} from "preact";
import attributes from "../../services/attributes";
import clsx from "clsx";
import Color, { ColorInstance } from "color";
import Debouncer from "../../utils/debouncer";
import FNote from "../../entities/fnote";
@@ -105,7 +106,11 @@ interface ColorCellProps {
}
function ColorCell(props: ColorCellProps) {
return <div class={`color-cell ${props.isSelected ? "selected" : ""} ${props.isDisabled ? "disabled-color-cell" : ""} ${props.className ?? ""}`}
return <div className={clsx(props.className, {
"color-cell": true,
"selected": props.isSelected,
"disabled-color-cell": props.isDisabled
})}
style={`${(props.color !== null) ? `--color: ${props.color}` : ""}`}
title={props.tooltip}
onClick={() => props.onSelect?.(props.color)}>
@@ -151,7 +156,9 @@ function CustomColorCell(props: ColorCellProps) {
return <div style={`--foreground: ${getForegroundColor(props.color)};`}>
<ColorCell {...props}
color={pickedColor}
className={`custom-color-cell ${(pickedColor === null) ? "custom-color-cell-empty" : ""}`}
className={clsx("custom-color-cell", {
"custom-color-cell-empty": (pickedColor === null)
})}
onSelect={onSelect}>
<input ref={colorInput}