gaschz/trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-03-01 14:22:32 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity

make canvas_note height 100%

Browse Source
This commit is contained in:
Tom 2022-04-10 13:56:15 +02:00
parent 27d0388d79
commit 272bb136d8
2 changed files with 18 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/public/app/widgets/note_detail.js
View File

@ -151,7 +151,7 @@ export default class NoteDetailWidget extends NoteContextAwareWidget {
// https://github.com/zadam/trilium/issues/2522 // https://github.com/zadam/trilium/issues/2522
this.$widget.toggleClass("full-height", this.$widget.toggleClass("full-height",
!this.noteContext.hasNoteList() !this.noteContext.hasNoteList()
&& ['editable-text', 'editable-code'].includes(this.type)); && ['editable-text', 'editable-code', 'canvas-note'].includes(this.type));
} }
getTypeWidget() { getTypeWidget() {

26
src/public/app/widgets/type_widgets/canvas_note.js
View File

@ -10,19 +10,14 @@ import uniqueId from "./canvas-note-utils/lodash.uniqueId.js";
import NoteContextAwareWidget from "../note_context_aware_widget.js"; import NoteContextAwareWidget from "../note_context_aware_widget.js";
const TPL = ` const TPL = `
<div class="canvas-note-widget note-detail-canvas-note note-detail-printable"> <div class="canvas-note-widget note-detail-canvas-note note-detail-printable note-detail">
<style type="text/css"> <style type="text/css">
.note-detail-canvas-note {
height: 100%;
}
.excalidraw .App-menu_top .buttonList { .excalidraw .App-menu_top .buttonList {
/*display: flex;*/ /*display: flex;*/
} }
.excalidraw-wrapper { .excalidraw-wrapper {
height: 100%; height: 100%;
position: relative;
} }
:root[dir="ltr"] :root[dir="ltr"]
@ -33,8 +28,8 @@ const TPL = `
} }
</style> </style>
<!-- height here necessary .otherwise excalidraw not shown. also, one window resize necessary! --> <!-- height here necessary. otherwise excalidraw not shown -->
<div class="canvas-note-render" style="height: 500px"></div> <div class="canvas-note-render" style="height: 100%"></div>
</div> </div>
`; `;
@ -42,6 +37,18 @@ const TPL = `
* FIXME: Buttons from one excalidraw get activated. Problems with instance?! (maybe it is only visually, once * FIXME: Buttons from one excalidraw get activated. Problems with instance?! (maybe it is only visually, once
* mouse is over one instance they change?) * mouse is over one instance they change?)
*/ */
/**
* FIXME: FONTS from unpkg.com are loaded. Change font to HELVETICA?
* See: https://www.npmjs.com/package/@excalidraw/excalidraw => FONT_FAMILY
*/
/**
* FIXME: when loading a note, onchangehandler gets fired and then note is automatically saved. this leads to
* network overhead, and also sometimes to an empty note, if somehow loading failed, then empty content
* is saved.
*/
/**
* Discussion?: add complete @excalidraw/excalidraw, utils, react, react-dom as library? maybe also node_modules?
*/
export default class ExcalidrawTypeWidget extends TypeWidget { export default class ExcalidrawTypeWidget extends TypeWidget {
constructor() { constructor() {
super(); super();
@ -96,7 +103,8 @@ export default class ExcalidrawTypeWidget extends TypeWidget {
// leads to contain: none // leads to contain: none
// https://developer.mozilla.org/en-US/docs/Web/CSS/contain // https://developer.mozilla.org/en-US/docs/Web/CSS/contain
this.contentSized(); // this.contentSized();
this.$widget.toggleClass("full-height", true); // only add
this.$render = this.$widget.find('.canvas-note-render'); this.$render = this.$widget.find('.canvas-note-render');
this.$renderElement = this.$render.get(0); this.$renderElement = this.$render.get(0);
this.log("doRender", this.$widget); this.log("doRender", this.$widget);