mirror of
https://github.com/zadam/trilium.git
synced 2025-11-13 09:59:02 +01:00
feat(board/promoted_attributes): basic support for color attributes
This commit is contained in:
parent
6b74b227cb
commit
e9f40c48e3
@ -7,6 +7,7 @@ import { DefinitionObject } from "../../services/promoted_attribute_definition_p
|
|||||||
import { formatDateTime } from "../../utils/formatters";
|
import { formatDateTime } from "../../utils/formatters";
|
||||||
import { ComponentChildren } from "preact";
|
import { ComponentChildren } from "preact";
|
||||||
import Icon from "../react/Icon";
|
import Icon from "../react/Icon";
|
||||||
|
import css_class_manager from "../../services/css_class_manager";
|
||||||
|
|
||||||
interface PromotedAttributesDisplayProps {
|
interface PromotedAttributesDisplayProps {
|
||||||
note: FNote;
|
note: FNote;
|
||||||
@ -26,8 +27,9 @@ export default function PromotedAttributesDisplay({ note, ignoredAttributes }: P
|
|||||||
return promotedDefinitionAttributes?.length > 0 && (
|
return promotedDefinitionAttributes?.length > 0 && (
|
||||||
<div className="promoted-attributes">
|
<div className="promoted-attributes">
|
||||||
{promotedDefinitionAttributes?.map((attr) => {
|
{promotedDefinitionAttributes?.map((attr) => {
|
||||||
|
const className = `${attr.type === "label" ? "label" + " " + attr.def.labelType : "relation"}`;
|
||||||
return (
|
return (
|
||||||
<span key={attr.friendlyName} className="promoted-attribute">
|
<span key={attr.friendlyName} className={`promoted-attribute type-${className}`}>
|
||||||
{formatLabelValue(attr)}
|
{formatLabelValue(attr)}
|
||||||
</span>
|
</span>
|
||||||
);
|
);
|
||||||
@ -74,6 +76,8 @@ function formatLabelValue(attr: AttributeWithDefinitions): ComponentChildren {
|
|||||||
return <><Icon icon={value === "true" ? "bx bx-check-square" : "bx bx-square"} /> <strong>{attr.friendlyName}</strong></>;
|
return <><Icon icon={value === "true" ? "bx bx-check-square" : "bx bx-square"} /> <strong>{attr.friendlyName}</strong></>;
|
||||||
case "url":
|
case "url":
|
||||||
return <><a href={value} target="_blank" rel="noopener noreferrer">{attr.friendlyName}</a></>;
|
return <><a href={value} target="_blank" rel="noopener noreferrer">{attr.friendlyName}</a></>;
|
||||||
|
case "color":
|
||||||
|
return <><span style={{ color: value }}>{attr.friendlyName}</span></>;
|
||||||
case "text":
|
case "text":
|
||||||
default:
|
default:
|
||||||
return <><strong>{attr.friendlyName}:</strong> {value}</>;
|
return <><strong>{attr.friendlyName}:</strong> {value}</>;
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user