/* * This is a demo of how you can create custom theme for Trilium. You can activate it by going * into options (top-right corner) in first tab "Appearance". * * You can read some details on theming here: http://github.com/zadam/trilium/wiki/Themes */ @font-face { /* This will be used as main UI font (see below) */ font-family: 'Raleway'; font-style: normal; font-weight: 400; src: url('../../../custom/fonts/raleway.woff2') format('woff2'); } @font-face { /* This will be used as text content font (see below) */ font-family: 'Garamond'; font-style: normal; font-weight: 400; src: url('../../../custom/fonts/garamond.woff2') format('woff2'); } :root { --theme-style: light; --main-font-family: 'Raleway'; --main-font-size: normal; --tree-font-family: 'Raleway'; --tree-font-size: normal; --detail-font-family: 'Raleway'; --detail-font-size: normal; --monospace-font-family: 'Monospace'; --monospace-font-size: normal; --main-background-color: #404552; --main-text-color: #AFB8C6; --main-border-color: #AFB8C6; --accented-background-color: #383C4A; --more-accented-background-color: #2F343F; --button-text-color: #AFB8C6; --button-background-color: #2F343F; --button-disabled-text-color: #86919F; --button-disabled-background-color: #404552; --button-border-color: #333; --button-border-radius: 2px; --primary-button-background-color: #6c757d; --primary-button-text-color: white; --primary-button-border-color: #6c757d; --muted-text-color: #86919F; --input-text-color: #AFB8C6; --input-background-color: #404552; --hover-item-text-color: white; --hover-item-background-color: #4877B1; --active-item-text-color: white; --active-item-background-color: #4877B1; --menu-text-color: #AFB8C6; --menu-background-color: #383C4A; --modal-background-color: #404552; --modal-backdrop-color: black; --left-pane-background-color: #2F343F; --left-pane-text-color: #AFB8C6; --launcher-pane-background-color: #2F343F; --launcher-pane-text-color: #AFB8C6; --active-tab-background-color: #2F343F; --active-tab-text-color: #AFB8C6; --inactive-tab-background-color: #404552; --inactive-tab-text-color: #AFB8C6; --scrollbar-border-color: rgba(175, 184, 198, 0.5); --tooltip-background-color: #383C4A; --link-color: lightskyblue; --mermaid-theme: forest; } body .global-menu-button { background-image: url("../../../assets/vX/images/icon-grey.png"); } body .note-detail-editable-text, body .note-detail-readonly-text { font-size: 120%; /* Garamond is subjectively smaller */ } body .CodeMirror { filter: invert(100%) hue-rotate(180deg); }