diff --git a/src/public/app/layouts/desktop_layout.js b/src/public/app/layouts/desktop_layout.js index 257432374..47ca424af 100644 --- a/src/public/app/layouts/desktop_layout.js +++ b/src/public/app/layouts/desktop_layout.js @@ -25,7 +25,6 @@ import PromotedAttributesWidget from "../widgets/type_property_widgets/promoted_ import InheritedAttributesWidget from "../widgets/type_property_widgets/inherited_attribute_list.js"; import NoteListWidget from "../widgets/note_list.js"; import SearchDefinitionWidget from "../widgets/type_property_widgets/search_definition.js"; -import Container from "../widgets/containers/container.js"; import SqlResultWidget from "../widgets/sql_result.js"; import SqlTableSchemasWidget from "../widgets/sql_table_schemas.js"; import FilePropertiesWidget from "../widgets/type_property_widgets/file_properties.js"; @@ -37,6 +36,8 @@ import SyncStatusWidget from "../widgets/sync_status.js"; import ScrollingContainer from "../widgets/containers/scrolling_container.js"; import RootContainer from "../widgets/containers/root_container.js"; import NoteUpdateStatusWidget from "../widgets/note_update_status.js"; +import SpacerWidget from "../widgets/spacer.js"; +import QuickSearchWidget from "../widgets/quick_search.js"; const RIGHT_PANE_CSS = ` + +`; + +export default class SpacerWidget extends BasicWidget { + doRender() { + this.$widget = $(TPL); + } +} diff --git a/src/public/app/widgets/sync_status.js b/src/public/app/widgets/sync_status.js index f8e53bfcb..bf66d4b49 100644 --- a/src/public/app/widgets/sync_status.js +++ b/src/public/app/widgets/sync_status.js @@ -10,7 +10,6 @@ const TPL = ` .sync-status-widget { height: 35px; box-sizing: border-box; - border-bottom: 1px solid var(--main-border-color); } .sync-status { diff --git a/src/public/stylesheets/allure.css b/src/public/stylesheets/allure.css new file mode 100644 index 000000000..6225b225f --- /dev/null +++ b/src/public/stylesheets/allure.css @@ -0,0 +1,3111 @@ +/* ----------------------------------------------------------------------------- */ +/* FONT DECLARATIONS */ +/* ----------------------------------------------------------------------------- */ + +/* Icons */ +@font-face { + font-family: 'trilium-allure-icons'; /* project id 2347067 */ + src: url('//at.alicdn.com/t/font_2347067_inu6k6cjpm.eot'); + src: url('//at.alicdn.com/t/font_2347067_inu6k6cjpm.eot?#iefix') format('embedded-opentype'), + url('//at.alicdn.com/t/font_2347067_inu6k6cjpm.woff2') format('woff2'), + url('//at.alicdn.com/t/font_2347067_inu6k6cjpm.woff') format('woff'), + url('//at.alicdn.com/t/font_2347067_inu6k6cjpm.ttf') format('truetype'), + url('//at.alicdn.com/t/font_2347067_inu6k6cjpm.svg#trilium-allure-icons') format('svg'); +} + +/* Open Sans */ +@font-face { + font-family: 'Open Sans'; + font-style: normal; + font-weight: 400; + src: url('/custom/fonts/open-sans-v17-latin-regular.woff') format('woff'); +} + +@font-face { + font-family: 'Open Sans'; + font-style: italic; + font-weight: 400; + src: url('/custom/fonts/open-sans-v17-latin-italic.woff') format('woff'); +} + +@font-face { + font-family: 'Open Sans'; + font-style: italic; + font-weight: 600; + src: url('/custom/fonts/open-sans-v17-latin-600italic.woff') format('woff'); +} + +@font-face { + font-family: 'Open Sans'; + font-style: normal; + font-weight: 600; + src: url('/custom/fonts/open-sans-v17-latin-600.woff') format('woff'); +} + +@font-face { + font-family: 'Fira Mono'; + font-style: normal; + font-weight: 400; + src: url('/custom/fonts/FiraMono-Regular.woff') format('woff'); +} + +/* Fira Code */ +@font-face { + font-family: 'Fira Code'; + font-style: normal; + font-weight: 300; + src: url('/custom/fonts/FiraCode-Regular.woff2') format('woff2'); +} + +@font-face { + font-family: 'Fira Code'; + font-style: normal; + font-weight: 600; + src: url('/custom/fonts/FiraCode-Bold.woff2') format('woff2'); +} + +/* Roboto-slab */ +@font-face { + font-family: 'Roboto Slab'; + font-style: normal; + font-weight: 300; + src: url('/custom/fonts/roboto-slab-v11-latin-300.woff') format('woff'); +} + +@font-face { + font-family: 'Roboto Slab'; + font-style: normal; + font-weight: 400; + src: url('/custom/fonts/roboto-slab-v11-latin-regular.woff') format('woff'); +} + +@font-face { + font-family: 'Roboto Slab'; + font-style: normal; + font-weight: 600; + src: url('/custom/fonts/roboto-slab-v11-latin-600.woff') format('woff'); +} + + +html { + /* ----------------------------------------------------------------------------- */ + /* COLOR VARIABLES */ + /* ----------------------------------------------------------------------------- */ + + --color-gray-lighter : #F3F3F3; + --color-gray-light : #DADCDB; + --color-gray : #8e8787; + --color-gray-dark : #666; + --color-gray-darker : #525051; + --color-gray-darkest : #393939; + --color-blue : #526DE9; + --color-white : #FFF; + --color-red : #FF5252; + --color-black-light : #282828; + --color-black : #1E1E1E; + + --color-dialog-translucent : rgb(126,126,126, 0.5); + --color-background-translucent : rgb(126,126,126, 0.1); + + + /* ------------------- Fixed variable ------------------ */ + --color-text-danger : var(--color-red); + --color-text-highlight : var(--color-blue); + + /* ------------------ Default mode start ------------- */ + --color-text-accent : var(--color-gray-darkest); + --color-text-primary : var(--color-gray-darker); + --color-text-secondary : var(--color-gray); + --color-text-inconspicuous : var(--color-gray-light); + + --color-background-primary : var(--color-gray-lighter); + --color-background-secondary : var(--color-white); + --color-background-accent : var(--color-gray-light); + --color-background-item : var(--color-gray-lighter); + + --color-button-primary : var(--color-gray-lighter); + --color-button-accent : var(--color-gray-light); + --color-button-hover-center : var(--color-gray-lighter); + /* ------------------- Default mode end -------------- */ + + + + /* ------------------ Night mode start --------------- */ + --color-text-accent : var(--color-gray-lighter); + --color-text-primary : var(--color-gray-light); + --color-text-secondary : var(--color-gray); + --color-text-inconspicuous : var(--color-gray-dark); + + --color-background-primary : var(--color-black); + --color-background-secondary : var(--color-black-light); + --color-background-accent : var(--color-gray-darkest); + --color-background-item : var(--color-gray-darkest); + + --color-button-primary : var(--color-gray-darker); + --color-button-accent : var(--color-gray-dark); + --color-button-hover-center : var(--color-black-light); + /* ------------------- Night mode end ---------------- */ + + + /* ------------------- Alternate variable ------------------ */ + --color-background-highlight : var(--color-text-highlight); + --color-button-highlight : var(--color-text-highlight); + --color-button-disabled : var(--color-background-accent); + + /* ----------------------------------------------------------------------------- */ + /* BORDER VARIABLES */ + /* ----------------------------------------------------------------------------- */ + + --border-radius-standard : 3px; + --border-radius-large : 12px; + + --border-standard : 1px solid var(--color-button-accent); + --border-transparent : 1px solid transparent; + --border-accent : 2px solid var(--color-button-accent); + --border-accent-alt : 2px solid var(--color-background-primary); + --border-option : 2px solid var(--color-text-inconspicuous); + --border-option-active : 2px solid var(--color-text-highlight); + --border-link : 1px dashed var(--color-text-secondary); + + --shadow-card : 0px 0px 18px -8px var(--color-background-accent); + --shadow-mobile : 0px 0px 12px 0px var(--color-text-inconspicuous); + --shadow-standard : 3px 4px 3px -3px var(--color-background-accent); + --shadow-accented : 2px 2px 5px -2px var(--color-gray-dark); + --shadow-mobile-popup : 0px 0px 16px 0px var(--color-background-accent); + + + /* ----------------------------------------------------------------------------- */ + /* FONT VARIABLES */ + /* ----------------------------------------------------------------------------- */ + + --font-headers : 'Open Sans', Noto Sans CJK SC, 'Source Sans Pro', 'Liberation Sans', Helvetica Neue, Microsoft YaHei, Sans-serif; + --font-body : 'Open Sans', Noto Sans CJK SC, 'Source Sans Pro', 'Liberation Sans', Helvetica Neue, Microsoft YaHei, Sans-serif; + --font-code : 'Fira Code', 'Source Code Pro', Courier, Monospace; + + /* ----------------------------------------------------------------------------- */ + /* LAYOUT VARIABLES */ + /* ----------------------------------------------------------------------------- */ + + /* Use larger spacing to separate paragraphs */ + --spacing-content-small : .4em; + --spacing-content-normal : .8em; + --spacing-content-large : 1.8em; + --spacing-center-pane : 42px; + + --width-note-body : 680px; + --width-left-button-pane : 50px; + + /* Use a larger size for the frequently used buttons on the left */ + --size-left-pane-button : 1.2em; + + --height-quick-search : 52px; +} + + +body.theme-allure-clear { + color: var(--color-text-primary); + line-height: 1.6em; +} + +/* ----------------------------------------------------------------------------- */ +/* HYPERLINKS */ +/* ----------------------------------------------------------------------------- */ + +body.theme-allure-clear a, +body.theme-allure-clear a:visited, +body.theme-allure-clear a:hover, +body.theme-allure-clear .note-detail a, +body.theme-allure-clear .modal-dialog a { + color: var(--color-text-primary); + text-decoration: none; + word-break: break-all; +} + +/* Hide the help link and the icon after a link */ +body.theme-allure-clear a:after, +body.theme-allure-clear a.external:not(.page-url) { + display: none; +} + + +/* ----------------------------------------------------------------------------- */ +/* LAYOUT */ +/* ----------------------------------------------------------------------------- */ + +/* Hr line of the note details */ +body.theme-allure-clear .gutter.gutter-horizontal { + /* ------------------ With tabs version start ------------- */ + background: var(--color-background-secondary); + /* ------------------ With tabs version end ------------- */ + + /* ------------------ No tabs version start ------------- */ + background: var(--color-background-primary); + z-index: 1; + width: 2px !important; + /* ------------------ No tabs version end ------------- */ +} + +/* ------------------ No tabs version start ------------- */ +/*body.theme-allure-clear .gutter.gutter-horizontal:nth-of-type(2) { + background: var(--color-background-secondary); +} +body.theme-allure-clear .gutter.gutter-horizontal:nth-of-type(4) { + background: var(--color-background-primary); +}*/ +/* ------------------ No tabs version end ------------- */ + +/*body.theme-allure-clear .gutter.gutter-horizontal:hover { + background: var(--color-background-accent); +}*/ + +/* buttons */ +body.theme-allure-clear .btn { + border-radius: var(--border-radius-standard); + color: var(--color-text-primary); +} +body.theme-allure-clear .btn:not(.btn-primary):not(.btn-secondary):not(.btn-danger) { + background: inherit; + border: none; + box-shadow: none; + padding: 6px; +} +body.theme-allure-clear .btn.btn-primary { + border: var(--border-standard); + background-color: var(--color-button-primary); +} +/*body.theme-allure-clear *, ::after, ::before { + font-family: 'trilium-allure-icons'; +}*/ + + +/* Image */ +body.theme-allure-clear img { + max-width: 100%; +} + +/* Root */ +body.theme-allure-clear div#root-widget { + background: var(--color-background-primary); +} +body.theme-allure-clear div#root-widget > div:nth-of-type(3) { + margin-left: var(--width-left-button-pane); + /*background: var(--color-background-secondary);*/ +} + +/* List */ +/*body.theme-allure-clear .ck-content dl, +body.theme-allure-clear .ck-content ol, +body.theme-allure-clear .ck-content ul { + padding-inline-start: 32px; + margin: var(--spacing-content-normal) 0 var(--spacing-content-large); +}*/ +body.theme-allure-clear .ck-content li { + margin: var(--spacing-content-small) 0; +} +body.theme-allure-clear .ck-content li:last-child { + margin-bottom: 0; +} + +/* Input */ +body.theme-allure-clear .input-group-text { + background: var(--color-background-item) !important; + border: none; +} + +/* Strong */ +body.theme-allure-clear b, +body.theme-allure-clear strong { + color: var(--color-text-accent); +} + + +/* ----------------------------------------------------------------------------- */ +/* CONTEXT MENU & FLOATING ELEMENTS */ +/* ----------------------------------------------------------------------------- */ + +/* Title bar button */ +body.theme-allure-clear .title-bar-buttons { + position: absolute; + right: 0; + top: 0; + margin-right: 8px; + z-index: 999; +} +body.theme-allure-clear .title-bar-buttons button { + /*border: none !important;*/ + font-size: .9rem; + background: var(--color-button-accent) !important; + padding: 0 !important; + border-radius: 12px; + margin: 2px; + color: var(--color-button-accent) !important; +} +body.theme-allure-clear .title-bar-buttons button:hover { + border: none !important; + color: var(--color-text-primary) !important; + background: var(--color-button-accent) !important; +} +body.theme-allure-clear .title-bar-buttons button:before { + font-family: 'trilium-allure-icons'; +} +body.theme-allure-clear .title-bar-buttons button.minimize-btn:before { + content: '\e9c0'; +} +body.theme-allure-clear .title-bar-buttons button.maximize-btn:before { + content: '\e9bc'; +} +body.theme-allure-clear .title-bar-buttons button.close-btn:before { + content: '\e9bb'; +} + + +/* Ctrl + F search */ +body.theme-allure-clear .find-box { + box-shadow: none !important; + background: var(--color-background-accent) !important; + border-radius: 3px; +} +body.theme-allure-clear .find-box .find-input { + border: none !important; +} +body.theme-allure-clear .find-box .find-input, +body.theme-allure-clear .find-box .find-case, +body.theme-allure-clear .find-box .find-back, +body.theme-allure-clear .find-box .find-forward, +body.theme-allure-clear .find-box .find-close { + background: none !important; +} + + +body.theme-allure-clear #context-menu-container { + border-radius: var(--border-radius-standard); + box-shadow: var(--shadow-accented); + border: var(--border-standard); + /*border-top: var(--border-accent);*/ + /*border-bottom: var(--border-accent);*/ + padding: 8px 0; +} + +body.theme-allure-clear .help-button { + display: none; +} + +body.theme-allure-clear #context-menu-container li.dropdown-item { + font-size: 1rem; + font-family: var(--font-headers); + height: 30px; + line-height: 30px; +} + +/* menu item divider */ +body.theme-allure-clear #context-menu-container .dropdown-divider, +body.theme-allure-clear #center-pane .dropdown-divider { + border: none; + /*height: 2px;*/ + margin: 2px 0px; + overflow: hidden; + /*background-color: var(--color-background-primary);*/ +} + + +/* note type and note actions buttons */ +body.theme-allure-clear #center-pane .note-type-dropdown, +body.theme-allure-clear #center-pane .dropdown-menu, +body.theme-allure-clear .global-menu .dropdown-menu { + border-radius: var(--border-radius-standard); + box-shadow: var(--shadow-accented); + border: var(--border-standard); + /*border-top: var(--border-accent);*/ + /*border-bottom: var(--border-accent);*/ + font-family: var(--font-family-monospace); + font-size: 1rem; + width: auto; +} + +body.theme-allure-clear #center-pane .dropdown-menu, { /* add by wenjinyu */ + left: -3em !important; +} + +/* toggle note protection switch in note actions dropdown */ +body.theme-allure-clear #center-pane .dropdown-item .switch { + height: auto; + margin-left: 20px; +} +body.theme-allure-clear #center-pane .dropdown-item .slider { + height: 18px; + border-radius: 10px; + margin-top: 11px; + /* background: var(--color-background-accent); */ + background: var(--color-button-accent); + width: 45px; +} +body.theme-allure-clear #center-pane .dropdown-item .slider::before { + height: 10px; + width: 10px; + border-radius: 8px; + background: var(--color-text-secondary); +} +body.theme-allure-clear #center-pane .dropdown-item.protect-button .slider { + background: var(--color-button-accent); +} +body.theme-allure-clear #center-pane .dropdown-item.protect-button .slider::before { + background: var(--color-background-secondary); +} +body.theme-allure-clear #center-pane .dropdown-item.unprotect-button .slider { + background: var(--color-button-highlight); +} +body.theme-allure-clear #center-pane .dropdown-item.unprotect-button .slider::before { + background: var(--color-background-secondary); +} + +/* MODALS */ + +body.theme-allure-clear div.modal { + font-size: 1.05rem; + background: var(--color-dialog-translucent); +} + +/* modal header */ +body.theme-allure-clear div.modal-content > div.modal-header { + display: flex; + align-items: center; + background: var(--color-background-primary); + color: var(--color-text-primary); + border: none; +} + +/* modal header title */ +body.theme-allure-clear div.modal-content > div.modal-header h5 { + font-family: var(--font-headers); + font-weight: bold; + margin-bottom: 0 !important; +} + +/* modal recent changes */ +body.theme-allure-clear div#recent-changes-content div b { + font-family: var(--font-headers); + display:block; + border-bottom: var(--border-accent-alt); +} + +body.theme-allure-clear div#recent-changes-content div ul { + list-style-type: none; + padding-left: 6rem; + margin-top: 0.3rem; + font-family: var(--font-body); + font-size: 90%; +} + +/* modal body primary button */ +/*body.theme-allure-clear div.modal-content button.btn-primary { + color: var(--color-text-primary); + background-color: var(--color-button-accent); + border: var(--border-standard); + margin: 0; +}*/ + +/* textareae in modals*/ +body.theme-allure-clear .modal-content .modal-body textarea { + font-family: var(--font-code); + border: var(--border-standard); + padding: 5px 5px 5px 15px; +} + +/* MODAL BODY */ +body.theme-allure-clear .modal-content .modal-body { + font-family: var(--font-body); + /*padding: 0;*/ + /*margin-top: -1px;*/ +} + +/* MODAL BODY - Appearance */ +/*body.theme-allure-clear .modal-content .input-group-append .input-group-text { + background: var(--color-button-accent) !important; + border: none; + color: var(--color-text-accent) !important; +}*/ +body.theme-allure-clear input:not(:disabled), +body.theme-allure-clear select:not(:disabled), +body.theme-allure-clear textarea:not(:disabled) { + background: var(--color-background-item) !important; + border: none; + color: var(--color-text-accent) !important; +} +body.theme-allure-clear input:disabled, +body.theme-allure-clear select:disabled, +body.theme-allure-clear textarea:disabled { + background: var(--color-button-disabled) !important; + border: none; + color: var(--color-text-accent) !important; +} +body.theme-allure-clear input:focus, +body.theme-allure-clear select:focus, +body.theme-allure-clear textarea:focus { + box-shadow: none; + /*border: var(--border-accent);*/ +} + +/* MODAL BODY - Keyboard shortcuts */ +body.theme-allure-clear #keyboard-shortcut-table td, +body.theme-allure-clear #keyboard-shortcut-table th { + color: var(--color-text-primary); +} +body.theme-allure-clear #keyboard-shortcut-table td[colspan="4"] { + background: var(--color-background-accent) !important; +} + +/* MODAL BODY - Username & password */ +body.theme-allure-clear #options-credentials .alert.alert-warning { + background: var(--color-background-accent) !important; + border: none; +} + +/* Modals - Code notes */ +body.theme-allure-clear ul#options-mime-types { + padding: 0 12px 12px 12px; + margin-bottom: 0; + margin-top: 16px; +} +body.theme-allure-clear ul#options-mime-types li { + display: inline-block; + margin: 6px; + font-size: 0; +} +body.theme-allure-clear ul#options-mime-types li label { + font-size: 1rem; + margin: 0; + padding: 8px 22px; + border-radius: 30px; + border: var(--border-option); + color: var(--color-text-secondary); + font-weight: bold; +} +body.theme-allure-clear ul#options-mime-types li label:hover { + background: var(--color-background-primary); +} +/*body.theme-allure-clear ul#options-mime-types li input[type="checkbox"]:checked+label:before { + content: '\e611'; + font-family: 'trilium-allure-icons'; + display: inline-block; + width: 20px; + height: 20px; +}*/ +/* input (checkbox) */ +body.theme-allure-clear ul#options-mime-types li input { + display: none; +} +body.theme-allure-clear ul#options-mime-types li input[type="checkbox"]:checked+label { + color: var(--color-text-highlight); + border: var(--border-option-active); + /*padding: 8px 12px;*/ +} + +/* modal body - button */ +body.theme-allure-clear div.modal-content .modal-body .tab-content button.btn { + background: var(--color-button-primary); + padding: 6px 12px; +} +body.theme-allure-clear div.modal-content .modal-body .tab-content button.btn:hover { + background: var(--color-button-accent); +} + +body.theme-allure-clear form#clone-to-form { + padding: 20px; +} + +body.theme-allure-clear form#clone-to-form .modal-footer { + padding: .75rem 0; +} + +body.theme-allure-clear span.fancytree-folder, +body.theme-allure-clear span.fancytree-node { + padding: 4px; +} + +body.theme-allure-clear span.fancytree-custom-icon { + /*margin: 2px 3px; + line-height: 28px; + width: auto; + height: auto;*/ + display: none; +} + +body.theme-allure-clear .tree-settings-popup.show { + background: var(--color-background-primary) !important; +} + + +body.theme-allure-clear button.icon-button { + font-size: 1em; + padding: 3px; +} + +body.theme-allure-clear .modal-header .close { + color: var(--color-text-primary); + font-weight: normal; + padding: 2px 4px; + margin: 0 5px; + outline: none; + /*border: var(--border-transparent);*/ + border-radius: var(--border-radius-standard); +} + +body.theme-allure-clear .modal-header .close:hover { + /*border: var(--border-standard);*/ + background: var(--color-button-accent); +} + +body.theme-allure-clear .owned-and-inherited-wrapper { + display: block; + /*padding-bottom: 8px;*/ +} + +body.theme-allure-clear .modal-dialog.modal-md form.protected-session-password-form { + padding: 20px; +} + +body.theme-allure-clear .btn.btn-primary kbd { + color: var(--color-text-secondary); + line-height: 1rem; + display: inline-block; +} + +body.theme-allure-clear .modal-dialog { + background: var(--color-background-primary); + border-radius: var(--border-radius-large); +} +body.theme-allure-clear .modal-dialog .modal-content { + background: var(--color-background-secondary) !important; +} + +/* Popup tabs */ +body.theme-allure-clear .nav-tabs .nav-link:hover { + background: var(--color-background-accent); + border: var(--border-transparent); +} +body.theme-allure-clear .nav-tabs .nav-item.show .nav-link, +body.theme-allure-clear .nav-tabs .nav-link.active { + /*color: var(--color-text-primary) !important;*/ + border: var(--border-transparent); +} +body.theme-allure-clear .nav-tabs .nav-link { + /*border-bottom: var(--border-standard);*/ + border-top-left-radius: var(--border-radius-standard); + border-top-right-radius: var(--border-radius-standard); +} +body.theme-allure-clear .nav-tabs { + background: var(--color-background-primary); + margin: -1rem -1rem 0 -1rem; + padding: 0 20px; + border: none; +} +/*body.theme-allure-clear .modal-header { + border-bottom: var(--border-standard); +}*/ +body.theme-allure-clear div#options-dialog .modal-body > div > br { + display: none; +} +body.theme-allure-clear .tab-content { + background: var(--color-background-secondary); + padding: 24px; +} + +body.theme-allure-clear .nav-item a.active { + background: var(--color-background-secondary) !important; + color: var(--color-text-primary) !important; +} + +body.theme-allure-clear .modal-footer { + border-top: 0; + padding: .75rem; +} + +/*body.theme-allure-clear .form-group { + margin-bottom: 0; +}*/ + +body.theme-allure-clear p { + font-size: 1em; + margin: var(--spacing-content-normal) 0; + font-family: var(--font-body); +} + +body.theme-allure-clear blockquote { + margin: var(--spacing-content-large) 0; + font-style: normal; + border-left: solid 3px var(--color-text-highlight); + /*color: var(--color-text-secondary);*/ + border-radius: var(--border-radius-standard); + background: var(--color-background-primary); + padding: var(--spacing-content-normal) 1.2em; +} +/*body.theme-allure-clear blockquote p { + margin: var(--spacing-content-normal) 0; +}*/ +body.theme-allure-clear blockquote p:last-child, +body.mobilx blockquote p:last-child { + margin-bottom: 0; +} + + +/* note action */ +body.theme-allure-clear .dropdown-item { + margin: 0 8px; + height: 40px; + padding: 0 1rem; + width: auto; + border-radius: 5px; + line-height: 40px; + min-width: max-content; + color: var(--color-text-primary) !important; +} +body.theme-allure-clear .dropdown-item:hover:not(.disabled) { + background: var(--color-background-primary) !important; + color: var(--color-text-accent) !important; +} +/* button - note protect*/ +body.theme-allure-clear .slider.checked { + background: var(--color-button-highlight); +} + +body.theme-allure-clear kbd { + padding: .1rem .4rem .1rem 3rem; +} + +body.theme-allure-clear .dropdown-menu { + margin: 0; + background: var(--color-background-secondary) !important; + left: 0; + right: unset; +} + + +/* NOTE REVISIONS */ + +/* Background */ +body.theme-allure-clear #note-revisions-dialog { + background: var(--color-dialog-translucent); +} +body.theme-allure-clear #note-revision-list { + /*border: var(--border-standard);*/ + background: var(--color-background-primary) !important; + width: 295px; +} +body.theme-allure-clear #note-revisions-dialog .modal-body { + padding: 0; +} +body.theme-allure-clear #note-revisions-dialog .modal-content > .modal-header { + padding: 0 !important; + background: var(--color-background-secondary); +} +body.theme-allure-clear #note-revisions-dialog .modal-content > .modal-header h5 { + background: var(--color-background-primary); + padding: 10px 20px; + width: 295px; +} + +/* Header - Delete all button */ +body.theme-allure-clear button#note-revisions-erase-all-revisions-button { + height: 30px; + margin: 0 10px 0 5px; +} +body.theme-allure-clear button#note-revisions-erase-all-revisions-button:hover { + background: var(--color-button-accent); +} + +/* Left - Revision list*/ +body.theme-allure-clear div#note-revision-list { + border: none; + padding: 0; + border-radius: unset; + border-right: none; +} +body.theme-allure-clear div#note-revision-list a.dropdown-item { + margin: 0; + border-radius: unset; +} +body.theme-allure-clear div#note-revision-list a.dropdown-item.active { + outline: none; + background: var(--color-background-accent) !important; +} + +/* Right - All */ +/*body.theme-allure-clear div#note-revision-content-wrapper { + margin-left: 0 !important; + padding-left: 0; + background: var(--color-background-secondary); +}*/ + +/* Right - Title */ +body.theme-allure-clear h3#note-revision-title { + padding: 10px; + /*background-color: var(--color-background-primary);*/ + margin: 0 !important; +} + +/* Right - Title border */ +/*body.theme-allure-clear div#note-revision-content-wrapper > div:nth-of-type(1) { + border-bottom: var(--border-standard); +}*/ + +/* Right - Three operation buttons */ +body.theme-allure-clear div#note-revision-title-buttons { + /*background: var(--color-background-primary);*/ + padding: 8px; +} +body.theme-allure-clear div#note-revision-title-buttons button { + font-size: 0; +} +body.theme-allure-clear div#note-revision-title-buttons button:nth-of-type(1):after { + content: '\2713'; + font-size: initial; +} +body.theme-allure-clear div#note-revision-title-buttons button:nth-of-type(2):after { + content: '\2715'; + font-size: initial; +} +body.theme-allure-clear div#note-revision-title-buttons button:nth-of-type(3) { + font-size: initial; +} +body.theme-allure-clear div#note-revision-title-buttons button:hover { + background: var(--color-button-accent); +} + +/* Right - Note revision content */ +body.theme-allure-clear div#note-revision-content { + padding: 12px; + background: var(--color-background-secondary); + margin: 4px; +} + + +body.theme-allure-clear .note-detail-book { + padding: 0; +} + +body.theme-allure-clear .btn:hover { + /*border: none !important;*/ + box-shadow: none !important; + /*background: var(--color-background-secondary) !important;*/ + /*border: transparent;*/ +} + + +/* LINK MAP DIALOG*/ + +/* Link Map Dialog - title */ +body.theme-allure-clear div#link-map-dialog > div { + top: 0 !important; +} + +/* Link Map Dialog - note */ +body.theme-allure-clear .link-map-container .note-box { + background: var(--color-background-primary); + color: var(--color-text-primary); +} +body.theme-allure-clear .link-map-active-note { + background: var(--color-background-accent) !important; +} + +/* Link Map Dialog - note preview */ +body.theme-allure-clear .tooltip-inner { + background: var(--color-background-secondary) !important; + color: var(--color-text-secondary) !important; + box-shadow: none; + border: var(--border-standard); +} +body.theme-allure-clear .note-tooltip-title { + color: var(--color-text-primary) !important; +} +body.theme-allure-clear .rendered-note-attributes { + color: var(--color-text-inconspicuous); +} + +/* Link Map Dialog - link */ +body.theme-allure-clear .link-map-container .jsplumb-connection-hover path { + stroke: var(--color-text-primary); +} + + + +/* OPTIONS DIALOG */ + +/* Options Dialog - hide the border bottom of the header*/ +body.theme-allure-clear div#options-dialog .modal-body { + margin-top: -1px; + /*overflow: hidden;*/ + position: static; +} + +body.theme-allure-clear div#options-keyboard-shortcuts div { + margin-top: 12px; +} + +/* float button */ +body.theme-allure-clear .btn-group.floating-button { + right: 8px !important; + top: 0px !important; +} +body.theme-allure-clear div.note-detail-relation-map div.floating-button { + top: auto !important; +} + + + +/* SCROLLBAR */ + +/* ¹ö¶¯ÌõµÄ³ß´ç */ +body.theme-allure-clear ::-webkit-scrollbar { + width: 12px; + height: 12px; + background-color: transparent; +} +/* ¹ö¶¯Ìõ¹ìµÀ */ +body.theme-allure-clear ::-webkit-scrollbar-track { + background-color: unset; + border: solid 4px transparent; +} +/* »¬¿é */ +body.theme-allure-clear ::-webkit-scrollbar-thumb { + border-radius: 10px; + box-shadow: inset 0 0 10px 10px var(--color-button-accent); + border: solid 4px transparent; +} +body.theme-allure-clear ::-webkit-scrollbar-thumb:hover { + border: solid 2px transparent; +} + + +/* ----------------------------------------------------------------------------- */ +/* TOP PANE */ +/* ----------------------------------------------------------------------------- */ + +/* NOTE TABS */ + +body.theme-allure-clear #root-widget > div.component:first-of-type, +body.theme-allure-clear .standard-top-widget { + position: absolute; + width: 100%; +} + +body.theme-allure-clear .note-tab-row-container .note-tab, +body.theme-allure-clear .note-tab-row-container .note-new-tab { + + /* ------------------ With tabs version start ------------- */ + margin-top: 12px; + /* ------------------ With tabs version end ------------- */ + + /* ------------------ No tabs version start ------------- */ + display: none; + /* ------------------ No tabs version end ------------- */ + +} + +/* Note tabs - New tab button */ +body.theme-allure-clear .note-new-tab { + border: none; + /*line-height: 1.6em;*/ + font-size: 0; +} +body.theme-allure-clear .note-new-tab:before { + font-size: 1rem; + content: '\e622'; + font-family: 'trilium-allure-icons'; + line-height: 33px; +} +body.theme-allure-clear .note-new-tab:hover { + background: var(--color-background-accent); +} +body.theme-allure-clear .note-tab-row { + background: unset; + margin: 0; + right: 72px; + position: absolute; + width: calc(100% - 354px); + + /* ------------------ With tabs version start ------------- */ + height: 48px; + /* ------------------ With tabs version end ------------- */ + + /* ------------------ No tabs version start ------------- */ + height: 28px; + /* ------------------ No tabs version end ------------- */ +} +body.theme-allure-clear .tab-row-filler .tab-row-border { + background: unset; +} +/*body.theme-allure-clear .tab-row-filler { + height: 20px; + margin-left: -50px; + left: -26px; +}*/ +/*body.theme-allure-clear .note-tab-row { + display: none !important; +}*/ +body.theme-allure-clear .note-tab-row .note-tab .note-tab-wrapper { + background: var(--color-background-item); + margin: 0 4px; + color: var(--color-text-secondary); + border: none; + border-radius: 20px; + position: unset; + padding: 5px 12px; + height: calc(1.6em + 8px); + text-align: center; +} +body.theme-allure-clear .note-tab-row .note-tab .note-tab-wrapper:hover { + background: var(--color-background-accent); + /*text-align: left;*/ + /*border: var(--border-standard);*/ +} +body.theme-allure-clear .note-tab-row .note-tab[active] .note-tab-wrapper { + color: var(--color-text-highlight); + font-weight: normal; +} + +/* TAB - Title */ +body.theme-allure-clear .note-tab-row .note-tab .note-tab-title { + line-height: 1.6em; + width: calc(100% - 14px); + text-overflow: ellipsis; + color: inherit; + min-height: 1.6em; +} + +/* TAB - Button */ +body.theme-allure-clear div.tab-row-filler { + /* display: none; */ + height: 28px; +} +body.theme-allure-clear .note-tab-row .note-tab .note-tab-close { + display: none; + position: absolute; + right: 14px; + padding: 1px 4px; +} +body.theme-allure-clear .note-tab-row .note-tab .note-tab-wrapper:hover .note-tab-close { + display: block; + background: var(--color-background-accent); +} +body.theme-allure-clear .note-tab-row .note-tab .note-tab-close:hover { + background-color: unset; + /*border: var(--border-standard);*/ + color: var(--color-text-accent); +} +body.theme-allure-clear .note-tab-row .note-tab .note-tab-close span { + top: unset; +} + + + +body.theme-allure-clear ul.fancytree-container { + height: 100%; + overflow: auto; + padding: 0; +} + + +/* LEFT BUTTON */ + +body.theme-allure-clear div.global-menu button, +body.theme-allure-clear div.standard-top-widget button { + font-size: 0; + margin: 8px; +} +body.theme-allure-clear div.global-menu button.btn.btn-sm:hover, +body.theme-allure-clear div.standard-top-widget button.btn.btn-sm:hover, +body.theme-allure-clear div.tree-wrapper > button.btn.btn-sm:hover, +body.theme-allure-clear button.btn.btn-sm.icon-button.hide-left-pane-button:hover, +body.theme-allure-clear button.btn.btn-sm.icon-button.show-left-pane-button:hover { + background: var(--color-background-accent); +} +body.theme-allure-clear .history-navigation { + display: none; +} + +/* LEFT BUTTON - Global menu */ +body.theme-allure-clear .global-menu-wrapper { + border: none; + padding: 0; +} +body.theme-allure-clear .global-menu-wrapper .global-menu button { + font-family: var(--font-headers); + font-size: var(--size-left-pane-button); +} +body.theme-allure-clear div.global-menu button.dropdown-toggle span { + font-size: initial; + display: flex; +} + +/* LEFT BUTTON - Button above */ +body.theme-allure-clear .standard-top-widget { + position: absolute; + background: var(--color-background-primary); + width: var(--width-left-button-pane); + display: inline-block; + margin-left: 0; + margin-top: var(--spacing-center-pane); +} +body.theme-allure-clear .standard-top-widget > div:not(.component) { + flex-flow: column; +} +body.theme-allure-clear .standard-top-widget button span:first-of-type { + font-size: initial; + top: inherit; +} +body.theme-allure-clear .standard-top-widget button span:before { + font-family: 'trilium-allure-icons'; + font-size: var(--size-left-pane-button); +} +body.theme-allure-clear .standard-top-widget .bx-file-blank:before { + content: '\eaec'; +} +body.theme-allure-clear .standard-top-widget .bx-search:before { + content: '\eb54'; +} +/* hide button because the function of it coincides with another button */ +/* jump to note = quick search */ +body.theme-allure-clear .standard-top-widget button[data-trigger-command="jumpToNote"] { + display: none; +} +/*body.theme-allure-clear div.standard-top-widget .bx-send:before { + content: '\e601'; +}*/ +body.theme-allure-clear .standard-top-widget .bx-history:before { + content: '\f1e2'; +} +body.theme-allure-clear button.enter-protected-session-button span:before { + content: '\e736'; +} +body.theme-allure-clear button.leave-protected-session-button span:before { + content: '\e605'; + font-weight: bold; + color: var(--color-button-highlight); +} +body.theme-allure-clear button#toolbar-button-Today span:before { + content: '\e745'; +} +body.theme-allure-clear .standard-top-widget .quick-search { + margin: 0 10px; + position: absolute; + top: -30px; + left: var(--width-left-button-pane); + width: 170px !important; + /*display: flex !important;*/ +} +body.theme-allure-clear .btn-outline-secondary.search-button { + display: none; +} + +/* Quick search */ +body.theme-allure-clear .standard-top-widget .quick-search:before { + content: '\eb54'; + font-family: 'trilium-allure-icons'; + display: table-caption; + line-height: calc(1.5em + .5rem + 4px); + font-size: 14px; +} +body.theme-allure-clear div.standard-top-widget input.search-string { + padding: 1em; + box-shadow: none; + border: none; + background: transparent !important; + /*border-left: var(--border-standard);*/ +} +/*body.theme-allure-clear div.standard-top-widget input.search-string:hover, +body.theme-allure-clear div.standard-top-widget input.search-string:focus { + background: var(--color-background-secondary) !important; +}*/ + + +/* LEFT BUTTON - Buttons below - collapse tree, tree settings */ +body.theme-allure-clear button.btn.btn-sm.icon-button.tree-settings-button { + bottom: calc(var(--height-quick-search) + 8px); + left: -40px; + font-size: var(--size-left-pane-button); +} +body.theme-allure-clear button.scroll-to-active-note-button { + display: none; +} +body.theme-allure-clear button.btn.btn-sm.icon-button.collapse-tree-button { + bottom: calc(var(--height-quick-search) + 50px); + left: -40px; + font-size: var(--size-left-pane-button); +} + +/* LEFT BUTTON - Buttons below - hide/show pane */ +body.theme-allure-clear .hide-right-pane-button, +body.theme-allure-clear .show-right-pane-button { + bottom: 2px; + right: 6px; + font-size: var(--size-left-pane-button); + color: var(--color-text-secondary); +} +body.theme-allure-clear .show-right-pane-button.btn.icon-button:hover { + background: var(--color-background-primary); +} +body.theme-allure-clear .hide-right-pane-button.btn.icon-button:hover { + background: var(--color-background-accent); +} +body.theme-allure-clear button.btn.btn-sm.icon-button.hide-left-pane-button, +body.theme-allure-clear button.btn.btn-sm.icon-button.show-left-pane-button { + /*bottom: 3px;*/ + left: 10px; + font-size: var(--size-left-pane-button); +} + +/* LEFT BUTTON - Buttons below - tree settings popup */ +body.theme-allure-clear div#left-pane div.tree-settings-popup { + border-radius: 3px; + box-shadow: var(--shadow-standard); + background: var(--color-background-secondary) !important; + width: auto; +} +body.theme-allure-clear div#left-pane div.tree-settings-popup button { + background: var(--color-background-primary); + border: var(--border-standard); + font-size: 0; +} +body.theme-allure-clear div#left-pane button.save-tree-settings-button:after { + content: 'Save'; + font-size: initial; +} +body.theme-allure-clear div#left-pane label.form-check-label { + min-width: max-content; +} + + + + +/* Search Result - note list */ +body.theme-allure-clear .input-group-append .dropdown-menu-right span.dropdown-item { + min-width: unset; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; +} +body.theme-allure-clear .input-group-append .dropdown-menu-right span.dropdown-item small { + color: var(--color-text-secondary); + margin-left: 8px; +} +body.theme-allure-clear .input-group-append .dropdown-menu-right span.dropdown-item:before { + content: '\e659'; + font-family: 'trilium-allure-icons'; + margin-right: 12px; +} + +/* Search Result - `Show in full search` button */ +body.theme-allure-clear .input-group-append .dropdown-menu-right a.dropdown-item { + padding-left: 38px; +} +body.theme-allure-clear .input-group-append .dropdown-menu-right button.btn.btn-sm { + font-size: inherit; + background-color: transparent; + border: none; + margin: 0; +} +body.theme-allure-clear .input-group-append .dropdown-menu-right button.btn.btn-sm:hover { + border: none !important; + background: none !important; + box-shadow: none !important; +} + +/* ----------------------------------------------------------------------------- */ +/* LEFT PANE */ +/* ----------------------------------------------------------------------------- */ + +/* GLOBAL BUTTONS */ +/* Create new note botton */ +body.theme-allure-clear div#left-pane .global-buttons { + border: none; + margin: 0; + position: absolute; + top: 4px; + right: 168px; + font-size: 12px; +} +body.theme-allure-clear div#left-pane .global-buttons a { + color: var(--color-button-accent) !important; +} +body.theme-allure-clear div#left-pane .global-buttons a:hover { + background: var(--color-background-secondary); +} + +/* hide the breadcrumbs/path widget */ +body.theme-allure-clear div.note-paths-widget { + display: none; +} + +/* Setting button of the note list pop-up window */ +body.theme-allure-clear div#left-pane button.tree-settings-button:before { + content: '\e651'; + line-height: 18px; + font-family: 'trilium-allure-icons'; +} + +/* SIDEBAR */ +body.theme-allure-clear div#left-pane { + background-color: var(--color-background-primary); + /*box-sizing: unset;*/ + /*box-shadow: unset;*/ + margin-top: 52px; + /*padding: 4px 0;*/ + padding-bottom: 44px; +} +body.theme-allure-clear div.tree span.fancytree-expander { + position: absolute; + left: 0; + top: 3px; + color: var(--color-text-primary); +} + + +/* TREE MENU */ + +/* hide caret of childless nodes */ +body.theme-allure-clear .fancytree-node:not(.fancytree-folder) .fancytree-expander::before { + display: none; +} + +/* style the caret icon on expandable nodes*/ +body.theme-allure-clear .fancytree-node .fancytree-expander::before { + font-size: 1rem; + margin-right: 0; + line-height: 28px; +} +body.theme-allure-clear .fancytree-active .fancytree-expander::before { + color: var(--color-text-highlight); + font-weight: bold; +} + +body.theme-allure-clear div.tree-wrapper, +body.theme-allure-clear div.tree { + font-family: var(--font-headers); + font-weight: 400; +} +/*body.theme-allure-clear div.tree-wrapper { + padding-bottom: 38px; +}*/ +body.theme-allure-clear div.tree { + padding: 0; + padding-bottom: 12px; +} + +/* SIDEBAR MENU ITEM [SECONDARY SELECTED] */ +body.theme-allure-clear span.fancytree-selected .fancytree-title { + background: var(--color-background-accent); + border-color: var(--main-background-color) ; /* invisible border */ + border-radius: 0; + color: var(--color-text-primary); + font-style: normal; +} + +/* SIDEBAR MENU ITEM [FOCUSED] */ +body.theme-allure-clear span.fancytree-focus .fancytree-title, +body.theme-allure-clear span.fancytree-focus .fancytree-selected .fancytree-title { + border: none; + background-color: none; + line-height: 28px; +} + +/* Note list - normal */ +body.theme-allure-clear span.fancytree-title { + border: none; + line-height: 24px; + padding: 2px; + text-overflow: ellipsis; + white-space: nowrap; + overflow: hidden; + display: block; + max-width: calc(100% - 18px); + margin-left: 4px !important; + font-size: .9em; +} +body.theme-allure-clear span.fancytree-node { + margin-left: 18px; + display: flex; + border-radius: var(--border-radius-standard) 0 0 var(--border-radius-standard); + width: 100%; +} +/* remove the margin-left of the "root" note */ +body.theme-allure-clear div.tree > ul > li > span { + margin-left: 0; +} +body.theme-allure-clear span.fancytree-node:hover { + background: var(--color-background-accent); +} +body.theme-allure-clear span.fancytree-node:hover span.fancytree-title { + border: none; + max-width: calc(100% - 46px); +} + +/* Note list - add note button */ +body.theme-allure-clear .add-note-button { + border: none; + right: 7px; + position: absolute; + margin: 4px 0; + color: var(--color-text-primary); +} + +/* Note list - Refresh search button */ +body.theme-allure-clear .refresh-search-button { + border: none; + margin: auto 5px; + display: none; +} +body.theme-allure-clear span.fancytree-node:hover .refresh-search-button { + display: inline-block; +} + +/* Note list - active note */ +body.theme-allure-clear span.fancytree-active span.add-note-button { + color: var(--color-text-highlight); +} +/*body.theme-allure-clear span.fancytree-active:not(.fancytree-focused) .fancytree-title { + font-weight: normal; +}*/ +/*body.theme-allure-clear span.fancytree-active:hover { + background: var(--color-background-highlight); +}*/ + +body.theme-allure-clear div.tree-wrapper.component .fancytree-container li[role=treeitem] { + padding: 0; +} +body.theme-allure-clear ul.fancytree-container ul ul { + padding-left: 12px; +} + +/* protected nodes */ +body.theme-allure-clear span.fancytree-node.protected, +body.theme-allure-clear span.fancytree-node.protected span { + color: var(--color-text-secondary); +} +body.theme-allure-clear span.fancytree-node.protected .fancytree-title:before { + content: '\e621'; + font-family: 'trilium-allure-icons'; + margin-right: 8px; +} +body.theme-allure-clear span.fancytree-node.fancytree-active.protected, +body.theme-allure-clear span.fancytree-node.fancytree-active.protected > span { + color: var(--color-text-danger) !important; +} +/* note title - protected notes*/ +body.theme-allure-clear input.note-title.protected { + text-shadow: none; + color: var(--color-text-danger) !important; +} + + +/* CONTEXT MENU ITEM [ACTIVE (on click)]*/ +body.theme-allure-clear .fancytree-node .fancytree-title:active { + background: transparent; +} + +/* CONTEXT MENU ITEM [active item background ("fix"?!)]*/ +body.theme-allure-clear span.fancytree-active .fancytree-title { + background: transparent !important; + /*border-radius: 3px;*/ + color: var(--color-text-highlight) !important; +} + + +/* ----------------------------------------------------------------------------- */ +/* CENTER PANE */ +/* ----------------------------------------------------------------------------- */ + +body.theme-allure-clear div#center-pane { + background: var(--color-background-secondary); + overflow: auto; + + /* ------------------ With tabs version start ------------- */ + padding: 62px 0 0 12px; + /* ------------------ With tabs version end ------------- */ + + /* ------------------ No tabs version start ------------- */ + padding: 4px 0 0 12px; + /* ------------------ No tabs version end ------------- */ +} + +/* BUTTON */ +body.theme-allure-clear #center-pane .btn:hover, +body.theme-allure-clear .edit-text-note-container:hover, +body.theme-allure-clear .edit-code-note-container:hover { + background: var(--color-button-hover-center) !important; +} + +/* ATTRIBUTE */ + +/* Attribute - title */ +body.theme-allure-clear .section-body { + border: none; + padding: 12px; + background: var(--color-background-primary); + border-radius: var(--border-radius-standard); + margin: 0; +} +body.theme-allure-clear .section-title-real { + border: none; + font-size: 14px; + color: var(--color-text-secondary); + padding: 4px 10px; + border-radius: var(--border-radius-standard); +} +body.theme-allure-clear .section-title:hover, +body.theme-allure-clear .section-title-real.active { + background: var(--color-background-primary); + border-bottom-right-radius: 0; + border-bottom-left-radius: 0; +} +body.theme-allure-clear .section-title-empty { + display: none; +} + + +/* Owned attrs */ +body.theme-allure-clear .attribute-list .save-attributes-button, +body.theme-allure-clear .attribute-list .add-new-attribute-button { + font-size: 1em; + border-radius: var(--border-radius-standard); + padding: 3px; + bottom: 0; + + /* ------------------ No tabs version start ------------- */ + margin-right: 28px; + /* ------------------ No tabs version end ------------- */ +} +body.theme-allure-clear .attribute-list .save-attributes-button:hover, +body.theme-allure-clear .attribute-list .add-new-attribute-button:hover { + background: var(--color-background-secondary); +} + +/* similar notes - content */ +body.theme-allure-clear div#center-pane hr.w-100 { + display: none !important; +} +body.theme-allure-clear div#center-pane div.similar-notes-widget a { + border: none; + font-size: .9rem; + font-family: var(--font-headers); + text-overflow: ellipsis; + max-width: 100%; + padding: 4px 15px; + background: var(--color-background-item); + line-height: 1.6em; + margin: 2px 8px; +} +body.theme-allure-clear div#center-pane div.similar-notes-widget a:before { + content: '\e659'; + font-family: 'trilium-allure-icons'; + margin-right: 10px; + color: var(--color-text-secondary); + /*margin: 2px 4px;*/ +} + +/* Attr details */ +body.theme-allure-clear .attr-detail { + background: var(--color-background-primary); + color: var(--color-text-primary); + border: var(--border-standard); + box-shadow: var(--shadow-accented); +} +body.theme-allure-clear .attr-detail input[readonly] { + background: var(--color-background-secondary) !important; + border: none; +} + + +/* TITLE */ + +/* Title - Note icon button */ +body.theme-allure-clear .note-icon-container { + display: none; +} + +/* Title - Title content*/ +body.theme-allure-clear .title-row { + width: 100%; + display: block !important; + flex-direction: unset !important; + + /* ------------------ With tabs version start ------------- */ + max-width: var(--width-note-body); + padding: 0 var(--spacing-center-pane); + margin: 0 auto; + /* ------------------ With tabs version end ------------- */ +} +body.theme-allure-clear .title-row > * { + margin: 0 5px; +} + +/* Title - Note type and more menu button */ +body.theme-allure-clear div#center-pane .title-row button.btn:not(.execute-script-button) { + font-size: 0; + border-radius: var(--border-radius-standard); + background-color: unset; + color: var(--color-text-secondary); + position: absolute; + + /* ------------------ With tabs version start ------------- */ + padding: 4px 10px; + top: -2px; + /* ------------------ With tabs version end ------------- */ + + /* ------------------ No tabs version start ------------- */ + padding: 0 4px; + right: 8px; + z-index: 1; + /* ------------------ No tabs version end ------------- */ +} + +/* ------------------ With tabs version start ------------- */ +body.theme-allure-clear .title-row button span { + line-height: 1.4rem; + font-size: 0.9rem; +} +/* ------------------ With tabs version end ------------- */ + +body.theme-allure-clear button.note-type-button span.note-type-desc:before { + font-family: 'trilium-allure-icons'; + content: "\e659"; + + /* ------------------ With tabs version start ------------- */ + margin-right: 4px; + /* ------------------ With tabs version end ------------- */ + + /* ------------------ No tabs version start ------------- */ + font-size: 1rem; + /* ------------------ No tabs version end ------------- */ +} +body.theme-allure-clear .note-actions button.dropdown-toggle:before { + font-size: initial; + content: '\e60c'; + font-family: 'trilium-allure-icons'; +} +/* Title - Note type button */ +body.theme-allure-clear .note-type button.btn.btn-sm.note-type-button { + /* ------------------ With tabs version start ------------- */ + right: 36px; + /* ------------------ With tabs version end ------------- */ + + /* ------------------ No tabs version start ------------- */ + top: 72px; + /* ------------------ No tabs version end ------------- */ +} +/* Title - More menu button */ +body.theme-allure-clear .note-actions button.btn.btn-sm.dropdown-toggle { + + /* ------------------ With tabs version start ------------- */ + right: 0; + /* ------------------ With tabs version end ------------- */ + + /* ------------------ No tabs version start ------------- */ + top: 38px; + /* ------------------ No tabs version end ------------- */ +} + + +/* INFO AND ATTRS */ + +body.theme-allure-clear .section-body-container { + + /* ------------------ With tabs version start ------------- */ + max-width: var(--width-note-body); + padding: 0 var(--spacing-center-pane); + margin: 0 auto; + /* ------------------ With tabs version end ------------- */ + + /* ------------------ No tabs version start ------------- */ + padding-right: 17px; + /* ------------------ No tabs version end ------------- */ +} + +/* Info */ +body.theme-allure-clear .section-body-container .note-properties-widget div { + font-size: 0; + + /* ------------------ No tabs version start ------------- */ + display: flex; + /* ------------------ No tabs version end ------------- */ +} +body.theme-allure-clear .section-body-container .note-properties-widget div:before { + font-size: initial; + content: 'source'; + color: var(--color-text-secondary); + white-space: pre; + margin-right: 12px; +} +body.theme-allure-clear .section-body-container .note-properties-widget a.page-url { + display: initial; + white-space: break-spaces; + /*margin: 12px 0 0 18px;*/ + border-bottom: var(--border-transparent); + font-size: initial; + + /* ------------------ With tabs version start ------------- */ + line-height: 1em; + /* ------------------ With tabs version end ------------- */ +} +body.theme-allure-clear .section-body-container .note-properties-widget a.page-url:hover { + color: var(--color-text-highlight); + border-bottom: var(--border-link); +} + +/* Attr */ + +/* ------------------ No tabs version start ------------- */ +body.theme-allure-clear .section-container { + position: absolute; + bottom: -5px; + z-index: 1; + background: var(--color-background-secondary); + width: inherit; + margin-left: -12px; +} +/* ------------------ No tabs version end ------------- */ + +body.theme-allure-clear .section-title-container { + justify-content: left; + max-width: var(--width-note-body); + + /* ------------------ With tabs version start ------------- */ + padding: 0 var(--spacing-center-pane); + margin: 0 auto; + /* ------------------ With tabs version end ------------- */ + + /* ------------------ No tabs version start ------------- */ + margin: 0; + padding-left: 12px; + /* ------------------ No tabs version end ------------- */ +} +body.theme-allure-clear .note-properties-widget, +body.theme-allure-clear .attribute-list > div:nth-of-type(1), +body.theme-allure-clear .inherited-attributes-container { + padding: 0 !important; + color: var(--color-text-secondary); +} +body.theme-allure-clear .attribute-list p { + /* ------------------ With tabs version start ------------- */ + margin-right: 50px !important; + /* ------------------ With tabs version end ------------- */ + + /* ------------------ No tabs version start ------------- */ + margin-right: 78px !important; + /* ------------------ No tabs version end ------------- */ +} +body.theme-allure-clear div.note-title-container { + /* ------------------ With tabs version start ------------- */ + margin: 0; + /* ------------------ With tabs version end ------------- */ + + /* ------------------ No tabs version start ------------- */ + margin: 0 0 4px; + /* ------------------ No tabs version end ------------- */ +} +body.theme-allure-clear .attribute-list-editor { + padding-left: 0 !important; +} + +/* Attr popup */ +body.theme-allure-claer table td, +body.theme-allure-claer table th { + color: var(--color-text-primary); +} + +/* message on top of notes and book view */ +/*body.theme-allure-clear .note-book-auto-message { + background: unset; + border-radius: unset; + text-align: left; + margin: 0.5rem 0; + width: calc(100% - 90px); +}*/ + +/* book view - mute hide/show children button */ +/*body.theme-allure-clear .note-book-children .note-book-hide-children-button, +body.theme-allure-clear .note-book-children .note-book-open-children-button { + font-size: 90%; + margin: 10px 0; + display: block; + text-align: center; +}*/ + +/* edit mode */ +body.theme-allure-clear .CodeMirror { + color: var(--color-text-primary); +} + +/* book view */ +body.theme-allure-clear .note-detail-book > .note-detail-book-content > div.note-book-card .note-book-content { + flex-grow: 0; + margin: 12px; + background: var(--color-background-secondary); +} +body.theme-allure-clear .note-detail-book > .note-detail-book-content > div.note-book-card .note-book-content * { + margin: .5rem 0; +} +body.theme-allure-clear pre:not(.CodeMirror-line) { + color: var(--color-text-primary) !important; +} + + +/* structure nested notes in book view */ +body.theme-allure-clear .note-detail > .note-book-card .note-book-card { + /*align-items: flex-start;*/ + /* border-left: var(--border-standard); */ + margin: 10px 0 35px; + background: var(--color-background-primary); +} + +/* include notes */ +body.theme-allure-clear .ck-content .include-note { + border-radius: var(--border-radius-standard); + border: var(--border-standard); + background: unset; + box-shadow: var(--shadow-card); + padding: 0; + margin: 20px 0; + display: block; +} +body.theme-allure-clear .ck-content .include-note-title { + font-size: 1.1rem; + margin-bottom: 0; + padding: 16px; + font-family: var(--font-headers); + font-weight: bold; +} +body.theme-allure-clear .ck-content .include-note-title a { + border-bottom: none; +} +body.theme-allure-clear .ck-content a, +body.theme-allure-clear .ck-content a * { + border-bottom: var(--border-link); +} +body.theme-allure-clear .ck-content a:hover, +body.theme-allure-clear .ck-content a *:hover { + color: var(--color-text-highlight); + border-color: var(--color-text-highlight); +} +body.theme-allure-clear .ck-content a:after, +body.theme-allure-clear .ck-content a *:after { + font-size: smaller; + content: none; + vertical-align: top; +} +body.theme-allure-clear .ck-content .include-note-title a { + text-decoration: none; + white-space: nowrap; + text-overflow: ellipsis; + display: block; + overflow: hidden; +} +body.theme-allure-clear h4.include-note-title a:before { + content: "\e659"; + font-family: trilium-allure-icons; + margin-right: 8px; +} +body.theme-allure-clear section.include-note img { + display: none; +} +body.theme-allure-clear section.include-note .image:after { + display: block; + content: '[img]'; + font-size: 1rem; +} +body.theme-allure-clear .ck-content .image > figcaption { + font-style: normal; + font-weight: 400; + font-size: 14px; + line-height: 16px; + text-align: center; + color: var(--color-text-secondary) !important; + margin-top: 6px; + background-color: unset !important; + /*padding: 0;*/ + display: block; +} +body.theme-allure-clear section[data-box-size=small].include-note > div:nth-of-type(1) > div { + height: 4.5rem; + overflow: hidden; + margin: 0 16px 16px; +} +body.theme-allure-clear section[data-box-size=medium].include-note > div:nth-of-type(1) > div { + height: 12rem; + overflow: hidden; + margin: 0 16px 16px; +} +body.theme-allure-clear section[data-box-size=medium].include-note img { + object-fit: cover; + width: 10rem; + height: 10rem; +} +body.theme-allure-clear section[data-box-size=full].include-note > div:nth-of-type(1) > div { + overflow: hidden; + margin: 0 16px 16px; +} +body.theme-allure-clear section:not([data-box-size=full]).include-note div.ck-content *:not(.image):not(img) { + font-weight: normal !important; + display: inline !important; + background: unset !important; + border: unset !important; + outline: unset !important; + margin: unset !important; + padding: unset !important; + font-size: 1rem !important; + color: var(--color-text-primary) !important; + white-space: initial !important; + line-height: 1.6rem; +} +body.theme-allure-clear section.include-note div.include-note-content.type-text br { + display: none; +} + + +/* Table */ +body.theme-allure-clear .ck-content .table { + width: auto; + /*border: var(--border-standard);*/ + margin: 1em; +} +body.theme-allure-clear .ck-content .table td { + padding: .6em .8em; + border-left: none; + border-right: none; + color: var(--color-text-primary); + position: relative; + vertical-align: middle; + border: var(--border-standard); +} +body.theme-allure-clear .ck-content .table td:focus { + background: var(--color-background-primary); + border: var(--border-standard); +} +body.theme-allure-clear .ck-content .table th { + background: var(--color-button-accent); + color: var(--color-text-primary); + border: var(--border-standard); +} +body.theme-allure-clear .ck-content ol, +body.theme-allure-clear .ck-content ul, +body.theme-allure-clear table ol, +body.theme-allure-clear table ul { + display: block; + /*width: max-content;*/ + margin: 0; + position: relative; + padding-left: 40px; +} +body.theme-allure-clear .ck-content ul ul, +body.theme-allure-clear .ck-content ul ol, +body.theme-allure-clear .ck-content ol ul, +body.theme-allure-clear .ck-content ol ol, +body.theme-allure-clear table ul ul, +body.theme-allure-clear table ul ol, +body.theme-allure-clear table ol ul, +body.theme-allure-clear table ol ol { + padding-left: 20px; +} +body.theme-allure-clear .ck-content li, +body.theme-allure-clear table li { + text-align: left; + line-height: 1.6rem; + /*padding-left: 0;*/ +} +body.theme-allure-clear .ck-widget, +body.theme-allure-clear .ck-widget.ck-widget_with-selection-handle { + width: auto; + margin-left: 0; +} +/* Table - header */ +body.theme-allure-clear .ck-content table tr:first-child { + background: var(--color-background-primary); + text-align: center; +} +/*body.theme-allure-clear .ck-content table tr:first-child td { + color: var(--color-text-grey); +}*/ +/* Table - body */ +body.theme-allure-clear .ck-widget_selected, +body.theme-allure-clear .ck-widget_selected:hover { + width: auto; +} +body.theme-allure-clear .ck-editor__nested-editable.ck-editor__nested-editable_focused, +body.theme-allure-clear .ck-editor__nested-editable:focus, +body.theme-allure-clear .ck-editor__nested-editable.ck-editor__nested-editable_focused, +body.theme-allure-clear .ck-editor__nested-editable:focus { + background: var(--color-background-grey); + border-style: none; + outline: none; + outline-offset: unset; + box-shadow: none; +} + +/* note title */ +body.theme-allure-clear input.note-title { + padding: 0; + outline: none; + background: unset !important; + line-height: 1.5em; + border: 2px solid transparent; + color: var(--color-text-primary) !important; + + /* ------------------ With tabs version start ------------- */ + font-size: 1.5em; + text-align: center; + /* ------------------ With tabs version end ------------- */ + + /* ------------------ No tabs version start ------------- */ + font-size: .8em; + text-align: left; + /* ------------------ No tabs version end ------------- */ +} + +body.theme-allure-clear input.note-title:focus { + color: var(--color-text-highlight) !important; +} +/*body.theme-allure-clear button.note-icon:before { + font-size: 1.6rem; +}*/ + +/* note type dropdown */ +body.theme-allure-clear .dropdown-item strong { + font-weight: normal; +} +body.theme-allure-clear .dropdown-item span.check { + float: right; + margin-left: 14px; +} +body.theme-allure-clear .dropdown-item[data-mime-type] { + padding: 0 1rem 0 2.6rem; +} +body.theme-allure-clear .dropdown-item[data-note-type=text] strong:before { + content: '\e61c'; + font-family: 'trilium-allure-icons'; + font-size: 1rem; + margin-right: 10px; +} +body.theme-allure-clear .dropdown-item[data-note-type=relation-map] strong:before { + content: '\e617'; + font-family: 'trilium-allure-icons'; + font-size: 1rem; + margin-right: 10px; +} +body.theme-allure-clear .dropdown-item[data-note-type=render] strong:before { + content: '\e60f'; + font-family: 'trilium-allure-icons'; + font-size: 1rem; + margin-right: 10px; +} +body.theme-allure-clear .dropdown-item[data-note-type=book] strong:before { + content: '\eb1f'; + font-family: 'trilium-allure-icons'; + font-size: 1rem; + margin-right: 10px; +} +body.theme-allure-clear .dropdown-item[data-note-type=code] strong:before { + content: '\efa4'; + font-family: 'trilium-allure-icons'; + font-size: 1rem; + margin-right: 10px; +} +body.theme-allure-clear .dropdown-item[data-note-type=code] strong:before { + content: '\e6b0'; + font-family: 'trilium-allure-icons'; + font-size: 1rem; + margin-right: 10px; +} + +/* NOTE BODY */ + +/* note details */ +/*body.theme-allure-clear div#center-pane .component:nth-of-type(10) { + background: var(--color-background-secondary); + padding: 4px; + border: var(--border-standard); + box-shadow: var(--shadow-card); + border-radius: var(--border-radius-standard); +}*/ +/*body.theme-allure-clear div#center-pane div:nth-of-type(11) { + margin: 4px 0; +}*/ + +/* ------------------ With tabs version start ------------- */ +body.theme-allure-clear .note-detail { +/* ------------------ With tabs version end ------------- */ + +/* ------------------ No tabs version start ------------- */ +body.theme-allure-clear :not(.rendered-note-content) > .ck-content, +body.theme-allure-clear .note-detail-code-editor, +body.theme-allure-clear #confirm-dialog-content, +body.theme-allure-clear .note-detail-readonly-text, +body.theme-allure-clear .note-detail-relation-map, +body.theme-allure-clear .note-detail-editable-text, +body.theme-allure-clear .note-detail-read-only-code-content, +body.theme-allure-clear .note-detail-read-only-code { + padding: 12px var(--spacing-center-pane) 0; + /* ------------------ No tabs version end ------------- */ + font-family: monospace; + margin: 0 auto; + max-width: var(--width-note-body); + font-size: 16px; + /*background: var(--color-background-secondary);*/ +} +body.theme-allure-clear #confirm-dialog-content, +body.theme-allure-clear .note-detail-readonly-text, +body.theme-allure-clear .note-detail-relation-map, +body.theme-allure-clear .note-detail-editable-text, +body.theme-allure-clear .note-detail-read-only-code-content, +body.theme-allure-clear .note-detail-read-only-code { + overflow: hidden; + margin-bottom: 0; + color: var(--color-text-primary) !important; + min-height: 28px; + + /* ------------------ With tabs version start ------------- */ + padding: 24px var(--spacing-center-pane); + /* ------------------ With tabs version end ------------- */ + + /* ------------------ No tabs version start ------------- */ + padding: 0 var(--spacing-center-pane) 33px; + /* ------------------ No tabs version end ------------- */ +} + +/* ------------------ With tabs version start ------------- */ +body.theme-allure-clear .note-detail-code { + padding-right: var(--spacing-center-pane); +} +/* ------------------ With tabs version end ------------- */ + +body.theme-allure-clear .ck-content :not(pre) code { + font-size: 0.7rem; + padding: 4px 8px; + margin: 0 4px; + /*border: var(--border-standard);*/ + font-family: var(--font-code); + color: var(--color-text-primary); + background: var(--color-background-accent); + vertical-align: middle; +} +body.theme-allure-clear p br:not([data-cke-filler]) { + height: var(--spacing-content-normal); + display: block; + content: " "; +} +/* Insert math */ +body.theme-allure-clear .ck-math-view input { + font-family: var(--font-code); + font-size: 1rem; + padding: 4px 8px; + box-shadow: none; +} +body.theme-allure-clear button.ck-button-save, +body.theme-allure-clear button.ck-button-cancel { + display: none; +} +body.theme-allure-clear .ck-math-view .ck-labeled-input__status, +body.theme-allure-clear .ck-math-view .ck-label { + color: var(--color-text-secondary); + font-weight: normal; +} +body.theme-allure-clear button.ck-button-display-toggle { + border: var(--border-standard); + margin: 6px; +} + +/* Edit button */ +body.theme-allure-clear .edit-note { + font-size: 0; +} +body.theme-allure-clear div.note-detail a.edit-note:before { + content: '\e6e5'; + padding: 6px; + font-family: 'trilium-allure-icons'; + + /* ------------------ With tabs version start ------------- */ + font-size: 1.3rem; + /* ------------------ With tabs version end ------------- */ + + /* ------------------ No tabs version start ------------- */ + font-size: 1rem; + /* ------------------ No tabs version end ------------- */ +} +body.theme-allure-clear .edit-text-note-container, +body.theme-allure-clear .edit-code-note-container { + padding: 0; + background: transparent !important; + border: var(--border-transparent) !important; + line-height: 1.4; + + /* ------------------ With tabs version start ------------- */ + top: 0; + right: 28px; + /* ------------------ With tabs version end ------------- */ + + /* ------------------ No tabs version start ------------- */ + top: 4px; + right: 8px; + /* ------------------ No tabs version end ------------- */ +} +/*body.theme-allure-clear div#center-pane.component div.note-detail-read-only-code div.alert { + padding: 0; +}*/ +/*body.theme-allure-clear div.note-detail-readonly-text div.edit-text-note-container { + top: 58px; + right: unset; + position: fixed; + margin-left: -30px; + background: none; + border: var(--border-transparent) !important; +}*/ +/*body.theme-allure-clear div.note-detail-read-only-code div.edit-code-note-container { + top: 58px; + right: unset; + position: fixed; + margin-left: -5px; + background: none; + border: var(--border-transparent) !important; +}*/ + +body.theme-allure-clear .note-detail-text { + line-height: 1.45; +} + +body.theme-allure-clear .ck-content > *:not(figure):first-child { + margin-top: 0; +} + +/* images */ +body.theme-allure-clear .ck-content .image { + margin: 2em auto; + display: block; +} + +/* line */ +body.theme-allure-clear .ck-content hr { + margin: 4em auto; + width: 240px; + max-width: 100%; + border: none; + height: 1px; +} + +/* p */ +body.theme-allure-clear .ck-content i { + color: var(--color-text-secondary); +} + + +/* HEADING */ + +body.theme-allure-clear .ck-content h2, +body.theme-allure-clear .ck-content h3, +body.theme-allure-clear .ck-content h4:not(.include-note-title), +body.theme-allure-clear .ck-content h5:not(.modal-title):not(.note-book-title), +body.theme-allure-clear .ck-content h6 { + color: var(--color-text-accent); + font-family: var(--font-headers); + font-weight: bold; +} +body.theme-allure-clear .note-detail .ck-content h2::before, +body.theme-allure-clear .note-detail .ck-content h3::before, +body.theme-allure-clear .note-detail .ck-content h4:not(.include-note-title)::before, +body.theme-allure-clear .note-detail .ck-content h5::before, +body.theme-allure-clear .note-detail .ck-content h6::before { + position: absolute; + margin-left: -38px; + font-size: 1rem; + color: var(--color-text-inconspicuous); + line-height: 2em; +} +body.theme-allure-clear .note-detail .ck-content h2::before { + content: 'H2'; +} +body.theme-allure-clear .note-detail .ck-content h3::before { + content: 'H3'; +} +body.theme-allure-clear .note-detail .ck-content h4:not(.include-note-title)::before { + content: 'H4'; +} +body.theme-allure-clear .note-detail .ck-content h5::before { + content: 'H5'; +} +body.theme-allure-clear .note-detail .ck-content h6::before { + content: 'H6'; +} + +/* h1 */ +/*body.theme-allure-clear .ck-content h1 { + display: table; + font-family: var(--font-headers); + font-size: 2rem; + font-weight: 600; + margin-top: 4rem; + margin-bottom: 1rem; +}*/ + +/* h2 */ +body.theme-allure-clear .ck-content h2 { + font-size: 1.4em; + margin-bottom: 1.4rem; + margin-top: 3.4rem; +} +/*body.theme-allure-clear .ck-content h2:after, +body.mobile .ck-content h2:after { + content: ''; + display: block; + width: 30px; + margin-top: 10px; + border-radius: 5px; +}*/ + +/* h3, h4, h5, h6 following directly after h2, h3, h4, h5 */ +body.theme-allure-clear .ck-content h2 + h3, +body.theme-allure-clear .ck-content h3 + h4, +body.theme-allure-clear .ck-content h4 + h5, +body.theme-allure-clear .ck-content h5 + h6 { + margin-top: var(--spacing-content-normal); +} + +/* h3 */ +body.theme-allure-clear .ck-content h3 { + font-size: 1.3em; + margin-bottom: 1.4rem; + margin-top: 3.0rem; +} + +/* h4, h5, h6 */ +body.theme-allure-clear .ck-content h4:not(.include-note-title), +body.theme-allure-clear .ck-content h5:not(.modal-title):not(.note-book-title), +body.theme-allure-clear .ck-content h6 { + font-size: 1.2em; + margin-bottom: 1.2rem; + margin-top: 2.6rem; +} + +/* The first heading */ +/*body.theme-allure-clear .ck-content h1:first-child, +body.theme-allure-clear .ck-content h2:first-child, +body.theme-allure-clear .ck-content h3:first-child, +body.theme-allure-clear .ck-content h4:first-child, +body.theme-allure-clear .ck-content h5:first-child, +body.theme-allure-clear .ck-content h6:first-child { + margin-top: 0; +}*/ + +/* code */ + +body.theme-allure-clear .ck-content pre { + background: var(--color-background-primary); + border: none; + margin: var(--spacing-content-normal) 0; + color: var(--color-text-primary) !important; +} + +body.theme-allure-clear .ck-content pre code { + font-family: var(--font-code); +} + +/* Checklists */ +body.theme-allure-clear .ck-content ul.todo-list { + padding-top: 4px; +} +body.theme-allure-clear .ck-content .todo-list .todo-list__label > input::before { + background: var(--color-button-accent); + border: none !important; + border-radius: 10px; +} +body.theme-allure-clear .ck-content .todo-list .todo-list__label > input[checked]::before { + background: var(--color-button-highlight); +} +body.theme-allure-clear label.todo-list__label { + margin-bottom: 0; +} +body.theme-allure-clear .todo-list li { + margin-bottom: 1rem; + line-height: 1.4rem; +} +body.theme-allure-clear .todo-list input[type="checkbox"] { + outline: none; + background: unset !important; +} + + +/* NOTE LIST WIDGET */ + +/* Note List - All */ +body.theme-allure-clear .note-list-widget { + padding: 0 var(--spacing-center-pane); + margin: 0 auto; + max-width: var(--width-note-body); +} +body.theme-allure-clear .note-list-widget .note-list { + padding: 0; +} +body.theme-allure-clear .note-book-card.expanded .note-book-content { + padding: 0 16px; + /*margin-bottom: 1em;*/ + overflow: hidden; +} +body.theme-allure-clear .note-book-card.expanded .note-book-content .ck-content { + padding: 0; + max-height: 6em; +} + +/* Note List - Content - Grid view */ +body.theme-allure-clear .note-list.grid-view .note-book-card { + background-color: var(--color-background-secondary); + /*border: var(--border-standard);*/ + flex-grow: 1; + margin: 6px 0; + /*box-shadow: var(--shadow-card);*/ + padding: 0; + border-radius: var(--border-radius-standard); + max-height: 12em; +} +body.theme-allure-clear .grid-view .note-book-card.expanded .ck-content * { + color: var(--color-text-secondary) !important; + font-weight: normal; + border: none; + margin: var(--spacing-content-small) 0; + line-height: 1em; + display: inline; + font-size: 1em; + padding: 0; + background: inherit; +} +body.theme-allure-clear .grid-view .note-book-card.expanded .ck-content br { + display: none; +} +body.theme-allure-clear .grid-view .note-book-card.expanded .ck-content img { + float: left; + max-width: 9em; + max-height: 9em; + margin: 9px 18px 0 0; + border-radius: 3px; +} +body.theme-allure-clear .grid-view .note-book-card .note-book-title a { + display: block; +} + +/* Note List - Content - List view */ +body.theme-allure-clear .note-list.list-view .note-list-container { + margin-top: 30px; +} +body.theme-allure-clear .note-list.list-view .note-book-card { + background-color: var(--color-background-secondary); + border: var(--border-standard); + margin: 12px 12px 12px 0; + box-shadow: var(--shadow-card); + padding: 0; + border-radius: var(--border-radius-standard); +} + +/* Note List - Button */ +body.theme-allure-clear .note-list.grid-view .note-list-container { + margin-top: 20px; +} + +/* Note List - Title */ +body.theme-allure-clear .note-book-card .note-book-title a { + /*font-size: 1.4em;*/ + font-family: var(--font-headers); + font-weight: normal; + margin: 0; + border-top-left-radius: var(--border-radius-standard); + border-top-right-radius: var(--border-radius-standard); + padding: 12px 16px 6px 16px; + font-size: 1.2rem; + width: 100%; + text-overflow: ellipsis; + white-space: nowrap; + overflow: hidden; + /*background-color: var(--color-background-primary);*/ + /*border-bottom: var(--border-standard);*/ +} +body.theme-allure-clear .list-view .note-book-card .note-book-title a { + padding-left: 0; +} +body.theme-allure-clear .note-book-card .note-book-title a:hover { + color: var(--color-text-highlight); +} +body.theme-allure-clear .note-book-card .note-book-title .note-expander { + padding: 14px; +} + +/* Note List - Title - Attrs */ +body.theme-allure-clear .note-book-title .rendered-note-attributes { + display: none; + /*font-size: 14px; + font-weight: normal; + display: block; + margin: 0; + padding: 10px 16px 0; + line-height: 1.4em; + color: var(--color-text-secondary);*/ +} +/*body.theme-allure-clear .note-book-title .rendered-note-attributes:before { + content: ''; +}*/ + + +/* SIMILAR NOTE */ +/* ------------------ With tabs version start ------------- */ +body.theme-allure-clear .similar-notes-widget .area-expander-text { + padding: 4px 0; + color: var(--color-text-secondary); +} +body.theme-allure-clear .similar-notes-widget .area-expander-text:hover { + color: var(--color-text-accent); +} +body.theme-allure-clear .similar-notes-widget .similar-notes-wrapper { + max-height: 30em; +} +/* ------------------ With tabs version end ------------- */ + +/* ------------------ No tabs version start ------------- */ +body.theme-allure-clear .similar-notes-widget { + display: none; +} +/* ------------------ No tabs version end ------------- */ + + +/* ----------------------------------------------------------------------------- */ +/* RIGHT PANE */ +/* ----------------------------------------------------------------------------- */ +body.theme-allure-clear div#right-pane { + padding: 16px 22px 16px 17px; + background: var(--color-background-primary); + margin-top: 12px; + + /* ------------------ No tabs version start ------------- */ + z-index: 1; + /* ------------------ No tabs version end ------------- */ +} + +/* List Items */ +body.theme-allure-clear div#right-pane li { + list-style-type: none; +} +body.theme-allure-clear div#right-pane li strong { + font-weight: normal; + color: var(--color-text-secondary); +} +body.theme-allure-clear div#right-pane li a { + border-bottom: var(--border-link); +} + + +/* WIDGET */ + +body.theme-allure-clear div#right-pane .card { + /*border-bottom: var(--border-standard);*/ + /*border-radius: unset;*/ + /*background-color: var(--color-background-secondary);*/ + margin: 2px 0; +} +body.theme-allure-clear div#right-pane .body-wrapper { + overflow: hidden; +} + +/* Widget - Icon before title */ +body.theme-allure-clear .card-header .widget-title:before { + font-family: "trilium-allure-icons"; + margin-right: 12px; +} +body.theme-allure-clear a[data-target*="NoteInfo"] .widget-title:before { + content: '\e650'; +} +body.theme-allure-clear a[data-target*="Calendar"] .widget-title:before { + content: '\e64a'; +} +body.theme-allure-clear a[data-target*="EditedNotes"] .widget-title:before { + content: '\e603'; +} +body.theme-allure-clear a[data-target*="LinkMap"] .widget-title:before { + content: '\e754'; +} +body.theme-allure-clear a[data-target*="NoteRevisions"] .widget-title:before { + content: '\e71f'; +} +body.theme-allure-clear a[data-target*="WhatLinksHere"] .widget-title:before { + content: '\ec57'; +} + + +/* Widget Header */ +body.theme-allure-clear div#right-pane .card-header { + /*border-bottom-left-radius: 0;*/ + /*border-bottom-right-radius: 0;*/ + /*border-bottom: var(--border-accent-alt);*/ + border: none; + width: 100%; + height: 38px; + justify-content: space-between; + align-items: center; + background: var(--color-background-primary); + padding: 0; +} +body.theme-allure-clear div.card-header div:nth-of-type(1) { + width: 100%; + display: inherit; +} +/* Remove the space in front of the show/hide button */ +body.theme-allure-clear div#right-pane .card-header div:nth-of-type(2) { + font-size: 0; +} +body.theme-allure-clear #right-pane .widget-title { + font-weight: 600; + font-family: var(--font-headers); + text-overflow: ellipsis; + white-space: nowrap; + overflow: hidden; + margin-right: 48px; + display: block; + color: var(--color-text-primary) !important; +} +body.theme-allure-clear div#right-pane .card-header .widget-header-actions a.widget-header-action { + color: var(--color-text-primary) !important; + font-size: 0.8rem; + padding: 6px; + /*border: var(--border-transparent);*/ + border-radius: var(--border-radius-standard); + position: absolute; + right: 28px; + margin: 4px 0; +} +body.theme-allure-clear div#right-pane .card-header .widget-header-actions a.widget-header-action:hover { + background: var(--color-button-accent); + /*border: var(--border-standard);*/ +} + +/* Widget Body */ +body.theme-allure-clear div#right-pane .card-body { + font-family: var(--font-body); + margin-left: 36px; + padding-left: 0; + padding-right: 34px; + /*background: var(--color-background-secondary);*/ + /*border-top: var(--border-standard);*/ +} +body.theme-allure-clear div#right-pane .card-body ul { + padding-left: 0; + margin-bottom: 0; + margin-right: -8px; +} +body.theme-allure-clear .link-map-widget { + margin: -8px; +} +body.theme-allure-clear .note-info-widget-table { + display: unset; +} +body.theme-allure-clear .note-info-widget-table th { + padding-left: 0; + color: var(--color-text-secondary); + font-weight: normal; +} +body.theme-allure-clear .note-info-widget-table td { + color: var(--color-text-primary); +} + +/* Widget button */ +body.theme-allure-clear a.widget-toggle-button { + /*border: var(--border-transparent);*/ + border-radius: var(--border-radius-standard); + padding: 8px; + width: 100%; +} +body.theme-allure-clear #right-pane .widget-toggle-icon { + float: right; + top: 4px; + color: var(--color-text-primary); +} +body.theme-allure-clear a.widget-toggle-button:hover { + /*border: var(--border-standard);*/ + background: var(--color-background-accent); +} +body.theme-allure-clear a.widget-help.external.no-arrow.bx-info-circle { + display: none; +} + +/* Calendar widget */ +body.theme-allure-clear div.calendar-widget div.calendar-header-label { + height: 24px; + overflow: hidden; +} +body.theme-allure-clear div.calendar-widget div.calendar-week span { + text-transform: inherit; + overflow: hidden; + height: 34px; + padding: 5px; +} +body.theme-allure-clear a.widget-toggle-button.no-arrow.bx-window:before { + content: "\e9ac"; +} + + + + + + + +/* ----------------------------------------------------------------------------- */ +/* MOBILE */ +/* ----------------------------------------------------------------------------- */ + +/* LAYOUT */ +body.mobile #root-widget > div.component:first-of-type { + border: none; + background: var(--color-background-secondary); +} +body.mobile .btn:focus { + box-shadow: none; +} +body.mobile :not(.fancytree-custom-icon):after, +body.mobile :not(.fancytree-custom-icon):before { + font-size: 1.3rem; + font-family: 'trilium-allure-icons'; + color: var(--color-text-primary); +} +body.mobile div#global-buttons { + top: 0; + padding: 9px 0; + margin: 0; + + /* --------- Default mode start -------- */ + box-shadow: var(--shadow-mobile); + /* ---------- Default mode end --------- */ + + /* ---------- Night mode start --------- */ + background: var(--color-background-accent); + /* ----------- Night mode end ---------- */ +} +body.mobile .btn.btn-primary { + border: none; + background: var(--color-button-highlight); +} +body.mobile div#root-widget { + background: var(--color-background-secondary); +} +body.mobile a.external { + display: none; +} + + +/* Menu */ + +/* Expanded menu in the upper left corner */ +body.mobile div#context-menu-container { + padding: 12px; + top: 16px !important; + left: 240px !important; + border-radius: var(--border-radius-standard); + border: none; + box-shadow: var(--shadow-mobile-popup); +} +body.mobile div#context-menu-container .dropdown-item { + margin-left: -12px; + font-size: 1rem; +} +body.mobile div#context-menu-container li.dropdown-item + li.dropdown-item { + margin-top: 20px; +} +/* The expanded menu in the upper right corner of the notebook */ +body.mobile div.dropdown-menu.dropdown-menu-right.show { + font-size: inherit; + border: none; + box-shadow: var(--shadow-mobile-popup); + padding: 12px; +} +body.mobile div#global-buttons a.dropdown-item { + font-size: 1rem; + padding: 0; +} +body.mobile div#global-buttons a.dropdown-item + a.dropdown-item { + margin-top: 20px; +} + + +body.mobile div.note-title-container input.note-title { + font-size: inherit; + height: 100%; + /*margin-right: 48px;*/ +} + +body.mobile div.note-detail.type-text.mime-text-html { + padding: 0 !important; + margin: 0 !important; +} +body.mobile div.note-detail-readonly-text-content, +body.mobile div.note-detail-read-only-code-content, +body.mobile div.note-detail-editable-text-editor, +body.mobile div.note-detail-readonly-text { + padding: 12px 0 12px 14px; + margin-left: 16px; +} +body.mobile div.component div.tree { + margin-bottom: 12px; +} + +body.mobile div#readability-page-1 { + line-height: 1.8rem; + padding: 0; +} + +body.mobile button.action-button.d-sm-none.d-md-none.d-lg-none.d-xl-none.component { + /*padding-top: 0 !important;*/ + margin-right: 4px; + order: -1; +} +body.mobile button.action-button span { + font-size: 0; +} +body.mobile button.action-button span:before { + content: '\e65c'; +} + +/* note detail menu */ +body.mobile button.bx-menu { + padding: 14px; + outline: none; + order: 1; +} +body.mobile button.bx-menu:before { + content: '\e60c'; +} +body.mobile .tree-item-button.add-note-button, +body.mobile .bx-plus, +body.mobile .bx-trash { + display: none !important; +} + +/* Note list */ + +body.mobile ul[role="group"] { + background: var(--color-background-translucent); +} +body.mobile div.component { + padding: 0; +} +body.mobile #root-widget > .component:nth-of-type(2) > .component:first-of-type { + position: inherit !important; + + /* --------- Default mode start -------- */ + box-shadow: var(--shadow-mobile); + /* ---------- Default mode end --------- */ + + /* ---------- Night mode start --------- */ + background: var(--color-background-accent); + /* ----------- Night mode end ---------- */ +} +body.mobile div.component div.tree-wrapper { + /*box-shadow: none;*/ + /*width: 100%;*/ + margin-top: 54px; + /*overflow: hidden;*/ +} + +body.mobile div.note-detail-printable.component { + margin: 5px; + box-shadow: none; +} +body.mobile span.fancytree-node { + padding: 8px 0; + border-radius: var(--border-radius-standard); + margin-left: 0; +} +body.mobile span.fancytree-node:active, +body.mobile span.fancytree-node:hover { + background: unset; +} +body.mobile span.fancytree-title { + font-size: inherit; + line-height: 28px; + border: none; + max-width: calc(100% - 48px); + display: inline-block; + margin-left: 0 !important; +} +body.mobile span.fancytree-custom-icon { + font-size: x-large; + margin-right: 6px; +} +body.mobile span.fancytree-expander { + font-size: 12px; +} +body.mobile span.fancytree-node:not(.fancytree-folder) span.fancytree-expander:before { + color: transparent; +} +body.mobile div.tree > ul > li > ul > li { + /*background: var(--color-background-primary);*/ + /*margin-top: 12px;*/ + /*padding: 6px;*/ + border-radius: 6px; +} +body.mobile div.tree span.fancytree-expander { + position: absolute; + margin: 8px 88%; +} +body.mobile div.tree span.fancytree-expander:before { + line-height: inherit; +} + +/* Selected notes */ +body.theme-allure-clear span.fancytree-selected { + background: var(--color-background-accent); + border-radius: unset; +} +body.theme-allure-clear span.fancytree-selected .fancytree-title { + background: unset !important; +} + +/* protected nodes */ +body.mobile div.protected-session-password-component.note-detail-printable { + margin: 80px auto auto; +} + +body.mobile div.note-detail.type-code.mime-text-css { + padding: 3px !important; +} + +body.mobile div.component div.note-title-container.component { + box-shadow: none; + display: contents; +} + +body.mobile input.note-title { + background: unset !important; +} + +body.mobile div span.fancytree-active .fancytree-title { + background: none !important; + font-weight: inherit; + color: inherit !important; +} + +body.mobile ul.ui-fancytree.fancytree-container { + padding: 0 6px; + /*background: var(--color-background-secondary) !important;*/ +} + +/* TOP BUTTON */ +body.mobile a { + color: var(--color-text-primary); +} +body.mobile .icon-action, +body.mobile a.edit-note { + border: none; + font-size: 1.3em; +} +body.mobile a[data-trigger-command="createNoteIntoInbox"]:before { + content: '\eaec'; +} +body.mobile a[data-trigger-command="collapseTree"]:before { + content: '\e620'; +} +body.mobile .bx-cog:before { + content: '\e713'; +} +body.mobile .bx-cog:after { + content: none; +} +body.mobile .bx-laptop:before, +body.mobile .bx-log-out:before { + content: none; +} +body.mobile .bx-info-circle:before { + font-size: 0; +} +body.mobile a[data-trigger-command="scrollToActiveNote"] { + display: none; +} +body.mobile .bx-extension:before { + content: '\e626'; +} + +/* dialog */ +body.mobile div.modal-dialog.modal-dialog-scrollable { + margin: 0; +} +body.mobile div.modal-dialog-scrollable .modal-content { + border: none; + border-radius: unset; +} +body.mobile div.modal-footer { + padding: 0; +} +body.mobile div.modal-footer button { + margin: 0; + border: none !important; + padding: 14px; + min-width: 110px; + border-radius: unset; + outline: none; + box-shadow: unset; +} +body.mobile .tree-settings-popup { + border-radius: var(--border-radius-standard); + background: var(--color-background-secondary); + border: none; + box-shadow: var(--shadow-mobile-popup); + padding: 0; +} +body.mobile .tree-settings-popup .form-check { + padding-left: 0; +} +body.mobile .tree-settings-popup .form-check-label { + width: 100%; + padding: 14px 20px; +} +body.mobile .tree-settings-popup .form-check-label:active { + background: var(--color-background-primary); +} +body.mobile .tree-settings-popup .form-check-label .form-check-input { + position: relative; + float: right; +} +body.mobile .tree-settings-popup button.save-tree-settings-button { + width: calc(100% - 32px); + height: 44px; + border-radius: 0 0 var(--border-radius-standard) var(--border-radius-standard); + margin: 10px 16px 16px; +} +body.mobile .tree-settings-popup > br { + display: none; +} + + +/* Note details */ +body.mobile blockquote { + padding: 1.5em 1.5em .5em 1.5em; +} +body.mobile .note-detail .ck-content h2::before, +body.mobile .note-detail .ck-content h3::before, +body.mobile .note-detail .ck-content h4:not(.include-note-title)::before, +body.mobile .note-detail .ck-content h5::before, +body.mobile .note-detail .ck-content h6::before { + margin-left: -24px; + font-size: .8rem; +} + +/* Edit button */ +body.mobile div.alert.alert-warning.no-print { + position: absolute; + right: 0px; + top: 0; + font-size: 0; + border: none; + padding: 6px 10px; +} +body.mobile div.edit-text-note-container a.edit-note:before, +body.mobile div.edit-code-note-container a.edit-note:before { + content: '\e6e5'; +} + +/* Expanded button */ +body.mobile span.fancytree-node.fancytree-active span.fancytree-expander:before { + color: transparent; +} +body.mobile span.fancytree-node.fancytree-active.fancytree-folder span.fancytree-expander:before { + color: unset; +} + diff --git a/src/views/desktop.ejs b/src/views/desktop.ejs index 0253cadeb..617c30a09 100644 --- a/src/views/desktop.ejs +++ b/src/views/desktop.ejs @@ -81,6 +81,7 @@ +