0
0
mirror of https://github.com/naturalcrit/homebrewery.git synced 2026-01-08 09:42:43 +00:00

use js for it

This commit is contained in:
Víctor Losada Hernández
2025-05-22 23:29:08 +02:00
parent 03527a1f95
commit 9adf6dee61
2 changed files with 13 additions and 11 deletions

View File

@@ -14,7 +14,6 @@ const EDITOR_THEME_KEY = 'HOMEBREWERY-EDITOR-THEME';
const PAGEBREAK_REGEX_V3 = /^(?=\\page(?:break)?(?: *{[^\n{}]*})?$)/m; const PAGEBREAK_REGEX_V3 = /^(?=\\page(?:break)?(?: *{[^\n{}]*})?$)/m;
const SNIPPETBREAK_REGEX_V3 = /^\\snippet\ .*$/; const SNIPPETBREAK_REGEX_V3 = /^\\snippet\ .*$/;
const SNIPPETBAR_HEIGHT = 25;
const DEFAULT_STYLE_TEXT = dedent` const DEFAULT_STYLE_TEXT = dedent`
/*=======--- Example CSS styling ---=======*/ /*=======--- Example CSS styling ---=======*/
/* Any CSS here will apply to your document! */ /* Any CSS here will apply to your document! */
@@ -60,8 +59,9 @@ const Editor = createClass({
}, },
getInitialState : function() { getInitialState : function() {
return { return {
editorTheme : this.props.editorTheme, editorTheme : this.props.editorTheme,
view : 'text' //'text', 'style', 'meta', 'snippet' view : 'text', //'text', 'style', 'meta', 'snippet'
snippetbarHeight : 25
}; };
}, },
@@ -88,6 +88,7 @@ const Editor = createClass({
editorTheme : editorTheme editorTheme : editorTheme
}); });
} }
this.setState({ snippetbarHeight: document.querySelector('.editor > .snippetBar').offsetHeight });
}, },
componentDidUpdate : function(prevProps, prevState, snapshot) { componentDidUpdate : function(prevProps, prevState, snapshot) {
@@ -412,6 +413,9 @@ const Editor = createClass({
//Called when there are changes to the editor's dimensions //Called when there are changes to the editor's dimensions
update : function(){ update : function(){
this.codeEditor.current?.updateSize(); this.codeEditor.current?.updateSize();
const snipHeight = document.querySelector('.editor > .snippetBar').offsetHeight;
if(snipHeight !== this.state.snippetbarHeight)
this.setState({ snippetbarHeight: snipHeight });
}, },
updateEditorTheme : function(newTheme){ updateEditorTheme : function(newTheme){
@@ -436,7 +440,8 @@ const Editor = createClass({
value={this.props.brew.text} value={this.props.brew.text}
onChange={this.props.onTextChange} onChange={this.props.onTextChange}
editorTheme={this.state.editorTheme} editorTheme={this.state.editorTheme}
rerenderParent={this.rerenderParent} /> rerenderParent={this.rerenderParent}
style={{ height: `calc(100% - ${this.state.snippetbarHeight}px)` }} />
</>; </>;
} }
if(this.isStyle()){ if(this.isStyle()){
@@ -449,7 +454,8 @@ const Editor = createClass({
onChange={this.props.onStyleChange} onChange={this.props.onStyleChange}
enableFolding={true} enableFolding={true}
editorTheme={this.state.editorTheme} editorTheme={this.state.editorTheme}
rerenderParent={this.rerenderParent} /> rerenderParent={this.rerenderParent}
style={{ height: `calc(100% - ${this.state.snippetbarHeight}px)` }} />
</>; </>;
} }
if(this.isMeta()){ if(this.isMeta()){
@@ -478,7 +484,8 @@ const Editor = createClass({
onChange={this.props.onSnipChange} onChange={this.props.onSnipChange}
enableFolding={true} enableFolding={true}
editorTheme={this.state.editorTheme} editorTheme={this.state.editorTheme}
rerenderParent={this.rerenderParent} /> rerenderParent={this.rerenderParent}
style={{ height: `calc(100% - ${this.state.snippetbarHeight}px)` }} />
</>; </>;
} }
}, },

View File

@@ -108,9 +108,4 @@
span { padding : 2px 5px; } span { padding : 2px 5px; }
} }
}
@container editor (width < 683px) {
.editor .codeEditor { height : calc(100% - 51px);}
.homePage .editor .codeEditor { height : calc(100% - 25px);}
} }