diff --git a/apps/client/src/services/css_class_manager.ts b/apps/client/src/services/css_class_manager.ts index 9c6a97aaf..f22dbf437 100644 --- a/apps/client/src/services/css_class_manager.ts +++ b/apps/client/src/services/css_class_manager.ts @@ -39,12 +39,12 @@ function createClassForColor(colorString: string | null) { `); registeredClasses.add(className); - if (hue) { + if (hue !== undefined) { colorsWithHue.add(className); } } - return clsx(className, colorsWithHue.has(className) && "with-hue"); + return clsx("use-note-color", className, colorsWithHue.has(className) && "with-hue"); } function parseColor(color: string) { diff --git a/apps/client/src/stylesheets/theme-dark.css b/apps/client/src/stylesheets/theme-dark.css index a356d32fd..0354e3346 100644 --- a/apps/client/src/stylesheets/theme-dark.css +++ b/apps/client/src/stylesheets/theme-dark.css @@ -109,3 +109,6 @@ body .todo-list input[type="checkbox"]:not(:checked):before { box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.6) !important; } +.use-note-color { + --custom-color: var(--dark-theme-custom-color); +} \ No newline at end of file diff --git a/apps/client/src/stylesheets/theme-light.css b/apps/client/src/stylesheets/theme-light.css index 872e7431f..0208ed97c 100644 --- a/apps/client/src/stylesheets/theme-light.css +++ b/apps/client/src/stylesheets/theme-light.css @@ -91,4 +91,8 @@ html { .ck-content a.reference-link > span, .board-note { color: var(--light-theme-custom-color, inherit); +} + +.use-note-color { + --custom-color: var(--light-theme-custom-color); } \ No newline at end of file diff --git a/apps/client/src/stylesheets/theme-next-dark.css b/apps/client/src/stylesheets/theme-next-dark.css index 72271ad2e..1565fe1e8 100644 --- a/apps/client/src/stylesheets/theme-next-dark.css +++ b/apps/client/src/stylesheets/theme-next-dark.css @@ -270,6 +270,12 @@ --ck-editor-toolbar-button-on-color: white; --ck-editor-toolbar-button-on-shadow: 1px 1px 2px rgba(0, 0, 0, .75); --ck-editor-toolbar-dropdown-button-open-background: #ffffff14; + + --calendar-coll-event-background-saturation: 12%; + --calendar-coll-event-background-lightness: 21%; + --calendar-coll-event-background-color: #3c3c3c; + --calendar-coll-event-text-color: white; + --calendar-cell-event-hover-filter: brightness(1.25); } /* @@ -308,4 +314,8 @@ body .todo-list input[type="checkbox"]:not(:checked):before { --modal-background-color: hsl(var(--custom-color-hue), 8.8%, 11.2%); --modal-border-color: hsl(var(--custom-color-hue), 9.4%, 25.1%); --promoted-attribute-card-background-color: hsl(var(--custom-color-hue), 13.2%, 20.8%); +} + +.use-note-color { + --custom-color: var(--dark-theme-custom-color); } \ No newline at end of file diff --git a/apps/client/src/stylesheets/theme-next-light.css b/apps/client/src/stylesheets/theme-next-light.css index 780d519f7..423ef8d52 100644 --- a/apps/client/src/stylesheets/theme-next-light.css +++ b/apps/client/src/stylesheets/theme-next-light.css @@ -268,6 +268,12 @@ --ck-editor-toolbar-button-on-color: black; --ck-editor-toolbar-button-on-shadow: none; --ck-editor-toolbar-dropdown-button-open-background: #0000000f; + + --calendar-coll-event-background-lightness: 95%; + --calendar-coll-event-background-saturation: 80%; + --calendar-coll-event-background-color: #eaeaea; + --calendar-coll-event-text-color: black; + --calendar-cell-event-hover-filter: brightness(.95) saturate(1.25); } #left-pane .fancytree-node.tinted { diff --git a/apps/client/src/translations/en-GB/translation.json b/apps/client/src/translations/en-GB/translation.json index 0967ef424..4c2ed6bce 100644 --- a/apps/client/src/translations/en-GB/translation.json +++ b/apps/client/src/translations/en-GB/translation.json @@ -1 +1,73 @@ -{} +{ + "import": { + "safeImportTooltip": "Trilium .zip export files can contain executable scripts which may contain harmful behaviour. Safe import will deactivate automatic execution of all imported scripts. Uncheck \"Safe import\" only if the imported archive is supposed to contain executable scripts and you completely trust the contents of the import file.", + "shrinkImagesTooltip": "

If you check this option, Trilium will attempt to shrink the imported images by scaling and optimisation which may affect the perceived image quality. If unchecked, images will be imported without changes.

This doesn't apply to .zip imports with metadata since it is assumed these files are already optimised.

", + "codeImportedAsCode": "Import recognised code files (e.g. .json) as code notes if it's unclear from metadata" + }, + "upload_attachments": { + "tooltip": "If you check this option, Trilium will attempt to shrink the uploaded images by scaling and optimisation which may affect the perceived image quality. If unchecked, images will be uploaded without changes." + }, + "attribute_detail": { + "auto_read_only_disabled": "text/code notes can be set automatically into read mode when they are too large. You can disable this behaviour on per-note basis by adding this label to the note", + "workspace_tab_background_color": "CSS colour used in the note tab when hoisted to this note", + "color": "defines colour of the note in note tree, links etc. Use any valid CSS colour value like 'red' or #a13d5f", + "color_type": "Colour" + }, + "mobile_detail_menu": { + "error_unrecognized_command": "Unrecognised command {{command}}" + }, + "promoted_attributes": { + "remove_color": "Remove the colour label" + }, + "max_content_width": { + "centerContent": "Keep content centred" + }, + "theme": { + "auto_theme": "Legacy (Follow system colour scheme)", + "triliumnext": "Trilium (Follow system colour scheme)" + }, + "search_engine": { + "custom_name_placeholder": "Customise search engine name", + "custom_url_placeholder": "Customise search engine url" + }, + "highlights_list": { + "description": "You can customise the highlights list displayed in the right panel:", + "color": "Coloured text", + "bg_color": "Text with background colour" + }, + "table_of_contents": { + "description": "Table of contents will appear in text notes when the note has more than a defined number of headings. You can customise this number:" + }, + "custom_date_time_format": { + "description": "Customise the format of the date and time inserted via or the toolbar. See Day.js docs for available format tokens." + }, + "i18n": { + "title": "Localisation" + }, + "attachment_detail_2": { + "unrecognized_role": "Unrecognised attachment role '{{role}}'." + }, + "ai_llm": { + "reprocess_index_started": "Search index optimisation started in the background", + "index_rebuilding": "Optimising index ({{percentage}}%)", + "index_rebuild_complete": "Index optimisation complete" + }, + "highlighting": { + "color-scheme": "Colour Scheme" + }, + "code_theme": { + "color-scheme": "Colour scheme" + }, + "call_to_action": { + "background_effects_message": "On Windows devices, background effects are now fully stable. The background effects adds a touch of colour to the user interface by blurring the background behind it. This technique is also used in other applications such as Windows Explorer." + }, + "settings_appearance": { + "related_code_blocks": "Colour scheme for code blocks in text notes", + "related_code_notes": "Colour scheme for code notes" + }, + "note-color": { + "clear-color": "Clear note colour", + "set-color": "Set note colour", + "set-custom-color": "Set custom note colour" + } +} diff --git a/apps/client/src/widgets/collections/calendar/event_builder.ts b/apps/client/src/widgets/collections/calendar/event_builder.ts index 8687dc6d9..2d884f8fe 100644 --- a/apps/client/src/widgets/collections/calendar/event_builder.ts +++ b/apps/client/src/widgets/collections/calendar/event_builder.ts @@ -3,6 +3,7 @@ import froca from "../../../services/froca"; import { formatDateToLocalISO, getCustomisableLabel, getMonthsInDateRange, offsetDate } from "./utils"; import FNote from "../../../entities/fnote"; import server from "../../../services/server"; +import clsx from "clsx"; interface Event { startDate: string, @@ -81,6 +82,7 @@ export async function buildEvent(note: FNote, { startDate, endDate, startTime, e const customTitleAttributeName = note.getLabelValue("calendar:title"); const titles = await parseCustomTitle(customTitleAttributeName, note); const color = note.getLabelValue("calendar:color") ?? note.getLabelValue("color"); + const colorClass = note.getColorClass(); const events: EventInput[] = []; const calendarDisplayedAttributes = note.getLabelValue("calendar:displayedAttributes")?.split(","); @@ -111,7 +113,7 @@ export async function buildEvent(note: FNote, { startDate, endDate, startTime, e color: color ?? undefined, iconClass: note.getLabelValue("iconClass"), promotedAttributes: displayedAttributesData, - className: isArchived ? "archived" : "" + className: clsx({archived: isArchived}, colorClass) }; if (endDate) { eventData.end = endDate; diff --git a/apps/client/src/widgets/collections/calendar/index.css b/apps/client/src/widgets/collections/calendar/index.css index 5dd836fe6..60886f716 100644 --- a/apps/client/src/widgets/collections/calendar/index.css +++ b/apps/client/src/widgets/collections/calendar/index.css @@ -75,4 +75,32 @@ body.desktop:not(.zen) .calendar-view .calendar-header { .search-result-widget-content .calendar-view .calendar-header { padding-inline-end: unset !important; } -/* #endregion */ \ No newline at end of file +/* #endregion */ + +.calendar-view { + --fc-event-text-color: var(--calendar-coll-event-text-color); + --fc-event-bg-color: var(--calendar-coll-event-background-color); +} + +.calendar-view a.fc-timegrid-event, +.calendar-view a.fc-daygrid-event { + border: unset; + border-left: 4px solid; + padding-left: 8px; + font-weight: 500; +} + +.calendar-view a.fc-timegrid-event:hover, +.calendar-view a.fc-daygrid-event:hover { + text-decoration: none; + border-color: var(--fc-event-text-color); + filter: var(--calendar-cell-event-hover-filter); +} + +.fc-timegrid-event.with-hue, .fc-daygrid-event:not(.fc-daygrid-dot-event).with-hue { + --fc-event-text-color: var(--custom-color); + + background: hsl(var(--custom-color-hue), + var(--calendar-coll-event-background-saturation), + var(--calendar-coll-event-background-lightness)) !important; +} \ No newline at end of file diff --git a/docs/README-en_GB.md b/docs/README-en_GB.md index bba139cc9..5c64da0a9 100644 --- a/docs/README-en_GB.md +++ b/docs/README-en_GB.md @@ -279,7 +279,7 @@ described in the "Discuss with us" section above. of the application. * [Sarah Hussein](https://github.com/Sarah-Hussein) for designing the application icon. -* [nriver](https://github.com/nriver) for his work on internationalization. +* [nriver](https://github.com/nriver) for his work on internationalisation. * [Thomas Frei](https://github.com/thfrei) for his original work on the Canvas. * [antoniotejada](https://github.com/nriver) for the original syntax highlight widget.