Merge remote-tracking branch 'origin/main' into react/type_widgets

.github/workflows/checks.yml

@@ -12,7 +12,7 @@ jobs:
     steps:
       - name: Check if PRs have conflicts
         uses: eps1lon/actions-label-merge-conflict@v3
-        if: github.repository == ${{ vars.REPO_MAIN }}
+        if: github.repository == ${{ vars.REPO_MAIN }} && ${{secrets.MERGE_CONFLICT_LABEL_PAT}}
         with:
           dirtyLabel: "merge-conflicts"
           repoToken: "${{ secrets.MERGE_CONFLICT_LABEL_PAT }}"

.github/workflows/codeql.yml

@@ -67,7 +67,7 @@ jobs:
 
     # Initializes the CodeQL tools for scanning.
     - name: Initialize CodeQL
-      uses: github/codeql-action/init@v3
+      uses: github/codeql-action/init@v4
       with:
         languages: ${{ matrix.language }}
         build-mode: ${{ matrix.build-mode }}
@@ -95,6 +95,6 @@ jobs:
         exit 1
 
     - name: Perform CodeQL Analysis
-      uses: github/codeql-action/analyze@v3
+      uses: github/codeql-action/analyze@v4
       with:
         category: "/language:${{matrix.language}}"

.github/workflows/deploy-docs.yml

@@ -55,7 +55,7 @@ jobs:
       - name: Setup Python
         uses: actions/setup-python@v6
         with:
-          python-version: '3.13'
+          python-version: '3.14'
           cache: 'pip'
           cache-dependency-path: 'requirements-docs.txt'
 
@@ -118,6 +118,7 @@ jobs:
 
       - name: Deploy
         uses: ./.github/actions/deploy-to-cloudflare-pages
+        if: github.repository == ${{ vars.REPO_MAIN }} && ${{secrets.CLOUDFLARE_API_TOKEN}}
         with:
           project_name: "trilium-docs"
           comment_body: "📚 Documentation preview is ready"

.github/workflows/nightly.yml

@@ -77,7 +77,7 @@ jobs:
           GPG_SIGNING_KEY: ${{ secrets.GPG_SIGN_KEY }}
 
       - name: Publish release
-        uses: softprops/action-gh-release@v2.3.4
+        uses: softprops/action-gh-release@v2.4.0
         if: ${{ github.event_name != 'pull_request' }}
         with:
           make_latest: false
@@ -118,7 +118,7 @@ jobs:
           arch: ${{ matrix.arch }}
 
       - name: Publish release
-        uses: softprops/action-gh-release@v2.3.4
+        uses: softprops/action-gh-release@v2.4.0
         if: ${{ github.event_name != 'pull_request' }}
         with:
           make_latest: false

.github/workflows/release.yml

@@ -127,7 +127,7 @@ jobs:
           path: upload
 
       - name: Publish stable release
-        uses: softprops/action-gh-release@v2.3.4
+        uses: softprops/action-gh-release@v2.4.0
         with:
           draft: false
           body_path: docs/Release Notes/Release Notes/${{ github.ref_name }}.md

.github/workflows/website.yml

@@ -11,6 +11,9 @@ on:
     paths:
       - "apps/website/**"
 
+  release:
+    types: [ released ]
+
 jobs:
   build-and-deploy:
     runs-on: ubuntu-latest

README.md

@@ -167,7 +167,7 @@ Please view the [documentation guide](https://github.com/TriliumNext/Trilium/blo
 ## 👏 Shoutouts
 
 * [zadam](https://github.com/zadam) for the original concept and implementation of the application.
-* [Larsa](https://github.com/LarsaSara) for designing the application icon.
+* [Sarah Hussein](https://github.com/Sarah-Hussein) for designing the application icon.
 * [nriver](https://github.com/nriver) for his work on internationalization.
 * [Thomas Frei](https://github.com/thfrei) for his original work on the Canvas.
 * [antoniotejada](https://github.com/nriver) for the original syntax highlight widget.

_regroup/package.json

@@ -35,16 +35,16 @@
     "chore:generate-openapi": "tsx bin/generate-openapi.js"
   },
   "devDependencies": {    
-    "@playwright/test": "1.55.1",
+    "@playwright/test": "1.56.0",
     "@stylistic/eslint-plugin": "5.4.0",        
     "@types/express": "5.0.3",    
-    "@types/node": "22.18.8",    
+    "@types/node": "22.18.9",    
     "@types/yargs": "17.0.33",
     "@vitest/coverage-v8": "3.2.4",
     "eslint": "9.37.0",
     "eslint-plugin-simple-import-sort": "12.1.1",
     "esm": "3.2.25",
-    "jsdoc": "4.0.4",
+    "jsdoc": "4.0.5",
     "lorem-ipsum": "2.0.8",    
     "rcedit": "4.0.1",
     "rimraf": "6.0.1",    

apps/client/package.json

@@ -51,9 +51,9 @@
     "leaflet": "1.9.4",
     "leaflet-gpx": "2.2.0",
     "mark.js": "8.11.1",
-    "marked": "16.3.0",
+    "marked": "16.4.0",
     "mermaid": "11.12.0",
-    "mind-elixir": "5.3.1",
+    "mind-elixir": "5.3.2",
     "normalize.css": "8.0.1",
     "panzoom": "9.4.3",
     "preact": "10.27.2",
@@ -73,7 +73,7 @@
     "@types/mark.js": "8.11.12",
     "@types/tabulator-tables": "6.2.11",
     "copy-webpack-plugin": "13.0.1",
-    "happy-dom": "19.0.2",
+    "happy-dom": "20.0.0",
     "script-loader": "0.7.2",
     "vite-plugin-static-copy": "3.1.3"
   }

apps/client/src/desktop.ts

@@ -10,7 +10,6 @@ import { t } from "./services/i18n.js";
 import options from "./services/options.js";
 import type ElectronRemote from "@electron/remote";
 import type Electron from "electron";
-import "bootstrap/dist/css/bootstrap.min.css";
 import "boxicons/css/boxicons.min.css";
 import "autocomplete.js/index_jquery.js";
 

apps/client/src/layouts/mobile_layout.tsx

@@ -40,8 +40,8 @@ kbd {
     border: none;
     cursor: pointer;
     font-size: 1.25em;
-    padding-left: 0.5em;
+    padding-inline-start: 0.5em;
-    padding-right: 0.5em;
+    padding-inline-end: 0.5em;
     color: var(--main-text-color);
 }
 .quick-search {
@@ -59,7 +59,7 @@ const FANCYTREE_CSS = `
     margin-top: 0px;
     overflow-y: auto;
     contain: content;
-    padding-left: 10px;
+    padding-inline-start: 10px;
 }
 
 .fancytree-custom-icon {
@@ -68,7 +68,7 @@ const FANCYTREE_CSS = `
 
 .fancytree-title {
     font-size: 1.5em;
-    margin-left: 0.6em !important;
+    margin-inline-start: 0.6em !important;
 }
 
 .fancytree-node {
@@ -81,7 +81,7 @@ const FANCYTREE_CSS = `
 
 span.fancytree-expander {
     width: 24px !important;
-    margin-right: 5px;
+    margin-inline-end: 5px;
 }
 
 .fancytree-loading span.fancytree-expander {
@@ -101,7 +101,7 @@ span.fancytree-expander {
 .tree-wrapper .scroll-to-active-note-button,
 .tree-wrapper .tree-settings-button {
     position: fixed;
-    margin-right: 16px;
+    margin-inline-end: 16px;
     display: none;
 }
 
@@ -126,8 +126,8 @@ export default class MobileLayout {
                             .class("d-md-flex d-lg-flex d-xl-flex col-12 col-sm-5 col-md-4 col-lg-3 col-xl-3")
                             .id("mobile-sidebar-wrapper")
                             .css("max-height", "100%")
-                            .css("padding-left", "0")
+                            .css("padding-inline-start", "0")
-                            .css("padding-right", "0")
+                            .css("padding-inline-end", "0")
                             .css("contain", "content")
                             .child(new FlexContainer("column").filling().id("mobile-sidebar-wrapper").child(new QuickSearchWidget()).child(new NoteTreeWidget().cssBlock(FANCYTREE_CSS)))
                     )

apps/client/src/login.ts

@@ -1,5 +1,3 @@
-import "bootstrap/dist/css/bootstrap.min.css";
-
 // @ts-ignore - module = undefined
 // Required for correct loading of scripts in Electron
 if (typeof module === 'object') {window.module = module; module = undefined;}

apps/client/src/menus/context_menu.ts

@@ -150,8 +150,8 @@ class ContextMenu {
         this.$widget
             .css({
                 display: "block",
-                top: top,
+                top,
-                left: left
+                left
             })
             .addClass("show");
     }

apps/client/src/mobile.ts

@@ -1,7 +1,6 @@
 import appContext from "./components/app_context.js";
 import noteAutocompleteService from "./services/note_autocomplete.js";
 import glob from "./services/glob.js";
-import "bootstrap/dist/css/bootstrap.min.css";
 import "boxicons/css/boxicons.min.css";
 import "autocomplete.js/index_jquery.js";
 

apps/client/src/runtime.ts

@@ -1,5 +1,15 @@
 import $ from "jquery";
+
+async function loadBootstrap() {
+    if (document.body.dir === "rtl") {
+        await import("bootstrap/dist/css/bootstrap.rtl.min.css");
+    } else {
+        await import("bootstrap/dist/css/bootstrap.min.css");
+    }
+}
+
 (window as any).$ = $;
 (window as any).jQuery = $;
+await loadBootstrap();
 
 $("body").show();

apps/client/src/services/i18n.spec.ts

@@ -6,7 +6,7 @@ import { describe, expect, it } from "vitest";
 describe("i18n", () => {
     it("translations are valid JSON", () => {
         for (const locale of LOCALES) {
-            if (locale.contentOnly) {
+            if (locale.contentOnly || locale.id === "en_rtl") {
                 continue;
             }
 

apps/client/src/services/link.ts

@@ -3,16 +3,7 @@ import linkContextMenuService from "../menus/link_context_menu.js";
 import appContext, { type NoteCommandData } from "../components/app_context.js";
 import froca from "./froca.js";
 import utils from "./utils.js";
-
+import { ALLOWED_PROTOCOLS } from "@triliumnext/commons";
-// Be consistent with `allowedSchemes` in `src\services\html_sanitizer.ts`
-// TODO: Deduplicate with server once we can.
-export const ALLOWED_PROTOCOLS = [
-    'http', 'https', 'ftp', 'ftps', 'mailto', 'data', 'evernote', 'file', 'facetime', 'gemini', 'git',
-    'gopher', 'imap', 'irc', 'irc6', 'jabber', 'jar', 'lastfm', 'ldap', 'ldaps', 'magnet', 'message',
-    'mumble', 'nfs', 'onenote', 'pop', 'rmi', 's3', 'sftp', 'skype', 'sms', 'spotify', 'steam', 'svn', 'udp',
-    'view-source', 'vlc', 'vnc', 'ws', 'wss', 'xmpp', 'jdbc', 'slack', 'tel', 'smb', 'zotero', 'geo',
-    'mid'
-];
 
 function getNotePathFromUrl(url: string) {
     const notePathMatch = /#(root[A-Za-z0-9_/]*)$/.exec(url);

apps/client/src/services/utils.ts

@@ -892,6 +892,18 @@ export function deferred<T>(): DeferredPromise<T> {
     })();
 }
 
+/**
+ * Handles left or right placement of e.g. tooltips in case of right-to-left languages. If the current language is a RTL one, then left and right are swapped. Other directions are unaffected.
+ * @param placement a string optionally containing a "left" or "right" value.
+ * @returns a left/right value swapped if needed, or the same as input otherwise.
+ */
+export function handleRightToLeftPlacement<T extends string>(placement: T) {
+    if (!glob.isRtl) return placement;
+    if (placement === "left") return "right";
+    if (placement === "right") return "left";
+    return placement;
+}
+
 export default {
     reloadFrontendApp,
     restartDesktopApp,

apps/client/src/set_password.ts

@@ -1,4 +1,3 @@
-import "bootstrap/dist/css/bootstrap.min.css";
 import "./stylesheets/auth.css";
 
 // @TriliumNextTODO: is this even needed anymore?

apps/client/src/setup.ts

@@ -1,7 +1,6 @@
 import "jquery";
 import utils from "./services/utils.js";
 import ko from "knockout";
-import "bootstrap/dist/css/bootstrap.min.css";
 
 // TriliumNextTODO: properly make use of below types
 // type SetupModelSetupType = "new-document" | "sync-from-desktop" | "sync-from-server" | "";

apps/client/src/stylesheets/calendar.css

@@ -60,7 +60,7 @@
     appearance: none;
     text-align: center;
     border: 0;
-    border-left: unset;
+    border-inline-start: unset;
     background-color: var(--menu-background-color);
     font-weight: bold;
     outline: 0;
@@ -102,7 +102,7 @@
     content: '';
     position: absolute;
     top: 0;
-    right: 0;
+    inset-inline-end: 0;
     bottom: 0;
     width: 1px;
     background-color: var(--main-border-color);

apps/client/src/stylesheets/llm_chat.css

@@ -299,7 +299,7 @@
     content: '';
     position: absolute;
     top: 0;
-    left: -100%;
+    inset-inline-start: -100%;
     width: 100%;
     height: 100%;
     background: linear-gradient(90deg, transparent, var(--hover-item-background-color, rgba(0, 0, 0, 0.03)), transparent);
@@ -406,10 +406,10 @@
 
 @keyframes shimmer {
     0% {
-        left: -100%;
+        inset-inline-start: -100%;
     }
     100% {
-        left: 100%;
+        inset-inline-start: 100%;
     }
 }
 

apps/client/src/stylesheets/print.css

@@ -218,7 +218,7 @@ span[style] {
         --box-vert-offset: calc((1lh - var(--box-size)) / 2);
 
         display: inline-block;
-        padding-left: calc(var(--box-size) + var(--box-text-gap));
+        padding-inline-start: calc(var(--box-size) + var(--box-text-gap));
         /* Source: https://pictogrammers.com/library/mdi/icon/checkbox-blank-outline/ */
         background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3e%3cpath d='M19%2c3H5C3.89%2c3 3%2c3.89 3%2c5V19A2%2c2 0 0%2c0 5%2c21H19A2%2c2 0 0%2c0 21%2c19V5C21%2c3.89 20.1%2c3 19%2c3M19%2c5V19H5V5H19Z' /%3e%3c/svg%3e");
         background-position: 0 var(--box-vert-offset);
@@ -281,7 +281,7 @@ span[style] {
     position: absolute;
 
     top: 0;
-    left: 0;
+    inset-inline-start: 0;
     width: 100%;
     height: 100%;
 }

apps/client/src/stylesheets/style.css

@@ -174,12 +174,12 @@ textarea,
 /* Add a gap between consecutive radios / check boxes */
 label.tn-radio + label.tn-radio,
 label.tn-checkbox + label.tn-checkbox {
-    margin-left: 12px;
+    margin-inline-start: 12px;
 }
 
 label.tn-radio input[type="radio"],
 label.tn-checkbox input[type="checkbox"] {
-    margin-right: .5em;
+    margin-inline-end: .5em;
 }
 
 #left-pane input,
@@ -226,7 +226,7 @@ samp {
 .badge {
     --bs-badge-color: var(--muted-text-color);
 
-    margin-left: 8px;
+    margin-inline-start: 8px;
     background: var(--accented-background-color);
 }
 
@@ -338,8 +338,8 @@ button kbd {
 }
 
 .ui-menu kbd {
-    margin-left: 30px;
+    margin-inline-start: 30px;
-    float: right;
+    float: inline-end;
 }
 
 .suppressed {
@@ -392,7 +392,7 @@ body.desktop .tabulator-popup-container {
 }
 
 .dropend .dropdown-toggle::after {
-    margin-left: 0.5em;
+    margin-inline-start: 0.5em;
     color: var(--muted-text-color);
 }
 
@@ -403,7 +403,7 @@ body.desktop .tabulator-popup-container {
 
 .dropdown-menu .disabled .disabled-tooltip {
     pointer-events: all;
-    margin-left: 8px;
+    margin-inline-start: 8px;
     font-size: 0.75rem;
     color: var(--disabled-tooltip-icon-color);
     cursor: help;
@@ -443,7 +443,7 @@ body #context-menu-container .dropdown-item > span {
 .dropdown-item span.keyboard-shortcut,
 .dropdown-item *:not(.keyboard-shortcut) > kbd {
     flex-grow: 1;
-    text-align: right;
+    text-align: end;
     padding-inline-start: 12px;
 }
 
@@ -504,7 +504,7 @@ body #context-menu-container .dropdown-item > span {
 
 body .cm-editor .cm-gutters {
     background-color: inherit !important;
-    border-right: none;
+    border-inline-end: none;
 }
 
 body .cm-editor .cm-placeholder {
@@ -586,6 +586,10 @@ button.btn-sm {
     z-index: 1000;
 }
 
+body[dir=rtl] .ck.ck-block-toolbar-button {
+    transform: translateX(-7px);
+}
+
 pre:not(.hljs) {
     color: var(--main-text-color) !important;
     white-space: pre-wrap;
@@ -604,11 +608,11 @@ pre:not(.hljs) {
 pre > button.copy-button {
     position: absolute;
     top: var(--copy-button-margin-size);
-    right: var(--copy-button-margin-size);
+    inset-inline-end: var(--copy-button-margin-size);
 }
 
 :root pre:has(> button.copy-button) {
-    padding-right: calc(var(--copy-button-width) + (var(--copy-button-margin-size) * 2));
+    padding-inline-end: calc(var(--copy-button-width) + (var(--copy-button-margin-size) * 2));
 }
 
 pre > button.copy-button:hover {
@@ -634,31 +638,31 @@ pre > button.copy-button:active {
 .full-text-search-button {
     cursor: pointer;
     font-size: 1.3em;
-    padding-left: 5px;
+    padding-inline-start: 5px;
-    padding-right: 5px;
+    padding-inline-end: 5px;
 }
 
 .input-clearer-button {
     cursor: pointer;
     font-size: 1.3em;
     background: inherit !important;
-    padding-left: 5px;
+    padding-inline-start: 5px;
-    padding-right: 5px;
+    padding-inline-end: 5px;
 }
 
 .open-external-link-button {
     cursor: pointer;
     font-size: 1.3em;
-    padding-left: 5px;
+    padding-inline-start: 5px;
-    padding-right: 5px;
+    padding-inline-end: 5px;
     padding-top: 8px;
 }
 
 .go-to-selected-note-button {
     cursor: pointer;
     font-size: 1.3em;
-    padding-left: 4px;
+    padding-inline-start: 4px;
-    padding-right: 3px;
+    padding-inline-end: 3px;
 }
 
 .go-to-selected-note-button.disabled,
@@ -671,7 +675,7 @@ pre > button.copy-button:active {
 
 .note-autocomplete-input {
     /* this is for seamless integration of "input clearer" button */
-    border-right: 0;
+    border-inline-end: 0;
 }
 
 table.promoted-attributes-in-tooltip {
@@ -704,10 +708,10 @@ table.promoted-attributes-in-tooltip th {
     border-top-color: var(--main-border-color) !important;
 }
 .bs-tooltip-left .tooltip-arrow::before {
-    border-left-color: var(--main-border-color) !important;
+    border-inline-start-color: var(--main-border-color) !important;
 }
 .bs-tooltip-right .tooltip-arrow::before {
-    border-right-color: var(--main-border-color) !important;
+    border-inline-end-color: var(--main-border-color) !important;
 }
 
 .bs-tooltip-bottom .tooltip-arrow::after {
@@ -717,17 +721,17 @@ table.promoted-attributes-in-tooltip th {
     border-top-color: var(--tooltip-background-color) !important;
 }
 .bs-tooltip-left .tooltip-arrow::after {
-    border-left-color: var(--tooltip-background-color) !important;
+    border-inline-start-color: var(--tooltip-background-color) !important;
 }
 .bs-tooltip-right .tooltip-arrow::after {
-    border-right-color: var(--tooltip-background-color) !important;
+    border-inline-end-color: var(--tooltip-background-color) !important;
 }
 
 .bs-tooltip-auto[data-popper-placement^="left"] .tooltip-arrow::before,
 .bs-tooltip-left .tooltip-arrow::before {
-    left: -1px;
+    inset-inline-start: -1px;
     border-width: 0.4rem 0 0.4rem 0.4rem;
-    border-left-color: var(--main-border-color) !important;
+    border-inline-start-color: var(--main-border-color) !important;
 }
 
 .bs-tooltip-auto[data-popper-placement^="bottom"] .tooltip-arrow::before,
@@ -739,9 +743,9 @@ table.promoted-attributes-in-tooltip th {
 
 .bs-tooltip-auto[data-popper-placement^="right"] .tooltip-arrow::before,
 .bs-tooltip-right .tooltip-arrow::before {
-    right: -1px;
+    inset-inline-end: -1px;
     border-width: 0.4rem 0.4rem 0.4rem 0;
-    border-right-color: var(--main-border-color) !important;
+    border-inline-end-color: var(--main-border-color) !important;
 }
 
 .bs-tooltip-auto[data-popper-placement^="top"] .tooltip-arrow::before,
@@ -753,9 +757,9 @@ table.promoted-attributes-in-tooltip th {
 
 .bs-tooltip-auto[data-popper-placement^="left"] .tooltip-arrow::after,
 .bs-tooltip-left .tooltip-arrow::after {
-    left: -1px;
+    inset-inline-start: -1px;
     border-width: 0.4rem 0 0.4rem 0.4rem;
-    border-left-color: var(--tooltip-background-color) !important;
+    border-inline-start-color: var(--tooltip-background-color) !important;
 }
 
 .bs-tooltip-auto[data-popper-placement^="bottom"] .tooltip-arrow::after,
@@ -767,9 +771,9 @@ table.promoted-attributes-in-tooltip th {
 
 .bs-tooltip-auto[data-popper-placement^="right"] .tooltip-arrow::after,
 .bs-tooltip-right .tooltip-arrow::after {
-    right: -1px;
+    inset-inline-end: -1px;
     border-width: 0.4rem 0.4rem 0.4rem 0;
-    border-right-color: var(--tooltip-background-color) !important;
+    border-inline-end-color: var(--tooltip-background-color) !important;
 }
 
 .bs-tooltip-auto[data-popper-placement^="top"] .tooltip-arrow::after,
@@ -788,7 +792,7 @@ table.promoted-attributes-in-tooltip th {
     background-color: var(--tooltip-background-color) !important;
     border: 1px solid var(--main-border-color);
     border-radius: 5px;
-    text-align: left;
+    text-align: start;
     color: var(--main-text-color) !important;
     max-width: 500px;
     box-shadow: 10px 10px 93px -25px #aaaaaa;
@@ -821,7 +825,7 @@ table.promoted-attributes-in-tooltip th {
 
 .note-tooltip-content .open-popup-button {
     position: absolute;
-    right: 15px;
+    inset-inline-end: 15px;
     bottom: 8px;
     font-size: 1.2em;
     color: inherit;
@@ -841,7 +845,7 @@ table.promoted-attributes-in-tooltip th {
 }
 
 .tooltip-inner figure.image-style-side {
-    float: right;
+    float: inline-end;
 }
 
 .tooltip.show {
@@ -890,7 +894,7 @@ table.promoted-attributes-in-tooltip th {
 .aa-dropdown-menu .aa-suggestion .text {
     display: inline-block;
     width: calc(100% - 20px);
-    padding-left: 4px;
+    padding-inline-start: 4px;
 }
 
 .aa-dropdown-menu .aa-suggestion .search-result-title {
@@ -916,7 +920,7 @@ table.promoted-attributes-in-tooltip th {
 }
 
 .help-button {
-    float: right;
+    float: inline-end;
     background: none;
     font-weight: 900;
     color: orange;
@@ -1033,7 +1037,7 @@ svg.ck-icon .note-icon {
     counter-increment: footnote-counter;
     display: flex;
     list-style: none;
-    margin-left: 0.5em;
+    margin-inline-start: 0.5em;
 }
 
 .ck-content .footnote-item > * {
@@ -1041,13 +1045,13 @@ svg.ck-icon .note-icon {
 }
 
 .ck-content .footnote-back-link {
-    margin-right: 0.1em;
+    margin-inline-end: 0.1em;
     position: relative;
     top: -0.2em;
 }
 
 .ck-content .footnotes .footnote-back-link > sup {
-    margin-right: 0;
+    margin-inline-end: 0;
 }
 
 .ck-content .footnote-item:before {
@@ -1055,8 +1059,8 @@ svg.ck-icon .note-icon {
     display: inline-block;
     min-width: fit-content;
     position: relative;
-    right: 0.2em;
+    inset-inline-end: 0.2em;
-    text-align: right;
+    text-align: end;
 }
 
 .ck-content .footnote-content {
@@ -1072,11 +1076,11 @@ svg.ck-icon .note-icon {
 }
 
 #options-dialog input[type="number"] {
-    text-align: right;
+    text-align: end;
 }
 
 .help-cards ul {
-    padding-left: 20px;
+    padding-inline-start: 20px;
 }
 
 .help-cards kbd {
@@ -1153,8 +1157,8 @@ a.external:not(.no-arrow):after, a[href^="http://"]:not(.no-arrow):after, a[href
 }
 
 .toast.no-title .toast-body {
-    padding-left: 0;
+    padding-inline-start: 0;
-    padding-right: 0;
+    padding-inline-end: 0;
 }
 
 .toast.no-title .toast-header {
@@ -1274,8 +1278,8 @@ a.external:not(.no-arrow):after, a[href^="http://"]:not(.no-arrow):after, a[href
 #context-menu-cover.show {
     position: fixed;
     top: 0;
-    left: 0;
+    inset-inline-start: 0;
-    right: 0;
+    inset-inline-end: 0;
     bottom: 0;
     z-index: 1000;
     background: rgba(0, 0, 0, 0.1);
@@ -1288,8 +1292,8 @@ a.external:not(.no-arrow):after, a[href^="http://"]:not(.no-arrow):after, a[href
 
 body.mobile #context-menu-container.mobile-bottom-menu {
     position: fixed !important;
-    left: 0 !important;
+    inset-inline-start: 0 !important;
-    right: 0 !important;
+    inset-inline-end: 0 !important;
     bottom: 0 !important;
     top: unset !important;
     max-height: 70vh;
@@ -1339,7 +1343,7 @@ body.desktop li.dropdown-submenu:hover > ul.dropdown-menu {
 
 .dropdown-submenu > .dropdown-menu {
     top: 0;
-    left: calc(100% - 2px); /* -2px, otherwise there's a small gap between menu and submenu where the hover can disappear */
+    inset-inline-start: calc(100% - 2px); /* -2px, otherwise there's a small gap between menu and submenu where the hover can disappear */
     margin-top: -10px;
     min-width: 15rem;
     /* to make submenu scrollable https://github.com/zadam/trilium/issues/3136 */
@@ -1348,7 +1352,7 @@ body.desktop li.dropdown-submenu:hover > ul.dropdown-menu {
 }
 
 body:not(.mobile) #launcher-pane.horizontal .dropdown-submenu > .dropdown-menu {
-    left: calc(-100% + 10px);
+    inset-inline-start: calc(-100% + 10px);
 }
 
 .right-dropdown-widget {
@@ -1414,7 +1418,7 @@ body:not(.mobile) #launcher-pane.horizontal .dropdown-submenu > .dropdown-menu {
 
 .ck.ck-slash-command-button__text-part,
 .ck.ck-template-form__text-part {
-    margin-left: 0.5em;
+    margin-inline-start: 0.5em;
     line-height: 1.2em !important;
 }
 
@@ -1445,8 +1449,8 @@ body:not(.mobile) #launcher-pane.horizontal .dropdown-submenu > .dropdown-menu {
 }
 
 .area-expander-text {
-    padding-left: 20px;
+    padding-inline-start: 20px;
-    padding-right: 20px;
+    padding-inline-end: 20px;
     white-space: nowrap;
 }
 
@@ -1492,7 +1496,7 @@ body:not(.mobile) #launcher-pane.horizontal .dropdown-submenu > .dropdown-menu {
     cursor: pointer;
     border: none;
     color: var(--launcher-pane-text-color);
-    background: transparent;
+    background-color: transparent;
     flex-shrink: 0;
 }
 
@@ -1533,16 +1537,16 @@ body:not(.mobile) #launcher-pane.horizontal .dropdown-submenu > .dropdown-menu {
         position: fixed !important;
         bottom: calc(var(--mobile-bottom-offset) + var(--launcher-pane-size)) !important;
         top: unset !important;
-        left: 0 !important;
+        inset-inline-start: 0 !important;
-        right: 0 !important;
+        inset-inline-end: 0 !important;
         transform: unset !important;
     }
 
     #mobile-sidebar-container {
         position: fixed;
         top: 0;
-        left: 0;
+        inset-inline-start: 0;
-        right: 0;
+        inset-inline-end: 0;
         bottom: 0;
         z-index: 1000;
         transition: background-color 250ms ease-in-out;
@@ -1557,7 +1561,7 @@ body:not(.mobile) #launcher-pane.horizontal .dropdown-submenu > .dropdown-menu {
     #mobile-sidebar-wrapper {
         position: absolute;
         top: 0;
-        left: 0;
+        inset-inline-start: 0;
         bottom: 0;
         width: 85vw;
         padding-top: env(safe-area-inset-top);
@@ -1589,8 +1593,8 @@ body:not(.mobile) #launcher-pane.horizontal .dropdown-submenu > .dropdown-menu {
     body.mobile .modal-dialog {
         position: fixed;
         bottom: 0;
-        left: 0;
+        inset-inline-start: 0;
-        right: 0;
+        inset-inline-end: 0;
         margin: 0 !important;
         max-height: 85vh;        
         display: flex;
@@ -1748,8 +1752,8 @@ body:not(.mobile) #launcher-pane.horizontal .dropdown-submenu > .dropdown-menu {
     display: flex;
     flex-shrink: 0;
     flex-direction: column;
-    margin-left: 10px;
+    margin-inline-start: 10px;
-    margin-right: 5px;
+    margin-inline-end: 5px;
 }
 
 #right-pane .card-header {
@@ -1789,7 +1793,7 @@ body:not(.mobile) #launcher-pane.horizontal .dropdown-submenu > .dropdown-menu {
 }
 
 #right-pane .card-body ul {
-    padding-left: 25px;
+    padding-inline-start: 25px;
     margin-bottom: 5px;
 }
 
@@ -1800,8 +1804,8 @@ body:not(.mobile) #launcher-pane.horizontal .dropdown-submenu > .dropdown-menu {
 }
 
 .note-split {
-    margin-left: auto;
+    margin-inline-start: auto;
-    margin-right: auto;
+    margin-inline-end: auto;
 }
 
 .note-split.full-content-width {
@@ -1820,7 +1824,7 @@ button.close:hover {
 .reference-link .bx {
     position: relative;
     top: 1px;
-    margin-right: 3px;
+    margin-inline-end: 3px;
 }
 
 .options-section:first-of-type h4 {
@@ -1858,7 +1862,7 @@ textarea {
 
 .attachment-help-button {
     display: inline-block;
-    margin-left: 10px;
+    margin-inline-start: 10px;
     vertical-align: middle;
     font-size: 1em;
 }
@@ -1966,7 +1970,7 @@ textarea {
 }
 
 body.electron.platform-darwin:not(.native-titlebar) .tab-row-container {
-    padding-left: 1em;
+    padding-inline-start: 1em;
 }
 
 #tab-row-left-spacer {
@@ -1975,7 +1979,7 @@ body.electron.platform-darwin:not(.native-titlebar) .tab-row-container {
 }
 
 .tab-row-widget {
-    padding-right: calc(100vw - env(titlebar-area-width, 100vw));
+    padding-inline-end: calc(100vw - env(titlebar-area-width, 100vw));
 }
 
 .tab-row-container .toggle-button {
@@ -2038,7 +2042,7 @@ body.zen .split-note-container-widget > .gutter {
 body.zen #launcher-pane {
     position: absolute !important;
     top: 0 !important;
-    right: 0 !important;
+    inset-inline-end: 0 !important;
     width: 64px !important;
     height: 64px !important;
     background: transparent !important;
@@ -2049,8 +2053,8 @@ body.zen .title-row {
     display: block !important;
     height: unset !important;
     -webkit-app-region: drag;
-    padding-left: env(titlebar-area-x);
+    padding-inline-start: env(titlebar-area-x);
-    padding-right: calc(100vw - env(titlebar-area-width, 100vw) + 2.5em);
+    padding-inline-end: calc(100vw - env(titlebar-area-width, 100vw) + 2.5em);
 }
 
 body.zen .floating-buttons {
@@ -2058,7 +2062,7 @@ body.zen .floating-buttons {
 }
 
 body.zen .floating-buttons-children {
-    right: 0;
+    inset-inline-end: 0;
 }
 
 body.zen .floating-buttons-children .button-widget {
@@ -2217,7 +2221,7 @@ footer.webview-footer button {
 .chat-input {
     width: 100%;
     resize: none;
-    padding-right: 40px;
+    padding-inline-end: 40px;
 }
 
 .chat-buttons {
@@ -2280,7 +2284,7 @@ footer.webview-footer button {
     padding: 1em;
     margin: 1.25em 0;
     position: relative;
-    padding-left: 2.5em;
+    padding-inline-start: 2.5em;
     overflow: hidden;
 }
 
@@ -2293,7 +2297,7 @@ footer.webview-footer button {
     font-family: boxicons !important;
     position: absolute;
     top: 1em;
-    left: 1em;
+    inset-inline-start: 1em;
 }
 
 .admonition.note { --accent-color: var(--admonition-note-accent-color); }
@@ -2319,18 +2323,18 @@ footer.webview-footer button {
     display: flex;
     align-items: center;
     font-size: 0.9em;
-    margin-right: 15px;
+    margin-inline-end: 15px;
     cursor: pointer;
 }
 
 .chat-option input[type="checkbox"] {
-    margin-right: 5px;
+    margin-inline-end: 5px;
 }
 
 /* Style for thinking process in chat responses */
 .thinking-process {
     background-color: rgba(0, 0, 0, 0.05);
-    border-left: 3px solid var(--main-text-color);
+    border-inline-start: 3px solid var(--main-text-color);
     padding: 10px;
     margin: 10px 0;
     border-radius: 4px;
@@ -2338,23 +2342,23 @@ footer.webview-footer button {
 
 .thinking-step {
     margin-bottom: 8px;
-    padding-left: 10px;
+    padding-inline-start: 10px;
 }
 
 .thinking-step.observation {
-    border-left: 2px solid #69c7ff;
+    border-inline-start: 2px solid #69c7ff;
 }
 
 .thinking-step.hypothesis {
-    border-left: 2px solid #9839f7;
+    border-inline-start: 2px solid #9839f7;
 }
 
 .thinking-step.evidence {
-    border-left: 2px solid #40c025;
+    border-inline-start: 2px solid #40c025;
 }
 
 .thinking-step.conclusion {
-    border-left: 2px solid #e2aa03;
+    border-inline-start: 2px solid #e2aa03;
     font-weight: bold;
 }
 
@@ -2369,17 +2373,17 @@ footer.webview-footer button {
 
 .content-floating-buttons.top-left {
     top: 10px;
-    left: 10px;
+    inset-inline-start: 10px;
 }
 
 .content-floating-buttons.bottom-left {
     bottom: 10px;
-    left: 10px;
+    inset-inline-start: 10px;
 }
 
 .content-floating-buttons.bottom-right {
     bottom: 10px;
-    right: 10px;
+    inset-inline-end: 10px;
 }
 
 .content-floating-buttons button.bx {

apps/client/src/stylesheets/table.css

@@ -67,13 +67,13 @@
 }
 
 .tabulator div.tabulator-header .tabulator-frozen.tabulator-frozen-left {
-    margin-left: var(--cell-editing-border-width);
+    margin-inline-start: var(--cell-editing-border-width);
 }
 
 .tabulator div.tabulator-header .tabulator-col,
 .tabulator div.tabulator-header .tabulator-frozen.tabulator-frozen-left {
     background: var(--col-header-background-color);
-    border-right: var(--col-header-separator-border);
+    border-inline-end: var(--col-header-separator-border);
 }
 
 /* Table body */
@@ -90,8 +90,8 @@
 }
 
 .tabulator-row .tabulator-cell input {
-    padding-left: var(--cell-horiz-padding-size) !important;
+    padding-inline-start: var(--cell-horiz-padding-size) !important;
-    padding-right: var(--cell-horiz-padding-size) !important;
+    padding-inline-end: var(--cell-horiz-padding-size) !important;
 }
 
 .tabulator-row {
@@ -117,12 +117,12 @@
 /* Cell */
 
 .tabulator-row .tabulator-cell.tabulator-frozen.tabulator-frozen-left {
-    margin-right: var(--cell-editing-border-width);
+    margin-inline-end: var(--cell-editing-border-width);
 }
 
 .tabulator-row .tabulator-cell.tabulator-frozen.tabulator-frozen-left,
 .tabulator-row .tabulator-cell {
-    border-right-color: transparent;
+    border-inline-end-color: transparent;
 }
 
 .tabulator-row .tabulator-cell:not(.tabulator-editable) {
@@ -156,14 +156,14 @@
 /* Align items without children/expander to the ones with. */
 .tabulator-cell[tabulator-field="title"] > span:first-child,         /* 1st level */
 .tabulator-cell[tabulator-field="title"] > div:first-child + span {  /* sub-level */
-    padding-left: 21px;
+    padding-inline-start: 21px;
 }
 
 /* Checkbox cells */
 
 .tabulator .tabulator-cell:has(svg),
 .tabulator .tabulator-cell:has(input[type="checkbox"]) {
-    padding-left: 8px;
+    padding-inline-start: 8px;
     display: inline-flex;
     flex-direction: column;
     justify-content: center;

apps/client/src/stylesheets/theme-next/base.css

@@ -120,8 +120,8 @@ body.desktop .dropdown-menu::before,
     border-radius: var(--dropdown-border-radius);
     position: absolute;
     top: 0;
-    left: 0;
+    inset-inline-start: 0;
-    right: 0;
+    inset-inline-end: 0;
     bottom: 0;
     z-index: -1;
 }
@@ -211,7 +211,7 @@ html body .dropdown-item[disabled] {
 
 .dropdown-item span.keyboard-shortcut {
     color: var(--menu-item-keyboard-shortcut-color) !important;
-    margin-left: 16px;
+    margin-inline-start: 16px;
 }
 
 .dropdown-divider {
@@ -224,8 +224,8 @@ html body .dropdown-item[disabled] {
     position: absolute;
     content: "";
     top: -1px;
-    left: calc(0px - var(--menu-padding-size));
+    inset-inline-start: calc(0px - var(--menu-padding-size));
-    right: calc(0px - var(--menu-padding-size));
+    inset-inline-end: calc(0px - var(--menu-padding-size));
     border-top: 1px solid var(--menu-item-delimiter-color);
 }
 
@@ -237,7 +237,7 @@ html body .dropdown-item[disabled] {
     align-items: center;
     justify-content: center;
     top: 0;
-    right: 0;
+    inset-inline-end: 0;
     margin: unset !important;
     border: unset !important;
     padding: 0 4px;
@@ -246,6 +246,10 @@ html body .dropdown-item[disabled] {
     color: var(--menu-item-arrow-color) !important;
 }
 
+body[dir=rtl] .dropdown-menu:not([data-popper-placement="bottom-start"]) .dropdown-toggle::after {
+    content: "\ea4d" !important;
+}
+
 /* Menu item group heading */
 
 /* The heading body */
@@ -264,8 +268,8 @@ html body .dropdown-item[disabled] {
     content: "";
     position: absolute;
     bottom: 8px;
-    left: calc(0px - var(--menu-padding-size));
+    inset-inline-start: calc(0px - var(--menu-padding-size));
-    right: calc(0px - var(--menu-padding-size));
+    inset-inline-end: calc(0px - var(--menu-padding-size));
     border-top: 1px solid var(--menu-item-delimiter-color);
 }
 
@@ -357,13 +361,13 @@ li.dropdown-item a.dropdown-item-button:focus-visible {
 }
 
 #toast-container .toast:not(.no-title) .bx {
-    margin-right: 0.5em;
+    margin-inline-end: 0.5em;
     font-size: 1.1em;
     opacity: 0.85;
 }
 
 #toast-container .toast.no-title .bx {
-    margin-right: 0;
+    margin-inline-end: 0;
     font-size: 1.3em;
 }
 

apps/client/src/stylesheets/theme-next/dialogs.css

@@ -29,7 +29,7 @@
     display: flex;
     justify-content: center;
     align-items: center;
-    margin-left: 8px;
+    margin-inline-start: 8px;
     border: 0;
     border-radius: 50%;
     padding: 0;
@@ -56,7 +56,7 @@
 }
 
 .modal .modal-header .help-button {
-    margin-right: 0;
+    margin-inline-end: 0;
     font-size: calc(var(--modal-control-button-size) * .75);
     font-family: unset;
     font-weight: bold;
@@ -141,7 +141,7 @@ div.tn-tool-dialog {
 
 /* Search box wrapper */
 .jump-to-note-dialog .input-group {
-    margin-right: 16px;
+    margin-inline-end: 16px;
 }
 
 .jump-to-note-dialog .input-group:hover {
@@ -197,8 +197,8 @@ div.tn-tool-dialog {
     border: unset;
     padding-top: var(--timeline-item-top-padding);
     padding-bottom: var(--timeline-item-bottom-padding);
-    padding-left: calc(var(--timeline-left-gap) + var(--timeline-right-gap));
+    padding-inline-start: calc(var(--timeline-left-gap) + var(--timeline-right-gap));
-    padding-right: var(--timeline-left-gap);
+    padding-inline-end: var(--timeline-left-gap);
     color: var(--active-item-text-color);
 }
 
@@ -259,7 +259,7 @@ div.tn-tool-dialog {
     position: absolute;
     content: "";
     top: var(--connector-top, 0);
-    left: calc(var(--timeline-left-gap) + ((var(--timeline-bullet-size) - var(--timeline-connector-size)) / 2));
+    inset-inline-start: calc(var(--timeline-left-gap) + ((var(--timeline-bullet-size) - var(--timeline-connector-size)) / 2));
     bottom: var(--connector-bottom, 0);
     width: var(--timeline-connector-size);
     border-radius: var(--connector-radius, 0) var(--connector-radius, 0) 0 0;
@@ -291,7 +291,7 @@ div.tn-tool-dialog {
     position: absolute;
     content: "";
     top: calc(var(--timeline-item-top-padding) + var(--timeline-bullet-vertical-pos));
-    left: var(--timeline-left-gap);
+    inset-inline-start: var(--timeline-left-gap);
     width: var(--timeline-bullet-size);
     height: var(--timeline-bullet-size);
     border-radius: 50%;
@@ -374,7 +374,7 @@ div.tn-tool-dialog {
 }
 
 .help-dialog .help-cards kbd:first-child {
-    margin-left: 0;
+    margin-inline-start: 0;
 }
 
 /* Inline code - used for Markdown samples */
@@ -392,7 +392,7 @@ div.tn-tool-dialog {
 }
 
 .delete-notes-list .note-path {
-    padding-left: 8px;
+    padding-inline-end: 8px;
 }
 
 /*
@@ -401,7 +401,7 @@ div.tn-tool-dialog {
 
 /* Labels */
 .attr-edit-table th {
-    padding-right: 12px;
+    padding-inline-end: 12px;
     font-weight: normal;
     white-space: nowrap;
 }
@@ -419,5 +419,5 @@ div.tn-tool-dialog {
 }
 
 .note-type-chooser-dialog div.note-type-dropdown .dropdown-item span.bx {
-    margin-right: .25em;
+    margin-inline-end: .25em;
 }

apps/client/src/stylesheets/theme-next/forms.css

@@ -62,7 +62,7 @@ button.btn.btn-secondary span.bx,
 button.btn.btn-sm span.bx,
 button.btn.btn-success span.bx {
     color: var(--cmd-button-icon-color);
-    padding-right: 0.35em;
+    padding-inline-end: 0.35em;
     font-size: 1.2em;
 }
 
@@ -71,7 +71,7 @@ button.btn.btn-primary kbd,
 button.btn.btn-secondary kbd,
 button.btn.btn-sm kbd,
 button.btn.btn-success kbd {
-    margin-left: 0.5em;
+    margin-inline-start: 0.5em;
     background: var(--cmd-button-keyboard-shortcut-background);
     color: var(--cmd-button-keyboard-shortcut-color);
     font-size: 0.6em;
@@ -102,7 +102,7 @@ button.btn.btn-success kbd {
 }
 
 .btn-group .tn-tool-button + .tn-tool-button {
-    margin-left: 4px !important;
+    margin-inline-start: 4px !important;
 }
 
 /* The "x" icon button */
@@ -237,7 +237,7 @@ input::selection,
     outline-offset: 6px;
     background: var(--input-background-color);
     border-radius: 6px;
-    padding-right: 8px;
+    padding-inline-end: 8px;
     color: var(--quick-search-color);
     flex-wrap: nowrap;
 }
@@ -357,13 +357,20 @@ select.form-control,
 
     outline: 3px solid transparent;
     outline-offset: 6px;
-    padding-right: calc(15px + 1.5rem);
+    padding-inline-end: calc(15px + 1.5rem);
-    background: var(--input-background-color) var(--dropdown-arrow);
+    background: var(--input-background-color) var(--dropdown-arrow);;
     color: var(--input-text-color);
     border: unset;
     border-radius: 0.375rem;
 }
 
+body[dir=rtl] select,
+body[dir=rtl] select.form-select,
+body[dir=rtl] select.form-control,
+body[dir=rtl] .select-button.dropdown-toggle.btn {
+    background-position: left 0.75rem center;
+}
+
 select:hover,
 select.form-select:hover,
 select.form-control:hover,
@@ -444,7 +451,7 @@ optgroup {
     content: "\eae1";
     width: 2em;
     height: 100%;
-    right: 0;
+    inset-inline-end: 0;
     top: 0;
     font-size: 1.2em;
     font-family: boxicons;
@@ -462,7 +469,7 @@ optgroup {
         --box-label-gap: 0.5em;
 
         position: relative;
-        padding-left: calc(var(--box-size) + var(--box-label-gap)) !important;
+        padding-inline-start: calc(var(--box-size) + var(--box-label-gap)) !important;
         user-select: none;
     }
 
@@ -471,7 +478,7 @@ optgroup {
     label.tn-checkbox > input[type="checkbox"] {
         position: absolute;
         top: 0;
-        left: 0;
+        inset-inline-start: 0;
         width: var(--box-size);
         height: 100%;
         margin: unset;
@@ -485,7 +492,7 @@ optgroup {
         content: "";
         position: absolute;
         top: 50%;
-        left: 0;
+        inset-inline-start: 0;
         translate: 0 -50%;
         width: var(--box-size);
         height: var(--box-size);

apps/client/src/stylesheets/theme-next/llm-chat.css

@@ -19,11 +19,11 @@
 }
 
 .chat-message.user-message {
-    margin-left: auto;
+    margin-inline-start: auto;
 }
 
 .chat-message.assistant-message {
-    margin-right: auto;
+    margin-inline-end: auto;
 }
 
 .message-avatar {
@@ -33,7 +33,7 @@
     display: flex;
     align-items: center;
     justify-content: center;
-    margin-right: 8px;
+    margin-inline-end: 8px;
 }
 
 .user-message .message-avatar {

apps/client/src/stylesheets/theme-next/notes/text.css

@@ -117,9 +117,9 @@
     content: "";
     position: absolute;
     top: var(--negative-padding);
-    right: var(--negative-padding);
+    inset-inline-end: var(--negative-padding);
     bottom: var(--negative-padding);
-    left: var(--negative-padding);
+    inset-inline-start: var(--negative-padding);
     border-radius: var(--dropdown-border-radius);
     backdrop-filter: var(--dropdown-backdrop-filter);
     z-index: -1;
@@ -210,7 +210,7 @@
 /* Separator */
 :root .ck .ck-list__separator {
     margin: .5em 0;
-    margin-left: calc(0px - var(--ck-editor-popup-padding));
+    margin-inline-start: calc(0px - var(--ck-editor-popup-padding));
     width: calc(100% + (var(--ck-editor-popup-padding) * 2));
     background: var(--menu-item-delimiter-color);
 }
@@ -233,8 +233,8 @@
     position: absolute;
     top: 0;
     bottom: var(--negative-padding);
-    left: var(--negative-padding);
+    inset-inline-start: var(--negative-padding);
-    right: var(--negative-padding);
+    inset-inline-end: var(--negative-padding);
     border-top: 1px solid var(--ck-editor-popup-border-color);
     background: var(--menu-section-background-color);
 }
@@ -255,7 +255,7 @@
 
 :root .ck.ck-toolbar .ck.ck-toolbar__separator {
     background: transparent;
-    border-left: 1px solid var(--ck-color-toolbar-border);
+    border-inline-start: 1px solid var(--ck-color-toolbar-border);
 }
 
 /* The last separator of the toolbar */
@@ -354,7 +354,7 @@
     align-items: center;
     width: 100%;
     margin: 4px;
-    padding-right: 2em;
+    padding-inline-end: 2em;
     border: 1px solid var(--accent);
     border-radius: 6px;
 }
@@ -492,7 +492,7 @@ button.ck.ck-button:is(.ck-button-action, .ck-button-save, .ck-button-cancel).ck
     /* Move the label above the text box regardless of the text box state */
     transform: translate(0, calc(-.2em - var(--ck-input-label-height))) !important;
     
-    padding-left: 0 !important;
+    padding-inline-start: 0 !important;
     background: transparent;
     font-size: .85em;
     font-weight: 600;
@@ -556,7 +556,7 @@ pre button.copy-button.icon-action {
 }
 
 :root pre:has(> button.copy-button) {
-    padding-right: calc(var(--icon-button-size) + (var(--copy-button-margin-size) * 2));
+    padding-inline-end: calc(var(--icon-button-size) + (var(--copy-button-margin-size) * 2));
 }
 
 html .note-detail-editable-text :not(figure, .include-note, hr):first-child {
@@ -615,12 +615,12 @@ html .note-detail-editable-text :not(figure, .include-note, hr):first-child {
 
 .ck-content blockquote:before {
     content: "“";
-    left: 0.2em;
+    inset-inline-start: 0.2em;
 }
 
 .ck-content blockquote:after {
     content: "”";
-    right: 0.35em;
+    inset-inline-end: 0.35em;
 }
 
 .ck-content h2,

apps/client/src/stylesheets/theme-next/pages.css

@@ -52,7 +52,7 @@
     background-color: #f5f5f5;
 }
 .google-login-btn img {
-    margin-right: 10px;
+    margin-inline-end: 10px;
     width: 18px;
     height: 18px;
 }
@@ -199,7 +199,7 @@ body.desktop .option-section:not(.tn-no-card) {
     color: var(--launcher-pane-text-color);
     margin-top: calc(-1 * var(--options-card-padding) - var(--options-title-font-size) - var(--options-title-offset)) !important;
     margin-bottom: calc(var(--options-title-offset) + var(--options-card-padding)) !important;
-    margin-left: calc(-1 * var(--options-card-padding));
+    margin-inline-start: calc(-1 * var(--options-card-padding));
 }
 
 .options-section:not(.tn-no-card) h5 {
@@ -216,8 +216,8 @@ body.desktop .option-section:not(.tn-no-card) {
 .options-section hr {
     --bs-border-width: 2px;
 
-    margin-left: calc(var(--options-card-padding) * -1);
+    margin-inline-start: calc(var(--options-card-padding) * -1);
-    margin-right: calc(var(--options-card-padding) * -1);
+    margin-inline-end: calc(var(--options-card-padding) * -1);
     opacity: 1;
     color: var(--root-background);
 }

apps/client/src/stylesheets/theme-next/ribbon.css

@@ -95,7 +95,7 @@ div.promoted-attributes-container {
 /* Note type dropdown */
 
 ul.note-type-dropdown .check {
-    margin-right: 6px;
+    margin-inline-end: 6px;
 }
 
 ul.note-type-dropdown li.dropdown-item {
@@ -105,7 +105,7 @@ ul.note-type-dropdown li.dropdown-item {
 /* Editability dropdown */
 
 ul.editability-dropdown li.dropdown-item > div {
-    margin-left: 4px;
+    margin-inline-start: 4px;
 }
 
 .editability-dropdown .dropdown-item .description {
@@ -142,12 +142,12 @@ ul.editability-dropdown li.dropdown-item > div {
 }
 
 .attribute-list .save-attributes-button {
-    right: 30px;
+    inset-inline-end: 30px;
 }
 
 /* Note path in attribute detail dialog */
 .attr-detail .note-path {
-    margin-left: 8px;
+    margin-inline-start: 8px;
 }
 
 /*

apps/client/src/stylesheets/theme-next/shell.css

@@ -69,7 +69,7 @@ body.background-effects.platform-win32.layout-vertical #vertical-main-container
 
 /* Add a border to the vertical launch bar if collapsed. */
 body.layout-vertical #horizontal-main-container.left-pane-hidden #launcher-pane.vertical {
-    border-right: 2px solid var(--left-pane-collapsed-border-color);
+    border-inline-end: 2px solid var(--left-pane-collapsed-border-color);
 }
 
 body.background-effects.zen #root-widget {
@@ -284,7 +284,7 @@ body.layout-horizontal > .horizontal {
 }
 
 #launcher-pane.horizontal .global-menu-button .global-menu-button-update-available {
-    right: -23px;
+    inset-inline-end: -23px;
     bottom: -22px;
     transform: scale(0.85);
 }
@@ -400,9 +400,9 @@ body.layout-horizontal > .horizontal {
     content: "";
     position: absolute;
     top: var(--vertical-margin);
-    right: var(--horiz-margin);
+    inset-inline-end: var(--horiz-margin);
     bottom: var(--vertical-margin);
-    left: var(--horiz-margin);
+    inset-inline-start: var(--horiz-margin);
     border-radius: 6px;
     background: var(--calendar-day-highlight-background);
     z-index: -1;
@@ -450,7 +450,7 @@ div.bookmark-folder-widget .note-link:hover {
 }
 
 div.bookmark-folder-widget .note-link a {
-    padding-left: 8px;
+    padding-inline-start: 8px;
     color: var(--menu-text-color);
     cursor: default;
 }
@@ -471,8 +471,8 @@ div.bookmark-folder-widget .note-link .bx {
 
 div.quick-search {
     --padding-top: 8px;
-    --padding-left: 8px;
+    --padding-inline-start: 8px;
-    --padding-right: 8px;
+    --padding-inline-end: 8px;
     --padding-bottom: 8px;
 
     position: relative;
@@ -480,7 +480,7 @@ div.quick-search {
     align-items: center;
     height: unset;
     contain: unset;
-    padding: var(--padding-top) var(--padding-right) var(--padding-bottom) var(--padding-left);
+    padding: var(--padding-top) var(--padding-inline-end) var(--padding-bottom) var(--padding-inline-start);
 }
 
 div.quick-search,
@@ -496,9 +496,9 @@ div.quick-search::before {
     position: absolute;
     content: "";
     top: var(--padding-top);
-    left: var(--padding-left);
+    inset-inline-start: var(--padding-inline-start);
     bottom: var(--padding-bottom);
-    right: var(--padding-right);
+    inset-inline-end: var(--padding-inline-end);
     z-index: 0;
     border: 2px solid transparent;
     border-radius: 6px;
@@ -520,7 +520,7 @@ div.quick-search:focus-within:before {
 }
 
 div.quick-search input {
-    padding-left: 15px !important;
+    padding-inline-start: 15px !important;
     box-shadow: unset !important;
     background: transparent !important;
 }
@@ -539,7 +539,7 @@ div.quick-search .search-button {
     justify-content: center;
     width: 25px;
     height: 25px;
-    margin-right: 8px;
+    margin-inline-end: 8px;
     border-radius: 50%;
     padding: 0;
     color: var(--quick-search-color) !important;
@@ -631,12 +631,12 @@ body.layout-vertical.background-effects div.quick-search .dropdown-menu {
 }
 
 #left-pane .ui-fancytree ul {
-    padding-left: 10px;
+    padding-inline-start: 10px;
 }
 
 /* The root element of the tree */
 #left-pane .fancytree-container > li:first-child > span {
-    padding-left: 12px;
+    padding-inline-start: 12px;
 }
 
 #left-pane span.fancytree-node.fancytree-active {
@@ -658,9 +658,9 @@ body.layout-vertical.background-effects div.quick-search .dropdown-menu {
     position: absolute;
     content: "";
     top: var(--left-pane-item-selected-shadow-size);
-    left: var(--left-pane-item-selected-shadow-size);
+    inset-inline-start: var(--left-pane-item-selected-shadow-size);
     bottom: var(--left-pane-item-selected-shadow-size);
-    right: var(--left-pane-item-selected-shadow-size);
+    inset-inline-end: var(--left-pane-item-selected-shadow-size);
     background: var(--left-pane-item-selected-background) !important;
     box-shadow: var(--left-pane-item-selected-shadow);
     border-radius: 6px;
@@ -676,7 +676,7 @@ body.layout-vertical.background-effects div.quick-search .dropdown-menu {
 #left-pane span.fancytree-node.protected > span.fancytree-custom-icon:after {
     position: absolute;
     bottom: 0;
-    right: 0;
+    inset-inline-end: 0;
     font-size: 14px;
     content: "\eb4a";
     font-family: "boxicons";
@@ -685,6 +685,10 @@ body.layout-vertical.background-effects div.quick-search .dropdown-menu {
     border-radius: 50%;
 }
 
+body[dir=rtl] #left-pane span.fancytree-node.protected > span.fancytree-custom-icon:after {
+    transform: translateX(-25%);
+}
+
 body.mobile .fancytree-expander::before,
 body.mobile .fancytree-title,
 body.mobile .fancytree-node > span {
@@ -699,7 +703,7 @@ body.mobile .fancytree-node > span {
     body.mobile:not(.force-fixed-tree) #mobile-sidebar-wrapper {
         border-top-right-radius: 12px;
         border-bottom-right-radius: 12px;
-        border-right: 1px solid var(--subtle-border-color);
+        border-inline-end: 1px solid var(--subtle-border-color);
     }
 }
 
@@ -734,7 +738,7 @@ body.mobile .fancytree-node > span {
 }
 
 #left-pane .tree-item-button {
-    margin-right: 6px;
+    margin-inline-end: 6px;
     border: unset;
     border-radius: 50%;
     background: var(--left-pane-item-action-button-background);
@@ -768,12 +772,12 @@ body.mobile .fancytree-node > span {
 /* Toolbar container (collapsed state) */
 #left-pane .tree-actions {
     max-width: var(--tree-actions-toolbar-collapsed-width);
-    right: var(--tree-actions-toolbar-horizontal-margin);
+    inset-inline-end: var(--tree-actions-toolbar-horizontal-margin);
     bottom: var(--tree-actions-toolbar-vertical-margin);
     overflow: hidden;
     border: 1px solid transparent;
     padding: var(--tree-actions-toolbar-padding-size);
-    padding-right: var(--tree-actions-toolbar-collapsed-width);
+    padding-inline-end: var(--tree-actions-toolbar-collapsed-width);
     background: transparent;
     transition:
         max-width 400ms ease-out,
@@ -817,7 +821,7 @@ body.mobile .fancytree-node > span {
     justify-content: center;
     align-items: center;
     top: 50%;
-    right: calc((var(--tree-actions-toolbar-collapsed-width) - var(--tree-actions-toolbar-expand-button-size)) / 2);
+    inset-inline-end: calc((var(--tree-actions-toolbar-collapsed-width) - var(--tree-actions-toolbar-expand-button-size)) / 2);
     width: var(--tree-actions-toolbar-expand-button-size);
     height: var(--tree-actions-toolbar-expand-button-size);
     box-shadow: 2px 2px 6px var(--left-pane-background-color);
@@ -906,8 +910,8 @@ body.electron.background-effects.layout-horizontal .tab-row-container .toggle-bu
     content: "";
     position: absolute;
     bottom: 0;
-    left: -10px;
+    inset-inline-start: -10px;
-    right: -10px;
+    inset-inline-end: -10px;
     top: 32px;
     height: 1px;
     border-bottom: 1px solid var(--launcher-pane-horiz-border-color);
@@ -918,13 +922,13 @@ body.electron.background-effects.layout-horizontal .tab-row-container .tab-scrol
     position: relative;
 }
 
-body.electron.background-effects.layout-horizontal .tab-row-container .tab-scroll-button-left:after,
+body.electron.background-effects.layout-horizontal .tab-row-container .tab-scroll-button-inset-inline-start:after,
-body.electron.background-effects.layout-horizontal .tab-row-container .tab-scroll-button-right:after {
+body.electron.background-effects.layout-horizontal .tab-row-container .tab-scroll-button-inset-inline-end:after {
     content: "";
     position: absolute;
     bottom: 0;
-    left: 0px;
+    inset-inline-start: 0px;
-    right: 0px;
+    inset-inline-end: 0px;
     height: 1px;
     border-bottom: 1px solid var(--launcher-pane-horiz-border-color);
 }
@@ -933,9 +937,9 @@ body.electron.background-effects.layout-horizontal .tab-row-container .note-tab[
     content: "";
     position: absolute;
     bottom: 0;
-    left: -32768px;
+    inset-inline-start: -32768px;
     top: var(--tab-height);
-    right: calc(100% - 1px);
+    inset-inline-end: calc(100% - 1px);
     height: 1px;
     border-bottom: 1px solid var(--launcher-pane-horiz-border-color);
 }
@@ -944,9 +948,9 @@ body.electron.background-effects.layout-horizontal .tab-row-container .note-tab[
     content: "";
     position: absolute;
     bottom: 0;
-    left: 100%;
+    inset-inline-start: 100%;
     top: var(--tab-height);
-    right: 0;
+    inset-inline-end: 0;
     width: 100vw;
     height: 1px;
     border-bottom: 1px solid var(--launcher-pane-horiz-border-color);
@@ -956,9 +960,9 @@ body.electron.background-effects.layout-horizontal .tab-row-container .note-new-
     content: "";
     position: absolute;
     bottom: 0;
-    left: -4px;
+    inset-inline-start: -4px;
     top: calc(var(--tab-height), -1);
-    right: 0;
+    inset-inline-end: 0;
     width: 100vw;
     height: 1px;
     border-bottom: 1px solid var(--launcher-pane-horiz-border-color);
@@ -1045,18 +1049,18 @@ body.layout-horizontal .tab-row-widget .note-tab .note-tab-wrapper {
     content: "";
     position: absolute;
     top: 0;
-    left: 0;
+    inset-inline-start: 0;
-    right: 0;
+    inset-inline-end: 0;
     height: 3px;
     background-color: var(--workspace-tab-background-color);
 }
 
-.tab-row-widget .note-tab:nth-child(1) {
+body:not([dir=rtl]) .tab-row-widget .note-tab:nth-child(1) {
     transform: translate3d(var(--tab-first-item-horiz-offset), 0, 0);
 }
 
 :root .tab-row-widget .note-tab .note-tab-icon {
-    padding-right: 5px; /* The gap between the icon and the title */
+    padding-inline-end: 5px; /* The gap between the icon and the title */
 }
 
 .tab-row-widget .note-tab[active] .note-tab-icon {
@@ -1101,7 +1105,7 @@ body.layout-vertical .tab-row-widget-is-sorting .note-tab.note-tab-is-dragging .
 
 .tab-row-widget .note-new-tab {
     position: relative;
-    margin-left: 3px;
+    margin-inline-start: 3px;
     color: transparent; /* Prevent the original "+" from being displayed */
 }
 
@@ -1114,7 +1118,7 @@ body.layout-vertical .tab-row-widget-is-sorting .note-tab.note-tab-is-dragging .
     position: absolute;
     content: "";
     top: calc((var(--tab-height) - var(--new-tab-button-size)) / 2);
-    left: calc((var(--tab-height) - var(--new-tab-button-size)) / 2);
+    inset-inline-start: calc((var(--tab-height) - var(--new-tab-button-size)) / 2);
     width: var(--new-tab-button-size);
     height: var(--new-tab-button-size);
     background: var(--new-tab-button-background);
@@ -1139,7 +1143,7 @@ body.layout-vertical .tab-row-widget-is-sorting .note-tab.note-tab-is-dragging .
     display: flex;
     position: absolute;
     content: "\ebc0";
-    left: 0;
+    inset-inline-start: 0;
     top: 0;
     width: 100%;
     height: 100%;
@@ -1221,23 +1225,23 @@ body.mobile .note-title {
 }
 
 .title-row > *:first-child {
-    margin-right: 0;
+    margin-inline-end: 0;
 }
 
 .title-row > *:nth-child(2) {
-    margin-left: 0;
+    margin-inline-start: 0;
 }
 
 .title-row {
     /* Aligns the "Create new split" button with the note menu button (the three dots button) */
-    padding-right: 3px;
+    padding-inline-end: 3px;
 }
 
 .note-title-widget input {
     --input-background-color: transparent;
 
     border-radius: 8px;
-    padding-left: 12px;
+    padding-inline-start: 12px;
 }
 
 /* The "Change note icon" button */
@@ -1312,7 +1316,7 @@ body.mobile .note-title {
 /* The promoted attributes section */
 div.promoted-attributes-container {
     display: flex;
-    margin-right: 10%;
+    margin-inline-end: 10%;
     padding: 6px 0;
     gap: 8px;
     align-items: stretch;
@@ -1326,8 +1330,8 @@ div.promoted-attributes-container input {
 
 /* A promoted attribute card */
 div.promoted-attribute-cell {
-    --pa-card-padding-left: 16px;
+    --pa-card-padding-inline-start: 16px;
-    --pa-card-padding-right: 2px;
+    --pa-card-padding-inline-end: 2px;
     --input-background-color: transparent;
 
     box-shadow: 1px 1px 2px var(--promoted-attribute-card-shadow-color);
@@ -1335,7 +1339,7 @@ div.promoted-attribute-cell {
     display: inline-flex;
     margin: 0;
     border-radius: 8px;
-    padding: 2px var(--pa-card-padding-right) 2px var(--pa-card-padding-left);
+    padding: 2px var(--pa-card-padding-inline-end) 2px var(--pa-card-padding-inline-start);
     background: var(--promoted-attribute-card-background-color);
     overflow-y: visible;
 }
@@ -1350,7 +1354,7 @@ div.promoted-attribute-cell {
 /* A promoted attribute card (boolean attribute) */
 div.promoted-attribute-cell:has(input[type="checkbox"]):not(:has(.multiplicity > span)) {
     /* Checbox attribute, without multiplicity */
-    padding-right: var(--pa-card-padding-left);
+    padding-inline-end: var(--pa-card-padding-inline-start);
 }
 
 div.promoted-attribute-cell > * {
@@ -1400,15 +1404,15 @@ div.promoted-attribute-cell .tn-checkbox {
 /* Relocate the checkbox before the label */
 div.promoted-attribute-cell.promoted-attribute-label-boolean > div:first-of-type {
     order: -1;
-    margin-right: 1.5em;
+    margin-inline-end: 1.5em;
 }
 
 /* The element containing the "new attribute" and "remove this attribute button" */
 div.promoted-attribute-cell .multiplicity:has(span) {
     --icon-button-size: 24px;
 
-    margin-left: 8px;
+    margin-inline-start: 8px;
-    margin-right: calc(var(--pa-card-padding-left) - var(--pa-card-padding-right));
+    margin-inline-end: calc(var(--pa-card-padding-inline-start) - var(--pa-card-padding-inline-end));
     font-size: 0; /* Prevent whitespaces creating a gap between buttons */
     display: flex;
 }
@@ -1436,6 +1440,10 @@ div#center-pane .floating-buttons-children {
                 opacity 250ms ease-out;
 }
 
+body[dir=rtl] div#center-pane .floating-buttons-children {
+    transform-origin: left;
+}
+
  /* Floating buttons container (collapsed) */
  div#center-pane .floating-buttons-children.temporarily-hidden {
     display: flex !important;
@@ -1547,7 +1555,7 @@ div.floating-buttons-children .close-floating-buttons {
 }
 
 div.floating-buttons-children .close-floating-buttons {
-    margin-left: 0 !important;
+    margin-inline-start: 0 !important;
     background: var(--floating-button-hide-button-background);
     color: var(--floating-button-hide-button-color);
 }
@@ -1637,12 +1645,12 @@ div.find-replace-widget div.find-widget-found-wrapper > span {
 }
 
 .find-replace-widget .form-check {
-    padding-left: 0;
+    padding-inline-start: 0;
     white-space: nowrap;
 }
 
 .find-replace-widget .form-check .form-check-input {
-    margin-left: 0;
+    margin-inline-start: 0;
 }
 
 /* Narrow version */
@@ -1662,13 +1670,13 @@ div.find-replace-widget div.find-widget-found-wrapper > span {
 
     .find-widget-box,
     .replace-widget-box {
-        padding-right: 3em !important;
+        padding-inline-end: 3em !important;
     }
 
     .find-widget-close-button {
         position: absolute;
         top: .85em;
-        right: .5em;
+        inset-inline-end: .5em;
     }
 
     .find-widget-box > * {
@@ -1700,7 +1708,7 @@ div.find-replace-widget div.find-widget-found-wrapper > span {
     }
 
     .replace-widget-box > * {
-        margin-right: unset !important;
+        margin-inline-end: unset !important;
     }
 
     div.replace-widget-box button.btn.btn-sm {
@@ -1743,7 +1751,7 @@ div.find-replace-widget div.find-widget-found-wrapper > span {
 #right-pane .toc li,
 #right-pane .highlights-list li {
     padding-top: 2px;
-    padding-right: 8px;
+    padding-inline-end: 8px;
     padding-bottom: 2px;
     border-radius: 4px;
     text-align: unset;
@@ -1806,8 +1814,8 @@ div.find-replace-widget div.find-widget-found-wrapper > span {
 }
 
 .excalidraw .dropdown-menu .dropdown-menu-container > div:not([class]):not(:last-child) {
-    margin-left: calc(var(--padding) * var(--space-factor) * -1) !important;
+    margin-inline-start: calc(var(--padding) * var(--space-factor) * -1) !important;
-    margin-right: calc(var(--padding) * var(--space-factor) * -1) !important;
+    margin-inline-end: calc(var(--padding) * var(--space-factor) * -1) !important;
 }
 
 .excalidraw .dropdown-menu:before {

apps/client/src/stylesheets/tree.css

@@ -1,5 +1,5 @@
 ul.fancytree-container {
-    padding-left: 0;
+    padding-inline-start: 0;
 }
 
 ul.fancytree-container li {
@@ -15,7 +15,7 @@ span.fancytree-node.fancytree-hide {
     flex-shrink: 1;
     flex-grow: 1;
     overflow: hidden;
-    margin-left: 7px;
+    margin-inline-start: 7px;
     outline: none;
     position: relative;
     top: 2px;
@@ -59,7 +59,11 @@ span.fancytree-node.fancytree-hide {
     line-height: 1;
     position: relative;
     top: 2px;
-    margin-right: 5px;
+    margin-inline-end: 5px;
+}
+
+body[dir=rtl] .fancytree-node:not(.fancytree-loading):not(.fancytree-expanded) .fancytree-expander:before {
+    content: "\ea4d";   /* bx bx-chevron-left */
 }
 
 .fancytree-loading span.fancytree-expander {
@@ -80,7 +84,7 @@ span.fancytree-node.fancytree-hide {
     width: 12px;
     height: 12px;
     margin-top: 2px;
-    margin-left: 1px;
+    margin-inline-start: 1px;
     border-width: 1px;
     border-style: solid;
 }
@@ -169,11 +173,11 @@ span.fancytree-node.fancytree-active-clone:not(.fancytree-active) .fancytree-tit
 
 /* first nesting level has lower left padding to avoid extra left padding. Other levels are not affected */
 .ui-fancytree > li > ul {
-    padding-left: 5px;
+    padding-inline-start: 5px;
 }
 
 .ui-fancytree ul {
-    padding-left: 20px;
+    padding-inline-start: 20px;
 }
 
 span.fancytree-active {
@@ -229,14 +233,14 @@ span.fancytree-node.archived {
     display: none;
     font-size: 120%;
     cursor: pointer;
-    margin-left: 8px;
+    margin-inline-start: 8px;
     padding: 1px;
     border: 1px solid transparent;
     border-radius: 5px;
 }
 
 .unhoist-button.bx.tree-item-button {
-    margin-left: 0; /* unhoist button is on the left and doesn't need more margin */
+    margin-inline-start: 0; /* unhoist button is on the left and doesn't need more margin */
     display: block; /* keep always visible */
 }
 

apps/client/src/translations/ar/translation.json

@@ -1,5 +1,968 @@
 {
   "about": {
-    "title": "حول تريليوم للملاحظات"
+    "title": "حول تريليوم للملاحظات",
+    "homepage": "الصفحة الرئيسية:",
+    "app_version": "اصدار التطبيق:",
+    "sync_version": "اصدار المزامنه:",
+    "build_date": "تاريخ الانشاء:",
+    "build_revision": "مراجعة الاصدار:",
+    "data_directory": "مجلد البيانات:",
+    "db_version": "اصدار قاعدة البيانات:"
+  },
+  "toast": {
+    "critical-error": {
+      "title": "خطأ فادح"
+    }
+  },
+  "add_link": {
+    "add_link": "أضافة رابط",
+    "note": "ملاحظة",
+    "search_note": "البحث عن الملاحظة بالاسم",
+    "link_title": "عنوان الرابط",
+    "button_add_link": "اضافة رابط"
+  },
+  "branch_prefix": {
+    "edit_branch_prefix": "تعديل بادئة الفرع",
+    "prefix": "البادئة: ",
+    "save": "حفظ"
+  },
+  "bulk_actions": {
+    "bulk_actions": "اجراءات جماعية",
+    "available_actions": "الاجراءات المتاحة",
+    "chosen_actions": "الأجراءات المختارة",
+    "execute_bulk_actions": "تنفيذ الأجراءات الجماعية",
+    "bulk_actions_executed": "تم تنفيذ الاجراءات الجماعية بنجاح،",
+    "none_yet": "لايوجد أجراء بعد... اضف اجراء بالنقر على احد الأجراءات المتاحة اعلاه.",
+    "relations": "العلاقات",
+    "notes": "الملاحظات",
+    "other": "أخرى",
+    "affected_notes": "الملاحظات المتأثرة",
+    "labels": "التسميات"
+  },
+  "upload_attachments": {
+    "options": "خيارات",
+    "upload": "تحميل",
+    "choose_files": "اختر الملفات",
+    "shrink_images": "تصغير الصور"
+  },
+  "attribute_detail": {
+    "name": "الاسم",
+    "value": "قيمة",
+    "promoted": "تمت ترقيته",
+    "promoted_alias": "اسم مستعار",
+    "label_type": "نوع",
+    "text": "نص",
+    "date": "تاريخ",
+    "time": "وقت",
+    "precision": "دفة",
+    "digits": "رقم",
+    "delete": "حذف",
+    "color_type": "لون",
+    "multiplicity": "تعددية",
+    "number": "عدد",
+    "boolean": "منطقي",
+    "url": "عنوان الويب",
+    "inheritable": "قابل للوراثة",
+    "target_note": "الملاحظة الهدف",
+    "single_value": "قيمة واحدة",
+    "multi_value": "قيم متعددة",
+    "inverse_relation": "العلاقة العكسية",
+    "more_notes": "مزيد من الملاحظات",
+    "label": "تفاصيل التسمية",
+    "relation": "تفاصيل العلاقة"
+  },
+  "rename_label": {
+    "to": "الى",
+    "old_name_placeholder": "الاسم القديم",
+    "new_name_placeholder": "الاسم الجديد",
+    "rename_label": "اعادة تسمية التسمية"
+  },
+  "move_note": {
+    "to": "الى",
+    "move_note": "نقل الملاحظة"
+  },
+  "add_relation": {
+    "to": "الى",
+    "add_relation": "اضافة علاقة",
+    "relation_name": "اسم العلاقة",
+    "target_note": "الملاحظة الهدف"
+  },
+  "rename_relation": {
+    "to": "الى",
+    "rename_relation": "اعادة تسمية العلاقة",
+    "old_name": "الاسم القديم",
+    "new_name": "الاسم الجديد"
+  },
+  "update_relation_target": {
+    "to": "الى",
+    "update_relation": "تحديث العلاقة",
+    "relation_name": "اسم العلاقة",
+    "target_note": "الملاحظة الهدف"
+  },
+  "attachments_actions": {
+    "download": "تنزيل",
+    "open_externally": "فتح خارجي",
+    "open_custom": "فتح مخصص",
+    "rename_attachment": "اعادة تسمية المرفق",
+    "delete_attachment": "حذف المرفق"
+  },
+  "calendar": {
+    "week": "أسبوع",
+    "month": "شهر",
+    "year": "سنة",
+    "list": "قائمة",
+    "today": "اليوم",
+    "mon": "الاثنين",
+    "tue": "الثلاثاء",
+    "wed": "الأربعاء",
+    "thu": "الخميس",
+    "fri": "الجمعة",
+    "sat": "السبت",
+    "sun": "الاحد",
+    "january": "يناير",
+    "march": "مارس",
+    "april": "ابريل",
+    "may": "مايو",
+    "june": "يونيو",
+    "july": "يوليو",
+    "august": "أغسطس",
+    "september": "سبتمبر",
+    "october": "اكتوبر",
+    "november": "نوفمبر",
+    "december": "ديسمبر",
+    "february": "فبراير",
+    "week_previous": "الاسبوع السابق",
+    "week_next": "الاسبوع التالي",
+    "month_previous": "الشهر السابق",
+    "month_next": "الشهر التالي",
+    "year_previous": "السنة السابقة",
+    "year_next": "السنة التالية"
+  },
+  "global_menu": {
+    "menu": "القائمة",
+    "options": "خيارات",
+    "advanced": "متقدمة",
+    "logout": "تسجيل خروج",
+    "zoom": "تكبير/تصغير",
+    "toggle_fullscreen": "تشغيل/ايقاف ملء الشاشة",
+    "zoom_out": "تصغير",
+    "zoom_in": "تكبير",
+    "configure_launchbar": "اعداد شريط الاطلاق",
+    "reload_frontend": "اعادة تحميل الواجهة",
+    "show_help": "عرض المساعدة",
+    "show-cheatsheet": "عرض دليل الاختصارات",
+    "toggle-zen-mode": "وضع التركيز"
+  },
+  "zpetne_odkazy": {
+    "relation": "العلاقة"
+  },
+  "note_icon": {
+    "category": "الفئة:",
+    "search": "بحث:"
+  },
+  "basic_properties": {
+    "language": "اللغة",
+    "editable": "قابل للتعديل",
+    "note_type": "نوع الملاحظة",
+    "basic_properties": "الخصائص الاساسية"
+  },
+  "book_properties": {
+    "list": "قائمة",
+    "expand": "توسيع",
+    "calendar": "التقويم",
+    "table": "جدول",
+    "board": "لوحة",
+    "grid": "خطوط شبكة",
+    "collapse": "طي",
+    "view_type": "نوع العرض",
+    "book_properties": "خصائص المجموعة",
+    "geo-map": "الخريطة الجغرافية"
+  },
+  "file_properties": {
+    "download": "تنزيل",
+    "open": "فتح",
+    "title": "ملف",
+    "note_id": "معرف الملاحظة",
+    "file_type": "نوع الملف",
+    "file_size": "حجم الملف"
+  },
+  "image_properties": {
+    "download": "تنزيل",
+    "open": "فتح",
+    "title": "صورة",
+    "file_type": "نوع الملف",
+    "file_size": "حجم الملف"
+  },
+  "note_info_widget": {
+    "created": "انشاء",
+    "type": "نوع",
+    "modified": "معدل",
+    "calculate": "حساب",
+    "note_id": "معرف الملاحظة",
+    "note_size": "حجم الملاحظة",
+    "title": "معلومات الملاحظة"
+  },
+  "note_paths": {
+    "search": "بحث",
+    "archived": "مؤرشف",
+    "title": "مسارات الملاحظة"
+  },
+  "script_executor": {
+    "query": "استعلام",
+    "script": "برنامج نصي",
+    "execute_query": "تنفيذ الاستعلام",
+    "execute_script": "تنفيذ السكربت"
+  },
+  "search_definition": {
+    "ancestor": "السلف",
+    "limit": "الحد الاقصى",
+    "action": "أجراء",
+    "search_button": "بحث",
+    "debug": "تصحيح الاخطاء",
+    "search_string": "سلسة البحث",
+    "search_script": "نص البحث",
+    "fast_search": "بحث سريع",
+    "include_archived": "تضمين العناصر المؤرشفة",
+    "order_by": "ترتيب حسب",
+    "search_parameters": "معايير البحث"
+  },
+  "ancestor": {
+    "label": "السلف",
+    "depth_label": "العمق",
+    "depth_doesnt_matter": "لايهم",
+    "direct_children": "العقد الفرعية المباشرة"
+  },
+  "limit": {
+    "limit": "الحد الاقصى"
+  },
+  "debug": {
+    "debug": "تصحيح الاخطاء"
+  },
+  "order_by": {
+    "title": "عنوان",
+    "desc": "تنازلي",
+    "order_by": "ترتيب حسب",
+    "relevancy": "الاهمية (افتراضيا)",
+    "date_created": "تاريخ الانشاء",
+    "random": "ترتيب عشوائي",
+    "asc": "تصاعدي (افتراضيا)"
+  },
+  "search_string": {
+    "search_prefix": "بحث:",
+    "title_column": "سلسلة البحث:",
+    "search_syntax": "صياغة البحث",
+    "also_see": "انظر ايضا"
+  },
+  "sync": {
+    "title": "مزامنة"
+  },
+  "fonts": {
+    "fonts": "خطوط",
+    "size": "حجم",
+    "serif": "خط ومزخرف",
+    "monospace": "خط بعرض ثابت",
+    "theme_defined": "النسق المحدد",
+    "main_font": "الخط الرئيسي",
+    "font_family": "عائلة الخطوط",
+    "reload_frontend": "اعادة تحميل الواجهة",
+    "generic-fonts": "الخطوط العامة",
+    "sans-serif": "خطوط بدون زوائد",
+    "system-default": "الاعداد الافتراضي للنظام"
+  },
+  "confirm": {
+    "confirmation": "تأكيد",
+    "cancel": "الغاء",
+    "ok": "نعم"
+  },
+  "delete_notes": {
+    "close": "غلق",
+    "cancel": "الغاء",
+    "ok": "نعم"
+  },
+  "export": {
+    "close": "غلق",
+    "export": "تصدير",
+    "export_note_title": "تصدير الملاحظة",
+    "export_status": "حالة التصدير"
+  },
+  "help": {
+    "troubleshooting": "أستكشاف الاخطاء واصلاحها",
+    "other": "أخرى",
+    "title": "ورقة المراجعة السريعة",
+    "noteNavigation": "التنقل بين الملاحظات",
+    "collapseExpand": "طي/توسيع العقدة",
+    "notSet": "غير محدد",
+    "collapseSubTree": "طي الشجرة الفرعية",
+    "tabShortcuts": "أختصارات التبويب",
+    "creatingNotes": "انشاء الملاحظات",
+    "selectNote": "تحديد الملاحظة",
+    "editingNotes": "تحرير الملاحظات",
+    "inPageSearch": "البحث داخل الصفحة",
+    "markdownAutoformat": "التنسيق التلقائي باسلوب Markdown"
+  },
+  "import": {
+    "options": "خيارات",
+    "import": "استيراد",
+    "safeImport": "أستيراد آمن",
+    "shrinkImages": "تقليل حجم الصور",
+    "import-status": "حالة الاستبراد"
+  },
+  "include_note": {
+    "label_note": "ملاحظة",
+    "dialog_title": "تضمين ملاحظة",
+    "button_include": "تضمين ملاحظة"
+  },
+  "info": {
+    "closeButton": "أغلاق",
+    "okButton": "نعم",
+    "modalTitle": "رسالة معلومات"
+  },
+  "markdown_import": {
+    "import_button": "أستيراد",
+    "dialog_title": "استيراد Markdown"
+  },
+  "note_type_chooser": {
+    "templates": "قوالب",
+    "builtin_templates": "القوالب المدمجة"
+  },
+  "prompt": {
+    "title": "ترقية",
+    "ok": "نعم",
+    "defaultTitle": "ترقية"
+  },
+  "protected_session_password": {
+    "close_label": "أغلاق",
+    "modal_title": "جلسة محمية"
+  },
+  "revisions": {
+    "delete_button": "حذف",
+    "download_button": "تنزيل",
+    "restore_button": "أستعادة",
+    "preview": "معاينة:",
+    "note_revisions": "مراجعات الملاحظة",
+    "diff_on": "عرض الفروقات",
+    "diff_off": "عرض المحتوى",
+    "file_size": "حجم الملف:",
+    "mime": "MIME: "
+  },
+  "sort_child_notes": {
+    "title": "عنوان",
+    "ascending": "تصاعدي",
+    "descending": "تنازلي",
+    "folders": "مجلدات",
+    "sort": "ترتيب",
+    "sorting_criteria": "معايير الترتيب",
+    "date_created": "تاريخ الانشاء",
+    "date_modified": "تاريخ التعديل",
+    "sorting_direction": "اتجاه الترتيب",
+    "natural_sort": "الترتيب الطبيعي"
+  },
+  "recent_changes": {
+    "undelete_link": "الغاء الحذف",
+    "title": "التغيرات الاخيرة"
+  },
+  "edited_notes": {
+    "deleted": "(حذف)",
+    "title": "الملاحظات المعدلة"
+  },
+  "note_properties": {
+    "info": "معلومات"
+  },
+  "backend_log": {
+    "refresh": "تحديث"
+  },
+  "max_content_width": {
+    "max_width_unit": "بكسل",
+    "title": "عرض المحتوى",
+    "reload_button": "اعادة تحميل الواجهة"
+  },
+  "native_title_bar": {
+    "enabled": "مفعل",
+    "disabled": "معطل"
+  },
+  "theme": {
+    "theme_label": "السمة",
+    "layout": "تخطيط",
+    "layout-vertical-title": "عمودي",
+    "layout-horizontal-title": "أفقي",
+    "title": "نسق التطبيق",
+    "light_theme": "النسق القديم (فاتح)",
+    "dark_theme": "النسق القديم (داكن)",
+    "triliumnext-light": "تريليوم (فاتح)",
+    "triliumnext-dark": "تريليوم ( داكن)"
+  },
+  "ui-performance": {
+    "title": "أداء",
+    "enable-shadows": "تفعيل الضلال"
+  },
+  "ai_llm": {
+    "progress": "تقدم",
+    "openai_tab": "OpenAI",
+    "actions": "أجراءات",
+    "retry": "أعد المحاولة",
+    "reprocessing_index": "جار اعادة البناء...",
+    "never": "ابدٱ",
+    "agent": {
+      "processing": "جار المعالجة...",
+      "thinking": "جار التفكير...",
+      "loading": "جار التحميل...",
+      "generating": "جار الانشاء..."
+    },
+    "name": "الذكاء الأصطناعي",
+    "openai": "OpenAI",
+    "sources": "مصادر",
+    "temperature": "درجة الحرارة",
+    "model": "نموذج",
+    "refreshing_models": "جار التحديث...",
+    "error": "خطأ",
+    "refreshing": "جار التحديث...",
+    "ollama_tab": "Ollama",
+    "anthropic_tab": "انتروبيك",
+    "not_started": "لم يبدأ بعد",
+    "title": "اعدادات AI",
+    "processed_notes": "الملاحظات المعالجة",
+    "total_notes": "الملاحظات الكلية",
+    "queued_notes": "الملاحظات في قائمة الانتظار",
+    "failed_notes": "الملاحظات الفاشلة",
+    "last_processed": "اخر معالجة",
+    "refresh_stats": "تحديث الاحصائيات",
+    "voyage_tab": "استكشاف AI",
+    "provider_precedence": "اولوية المزود",
+    "system_prompt": "موجه النظام",
+    "openai_configuration": "اعدادات OpenAI",
+    "openai_settings": "اعدادات OpenAI",
+    "api_key": "مفتاح واجهة برمجة التطبيقات",
+    "url": "عنوان URL الاساسي",
+    "default_model": "النموذج الافتراضي",
+    "base_url": "عنوان URL الأساسي",
+    "openai_url_description": "افتراضيا: https://api.openai.com/v1",
+    "anthropic_settings": "اعدادات انتروبيك",
+    "ollama_settings": "اعدادات Ollama",
+    "anthropic_configuration": "تهيئة انتروبيك",
+    "voyage_url_description": "افتراضيا: https://api.voyageai.com/v1",
+    "ollama_configuration": "تهيئة Ollama",
+    "enable_ollama": "تمكين Ollama",
+    "last_attempt": "اخر محاولة",
+    "active_providers": "المزودون النشطون",
+    "disabled_providers": "المزودون المعطلون",
+    "similarity_threshold": "عتبة التشابه",
+    "complete": "اكتمل (100%)",
+    "ai_settings": "اعدادات AI",
+    "show_thinking": "عرض التفكير",
+    "index_status": "حالة الفهرس",
+    "indexed_notes": "الملاحظات المفهرسة",
+    "indexing_stopped": "تم ايقاف الفهرسة",
+    "last_indexed": "اخر فهرسة",
+    "note_chat": "دردشة الملاحظة",
+    "start_indexing": "بدء الفهرسة",
+    "chat": {
+      "root_note_title": "دردشات AI",
+      "new_chat_title": "دردشة جديدة"
+    },
+    "selected_provider": "المزود المحدد",
+    "select_model": "اختر النموذج...",
+    "select_provider": "اختى المزود...",
+    "ollama_model": "نموذج Ollama",
+    "refresh_models": "تحديث النماذج",
+    "rebuild_index": "اعادة بناء الفهرس",
+    "note_title": "عنوان الملاحظة",
+    "processing": "جاري المعالجة ({{percentage}}%)",
+    "incomplete": "غير مكتمل ({{percentage}}%)"
+  },
+  "code_auto_read_only_size": {
+    "unit": "حروف"
+  },
+  "code-editor-options": {
+    "title": "محرر"
+  },
+  "images": {
+    "images_section_title": "صور",
+    "max_image_dimensions_unit": "بكسل"
+  },
+  "revisions_snapshot_limit": {
+    "snapshot_number_limit_unit": "لقطات"
+  },
+  "search_engine": {
+    "bing": "Bing",
+    "duckduckgo": "DuckDuckGo",
+    "google": "جوجل",
+    "save_button": "حفظ",
+    "baidu": "Baidu",
+    "title": "محرك البحث"
+  },
+  "heading_style": {
+    "plain": "بسيط",
+    "underline": "تسطير",
+    "markdown": "نمط-Markdown",
+    "title": "نمط العنوان"
+  },
+  "text_auto_read_only_size": {
+    "unit": "حروف"
+  },
+  "i18n": {
+    "language": "لغة",
+    "sunday": "الاحد",
+    "monday": "الاثنين",
+    "title": "تعريب"
+  },
+  "backup": {
+    "path": "مسار",
+    "automatic_backup": "النسخ الاحتياطي التلقائي",
+    "backup_now": "نسخ احتياطي الان",
+    "existing_backups": "النسخ الاحتياطية الموجودة"
+  },
+  "etapi": {
+    "wiki": "ويكي",
+    "created": "تم الأنشاء",
+    "actions": "أجراءات",
+    "title": "ETAPI",
+    "existing_tokens": "الرموز الموجوده",
+    "token_name": "اسم الرمز",
+    "default_token_name": "رمز جديد",
+    "rename_token_title": "اعادة تسمية الرمز"
+  },
+  "password": {
+    "heading": "كلمة المرور",
+    "wiki": "ويكي",
+    "old_password": "كلمة المرور القديمة",
+    "new_password": "كلمة مرور جديدة",
+    "change_password": "تغيير كلمة المرور",
+    "change_password_heading": "تغيير كلمة المرور",
+    "set_password_heading": "تعيين كلمة المرور",
+    "set_password": "تعيين كلمة المرور"
+  },
+  "shortcuts": {
+    "shortcuts": "أختصارات",
+    "description": "الوصف",
+    "keyboard_shortcuts": "اختصارات لوحة المفاتيح",
+    "action_name": "اسم الاجراء",
+    "default_shortcuts": "اختصارات افتراضية"
+  },
+  "sync_2": {
+    "timeout_unit": "ميلي ثانية",
+    "note": "ملاحظة",
+    "save": "حفظ",
+    "help": "المساعدة",
+    "config_title": "تهيئة المزامنة",
+    "timeout": "انتهاء مهلة المزامنة",
+    "test_title": "اختبار المزامنة",
+    "test_button": "اختبار المزامنة"
+  },
+  "api_log": {
+    "close": "أغلاق"
+  },
+  "bookmark_switch": {
+    "bookmark": "علامة مرجعية",
+    "remove_bookmark": "ازالة الاشارة المرجعية"
+  },
+  "editability_select": {
+    "auto": "تلقائي",
+    "read_only": "قراءة-فقط",
+    "always_editable": "قابل للتعديل دائما"
+  },
+  "tab_row": {
+    "close": "اغلاق",
+    "close_tab": "اغلاق التبويب",
+    "new_tab": "تبويب جديد"
+  },
+  "toc": {
+    "options": "خيارات"
+  },
+  "tasks": {
+    "due": {
+      "yesterday": "أمس",
+      "today": "اليوم",
+      "tomorrow": "غدٱ"
+    }
+  },
+  "code_theme": {
+    "title": "المظهر",
+    "word_wrapping": "التفاف النص",
+    "color-scheme": "نظام الالوان"
+  },
+  "table_view": {
+    "sort-column-ascending": "تصاعدي",
+    "sort-column-descending": "تنازلي",
+    "new-column-relation": "العلاقة",
+    "new-column-label": "تسمية",
+    "new-row": "صف جديد",
+    "new-column": "عمود جديد",
+    "sort-column-clear": "ازالة الترتيب",
+    "show-hide-columns": "اظهار/اخفاء الاعمدة",
+    "edit-column": "تحرير العمود",
+    "delete-column": "حذف العمود"
+  },
+  "modal": {
+    "close": "اغلاق"
+  },
+  "call_to_action": {
+    "dismiss": "تجاهل"
+  },
+  "units": {
+    "percentage": "%"
+  },
+  "clone_to": {
+    "prefix_optional": "بادئة (اختياري)"
+  },
+  "table_of_contents": {
+    "unit": "عناوين"
+  },
+  "tree-context-menu": {
+    "archive": "أرشفة",
+    "unarchive": "الغاء الارشفة",
+    "delete": "حذف",
+    "advanced": "متقدمة",
+    "cut": "قص",
+    "duplicate": "استنساخ",
+    "export": "تصدير",
+    "expand-subtree": "توسيع الشجرة الفرعية",
+    "collapse-subtree": "طي الشجرة الفرعية",
+    "sort-by": "ترتيب بواسطة...",
+    "protect-subtree": "الشجرة الفرعية المحمية",
+    "unprotect-subtree": "الجرةةالفرعية الغير محمية",
+    "clone-to": "‍استنساخ الى...",
+    "move-to": "نقل الى...",
+    "paste-into": "لصق في",
+    "paste-after": "لصق بعد",
+    "open-in-popup": "تحرير سريع"
+  },
+  "note_types": {
+    "text": "نص",
+    "code": "كود",
+    "book": "مجموعة",
+    "canvas": "مساحة العمل",
+    "file": "ملف",
+    "image": "صورة",
+    "launcher": "مشغل",
+    "doc": "مستند",
+    "widget": "عنصر واجهة",
+    "new-feature": "جديد",
+    "collections": "مجاميع",
+    "beta-feature": "اصدار تجريبي",
+    "saved-search": "بحث محفوظ",
+    "relation-map": "خريطة العلاقة",
+    "note-map": "خريطة الملاحظة",
+    "render-note": "عرض الملاحظة",
+    "mermaid-diagram": "مخطط Mermaid",
+    "web-view": "عرض الويب",
+    "mind-map": "خريطة ذهنية",
+    "geo-map": "خريطة جغرافية",
+    "ai-chat": "دردشة AI",
+    "task-list": "قائمة المهام"
+  },
+  "shared_switch": {
+    "shared": "مشترك"
+  },
+  "template_switch": {
+    "template": "قالب"
+  },
+  "find": {
+    "replace": "استبدال",
+    "case_sensitive": "حساسة لحالة الاحرف",
+    "match_words": "مطابقة الكلمات",
+    "replace_placeholder": "استبدال ب...",
+    "replace_all": "استبدال الكل"
+  },
+  "highlights_list_2": {
+    "options": "خيارات",
+    "title": "قائمة التمييزات"
+  },
+  "quick-search": {
+    "searching": "جار البحث...",
+    "placeholder": "البحث السريع"
+  },
+  "note_tree": {
+    "unhoist": "ارجاع الى الترتيب الطبيعي",
+    "tree-settings-title": "اعدادات الشجرة",
+    "toggle-sidebar": "اظهار/اخفاء الشريط الجانبي"
+  },
+  "sql_table_schemas": {
+    "tables": "جداول"
+  },
+  "launcher_context_menu": {
+    "reset": "اعادة ضبط",
+    "add-spacer": "اضافة فاصل"
+  },
+  "editable-text": {
+    "auto-detect-language": "تم اكتشافه تلقائيا"
+  },
+  "classic_editor_toolbar": {
+    "title": "تنسيق"
+  },
+  "editor": {
+    "title": "محرر"
+  },
+  "editing": {
+    "editor_type": {
+      "floating": {
+        "title": "عائم"
+      },
+      "fixed": {
+        "title": "مثبت"
+      },
+      "label": "شريط ادوات التنسيق"
+    }
+  },
+  "electron_context_menu": {
+    "cut": "قص",
+    "copy": "نسخ",
+    "paste": "لصق",
+    "copy-link": "نسخ الرابط"
+  },
+  "promoted_attributes": {
+    "url_placeholder": "http://website...",
+    "promoted_attributes": "السمات المعززة",
+    "unset-field-placeholder": "غير محدد"
+  },
+  "duration": {
+    "seconds": "ثواني",
+    "minutes": "دقائق",
+    "hours": "ساعات",
+    "days": "أيام"
+  },
+  "editorfeatures": {
+    "title": "مميزات"
+  },
+  "book_properties_config": {
+    "raster": "نقطي",
+    "hide-weekends": "اخفاء عطلات نهايات الاسبوع",
+    "map-style": "نمط الخريطة:",
+    "vector_light": "متجه (فاتح)",
+    "vector_dark": "متجه (داكن)",
+    "show-scale": "اظهار المقياس"
+  },
+  "multi_factor_authentication": {
+    "oauth_title": "OAuth/OpenID",
+    "title": "المصادقة متعددة العوامل",
+    "mfa_method": "طريقة المصادقة متعددة العوامل",
+    "oauth_user_account": "حساب المستخدم: ",
+    "oauth_user_email": "البريد الإلكتروني للمستخدم: "
+  },
+  "execute_script": {
+    "execute_script": "تنفيذ السكريبت"
+  },
+  "add_label": {
+    "add_label": "اضافة تسمية",
+    "to_value": "الى القيمة",
+    "new_value_placeholder": "قيمة جديدة",
+    "label_name_placeholder": "اسم التسمية"
+  },
+  "delete_label": {
+    "delete_label": "حذف التسمية",
+    "label_name_placeholder": "اسم التسمية"
+  },
+  "update_label_value": {
+    "to_value": "الى القيمة",
+    "new_value_placeholder": "قيمة جديدة",
+    "label_name_placeholder": "اسم التسمية"
+  },
+  "delete_note": {
+    "delete_note": "حذف الملاحظة"
+  },
+  "rename_note": {
+    "rename_note": "اعادة تسمية الملاحظة"
+  },
+  "delete_relation": {
+    "delete_relation": "حذف العلاقة",
+    "relation_name": "اسم العلاقة"
+  },
+  "left_pane_toggle": {
+    "show_panel": "عرض اللوحة",
+    "hide_panel": "اخفاء اللوحة"
+  },
+  "move_pane_button": {
+    "move_left": "تحريك الى اليسار",
+    "move_right": "تحريك الى اليمين"
+  },
+  "note_actions": {
+    "re_render_note": "اعادة عرض الملاحظة",
+    "note_source": "مصدر الملاحظة",
+    "note_attachments": "مرفقات الملاحظة",
+    "import_files": "استيراد الملفات",
+    "export_note": "تصدير الملاحظة",
+    "delete_note": "حذف الملاحظة",
+    "print_note": "طباعة الملاحظة",
+    "save_revision": "حفظ المراجعة"
+  },
+  "update_available": {
+    "update_available": "تحديث متوفر"
+  },
+  "code_buttons": {
+    "execute_button_title": "تنفيذ السكريبت"
+  },
+  "hide_floating_buttons_button": {
+    "button_title": "اخفاء الازرار"
+  },
+  "show_floating_buttons_button": {
+    "button_title": "عرض الازرار"
+  },
+  "relation_map_buttons": {
+    "zoom_in_title": "تكبير",
+    "zoom_out_title": "تصغير"
+  },
+  "inherited_attribute_list": {
+    "title": "السمات الموروثة"
+  },
+  "note_map": {
+    "title": "خريطة الملاحظة",
+    "fix-nodes": "اصلاح العقد",
+    "link-distance": "مسافة الرابط"
+  },
+  "owned_attribute_list": {
+    "owned_attributes": "السمات المملوكة"
+  },
+  "similar_notes": {
+    "title": "ملاحظات مشابهة"
+  },
+  "fast_search": {
+    "fast_search": "بحث سريع"
+  },
+  "search_script": {
+    "title": "نص البحث:"
+  },
+  "attachment_detail": {
+    "owning_note": "الملاحظة المالكة: "
+  },
+  "attachment_list": {
+    "owning_note": "الملاحظة المالكة: ",
+    "upload_attachments": "رفع المرفقات"
+  },
+  "protected_session": {
+    "wrong_password": "كلمة المرور خاطئة",
+    "protecting-title": "الحالة المحمية",
+    "unprotecting-title": "الحالة الغير محمية"
+  },
+  "relation_map": {
+    "remove_note": "حذف الملاحظة",
+    "edit_title": "تعديل العنوان",
+    "rename_note": "اعادة تسمية الملاحظة",
+    "remove_relation": "حذف العلاقة",
+    "default_new_note_title": "ملاحظة جديدة"
+  },
+  "web_view": {
+    "web_view": "عرض الويب"
+  },
+  "consistency_checks": {
+    "title": "فحوصات التناسق"
+  },
+  "database_anonymization": {
+    "title": "اخفاء هوية البيانات",
+    "full_anonymization": "الاخفاء الكامل للهوية",
+    "light_anonymization": "الاخفاء الجزئي للهوية"
+  },
+  "vacuum_database": {
+    "title": "تحرير مساحة قاعدة البيانات",
+    "button_text": "تحرير مساحة قاعدة البيانات",
+    "vacuuming_database": "جار تحرير مساحة قاعدة الييانات..."
+  },
+  "ribbon": {
+    "widgets": "ادوات الشريط"
+  },
+  "vim_key_bindings": {
+    "use_vim_keybindings_in_code_notes": "اختصارات لوحة المفاتيح باسلوب Vim"
+  },
+  "network_connections": {
+    "network_connections_title": "اتصالات الشبكة"
+  },
+  "tray": {
+    "title": "شريط النظام"
+  },
+  "highlights_list": {
+    "title": "قائمة النقاط المميزة",
+    "bold": "نص عربض",
+    "italic": "نص مائل",
+    "underline": "خط تحت النص",
+    "color": "نص ملون"
+  },
+  "revisions_button": {
+    "note_revisions": "مراجعات الملاحظة"
+  },
+  "custom_date_time_format": {
+    "format_string": "سلسلة التنسيق:",
+    "formatted_time": "التاريخ/الوقت المنسق:"
+  },
+  "options_widget": {
+    "options_status": "حالة الخيارات"
+  },
+  "spellcheck": {
+    "title": "التدقيق الاملائي",
+    "enable": "تفعيل التدقيق الاملائي"
+  },
+  "note-map": {
+    "button-link-map": "خريطة الروابط",
+    "button-tree-map": "خريطة الشجرة"
+  },
+  "spacer": {
+    "configure_launchbar": "تهيئة شريط الاطلاق"
+  },
+  "entrypoints": {
+    "note-executed": "تم تنفيذ الملاحظة."
+  },
+  "branches": {
+    "delete-status": "حالة الحذف"
+  },
+  "highlighting": {
+    "title": "كتل الكود",
+    "color-scheme": "نظام الالوان"
+  },
+  "code_block": {
+    "word_wrapping": "التفاف النص",
+    "theme_group_light": "الثيمات الفاتحة",
+    "theme_group_dark": "الثيمات الغامقة"
+  },
+  "link_context_menu": {
+    "open_note_in_popup": "تحرير سريع"
+  },
+  "electron_integration": {
+    "desktop-application": "تطبيقات سطح المكتبة",
+    "zoom-factor": "عامل التكبير"
+  },
+  "note_tooltip": {
+    "quick-edit": "التحرير السريع"
+  },
+  "geo-map-context": {
+    "open-location": "فتح الموقع"
+  },
+  "share": {
+    "title": "اعدادات المشاركة"
+  },
+  "note_language": {
+    "not_set": "غير محدد",
+    "configure-languages": "لغات التهيئة"
+  },
+  "content_language": {
+    "title": "لغات المحتوى"
+  },
+  "toggle_read_only_button": {
+    "unlock-editing": "الغاء قفل التحرير",
+    "lock-editing": "قفل التحرير"
+  },
+  "cpu_arch_warning": {
+    "continue_anyway": "المتابعة على اي حال"
+  },
+  "table_context_menu": {
+    "delete_row": "حذف الصف"
+  },
+  "board_view": {
+    "delete-note": "حذف الملاحظة...",
+    "archive-note": "ارشفة الملاحظة",
+    "unarchive-note": "الغاء ارشفة الملاحظة",
+    "move-to": "نقل الى",
+    "insert-above": "ادراج اعلاه",
+    "insert-below": "ادراج ادناه",
+    "delete-column": "حذف العمود",
+    "new-item": "عنصر جديد",
+    "add-column": "اضافة عمود"
+  },
+  "command_palette": {
+    "export_note_title": "تصدير ملاحظة",
+    "show_attachments_title": "عرض المرفقات",
+    "search_notes_title": "البحث في الملاحظات"
+  },
+  "content_renderer": {
+    "open_externally": "فتح خارجيا"
+  },
+  "settings": {
+    "related_settings": "اعدادات متعلقة"
   }
 }

apps/client/src/translations/en/translation.json

@@ -646,7 +646,8 @@
     "about": "About Trilium Notes",
     "logout": "Logout",
     "show-cheatsheet": "Show Cheatsheet",
-    "toggle-zen-mode": "Zen Mode"
+    "toggle-zen-mode": "Zen Mode",
+    "update_available": "Version {{latestVersion}} is available, click to download."
   },
   "zen_mode": {
     "button_exit": "Exit Zen Mode"
@@ -735,6 +736,7 @@
   "mobile_detail_menu": {
     "insert_child_note": "Insert child note",
     "delete_this_note": "Delete this note",
+    "note_revisions": "Note revisions",
     "error_cannot_get_branch_id": "Cannot get branchId for notePath '{{notePath}}'",
     "error_unrecognized_command": "Unrecognized command {{command}}"
   },
@@ -1413,8 +1415,13 @@
     "title": "Localization",
     "language": "Language",
     "first-day-of-the-week": "First day of the week",
-    "sunday": "Sunday",
     "monday": "Monday",
+    "tuesday": "Tuesday",
+    "wednesday": "Wednesday",
+    "thursday": "Thursday",
+    "friday": "Friday",
+    "saturday": "Saturday",
+    "sunday": "Sunday",
     "first-week-of-the-year": "First week of the year",
     "first-week-contains-first-day": "First week contains first day of the year",
     "first-week-contains-first-thursday": "First week contains first Thursday of the year",
@@ -1422,7 +1429,8 @@
     "min-days-in-first-week": "Minimum days in first week",
     "first-week-info": "First week contains first Thursday of the year is based on <a href=\"https://en.wikipedia.org/wiki/ISO_week_date#First_week\">ISO 8601</a> standard.",
     "first-week-warning": "Changing first week options may cause duplicate with existing Week Notes and the existing Week Notes will not be updated accordingly.",
-    "formatting-locale": "Date & number format"
+    "formatting-locale": "Date & number format",
+    "formatting-locale-auto": "Based on the application's language"
   },
   "backup": {
     "automatic_backup": "Automatic backup",

apps/client/src/translations/id/translation.json

@@ -0,0 +1,8 @@
+{
+  "about": {
+    "title": "Tentang Trilium Notes",
+    "homepage": "Halaman utama:",
+    "app_version": "Versi Aplikasi:",
+    "db_version": "Versi DB:"
+  }
+}

apps/client/src/translations/ja/translation.json

@@ -67,7 +67,8 @@
     "switch_to_mobile_version": "モバイル版に切り替え",
     "switch_to_desktop_version": "デスクトップ版に切り替え",
     "configure_launchbar": "ランチャーバーの設定",
-    "show_shared_notes_subtree": "共有ノートのサブツリーを表示"
+    "show_shared_notes_subtree": "共有ノートのサブツリーを表示",
+    "update_available": "バージョン {{latestVersion}} が利用可能です。クリックしてダウンロードしてください。"
   },
   "left_pane_toggle": {
     "show_panel": "パネルを表示",
@@ -162,7 +163,8 @@
     "min-days-in-first-week": "最初の週の最低日数",
     "first-week-info": "最初の週は、その年の最初の木曜日を含む週を指し、<a href=\"https://en.wikipedia.org/wiki/ISO_week_date#First_week\">ISO 8601</a>規格に基づいています。",
     "first-week-warning": "最初の週のオプションを変更すると、既存のウィークノートと重複する可能性があり、既存のウィークノートはそれに応じて更新されません。",
-    "formatting-locale": "日付と数値のフォーマット"
+    "formatting-locale": "日付と数値のフォーマット",
+    "formatting-locale-auto": "アプリケーションの言語に基づいて"
   },
   "tab_row": {
     "close_tab": "タブを閉じる",
@@ -251,12 +253,12 @@
   "help": {
     "title": "チートシート",
     "noteNavigation": "ノートナビゲーション",
-    "collapseExpand": "ノードの格納/展開",
+    "collapseExpand": "ノードを折りたたむ / 展開",
     "goBackForwards": "履歴を戻る／進む",
     "scrollToActiveNote": "アクティブノートまでスクロール",
     "jumpToParentNote": "親ノートへ移動",
-    "collapseWholeTree": "すべてのノートツリーを格納",
+    "collapseWholeTree": "すべてのノートツリーを折りたたむ",
-    "collapseSubTree": "サブツリーを格納",
+    "collapseSubTree": "サブツリーを折りたたむ",
     "tabShortcuts": "タブショートカット",
     "newTabNoteLink": "ノートのリンクをクリックすると、新しいタブで開く",
     "newTabWithActivationNoteLink": "ノートのリンクをクリックすると、新しいタブで開き、アクティブにします",
@@ -515,9 +517,9 @@
   "book_properties": {
     "grid": "グリッド",
     "list": "リスト",
-    "collapse_all_notes": "すべてのノートを格納",
+    "collapse_all_notes": "すべてのノートを折りたたむ",
     "expand_all_children": "すべての子を展開",
-    "collapse": "格納",
+    "collapse": "折りたたむ",
     "expand": "展開",
     "book_properties": "コレクションプロパティ",
     "invalid_view_type": "無効なビュータイプ '{{type}}'",
@@ -550,7 +552,7 @@
     "beta-feature": "Beta",
     "ai-chat": "AI チャット",
     "task-list": "タスクリスト",
-    "new-feature": "新しい",
+    "new-feature": "New",
     "collections": "コレクション"
   },
   "edited_notes": {
@@ -767,7 +769,7 @@
     "placeholder": "ノート名で検索",
     "label": "祖先",
     "depth_label": "深さ",
-    "depth_doesnt_matter": "関係ない",
+    "depth_doesnt_matter": "関係なし",
     "depth_eq": "ちょうど {{count}} つ下の階層",
     "direct_children": "直接の子",
     "depth_gt": "{{count}} より下の階層",
@@ -830,7 +832,7 @@
     "max_width_label": "最大コンテンツ幅",
     "max_width_unit": "ピクセル",
     "apply_changes_description": "コンテンツ幅の変更を適用するには、クリックしてください",
-    "reload_description": "外観オプションからの変更"
+    "reload_description": "外観設定から変更"
   },
   "theme": {
     "title": "アプリのテーマ",
@@ -899,14 +901,14 @@
     "bg_color": "背景色付きテキスト",
     "visibility_title": "ハイライトリスト表示",
     "visibility_description": "#hideHighlightWidget ラベルを追加することで、ノートごとにハイライトウィジェットを非表示にできます。",
-    "shortcut_info": "オプション -> ショートカット（'右ペイン切り替え'）で、右ペイン（ハイライトを含む）を素早く切り替えるキーボードショートカットを設定できます。"
+    "shortcut_info": "設定 -> ショートカット（右ペイン切り替え）で、右ペイン（ハイライトを含む）を素早く切り替えるキーボードショートカットを設定できます。"
   },
   "table_of_contents": {
     "title": "目次",
     "description": "ノートに定義された数以上の見出しがある場合、テキストノートに目次が表示されます。この数はカスタマイズできます:",
     "unit": "見出し",
-    "disable_info": "このオプションに非常に大きな数値を設定することで、目次を効果的に無効にすることもできる。",
+    "disable_info": "このオプションに非常に大きな数値を設定することで、目次を効果的に無効にすることもできます。",
-    "shortcut_info": "オプション -> ショートカット（'右ペイン切り替え'）で、右ペイン（目次を含む）を素早く切り替えるキーボードショートカットを設定できます。"
+    "shortcut_info": "設定 -> ショートカット（右ペイン切り替え）で、右ペイン（目次を含む）を素早く切り替えるキーボードショートカットを設定できます。"
   },
   "toc": {
     "table_of_contents": "目次",
@@ -1073,7 +1075,7 @@
     "read_only": "エディターは読み取り専用モードです。テキストとコードノートのみ機能します。",
     "auto_read_only_disabled": "テキスト/コードノートは、サイズが大きすぎる場合、自動的に読み取りモードに設定されます。このラベルをノートに追加することで、ノートごとにこの動作を無効にすることができます",
     "app_css": "Trilium アプリケーションに読み込まれ、Trilium の外観を変更するために使用できる CSS ノートをマークします。",
-    "app_theme": "Trilium のフルテーマである CSS ノートをマークし、Trilium オプションで利用できるようにします。",
+    "app_theme": "Trilium のフルテーマである CSS ノートをマークし、Trilium の設定で利用できるようにします。",
     "app_theme_base": "「next」、「next-light」、または「next-dark」に設定すると、従来のテーマではなく、対応する TriliumNext テーマ (auto、light、または dark) がカスタム テーマのベースとして使用されます。",
     "css_class": "このラベルの値は、ツリー内の特定のノートを表すノードにCSSクラスとして追加されます。これは高度なテーマ設定に役立ちます。テンプレートノートで使用できます。",
     "icon_class": "このラベルの値は、ツリー上のアイコンにCSSクラスとして追加され、ツリー内のノートを視覚的に区別するのに役立ちます。例えば、bx bx-home のように、アイコンは boxicons から取得されます。テンプレートノートで使用できます。",
@@ -1275,7 +1277,7 @@
     "editor_type": {
       "label": "書式設定ツールバー",
       "floating": {
-        "description": "編集ツールがカーソル付近に表示されます;",
+        "description": "編集ツールがカーソル付近に表示されます。",
         "title": "フローティング"
       },
       "fixed": {
@@ -1290,7 +1292,7 @@
     "cut": "カット",
     "copy": "コピー",
     "copy-link": "リンクをコピー",
-    "paste": "ペースト",
+    "paste": "貼り付け",
     "paste-as-plain-text": "プレーンテキストで貼り付け",
     "search_online": "{{searchEngine}} で \"{{term}}\" を検索"
   },
@@ -1582,7 +1584,8 @@
     "delete_this_note": "このノートを削除",
     "error_unrecognized_command": "認識されないコマンド {{command}}",
     "insert_child_note": "子ノートを挿入",
-    "error_cannot_get_branch_id": "ノートパス 「{{notePath}} のbranchIdを取得できません"
+    "error_cannot_get_branch_id": "ノートパス 「{{notePath}} のbranchIdを取得できません",
+    "note_revisions": "ノートの変更履歴"
   },
   "inherited_attribute_list": {
     "title": "継承属性",

apps/client/src/translations/md/translation.json

@@ -0,0 +1 @@
+{}

apps/client/src/types.d.ts

@@ -46,6 +46,7 @@ interface CustomGlobals {
     platform?: typeof process.platform;
     linter: typeof lint;
     hasNativeTitleBar: boolean;
+    isRtl: boolean;
 }
 
 type RequireMethod = (moduleName: string) => any;

apps/client/src/utils/formatters.ts

@@ -1,3 +1,5 @@
+import options from "../services/options";
+
 type DateTimeStyle = "full" | "long" | "medium" | "short" | "none" | undefined;
 
 /**
@@ -8,7 +10,7 @@ export function formatDateTime(date: string | Date | number | null | undefined,
         return "";
     }
 
-    const locale = navigator.language;
+    const locale = options.get("formattingLocale") || options.get("locale") || navigator.language;
 
     let parsedDate;
     if (typeof date === "string" || typeof date === "number") {
@@ -24,7 +26,7 @@ export function formatDateTime(date: string | Date | number | null | undefined,
 
     if (timeStyle !== "none" && dateStyle !== "none") {
         // Format the date and time
-        const formatter = new Intl.DateTimeFormat(navigator.language, { dateStyle, timeStyle });
+        const formatter = new Intl.DateTimeFormat(locale, { dateStyle, timeStyle });
         return formatter.format(parsedDate);
     } else if (timeStyle === "none" && dateStyle !== "none") {
         // Format only the date

apps/client/src/widgets/FloatingButtons.css

@@ -7,7 +7,7 @@
 .show-floating-buttons {
     position: absolute;
     top: var(--floating-buttons-vert-offset, 10px);
-    right: var(--floating-buttons-horiz-offset, 10px);
+    inset-inline-end: var(--floating-buttons-horiz-offset, 10px);
     display: flex;
     flex-direction: row;
     z-index: 100;
@@ -15,8 +15,7 @@
 
 .note-split.rtl .floating-buttons-children,
 .note-split.rtl .show-floating-buttons {
-    right: unset;
+    inset-inline-end: 10px;
-    left: 10px;
 }
 
 .note-split.rtl .close-floating-buttons {
@@ -74,7 +73,7 @@
 
 .show-floating-buttons {
     /* display: none;*/
-    margin-left: 5px !important;
+    margin-inline-start: 5px !important;
 }
 
 .show-floating-buttons-button {
@@ -97,7 +96,7 @@
 
 /* #region Close floating buttons */
 .close-floating-buttons {
-    margin-left: 5px !important;
+    margin-inline-start: 5px !important;
 }
 
 .close-floating-buttons:first-child {
@@ -140,7 +139,7 @@
     z-index: 10;
     position: absolute;
     top: 50px;
-    right: 10px;
+    inset-inline-end: 10px;
     width: 400px;
     border-radius: 10px;
     background-color: var(--accented-background-color);
@@ -150,8 +149,8 @@
 }
 
 .backlink-excerpt {
-    border-left: 2px solid var(--main-border-color);
+    border-inline-start: 2px solid var(--main-border-color);
-    padding-left: 10px;
+    padding-inline-start: 10px;
     opacity: 80%;
     font-size: 90%;
 }

apps/client/src/widgets/api_log.css

@@ -23,6 +23,6 @@
     color: var(--button-text-color);
     position: absolute;
     top: 10px;
-    right: 10px;
+    inset-inline-end: 10px;
     cursor: pointer;
 }

apps/client/src/widgets/attribute_widgets/attribute_detail.ts

@@ -36,7 +36,7 @@ const TPL = /*html*/`
         }
 
         .related-notes-list {
-            padding-left: 20px;
+            padding-inline-start: 20px;
             margin-top: 10px;
             margin-bottom: 10px;
         }
@@ -46,7 +46,7 @@ const TPL = /*html*/`
         }
 
         .attr-edit-table th {
-            text-align: left;
+            text-align: start;
         }
 
         .attr-edit-table td input[not(type="checkbox")] {
@@ -150,7 +150,7 @@ const TPL = /*html*/`
             <th title="${t("attribute_detail.precision_title")}">${t("attribute_detail.precision")}</th>
             <td>
                 <div class="input-group">
-                    <input type="number" class="form-control attr-input-number-precision" style="text-align: right">
+                    <input type="number" class="form-control attr-input-number-precision" style="text-align: end">
                     <span class="input-group-text">${t("attribute_detail.digits")}</span>
                 </div>
             </td>
@@ -176,7 +176,7 @@ const TPL = /*html*/`
 
     <div class="attr-save-delete-button-container">
         <button class="btn btn-primary btn-sm attr-save-changes-and-close-button"
-            style="flex-grow: 1; margin-right: 20px">
+            style="flex-grow: 1; margin-inline-end: 20px">
             ${t("attribute_detail.save_and_close")}</button>
 
         <button class="btn btn-secondary btn-sm attr-delete-button">

apps/client/src/widgets/basic_widget.ts

@@ -74,7 +74,7 @@ export class TypedBasicWidget<T extends TypedComponent<any>> extends TypedCompon
     /**
      * Sets the CSS attribute of the given name to the given value.
      *
-     * @param name the name of the CSS attribute to set (e.g. `padding-left`).
+     * @param name the name of the CSS attribute to set (e.g. `padding-inline-start`).
      * @param value the value of the CSS attribute to set (e.g. `12px`).
      * @returns self for chaining.
      */
@@ -87,7 +87,7 @@ export class TypedBasicWidget<T extends TypedComponent<any>> extends TypedCompon
      * Sets the CSS attribute of the given name to the given value, but only if the condition provided is truthy.
      *
      * @param condition `true` in order to apply the CSS, `false` to ignore it.
-     * @param name the name of the CSS attribute to set (e.g. `padding-left`).
+     * @param name the name of the CSS attribute to set (e.g. `padding-inline-start`).
      * @param value the value of the CSS attribute to set (e.g. `12px`).
      * @returns self for chaining.
      */

apps/client/src/widgets/bulk_actions/BulkAction.tsx

@@ -12,8 +12,8 @@ interface BulkActionProps {
 
 // Define styles as constants to prevent recreation
 const flexContainerStyle = { display: "flex", alignItems: "center" } as const;
-const labelStyle = { marginRight: "10px" } as const;
+const labelStyle = { marginInlineEnd: "10px" } as const;
-const textStyle = { marginRight: "10px", marginLeft: "10px" } as const;
+const textStyle = { marginInlineEnd: "10px", marginInlineStart: "10px" } as const;
 
 const BulkAction = memo(({ label, children, helpText, bulkAction }: BulkActionProps) => {
     return (

apps/client/src/widgets/buttons/abstract_button.ts

@@ -1,5 +1,6 @@
 import { Tooltip } from "bootstrap";
 import NoteContextAwareWidget from "../note_context_aware_widget.js";
+import { handleRightToLeftPlacement } from "../../services/utils.js";
 
 const TPL = /*html*/`<button class="button-widget bx"
       data-bs-toggle="tooltip"
@@ -26,13 +27,14 @@ export default class AbstractButtonWidget<SettingsT extends AbstractButtonWidget
 
     doRender() {
         this.$widget = $(TPL);
+
         this.tooltip = new Tooltip(this.$widget[0], {
             html: true,
             // in case getTitle() returns null -> use empty string as fallback
             title: () => this.getTitle() || "",
             trigger: "hover",
-            placement: this.settings.titlePlacement,
+            placement: handleRightToLeftPlacement(this.settings.titlePlacement),
-            fallbackPlacements: [this.settings.titlePlacement]
+            fallbackPlacements: [ handleRightToLeftPlacement(this.settings.titlePlacement) ]
         });
 
         if (this.settings.onContextMenu) {

apps/client/src/widgets/buttons/bookmark_folder.ts

@@ -35,7 +35,7 @@ const DROPDOWN_TPL = `
         }
 
         .bookmark-folder-widget li .note-link {
-            padding-left: 35px;
+            padding-inline-start: 35px;
         }
     </style>
 

apps/client/src/widgets/buttons/calendar.ts

@@ -8,13 +8,15 @@ import options from "../../services/options.js";
 import { Dropdown } from "bootstrap";
 import type { EventData } from "../../components/app_context.js";
 import dayjs, { Dayjs } from "dayjs";
+import isoWeek from "dayjs/plugin/isoWeek.js";
 import utc from "dayjs/plugin/utc.js";
 import isSameOrAfter from "dayjs/plugin/isSameOrAfter.js";
 import "../../stylesheets/calendar.css";
-import type { AttributeRow } from "@triliumnext/commons";
+import type { AttributeRow, OptionDefinitions } from "@triliumnext/commons";
 
 dayjs.extend(utc);
 dayjs.extend(isSameOrAfter);
+dayjs.extend(isoWeek);
 
 const MONTHS = [
     t("calendar.january"),
@@ -69,7 +71,15 @@ const DROPDOWN_TPL = `
     <div class="calendar-body" data-calendar-area="month"></div>
 </div>`;
 
-const DAYS_OF_WEEK = [t("calendar.sun"), t("calendar.mon"), t("calendar.tue"), t("calendar.wed"), t("calendar.thu"), t("calendar.fri"), t("calendar.sat")];
+const DAYS_OF_WEEK = [
+    t("calendar.sun"),
+    t("calendar.mon"),
+    t("calendar.tue"),
+    t("calendar.wed"),
+    t("calendar.thu"),
+    t("calendar.fri"),
+    t("calendar.sat")
+];
 
 interface DateNotesForMonth {
     [date: string]: string;
@@ -90,7 +100,8 @@ export default class CalendarWidget extends RightDropdownButtonWidget {
     private $nextYear!: JQuery<HTMLElement>;
     private $previousYear!: JQuery<HTMLElement>;
     private monthDropdown!: Dropdown;
-    private firstDayOfWeek!: number;
+    // stored in ISO 1–7
+    private firstDayOfWeekISO!: number;
     private weekCalculationOptions!: WeekCalculationOptions;
     private activeDate: Dayjs | null = null;
     private todaysDate!: Dayjs;
@@ -126,6 +137,7 @@ export default class CalendarWidget extends RightDropdownButtonWidget {
                 this.createMonth();
             }
         });
+
         this.$next = this.$dropdownContent.find('[data-calendar-toggle="next"]');
         this.$next.on("click", () => {
             this.date = this.date.add(1, 'month');
@@ -144,23 +156,24 @@ export default class CalendarWidget extends RightDropdownButtonWidget {
             this.date = this.date.year(parseInt(target.value));
             this.createMonth();
         });
+
         this.$nextYear = this.$dropdownContent.find('[data-calendar-toggle="nextYear"]');
         this.$nextYear.on("click", () => {
             this.date = this.date.add(1, 'year');
             this.createMonth();
         });
+
         this.$previousYear = this.$dropdownContent.find('[data-calendar-toggle="previousYear"]');
         this.$previousYear.on("click", () => {
             this.date = this.date.subtract(1, 'year');
             this.createMonth();
         });
 
+        // Date click
         this.$dropdownContent.on("click", ".calendar-date", async (ev) => {
             const date = $(ev.target).closest(".calendar-date").attr("data-calendar-date");
-
             if (date) {
                 const note = await dateNoteService.getDayNote(date);
-
                 if (note) {
                     appContext.tabManager.getActiveContext()?.setNote(note.noteId);
                     this.dropdown?.hide();
@@ -168,10 +181,10 @@ export default class CalendarWidget extends RightDropdownButtonWidget {
                     toastService.showError(t("calendar.cannot_find_day_note"));
                 }
             }
-
             ev.stopPropagation();
         });
 
+        // Week click
         this.$dropdownContent.on("click", ".calendar-week-number", async (ev) => {
             if (!this.weekNoteEnable) {
                 return;
@@ -218,23 +231,17 @@ export default class CalendarWidget extends RightDropdownButtonWidget {
             return;
         }
         const noteAttributes = await server.get<AttributeRow[]>(`notes/${noteId}/attributes`);
-
+        this.weekNoteEnable = noteAttributes.some(a => a.name === 'enableWeekNote');
-        for (const attribute of noteAttributes) {
-            if (attribute.name === 'enableWeekNote') {
-                this.weekNoteEnable = true;
-                return
-            }
-        }
-        this.weekNoteEnable = false;
     }
 
+    // Store firstDayOfWeek as ISO (1–7)
     manageFirstDayOfWeek() {
-        this.firstDayOfWeek = options.getInt("firstDayOfWeek") || 0;
+        const rawFirstDayOfWeek = options.getInt("firstDayOfWeek") || 0;
+        this.firstDayOfWeekISO = rawFirstDayOfWeek === 0 ? 7 : rawFirstDayOfWeek;
 
-        // Generate the list of days of the week taking into consideration the user's selected first day of week.
         let localeDaysOfWeek = [...DAYS_OF_WEEK];
-        const daysToBeAddedAtEnd = localeDaysOfWeek.splice(0, this.firstDayOfWeek);
+        const shifted = localeDaysOfWeek.splice(0, rawFirstDayOfWeek);
-        localeDaysOfWeek = ['', ...localeDaysOfWeek, ...daysToBeAddedAtEnd];
+        localeDaysOfWeek = ['', ...localeDaysOfWeek, ...shifted];
         this.$weekHeader.html(localeDaysOfWeek.map((el) => `<span>${el}</span>`).join(''));
     }
 
@@ -245,72 +252,15 @@ export default class CalendarWidget extends RightDropdownButtonWidget {
         };
     }
 
+    getWeekStartDate(date: Dayjs): Dayjs {
+        const currentISO = date.isoWeekday();
+        const diff = (currentISO - this.firstDayOfWeekISO + 7) % 7;
+        return date.clone().subtract(diff, "day").startOf("day");
+    }
+
     getWeekNumber(date: Dayjs): number {
-        const year = date.year();
+        const weekStart = this.getWeekStartDate(date);
-        const dayOfWeek = (day: number) => (day - this.firstDayOfWeek + 7) % 7;
+        return weekStart.isoWeek();
-
-        // Get first day of the year and adjust to first week start
-        const jan1 = date.clone().year(year).month(0).date(1);
-        const jan1Weekday = jan1.day();
-        const dayOffset = dayOfWeek(jan1Weekday);
-        let firstWeekStart = jan1.clone().subtract(dayOffset, 'day');
-
-        // Adjust based on week rule
-        switch (this.weekCalculationOptions.firstWeekType) {
-            case 1: { // ISO 8601: first week contains Thursday
-                const thursday = firstWeekStart.clone().add(3, 'day'); // Monday + 3 = Thursday
-                if (thursday.year() < year) {
-                    firstWeekStart = firstWeekStart.add(7, 'day');
-                }
-                break;
-            }
-            case 2: { // minDaysInFirstWeek rule
-                const daysInFirstWeek = 7 - dayOffset;
-                if (daysInFirstWeek < this.weekCalculationOptions.minDaysInFirstWeek) {
-                    firstWeekStart = firstWeekStart.add(7, 'day');
-                }
-                break;
-            }
-            // default case 0: week containing Jan 1 → already handled
-        }
-
-        const diffDays = date.startOf('day').diff(firstWeekStart.startOf('day'), 'day');
-        const weekNumber = Math.floor(diffDays / 7) + 1;
-
-        // Handle case when date is before first week start → belongs to last week of previous year
-        if (weekNumber <= 0) {
-            return this.getWeekNumber(date.subtract(1, 'day'));
-        }
-
-        // Handle case when date belongs to first week of next year
-        const nextYear = year + 1;
-        const jan1Next = date.clone().year(nextYear).month(0).date(1);
-        const jan1WeekdayNext = jan1Next.day();
-        const offsetNext = dayOfWeek(jan1WeekdayNext);
-        let nextYearWeekStart = jan1Next.clone().subtract(offsetNext, 'day');
-
-        switch (this.weekCalculationOptions.firstWeekType) {
-            case 1: {
-                const thursday = nextYearWeekStart.clone().add(3, 'day');
-                if (thursday.year() < nextYear) {
-                    nextYearWeekStart = nextYearWeekStart.add(7, 'day');
-                }
-                break;
-            }
-            case 2: {
-                const daysInFirstWeek = 7 - offsetNext;
-                if (daysInFirstWeek < this.weekCalculationOptions.minDaysInFirstWeek) {
-                    nextYearWeekStart = nextYearWeekStart.add(7, 'day');
-                }
-                break;
-            }
-        }
-
-        if (date.isSameOrAfter(nextYearWeekStart)) {
-            return 1;
-        }
-
-        return weekNumber;
     }
 
     async dropdownShown() {
@@ -320,32 +270,25 @@ export default class CalendarWidget extends RightDropdownButtonWidget {
     }
 
     init(activeDate: string | null) {
-        // attaching time fixes local timezone handling
         this.activeDate = activeDate ? dayjs(`${activeDate}T12:00:00`) : null;
         this.todaysDate = dayjs();
         this.date = dayjs(this.activeDate || this.todaysDate).startOf('month');
-
         this.createMonth();
     }
 
     createDay(dateNotesForMonth: DateNotesForMonth, num: number) {
-        const $newDay = $("<a>").addClass("calendar-date").attr("data-calendar-date", this.date.local().format('YYYY-MM-DD'));
+        const $newDay = $("<a>")
+            .addClass("calendar-date")
+            .attr("data-calendar-date", this.date.local().format('YYYY-MM-DD'));
         const $date = $("<span>").html(String(num));
-
         const dateNoteId = dateNotesForMonth[this.date.local().format('YYYY-MM-DD')];
 
         if (dateNoteId) {
-            $newDay.addClass("calendar-date-exists");
+            $newDay.addClass("calendar-date-exists").attr("data-href", `#root/${dateNoteId}`);
-            $newDay.attr("data-href", `#root/${dateNoteId}`);
         }
 
-        if (this.date.isSame(this.activeDate, 'day')) {
+        if (this.date.isSame(this.activeDate, 'day')) $newDay.addClass("calendar-date-active");
-            $newDay.addClass("calendar-date-active");
+        if (this.date.isSame(this.todaysDate, 'day')) $newDay.addClass("calendar-date-today");
-        }
-
-        if (this.date.isSame(this.todaysDate, 'day')) {
-            $newDay.addClass("calendar-date-today");
-        }
 
         $newDay.append($date);
         return $newDay;
@@ -353,29 +296,26 @@ export default class CalendarWidget extends RightDropdownButtonWidget {
 
     createWeekNumber(weekNumber: number) {
         const weekNoteId = this.date.local().format('YYYY-') + 'W' + String(weekNumber).padStart(2, '0');
-
         let $newWeekNumber;
+
         if (this.weekNoteEnable) {
-            // Utilize the hover effect of calendar-date
             $newWeekNumber = $("<a>").addClass("calendar-date");
-
             if (this.weekNotes.includes(weekNoteId)) {
-                $newWeekNumber.addClass("calendar-date-exists");
+                $newWeekNumber.addClass("calendar-date-exists").attr("data-href", `#root/${weekNoteId}`);
-                $newWeekNumber.attr("data-href", `#root/${weekNoteId}`);
             }
-
         } else {
             $newWeekNumber = $("<span>").addClass("calendar-week-number-disabled");
         }
+
         $newWeekNumber.addClass("calendar-week-number").attr("data-calendar-week-number", weekNoteId);
         $newWeekNumber.append($("<span>").html(String(weekNumber)));
-
         return $newWeekNumber;
     }
 
-    private getPrevMonthDays(firstDayOfWeek: number): { weekNumber: number, dates: Dayjs[] } {
+    // Use isoWeekday() consistently
+    private getPrevMonthDays(firstDayISO: number): { weekNumber: number, dates: Dayjs[] } {
         const prevMonthLastDay = this.date.subtract(1, 'month').endOf('month');
-        const daysToAdd = (firstDayOfWeek - this.firstDayOfWeek + 7) % 7;
+        const daysToAdd = (firstDayISO - this.firstDayOfWeekISO + 7) % 7;
         const dates: Dayjs[] = [];
 
         const firstDay = this.date.startOf('month');
@@ -389,18 +329,16 @@ export default class CalendarWidget extends RightDropdownButtonWidget {
         return { weekNumber, dates };
     }
 
-    private getNextMonthDays(lastDayOfWeek: number): Dayjs[] {
+    private getNextMonthDays(lastDayISO: number): Dayjs[] {
         const nextMonthFirstDay = this.date.add(1, 'month').startOf('month');
         const dates: Dayjs[] = [];
 
-        const lastDayOfUserWeek = (this.firstDayOfWeek + 6) % 7;
+        const lastDayOfUserWeek = ((this.firstDayOfWeekISO + 6 - 1) % 7) + 1; // ISO wrap
-        const daysToAdd = (lastDayOfUserWeek - lastDayOfWeek + 7) % 7;
+        const daysToAdd = (lastDayOfUserWeek - lastDayISO + 7) % 7;
 
-        // Get dates from next month
         for (let i = 0; i < daysToAdd; i++) {
             dates.push(nextMonthFirstDay.add(i, 'day'));
         }
-
         return dates;
     }
 
@@ -411,12 +349,11 @@ export default class CalendarWidget extends RightDropdownButtonWidget {
         this.$month.empty();
 
         const firstDay = this.date.startOf('month');
-        const firstDayOfWeek = firstDay.day();
+        const firstDayISO = firstDay.isoWeekday();
-
-        // Add dates from previous month
-        if (firstDayOfWeek !== this.firstDayOfWeek) {
-            const { weekNumber, dates } = this.getPrevMonthDays(firstDayOfWeek);
 
+        // Previous month filler
+        if (firstDayISO !== this.firstDayOfWeekISO) {
+            const { weekNumber, dates } = this.getPrevMonthDays(firstDayISO);
             const prevMonth = this.date.subtract(1, 'month').format('YYYY-MM');
             const dateNotesForPrevMonth: DateNotesForMonth = await server.get(`special-notes/notes-for-month/${prevMonth}`);
 
@@ -435,18 +372,16 @@ export default class CalendarWidget extends RightDropdownButtonWidget {
 
         const currentMonth = this.date.month();
 
+        // Main month
         while (this.date.month() === currentMonth) {
             const weekNumber = this.getWeekNumber(this.date);
-
+            if (this.date.isoWeekday() === this.firstDayOfWeekISO) {
-            // Add week number if it's first day of week
-            if (this.date.day() === this.firstDayOfWeek) {
                 const $weekNumber = this.createWeekNumber(weekNumber);
                 this.$month.append($weekNumber);
             }
 
             const $day = this.createDay(dateNotesForMonth, this.date.date());
             this.$month.append($day);
-
             this.date = this.date.add(1, 'day');
         }
         // while loop trips over and day is at 30/31, bring it back
@@ -454,11 +389,11 @@ export default class CalendarWidget extends RightDropdownButtonWidget {
 
         // Add dates from next month
         const lastDayOfMonth = this.date.endOf('month');
-        const lastDayOfWeek = lastDayOfMonth.day();
+        const lastDayISO = lastDayOfMonth.isoWeekday();
-        const lastDayOfUserWeek = (this.firstDayOfWeek + 6) % 7;
+        const lastDayOfUserWeek = ((this.firstDayOfWeekISO + 6 - 1) % 7) + 1;
-        if (lastDayOfWeek !== lastDayOfUserWeek) {
-            const dates = this.getNextMonthDays(lastDayOfWeek);
 
+        if (lastDayISO !== lastDayOfUserWeek) {
+            const dates = this.getNextMonthDays(lastDayISO);
             const nextMonth = this.date.add(1, 'month').format('YYYY-MM');
             const dateNotesForNextMonth: DateNotesForMonth = await server.get(`special-notes/notes-for-month/${nextMonth}`);
 
@@ -477,9 +412,12 @@ export default class CalendarWidget extends RightDropdownButtonWidget {
     }
 
     async entitiesReloadedEvent({ loadResults }: EventData<"entitiesReloaded">) {
-        if (!loadResults.getOptionNames().includes("firstDayOfWeek") &&
+        const WEEK_OPTIONS: (keyof OptionDefinitions)[] = [
-            !loadResults.getOptionNames().includes("firstWeekOfYear") &&
+            "firstDayOfWeek",
-            !loadResults.getOptionNames().includes("minDaysInFirstWeek")) {
+            "firstWeekOfYear",
+            "minDaysInFirstWeek",
+        ];
+        if (!WEEK_OPTIONS.some(opt => loadResults.getOptionNames().includes(opt))) {
             return;
         }
 

apps/client/src/widgets/buttons/global_menu.css

@@ -55,7 +55,7 @@ button.global-menu-button {
 
 .global-menu-button-update-available {
     position: absolute;
-    right: -30px;
+    inset-inline-end: -30px;
     bottom: -30px;
     width: 100%;
     height: 100%;
@@ -69,7 +69,7 @@ button.global-menu-button {
 }
 
 .global-menu .zoom-buttons {
-    margin-left: 2em;
+    margin-inline-start: 2em;
 }
 
 .global-menu .zoom-buttons a {
@@ -79,7 +79,7 @@ button.global-menu-button {
     color: var(--button-text-color);
     background-color: var(--button-background-color);
     padding: 3px;
-    margin-left: 3px;
+    margin-inline-start: 3px;
     text-decoration: none;
 }
 
@@ -88,15 +88,15 @@ button.global-menu-button {
 }
 
 .global-menu .zoom-state {
-    margin-left: 5px;
+    margin-inline-start: 5px;
-    margin-right: 5px;
+    margin-inline-end: 5px;
 }
 
 .global-menu .dropdown-item .bx {
     position: relative;
     top: 3px;
     font-size: 120%;
-    margin-right: 6px;
+    margin-inline-end: 6px;
 }
 
 /* #region Update available */

apps/client/src/widgets/buttons/global_menu.tsx

@@ -58,7 +58,7 @@ export default function GlobalMenu({ isHorizontalLayout }: { isHorizontalLayout:
             <KeyboardActionMenuItem command="showHelp" icon="bx bx-help-circle" text={t("global_menu.show_help")} />
             <KeyboardActionMenuItem command="showCheatsheet" icon="bx bxs-keyboard" text={t("global_menu.show-cheatsheet")} />
             <MenuItem command="openAboutDialog" icon="bx bx-info-circle" text={t("global_menu.about")} />
-            {isUpdateAvailable && <MenuItem command={() => window.open("https://github.com/TriliumNext/Trilium/releases/latest")} icon="bx bx-sync" text={`Version ${latestVersion} is available, click to download.`} /> }
+            {isUpdateAvailable && <MenuItem command={() => window.open("https://github.com/TriliumNext/Trilium/releases/latest")} icon="bx bx-sync" text={t("global_menu.update_available", { latestVersion })} /> }
             {!isElectron() && <BrowserOnlyOptions />}
         </Dropdown>
     )

apps/client/src/widgets/buttons/right_dropdown_button.ts

@@ -1,3 +1,4 @@
+import { handleRightToLeftPlacement } from "../../services/utils.js";
 import BasicWidget from "../basic_widget.js";
 import { Tooltip, Dropdown } from "bootstrap";
 type PopoverPlacement = Tooltip.PopoverPlacement;
@@ -48,8 +49,8 @@ export default class RightDropdownButtonWidget extends BasicWidget {
 
         this.$tooltip = this.$widget.find(".tooltip-trigger").attr("title", this.title);
         this.tooltip = new Tooltip(this.$tooltip[0], {
-            placement: this.settings.titlePlacement,
+            placement: handleRightToLeftPlacement(this.settings.titlePlacement),
-            fallbackPlacements: [this.settings.titlePlacement]
+            fallbackPlacements: [ handleRightToLeftPlacement(this.settings.titlePlacement) ]
         });
 
         this.$widget

apps/client/src/widgets/close_zen_button.css

@@ -11,7 +11,7 @@ body.zen .close-zen-container {
     display: block;
     position: fixed;
     top: 2px;
-    right: 2px;
+    inset-inline-end: 2px;
     z-index: 9999;
     -webkit-app-region: no-drag;
 }
@@ -21,6 +21,6 @@ body.zen.mobile .close-zen-container {
 }
 
 body.zen.electron:not(.platform-darwin):not(.native-titlebar) .close-zen-container {
-    left: calc(env(titlebar-area-width) - var(--zen-button-size) - 2px);
+    inset-inline-start: calc(env(titlebar-area-width) - var(--zen-button-size) - 2px);
-    right: unset;
+    inset-inline-end: unset;
 }

apps/client/src/widgets/collections/board/card.tsx

@@ -63,6 +63,14 @@ export default function Card({
         setBranchIdToEdit?.(branch.branchId);
     }, [ setBranchIdToEdit, branch ]);
 
+    const handleKeyDown = useCallback((e: KeyboardEvent) => {
+        if (e.key === "Enter") {
+            api.openNote(note.noteId);
+        } else if (e.key === "F2") {
+            setBranchIdToEdit?.(branch.branchId);
+        }
+    }, [ setBranchIdToEdit, note ]);
+
     useEffect(() => {
         editorRef.current?.focus();
     }, [ isEditing ]);
@@ -83,9 +91,11 @@ export default function Card({
             onDragEnd={handleDragEnd}
             onContextMenu={handleContextMenu}
             onClick={!isEditing ? handleOpen : undefined}
+            onKeyDown={handleKeyDown}
             style={{
                 display: !isVisible ? "none" : undefined
             }}
+            tabIndex={300}
         >
             {!isEditing ? (
                 <>

apps/client/src/widgets/collections/board/column.tsx

@@ -50,6 +50,12 @@ export default function Column({
         openColumnContextMenu(api, e, column);
     }, [ api, column ]);
 
+    const handleTitleKeyDown = useCallback((e: KeyboardEvent) => {
+        if (e.key === "F2") {
+            setColumnNameToEdit?.(column);
+        }
+    }, [ column ]);
+
     /** Allow using mouse wheel to scroll inside card, while also maintaining column horizontal scrolling. */
     const handleScroll = useCallback((event: JSX.TargetedWheelEvent<HTMLDivElement>) => {
         const el = event.currentTarget;
@@ -82,7 +88,6 @@ export default function Column({
             onDragOver={isAnyColumnDragging ? handleColumnDragOver : handleDragOver}
             onDragLeave={handleDragLeave}
             onDrop={handleDrop}
-            onWheel={handleScroll}
             style={{
                 display: !isVisible ? "none" : undefined
             }}
@@ -93,6 +98,8 @@ export default function Column({
                 onDragStart={handleColumnDragStart}
                 onDragEnd={handleColumnDragEnd}
                 onContextMenu={handleContextMenu}
+                onKeyDown={handleTitleKeyDown}
+                tabIndex={300}
             >
                 {!isEditing ? (
                     <>
@@ -112,33 +119,35 @@ export default function Column({
                 )}
             </h3>
 
-            {(columnItems ?? []).map(({ note, branch }, index) => {
+            <div className="board-column-content" onWheel={handleScroll}>
-                const showIndicatorBefore = dropPosition?.column === column &&
+                {(columnItems ?? []).map(({ note, branch }, index) => {
-                                          dropPosition.index === index &&
+                    const showIndicatorBefore = dropPosition?.column === column &&
-                                          draggedCard?.noteId !== note.noteId;
+                                            dropPosition.index === index &&
+                                            draggedCard?.noteId !== note.noteId;
 
-                return (
+                    return (
-                    <>
+                        <>
-                        {showIndicatorBefore && (
+                            {showIndicatorBefore && (
-                            <div className="board-drop-placeholder show" />
+                                <div className="board-drop-placeholder show" />
-                        )}
+                            )}
-                        <Card
+                            <Card
-                            key={note.noteId}
+                                key={note.noteId}
-                            api={api}
+                                api={api}
-                            note={note}
+                                note={note}
-                            branch={branch}
+                                branch={branch}
-                            column={column}
+                                column={column}
-                            index={index}
+                                index={index}
-                            isDragging={draggedCard?.noteId === note.noteId}
+                                isDragging={draggedCard?.noteId === note.noteId}
-                        />
+                            />
-                    </>
+                        </>
-                );
+                    );
-            })}
+                })}
-            {dropPosition?.column === column && dropPosition.index === (columnItems?.length ?? 0) && (
+                {dropPosition?.column === column && dropPosition.index === (columnItems?.length ?? 0) && (
-                <div className="board-drop-placeholder show" />
+                    <div className="board-drop-placeholder show" />
-            )}
+                )}
 
-            <AddNewItem api={api} column={column} />
+                <AddNewItem api={api} column={column} />
+            </div>
         </div>
     )
 }
@@ -146,11 +155,18 @@ export default function Column({
 function AddNewItem({ column, api }: { column: string, api: BoardApi }) {
     const [ isCreatingNewItem, setIsCreatingNewItem ] = useState(false);
     const addItemCallback = useCallback(() => setIsCreatingNewItem(true), []);
+    const handleKeyDown = useCallback((e: KeyboardEvent) => {
+        if (!isCreatingNewItem && e.key === "Enter") {
+            setIsCreatingNewItem(true);
+        }
+    }, []);
 
     return (
         <div
             className={`board-new-item ${isCreatingNewItem ? "editing" : ""}`}
             onClick={addItemCallback}
+            onKeyDown={handleKeyDown}
+            tabIndex={300}
         >
             {!isCreatingNewItem ? (
                 <>

apps/client/src/widgets/collections/board/index.css

@@ -23,11 +23,12 @@
   flex-shrink: 0;
   border: 2px solid transparent;
   border-radius: 8px;
-  padding: 0.5em;
   background-color: var(--accented-background-color);
   transition: border-color 0.2s ease;
   overflow-y: auto;
   max-height: 100%;
+  display: flex;
+  flex-direction: column;
 }
 
 .board-view-container .board-column.drag-over {
@@ -37,7 +38,7 @@
 
 .board-view-container .board-column h3 {
   font-size: 1em;
-  margin-bottom: 0.75em;
+  margin: 0;
   padding: 0.5em 0.5em 0.5em 0.5em;
   border-bottom: 1px solid var(--main-border-color);
   cursor: grab;
@@ -92,12 +93,18 @@
 
 .board-view-container .board-column .edit-icon {
   opacity: 0;
-  margin-left: 0.5em;
+  margin-inline-start: 0.5em;
   transition: opacity 0.2s ease;
   color: var(--muted-text-color);
   cursor: pointer;
 }
 
+.board-view-container .board-column > .board-column-content {
+  flex-grow: 1;
+  overflow: scroll;
+  padding: 0.5em;
+}
+
 .board-view-container .board-column h3:hover .edit-icon,
 .board-view-container .board-note:hover .edit-icon {
   opacity: 1;
@@ -121,6 +128,15 @@
   font-size: var(--card-font-size);
 }
 
+.board-view-container .board-note:first-of-type {
+  margin-top: 0;
+}
+
+.board-view-container :focus {
+  outline: 3px solid var(--input-focus-outline-color);
+  outline-offset: 0;
+}
+
 .board-view-container .board-note {
   transition: transform 0.2s ease, box-shadow 0.2s ease, opacity 0.15s ease, margin-top 0.2s ease;
 }
@@ -130,14 +146,14 @@
 }
 
 .board-view-container .board-note .icon {
-  margin-right: 0.25em;
+  margin-inline-end: 0.25em;
   display: inline;
 }
 
 .board-view-container .board-note > .edit-icon {
   position: absolute;
   top: 8px;
-  right: 4px;
+  inset-inline-end: 4px;
   padding: 2px;
   background-color: var(--main-background-color);
 }
@@ -149,10 +165,10 @@
 .board-view-container .board-note:hover > .edit-icon {
   position: absolute;
   top: 8px;
-  right: 4px;
+  inset-inline-end: 4px;
   color: var(--main-text-color);
   background-color: var(--main-background-color);
-  padding-left: 6px;
+  padding-inline-start: 6px;
 }
 
 .board-view-container .board-note.fade-in {
@@ -253,7 +269,7 @@
 }
 
 .board-new-item .icon {
-  margin-right: 0.25em;
+  margin-inline-end: 0.25em;
 }
 
 .board-add-column {
@@ -280,7 +296,7 @@
 }
 
 .board-add-column .icon {
-  margin-right: 0.5em;
+  margin-inline-end: 0.5em;
   font-size: 1.2em;
 }
 

apps/client/src/widgets/collections/board/index.tsx

@@ -227,10 +227,12 @@ export function TitleEditor({ currentValue, placeholder, save, dismiss, multilin
     isNewItem?: boolean;
 }) {
     const inputRef = useRef<any>(null);
+    const focusElRef = useRef<Element>(null);
     const dismissOnNextRefreshRef = useRef(false);
     const shouldDismiss = useRef(false);
 
     useEffect(() => {
+        focusElRef.current = document.activeElement;
         inputRef.current?.focus();
         inputRef.current?.select();
     }, [ inputRef ]);
@@ -254,8 +256,11 @@ export function TitleEditor({ currentValue, placeholder, save, dismiss, multilin
             onKeyDown={(e: TargetedKeyboardEvent<HTMLInputElement | HTMLTextAreaElement>) => {
                 if (e.key === "Enter" || e.key === "Escape") {
                     e.preventDefault();
+                    e.stopPropagation();
                     shouldDismiss.current = (e.key === "Escape");
-                    e.currentTarget.blur();
+                    if (focusElRef.current instanceof HTMLElement) {
+                        focusElRef.current.focus();
+                    }
                 }
             }}
             onBlur={(newValue) => {

apps/client/src/widgets/collections/calendar/index.css

@@ -13,8 +13,8 @@
 .search-result-widget-content .calendar-view {
     position: absolute;
     top: 0;
-    left: 0;
+    inset-inline-start: 0;
-    right: 0;
+    inset-inline-end: 0;
     bottom: 0;
 }
 
@@ -67,10 +67,10 @@
 }
 
 body.desktop:not(.zen) .calendar-view .calendar-header {
-    padding-right: 5em;
+    padding-inline-end: 5em;
 }
 
 .search-result-widget-content .calendar-view .calendar-header {
-    padding-right: unset !important;
+    padding-inline-end: unset !important;
 }
 /* #endregion */

apps/client/src/widgets/collections/calendar/index.tsx

@@ -4,7 +4,7 @@ import Calendar from "./calendar";
 import { useCallback, useEffect, useMemo, useRef, useState } from "preact/hooks";
 import "./index.css";
 import { useNoteLabel, useNoteLabelBoolean, useResizeObserver, useSpacedUpdate, useTriliumEvent, useTriliumOption, useTriliumOptionInt } from "../../react/hooks";
-import { LOCALE_IDS } from "@triliumnext/commons";
+import { DISPLAYABLE_LOCALE_IDS } from "@triliumnext/commons";
 import { Calendar as FullCalendar } from "@fullcalendar/core";
 import { parseStartEndDateFromEvent, parseStartEndTimeFromEvent } from "./utils";
 import dialog from "../../../services/dialog";
@@ -62,7 +62,7 @@ const CALENDAR_VIEWS = [
 const SUPPORTED_CALENDAR_VIEW_TYPE = CALENDAR_VIEWS.map(v => v.type);
 
 // Here we hard-code the imports in order to ensure that they are embedded by webpack without having to load all the languages.
-export const LOCALE_MAPPINGS: Record<LOCALE_IDS, (() => Promise<{ default: LocaleInput }>) | null> = {
+export const LOCALE_MAPPINGS: Record<DISPLAYABLE_LOCALE_IDS, (() => Promise<{ default: LocaleInput }>) | null> = {
     de: () => import("@fullcalendar/core/locales/de"),
     es: () => import("@fullcalendar/core/locales/es"),
     fr: () => import("@fullcalendar/core/locales/fr"),
@@ -71,9 +71,12 @@ export const LOCALE_MAPPINGS: Record<LOCALE_IDS, (() => Promise<{ default: Local
     ro: () => import("@fullcalendar/core/locales/ro"),
     ru: () => import("@fullcalendar/core/locales/ru"),
     ja: () => import("@fullcalendar/core/locales/ja"),
+    pt: () => import("@fullcalendar/core/locales/pt"),
     "pt_br": () => import("@fullcalendar/core/locales/pt-br"),
     uk: () => import("@fullcalendar/core/locales/uk"),
-    en: null
+    en: null,
+    "en_rtl": null,
+    ar: () => import("@fullcalendar/core/locales/ar")
 };
 
 export default function CalendarView({ note, noteIds }: ViewModeProps<CalendarViewData>) {

apps/client/src/widgets/collections/geomap/index.css

@@ -36,14 +36,14 @@
 .geo-map-container .leaflet-div-icon .icon-shadow {
   position: absolute;
   top: 0;
-  left: 0;
+  inset-inline-start: 0;
   z-index: -1;
 }
 
 .geo-map-container .leaflet-div-icon .bx {
   position: absolute;
   top: 3px;
-  left: 2px;
+  inset-inline-start: 2px;
   background-color: white;
   color: black;
   padding: 2px;
@@ -55,7 +55,7 @@
   display: block;
   position: absolute;
   top: 100%;
-  left: 50%;
+  inset-inline-start: 50%;
   transform: translateX(-50%);
   font-size: 0.75rem;
   height: 1rem;
@@ -68,6 +68,10 @@
   overflow: hidden;
 }
 
+body[dir=rtl] .geo-map-container .leaflet-div-icon .title-label {
+  transform: translateX(50%);
+}
+
 .geo-map-container .leaflet-div-icon .archived {
   opacity: 0.5;
 }

apps/client/src/widgets/collections/legacy/ListOrGridView.css

@@ -57,7 +57,7 @@
 .note-book-header .note-icon {
     font-size: 100%;
     display: inline-block;
-    padding-right: 7px;
+    padding-inline-end: 7px;
     position: relative;
 }
 

apps/client/src/widgets/collections/legacy/ListOrGridView.tsx

@@ -59,8 +59,8 @@ function ListNoteCard({ note, parentNote, expand, highlightedTokens }: { note: F
     const [ isExpanded, setExpanded ] = useState(expand);
     const notePath = getNotePath(parentNote, note);
 
-    // Reset expand state if switching to another note.
+    // Reset expand state if switching to another note, or if user manually toggled expansion state.
-    useEffect(() => setExpanded(expand), [ note ]);
+    useEffect(() => setExpanded(expand), [ note, expand ]);
 
     return (
         <div

apps/client/src/widgets/collections/table/index.css

@@ -13,8 +13,8 @@
 .search-result-widget-content .table-view {
     position: absolute;
     top: 0;
-    left: 0;
+    inset-inline-start: 0;
-    right: 0;
+    inset-inline-end: 0;
     bottom: 0;
 }
 
@@ -33,7 +33,7 @@
 
 .tabulator .tabulator-header .tabulator-frozen.tabulator-frozen-left,
 .tabulator-row .tabulator-cell.tabulator-frozen.tabulator-frozen-left {
-    border-right-width: 1px;
+    border-inline-end-width: 1px;
 }
 
 .tabulator .tabulator-row.archived {
@@ -65,7 +65,7 @@
 .tabulator button.tree-collapse span {
     position: absolute;
     top: 0;
-    left: 0;
+    inset-inline-start: 0;
     font-size: 1.5em;
     transform: translateY(-50%);
 }

apps/client/src/widgets/collections/table/index.tsx

@@ -54,7 +54,7 @@ export default function TableView({ note, noteIds, notePath, viewConfig, saveCon
 
     return (
         <div className="table-view">
-            {persistenceProps &&  (
+            {rowData !== undefined && persistenceProps &&  (
                 <>
                     <Tabulator
                         tabulatorRef={tabulatorRef}

apps/client/src/widgets/collections/table/tabulator.tsx

@@ -16,7 +16,7 @@ interface TableProps<T> extends Omit<Options, "data" | "footerElement" | "index"
     footerElement?: string | HTMLElement | JSX.Element;
 }
 
-export default function Tabulator<T>({ className, columns, data, modules, tabulatorRef: externalTabulatorRef, footerElement, events, index, ...restProps }: TableProps<T>) {
+export default function Tabulator<T>({ className, columns, data, modules, tabulatorRef: externalTabulatorRef, footerElement, events, index, dataTree, ...restProps }: TableProps<T>) {
     const parentComponent = useContext(ParentComponent);
     const containerRef = useRef<HTMLDivElement>(null);
     const tabulatorRef = useRef<VanillaTabulator>(null);
@@ -36,6 +36,7 @@ export default function Tabulator<T>({ className, columns, data, modules, tabula
             data,
             footerElement: (parentComponent && isValidElement(footerElement) ? renderReactWidget(parentComponent, footerElement)[0] : undefined),
             index: index as string | number | undefined,
+            dataTree,
             ...restProps
         });
 
@@ -45,7 +46,7 @@ export default function Tabulator<T>({ className, columns, data, modules, tabula
         });
 
         return () => tabulator.destroy();
-    }, []);
+    }, [ dataTree ] );
 
     useEffect(() => {
         const tabulator = tabulatorRef.current;

apps/client/src/widgets/containers/root_container.ts

@@ -3,6 +3,7 @@ import FlexContainer from "./flex_container.js";
 import options from "../../services/options.js";
 import type BasicWidget from "../basic_widget.js";
 import utils from "../../services/utils.js";
+import { LOCALES } from "@triliumnext/commons";
 
 /**
  * The root container is the top-most widget/container, from which the entire layout derives.
@@ -32,6 +33,7 @@ export default class RootContainer extends FlexContainer<BasicWidget> {
         this.#setMotion(options.is("motionEnabled"));
         this.#setShadows(options.is("shadowsEnabled"));
         this.#setBackdropEffects(options.is("backdropEffectsEnabled"));
+        this.#setLocaleAndDirection(options.get("locale"));
 
         return super.render();
     }
@@ -68,6 +70,12 @@ export default class RootContainer extends FlexContainer<BasicWidget> {
     #setBackdropEffects(enabled: boolean) {
         document.body.classList.toggle("backdrop-effects-disabled", !enabled);
     }
+
+    #setLocaleAndDirection(locale: string) {
+        const correspondingLocale = LOCALES.find(l => l.id === locale);
+        document.body.lang = locale;
+        document.body.dir = correspondingLocale?.rtl ? "rtl" : "ltr";
+    }
 }
 
 function getViewportHeight() {

apps/client/src/widgets/dialogs/bulk_actions.css

@@ -4,7 +4,7 @@
 
 .bulk-actions-dialog .bulk-available-action-list button {
     padding: 2px 7px;
-    margin-right: 10px;
+    margin-inline-end: 10px;
     margin-bottom: 5px;
 }
 
@@ -19,7 +19,7 @@
 .bulk-actions-dialog .bulk-existing-action-list .button-column {
     width: 50px;
     white-space: nowrap;
-    text-align: right;
+    text-align: end;
 }
 
 .bulk-actions-dialog .bulk-existing-action-list .button-column > * {

apps/client/src/widgets/dialogs/export.css

@@ -4,11 +4,11 @@
 }
 
 .export-dialog form .format-choice {
-    padding-left: 40px;
+    padding-inline-start: 40px;
 }
 
 .export-dialog form .opml-versions {
-    padding-left: 60px;
+    padding-inline-start: 60px;
 }
 
 .export-dialog form .form-check-label {

apps/client/src/widgets/dialogs/popup_editor.ts

@@ -45,8 +45,8 @@ const TPL = /*html*/`\
         .modal.popup-editor-dialog .classic-toolbar-widget {
             position: sticky;
             top: 0;
-            left: 0;
+            inset-inline-start: 0;
-            right: 0;
+            inset-inline-end: 0;
             background: var(--modal-background-color);
             z-index: 998;
         }

apps/client/src/widgets/dialogs/revisions.tsx

@@ -115,7 +115,7 @@ export default function RevisionsDialog() {
 
                 <div className="revision-content-wrapper" style={{
                     flexGrow: "1",
-                    marginLeft: "20px",
+                    marginInlineStart: "20px",
                     display: "flex",
                     flexDirection: "column",
                     maxWidth: "calc(100% - 150px)",

apps/client/src/widgets/find.ts

@@ -32,7 +32,7 @@ const TPL = /*html*/`
         }
 
         .find-widget-box > *, .replace-widget-box > *{
-            margin-right: 15px;
+            margin-inline-end: 15px;
         }
 
         .find-widget-box, .replace-widget-box {

apps/client/src/widgets/highlights_list.ts

@@ -24,7 +24,7 @@ const TPL = /*html*/`<div class="highlights-list-widget">
         }
 
         .highlights-list > ol {
-            padding-left: 20px;
+            padding-inline-start: 20px;
         }
 
         .highlights-list li {

apps/client/src/widgets/icon_list.ts

@@ -2090,14 +2090,14 @@ const icons: Icon[] = [
         term: ["keypad"]
     },
     {
-        name: "border-right",
+        name: "border-inline-end",
-        slug: "border-right-regular",
+        slug: "border-inline-end-regular",
         category_id: 111,
         type_of_icon: "REGULAR"
     },
     {
-        name: "border-left",
+        name: "border-inline-start",
-        slug: "border-left-regular",
+        slug: "border-inline-start-regular",
         category_id: 111,
         type_of_icon: "REGULAR"
     },

apps/client/src/widgets/llm_chat/ui.ts

@@ -9,7 +9,7 @@ import { formatMarkdown, applyHighlighting } from "./utils.js";
 export const TPL = `
 <div class="note-context-chat h-100 w-100 d-flex flex-column">
     <!-- Move validation warning outside the card with better styling -->
-    <div class="provider-validation-warning alert alert-warning m-2 border-left border-warning" style="display: none; padding-left: 15px; border-left: 4px solid #ffc107; background-color: rgba(255, 248, 230, 0.9); font-size: 0.9rem; box-shadow: 0 2px 5px rgba(0,0,0,0.05);"></div>
+    <div class="provider-validation-warning alert alert-warning m-2 border-inline-start border-warning" style="display: none; padding-inline-start: 15px; border-inline-start: 4px solid #ffc107; background-color: rgba(255, 248, 230, 0.9); font-size: 0.9rem; box-shadow: 0 2px 5px rgba(0,0,0,0.05);"></div>
 
     <div class="note-context-chat-container flex-grow-1 overflow-auto p-3">
         <div class="note-context-chat-messages"></div>

apps/client/src/widgets/mobile_widgets/mobile_detail_menu.tsx

@@ -25,7 +25,7 @@ export default function MobileDetailMenu() {
                         { title: t("mobile_detail_menu.insert_child_note"), command: "insertChildNote", uiIcon: "bx bx-plus", enabled: note?.type !== "search" },
                         { title: t("mobile_detail_menu.delete_this_note"), command: "delete", uiIcon: "bx bx-trash", enabled: note?.noteId !== "root" },
                         { kind: "separator" },
-                        { title: "Note revisions", command: "showRevisions", uiIcon: "bx bx-history" }
+                        { title: t("mobile_detail_menu.note_revisions"), command: "showRevisions", uiIcon: "bx bx-history" }
                     ],
                     selectMenuItemHandler: async ({ command }) => {
                         if (command === "insertChildNote") {

apps/client/src/widgets/mobile_widgets/sidebar_container.ts

@@ -27,6 +27,7 @@ export default class SidebarContainer extends FlexContainer<BasicWidget> {
     private backdropEl!: HTMLElement;
     private originalSidebarTransition: string;
     private originalBackdropTransition: string;
+    private screenWidth: number;
 
     constructor(screenName: Screen, direction: FlexDirection) {
         super(direction);
@@ -37,6 +38,7 @@ export default class SidebarContainer extends FlexContainer<BasicWidget> {
         this.dragState = DRAG_STATE_NONE;
         this.originalSidebarTransition = "";
         this.originalBackdropTransition = "";
+        this.screenWidth = document.body.getBoundingClientRect().width;
     }
 
     doRender() {
@@ -51,7 +53,9 @@ export default class SidebarContainer extends FlexContainer<BasicWidget> {
         const x = "touches" in e ? e.touches[0].clientX : e.clientX;
         this.startX = x;
 
-        if (x > 30 && this.currentTranslate === -100) {
+        // Prevent dragging if too far from the edge of the screen and the menu is closed.
+        let dragRefX = glob.isRtl ? this.screenWidth - x : x;
+        if (dragRefX > 30 && this.currentTranslate === -100) {
             return;
         }
 
@@ -66,7 +70,7 @@ export default class SidebarContainer extends FlexContainer<BasicWidget> {
         }
 
         const x = "touches" in e ? e.touches[0].clientX : e.clientX;
-        const deltaX = x - this.startX;
+        const deltaX = glob.isRtl ? this.startX - x : x - this.startX;
         if (this.dragState === DRAG_STATE_INITIAL_DRAG) {
             if (this.currentTranslate === -100 ? deltaX > DRAG_CLOSED_START_THRESHOLD : deltaX < -DRAG_OPENED_START_THRESHOLD) {
                 /* Disable the transitions since they affect performance, they are going to reenabled once drag ends. */
@@ -85,10 +89,15 @@ export default class SidebarContainer extends FlexContainer<BasicWidget> {
             }
         } else if (this.dragState === DRAG_STATE_DRAGGING) {
             const width = this.sidebarEl.offsetWidth;
-            const translatePercentage = Math.min(0, Math.max(this.currentTranslate + (deltaX / width) * 100, -100));
+            let translatePercentage = Math.min(0, Math.max(this.currentTranslate + (deltaX / width) * 100, -100));
+            const backdropOpacity = Math.max(0, 1 + translatePercentage / 100);
             this.translatePercentage = translatePercentage;
-            this.sidebarEl.style.transform = `translateX(${translatePercentage}%)`;
+            if (glob.isRtl) {
-            this.backdropEl.style.opacity = String(Math.max(0, 1 + translatePercentage / 100));
+                this.sidebarEl.style.transform = `translateX(${-translatePercentage}%)`;
+            } else {
+                this.sidebarEl.style.transform = `translateX(${translatePercentage}%)`;
+            }
+            this.backdropEl.style.opacity = String(backdropOpacity);
         }
 
         // Consume the event to prevent the user from doing the back to previous page gesture on iOS.
@@ -149,7 +158,15 @@ export default class SidebarContainer extends FlexContainer<BasicWidget> {
         }
 
         this.sidebarEl.classList.toggle("show", isOpen);
-        this.sidebarEl.style.transform = isOpen ? "translateX(0)" : "translateX(-100%)";
+        if (isOpen) {
+            this.sidebarEl.style.transform = "translateX(0)";
+        } else {
+            if (glob.isRtl) {
+                this.sidebarEl.style.transform = "translateX(100%)"
+            } else {
+                this.sidebarEl.style.transform = "translateX(-100%)";
+            }
+        }
         this.sidebarEl.style.transition = this.originalSidebarTransition;
 
         this.backdropEl.classList.toggle("show", isOpen);

apps/client/src/widgets/note_icon.css

@@ -1,6 +1,6 @@
 .note-icon-widget {
-    padding-left: 7px;
+    padding-inline-start: 7px;
-    margin-right: 0;
+    margin-inline-end: 0;
     width: 50px;
     height: 50px;
 }
@@ -29,15 +29,15 @@
 .note-icon-widget .filter-row {
     padding-top: 10px;
     padding-bottom: 10px;
-    padding-right: 20px;
+    padding-inline-end: 20px;
     display: flex;
     align-items: baseline;
 }
 
 .note-icon-widget .filter-row span {
     display: block;
-    padding-left: 15px;
+    padding-inline-start: 15px;
-    padding-right: 15px;
+    padding-inline-end: 15px;
     font-weight: bold;
 }
 

apps/client/src/widgets/note_map/NoteMap.css

@@ -17,7 +17,7 @@
     /* removing default appearance */
     -webkit-appearance: none;
     appearance: none;
-    margin-left: 15px;
+    margin-inline-start: 15px;
     width: 150px;
 }
 

apps/client/src/widgets/note_tree.ts

@@ -61,7 +61,7 @@ const TPL = /*html*/`
         display: flex;
         align-items: flex-end;
         justify-content: flex-end;
-        right: 17px;
+        inset-inline-end: 17px;
         border-radius: 7px;
         border: 1px solid var(--main-border-color);
     }
@@ -82,15 +82,15 @@ const TPL = /*html*/`
     }
 
     .collapse-tree-button {
-        right: 100px;
+        inset-inline-end: 100px;
     }
 
     .scroll-to-active-note-button {
-        right: 55px;
+        inset-inline-end: 55px;
     }
 
     .tree-settings-button {
-        right: 10px;
+        inset-inline-end: 10px;
     }
 
     .tree-settings-popup {

apps/client/src/widgets/promoted_attributes.ts

@@ -45,7 +45,7 @@ const TPL = /*html*/`
     }
 
     .promoted-attribute-cell div.input-group {
-        margin-left: 10px;
+        margin-inline-start: 10px;
         display: flex;
         min-height: 40px;
     }
@@ -95,8 +95,8 @@ const TPL = /*html*/`
         content: "";
         position: absolute;
         top: 10px;
-        left: 0px;
+        inset-inline-start: 0px;
-        right: 0;
+        inset-inline-end: 0;
         height: 2px;
         background: rgba(0, 0, 0, 0.5);
         transform: rotate(45deg);

apps/client/src/widgets/quick_search.ts

@@ -2,7 +2,7 @@ import BasicWidget from "./basic_widget.js";
 import server from "../services/server.js";
 import linkService from "../services/link.js";
 import froca from "../services/froca.js";
-import utils from "../services/utils.js";
+import utils, { handleRightToLeftPlacement } from "../services/utils.js";
 import appContext from "../components/app_context.js";
 import shortcutService, { isIMEComposing } from "../services/shortcuts.js";
 import { t } from "../services/i18n.js";
@@ -43,7 +43,7 @@ const TPL = /*html*/`
     .quick-search .dropdown-item + .dropdown-item::after {
         content: '';
         position: absolute;
-        left: 0;
+        inset-inline-start: 0;
         top: 0;
         width: 100%;
         height: 1px;
@@ -248,7 +248,7 @@ export default class QuickSearchWidget extends BasicWidget {
             let tooltip = new Tooltip(this.$searchString[0], {
                 trigger: "manual",
                 title: `Search error: ${error}`,
-                placement: "right"
+                placement: handleRightToLeftPlacement("right")
             });
 
             tooltip.show();

apps/client/src/widgets/react/FormList.tsx

@@ -5,7 +5,7 @@ import { useEffect, useMemo, useRef, useState, type CSSProperties } from "preact
 import "./FormList.css";
 import { CommandNames } from "../../components/app_context";
 import { useStaticTooltip } from "./hooks";
-import { isMobile } from "../../services/utils";
+import { handleRightToLeftPlacement, isMobile } from "../../services/utils";
 
 interface FormListOpts {
     children: ComponentChildren;
@@ -95,8 +95,8 @@ interface FormListItemOpts {
 }
 
 const TOOLTIP_CONFIG: Partial<Tooltip.Options> = {
-    placement: "right",
+    placement: handleRightToLeftPlacement("right"),
-    fallbackPlacements: [ "right" ]
+    fallbackPlacements: [ handleRightToLeftPlacement("right") ]
 }
 
 export function FormListItem({ className, icon, value, title, active, disabled, checked, container, onClick, selected, rtl, triggerCommand, description, ...contentProps }: FormListItemOpts) {

apps/client/src/widgets/react/FormToggle.css

@@ -18,7 +18,7 @@
 .switch-widget .switch-button {
     display: block;
     position: relative;
-    margin-left: 8px;
+    margin-inline-start: 8px;
     width: var(--switch-track-width);
     height: var(--switch-track-height);
     border-radius: 24px;
@@ -40,7 +40,7 @@
     content: "";
     position: absolute;
     top: 0;
-    left: 0;
+    inset-inline-start: 0;
     width: var(--switch-thumb-width);
     height: var(--switch-thumb-height);
     background-color: var(--switch-off-thumb-background);
@@ -50,6 +50,10 @@
                 background 200ms ease-out;
 }
 
+body[dir=rtl] .switch-widget .switch-button:after {
+    --x: calc(var(--y) * -1);
+}
+
 .switch-widget .switch-button.on:after {
     --x: calc(var(--switch-track-width) - var(--switch-thumb-width) - var(--y));
 
@@ -58,12 +62,16 @@
                 background 100ms ease-in;
 }
 
+body[dir=rtl] .switch-widget .switch-button.on:after {
+    --x: calc((var(--switch-track-width) - var(--switch-thumb-width) - var(--y)) * -1);
+}
+
 
 .switch-widget .switch-button input[type="checkbox"] {
     /* A hidden check box for accesibility purposes */
     position: absolute;
     top: 0;
-    left: 0;
+    inset-inline-start: 0;
     width: 100%;
     height: 100%;
     opacity: 0;
@@ -86,7 +94,7 @@
 
 .switch-widget .switch-help-button {
     border: 0;
-    margin-left: 4px;
+    margin-inline-start: 4px;
     background: none;
     cursor: pointer;
     font-size: 1.1em;

apps/client/src/widgets/ribbon/BasicPropertiesTab.tsx

@@ -353,7 +353,7 @@ function NoteLanguageSwitch({ note }: { note?: FNote | null }) {
                 >{t("note_language.configure-languages")}</FormListItem>
             </Dropdown>
 
-            <HelpButton helpPage="B0lcI9xz1r8K" style={{ marginLeft: "4px" }} />
+            <HelpButton helpPage="B0lcI9xz1r8K" style={{ marginInlineStart: "4px" }} />
 
             <Modal
                 className="content-languages-modal"

apps/client/src/widgets/ribbon/SearchDefinitionOptions.tsx

@@ -263,7 +263,7 @@ function AncestorOption({ note, ...restProps}: SearchOptionProps) {
         placeholder={t("ancestor.placeholder")}
       />
 
-      <div style="margin-left: 10px; margin-right: 10px">{t("ancestor.depth_label")}:</div>
+      <div style="margin-inline-start: 10px; margin-inline-end: 10px">{t("ancestor.depth_label")}:</div>
       <FormSelect
         values={options}
         keyProperty="value" titleProperty="label"

apps/client/src/widgets/ribbon/components/AttributeEditor.tsx

@@ -4,7 +4,7 @@ import { t } from "../../../services/i18n";
 import server from "../../../services/server";
 import note_autocomplete, { Suggestion } from "../../../services/note_autocomplete";
 import CKEditor, { CKEditorApi } from "../../react/CKEditor";
-import { useLegacyImperativeHandlers, useLegacyWidget, useTooltip, useTriliumEvent } from "../../react/hooks";
+import { useLegacyImperativeHandlers, useLegacyWidget, useTooltip, useTriliumEvent, useTriliumOption } from "../../react/hooks";
 import FAttribute from "../../../entities/fattribute";
 import attribute_renderer from "../../../services/attribute_renderer";
 import FNote from "../../../entities/fnote";
@@ -100,6 +100,7 @@ export default function AttributeEditor({ api, note, componentId, notePath, ntxI
     const currentValueRef = useRef(currentValue);
     const wrapperRef = useRef<HTMLDivElement>(null);
     const editorRef = useRef<CKEditorApi>();
+    const [ locale ] = useTriliumOption("locale");
 
     const { showTooltip, hideTooltip } = useTooltip(wrapperRef, {
         trigger: "focus",
@@ -308,7 +309,8 @@ export default function AttributeEditor({ api, note, componentId, notePath, ntxI
                         toolbar: { items: [] },
                         placeholder: t("attribute_editor.placeholder"),
                         mention: { feeds: mentionSetup },
-                        licenseKey: "GPL"
+                        licenseKey: "GPL",
+                        language: "en"
                     }}
                     onChange={(currentValue) => {
                         currentValueRef.current = currentValue ?? "";

apps/client/src/widgets/ribbon/style.css

@@ -11,7 +11,7 @@
     display: flex;
     flex-direction: row;
     justify-content: center;
-    margin-left: 10px;
+    margin-inline-start: 10px;
     flex-grow: 1;
     flex-flow: row wrap;
 }
@@ -49,7 +49,7 @@
 }
 
 .ribbon-tab-title:first-of-type {
-    padding-left: 10px;
+    padding-inline-start: 10px;
 }
 
 .ribbon-tab-spacer {
@@ -70,19 +70,19 @@
 .ribbon-button-container {
     display: flex;
     border-bottom: 1px solid var(--main-border-color);
-    margin-right: 5px;
+    margin-inline-end: 5px;
 }
 
 .ribbon-button-container > * {
     position: relative;
     top: -3px;
-    margin-left: 10px;
+    margin-inline-start: 10px;
 }
 
 .ribbon-body {
     border-bottom: 1px solid var(--main-border-color);
-    margin-left: 10px;
+    margin-inline-start: 10px;
-    margin-right: 5px; /* needs to have this value so that the bottom border is the same width as the top one */
+    margin-inline-end: 5px; /* needs to have this value so that the bottom border is the same width as the top one */
 }
 
 .ribbon-body.active {
@@ -105,7 +105,7 @@
 .basic-properties-widget > * {
     margin-top: 9px;
     margin-bottom: 2px;
-    margin-right: 30px;
+    margin-inline-end: 30px;
 }
 
 .note-type-container,
@@ -262,7 +262,7 @@
 
 .note-map-ribbon-widget .open-full-button, .note-map-ribbon-widget .collapse-button {
     position: absolute;
-    right: 5px;
+    inset-inline-end: 5px;
     bottom: 5px;
     z-index: 1000;
 }
@@ -285,6 +285,11 @@
     transition: opacity .1s linear;
 }
 
+body[dir=rtl] .attribute-list-editor {
+    padding: 0 5px 0 100px !important;
+    text-align: right !important;
+}
+
 .attribute-list-editor.ck-content .mention {
     color: var(--muted-text-color) !important;
     background: transparent !important;
@@ -294,7 +299,7 @@
     display: flex;
     position: absolute;
     top: 0;
-    right: 0;
+    inset-inline-end: 0;
     bottom: 0;
     align-items: center;
     gap: 10px;
@@ -308,8 +313,8 @@
 
 /* #region Owned Attributes */
 .attribute-list {
-    margin-left: 7px;
+    margin-inline-start: 7px;
-    margin-right: 7px;
+    margin-inline-end: 7px;
     margin-top: 5px;
     margin-bottom: 2px;
     position: relative;
@@ -359,7 +364,7 @@
 }
 
 .book-properties-widget input[type="checkbox"] {
-    margin-right: 5px;
+    margin-inline-end: 5px;
 }
 
 .book-properties-widget label {
@@ -394,7 +399,7 @@
     /* minimal width so that table remains static sized and most space remains for middle column with settings */
     width: 50px;
     white-space: nowrap;
-    text-align: right;
+    text-align: end;
     vertical-align: middle;
 }
 
@@ -446,7 +451,7 @@
     position: relative;
     top: 3px;
     font-size: 120%;
-    margin-right: 5px;
+    margin-inline-end: 5px;
 }
 
 .note-actions .dropdown-item[disabled], .note-actions .dropdown-item[disabled]:hover {

apps/client/src/widgets/sql_table_schemas.css

@@ -1,6 +1,6 @@
 .sql-table-schemas-widget {
     padding: 12px;
-    padding-right: 10%;
+    padding-inline-end: 10%;
     contain: none !important;
 }
 

apps/client/src/widgets/sync_status.ts

@@ -3,7 +3,7 @@ import BasicWidget from "./basic_widget.js";
 import ws from "../services/ws.js";
 import options from "../services/options.js";
 import syncService from "../services/sync.js";
-import { escapeQuotes } from "../services/utils.js";
+import { escapeQuotes, handleRightToLeftPlacement } from "../services/utils.js";
 import { Tooltip } from "bootstrap";
 import { WebSocketMessage } from "@triliumnext/commons";
 
@@ -27,7 +27,7 @@ const TPL = /*html*/`
     .sync-status .sync-status-sub-icon {
         font-size: 40%;
         position: absolute;
-        left: 0;
+        inset-inline-start: 0;
         top: 16px;
     }
 
@@ -109,8 +109,8 @@ export default class SyncStatusWidget extends BasicWidget {
 
         Tooltip.getOrCreateInstance(this.$widget.find(`.sync-status-${className}`)[0], {
             html: true,
-            placement: this.settings.titlePlacement,
+            placement: handleRightToLeftPlacement(this.settings.titlePlacement),
-            fallbackPlacements: [this.settings.titlePlacement]
+            fallbackPlacements: [ handleRightToLeftPlacement(this.settings.titlePlacement) ]
         });
 
         this.$widget.show();

apps/client/src/widgets/tab_row.ts

@@ -155,8 +155,8 @@ const TAB_ROW_TPL = `
     }
 
     .tab-row-widget .note-tab[is-mini] .note-tab-wrapper {
-        padding-left: 2px;
+        padding-inline-start: 2px;
-        padding-right: 2px;
+        padding-inline-end: 2px;
     }
 
     .tab-row-widget .note-tab .note-tab-title {
@@ -168,11 +168,11 @@ const TAB_ROW_TPL = `
 
     .tab-row-widget .note-tab .note-tab-icon {
         position: relative;
-        padding-right: 3px;
+        padding-inline-end: 3px;
     }
 
     .tab-row-widget .note-tab[is-small] .note-tab-title {
-        margin-left: 0;
+        margin-inline-start: 0;
     }
 
     .tab-row-widget .note-tab .note-tab-drag-handle {
@@ -240,14 +240,14 @@ const TAB_ROW_TPL = `
     }
 
     .tab-row-widget .note-tab[is-smaller] .note-tab-close {
-        margin-left: auto;
+        margin-inline-start: auto;
     }
     .tab-row-widget .note-tab[is-mini]:not([active]) .note-tab-close {
         display: none;
     }
     .tab-row-widget .note-tab[is-mini][active] .note-tab-close {
-        margin-left: auto;
+        margin-inline-start: auto;
-        margin-right: auto;
+        margin-inline-end: auto;
     }
     @-moz-keyframes note-tab-was-just-added {
         to {
@@ -500,6 +500,9 @@ export default class TabRowWidget extends BasicWidget {
         position -= MARGIN_WIDTH; // the last margin should not be applied
 
         const anchorPosition = position;
+        if (glob.isRtl) {
+            tabPositions.reverse();
+        }
 
         return { tabPositions, anchorPosition };
     }

apps/client/src/widgets/toc.ts

@@ -29,13 +29,13 @@ const TPL = /*html*/`<div class="toc-widget">
             contain: none;
             overflow: auto;
             position: relative;
-            padding-left:0px !important;
+            padding-inline-start:0px !important;
         }
 
         .toc ol {
             position: relative;
             overflow: hidden;
-            padding-left: 0px;
+            padding-inline-start: 0px;
             transition: max-height 0.3s ease;
         }
 
@@ -47,7 +47,7 @@ const TPL = /*html*/`<div class="toc-widget">
             content: "";
             position: absolute;
             height: 100%;
-            border-left: 1px solid var(--main-border-color);
+            border-inline-start: 1px solid var(--main-border-color);
             z-index: 10;
         }
 
@@ -56,7 +56,7 @@ const TPL = /*html*/`<div class="toc-widget">
             position: relative;
             list-style: none;
             align-items: center;
-            padding-left: 7px;
+            padding-inline-start: 7px;
             cursor: pointer;
             text-align: justify;
             word-wrap: break-word;
@@ -80,11 +80,11 @@ const TPL = /*html*/`<div class="toc-widget">
         }
 
         .toc > ol ol::before {
-            left: calc((var(--toc-depth-level) - 2) * 20px + 14px);
+            inset-inline-start: calc((var(--toc-depth-level) - 2) * 20px + 14px);
         }
 
         .toc li {
-            padding-left: calc((var(--toc-depth-level) - 1) * 20px + 4px);
+            padding-inline-start: calc((var(--toc-depth-level) - 1) * 20px + 4px);
         }
 
         .toc li .collapse-button {
@@ -103,12 +103,12 @@ const TPL = /*html*/`<div class="toc-widget">
         }
 
         .toc li .item-content {
-            margin-left: 25px;
+            margin-inline-start: 25px;
             flex: 1;
         }
 
         .toc li .collapse-button + .item-content {
-            margin-left: 4px;
+            margin-inline-start: 4px;
         }
 
         .toc li:hover {

apps/client/src/widgets/type_widgets/Attachment.css

@@ -1,7 +1,7 @@
 /* #region Attachment list */
 .attachment-list {
-    padding-left: 15px;
+    padding-inline-start: 15px;
-    padding-right: 15px;
+    padding-inline-end: 15px;
 }
 
 .attachment-list .links-wrapper {
@@ -31,7 +31,7 @@
 }
 
 .attachment-details {
-    margin-left: 10px;
+    margin-inline-start: 10px;
 }
 
 .attachment-content-wrapper {
@@ -126,7 +126,7 @@
     position: relative;
     top: 3px;
     font-size: 120%;
-    margin-right: 5px;
+    margin-inline-end: 5px;
 }
 
 .attachment-actions .dropdown-item[disabled], .attachment-actions .dropdown-item[disabled]:hover {

apps/client/src/widgets/type_widgets/MindMap.css

@@ -10,7 +10,7 @@
 .map-container .node-menu {
     position: absolute;
     top: 60px;
-    right: 20px;
+    inset-inline-end: 20px;
     bottom: 80px;
     overflow: auto;
     background: var(--panel-bgcolor);

apps/client/src/widgets/type_widgets/helpers/SplitEditor.css

@@ -44,7 +44,7 @@
 /* Horizontal layout */
 
 .note-detail-split.split-horizontal > .note-detail-split-preview-col {
-    border-left: 1px solid var(--main-border-color);
+    border-inline-start: 1px solid var(--main-border-color);
 }
 
 .note-detail-split.split-horizontal > .note-detail-split-editor-col,

apps/client/src/widgets/type_widgets/options/code_notes.css

@@ -2,7 +2,7 @@
 .options-mime-types {
     list-style-type: none;
     column-width: 250px;
-    padding-left: 0;
+    padding-inline-start: 0;
 }
 
 .options-mime-types > section {
@@ -11,6 +11,6 @@
 }
 
 .options-mime-types ul {
-    padding-left: 0;
+    padding-inline-start: 0;
 }
 /* #endregion */

apps/client/src/widgets/type_widgets/options/i18n.tsx

@@ -23,11 +23,18 @@ export default function InternationalizationOptions() {
 }
 
 function LocalizationOptions() {
-    const { uiLocales, formattingLocales: contentLocales } = useMemo(() => {
+    const { uiLocales, formattingLocales: contentLocales } = useMemo<{ uiLocales: Locale[], formattingLocales: Locale[] }>(() => {
         const allLocales = getAvailableLocales();
         return {
-            uiLocales: allLocales.filter(locale => !locale.contentOnly),
+            uiLocales: allLocales.filter(locale => {
-            formattingLocales: allLocales.filter(locale => locale.electronLocale),
+                if (locale.contentOnly) return false;
+                if (locale.devOnly && !glob.isDev) return false;
+                return true;
+            }),
+            formattingLocales: [
+                { id: "", name: t("i18n.formatting-locale-auto") },
+                ...allLocales.filter(locale => locale.electronLocale)
+            ]
         }
     }, []);
 
@@ -40,7 +47,7 @@ function LocalizationOptions() {
                 <LocaleSelector locales={uiLocales} currentValue={locale} onChange={setLocale} />
             </OptionsRow>
 
-            {isElectron() && <OptionsRow name="formatting-locale" label={t("i18n.formatting-locale")}>
+            {<OptionsRow name="formatting-locale" label={t("i18n.formatting-locale")}>
                 <LocaleSelector locales={contentLocales} currentValue={formattingLocale} onChange={setFormattingLocale} />
             </OptionsRow>}
 
@@ -66,13 +73,21 @@ function DateSettings() {
     return (
         <>
             <OptionsRow name="first-day-of-week" label={t("i18n.first-day-of-the-week")}>
-                <FormInlineRadioGroup
+                <FormSelect
                     name="first-day-of-week"
+                    currentValue={firstDayOfWeek}
+                    onChange={setFirstDayOfWeek}
+                    keyProperty="value"
+                    titleProperty="label"
                     values={[
-                        { value: "0", label: t("i18n.sunday") },
+                        { value: "1", label: t("i18n.monday") },
-                        { value: "1", label: t("i18n.monday") }
+                        { value: "2", label: t("i18n.tuesday") },
+                        { value: "3", label: t("i18n.wednesday") },
+                        { value: "4", label: t("i18n.thursday") },
+                        { value: "5", label: t("i18n.friday") },
+                        { value: "6", label: t("i18n.saturday") },
+                        { value: "7", label: t("i18n.sunday") },
                     ]}
-                    currentValue={firstDayOfWeek} onChange={setFirstDayOfWeek}
                 />
             </OptionsRow>
 

apps/client/src/widgets/type_widgets/options/text_notes.tsx

@@ -62,7 +62,7 @@ function FormattingToolbar() {
                 name="multiline-toolbar"
                 label={t("editing.editor_type.multiline-toolbar")}
                 currentValue={textNoteEditorMultilineToolbar} onChange={setTextNoteEditorMultilineToolbar}
-                containerStyle={{ marginLeft: "1em" }}
+                containerStyle={{ marginInlineStart: "1em" }}
             />
         </OptionsSection>
     )

apps/client/src/widgets/type_widgets/relation_map/RelationMap.css

@@ -62,7 +62,7 @@
 .note-detail-relation-map .endpoint {
     position: absolute;
     bottom: 37%;
-    right: 5px;
+    inset-inline-end: 5px;
     width: 1em;
     height: 1em;
     background-color: #333;

apps/client/src/widgets/type_widgets/text/EditableText.css

@@ -1,6 +1,6 @@
 .note-detail-editable-text {
     font-family: var(--detail-font-family);
-    padding-left: 14px;
+    padding-inline-start: 14px;
     padding-top: 10px;
     height: 100%;
 }
@@ -11,7 +11,7 @@ body.desktop.electron .note-detail-editable-text {
 }
 
 body.mobile .note-detail-editable-text {
-    padding-left: 4px;
+    padding-inline-start: 4px;
 }
 
 .note-detail-editable-text a:hover {